/* Start of CMSMS style sheet 'Layout Appearance' */
/*****************
browsers interpret margin and padding a little differently, 
we'll remove all default padding and margins and
set them later on
******************/
* {
margin:0;
padding:0;
}
  


body { /*sets initial body and font information*/
        color: #242138;
	font-family: Verdana,Arial,Helvetica,sans-serif;
        background-color:#525474;
         background-image: url("uploads/images/backgroundgrad.gif");
         background-repeat: repeat-x;

}


/*if image is inside"a" it would have borders which we don't want, 
also makes images wrap in text*/
img{ 
        float: none;  /*this cancels the float left as I don't want my text to wrap around the image*/
        border:0;
        display:block;
	}

img.content{ 
        position: relative;
        clear:both;        
	}

img.content2{ 
        float:left;
        clear:left;
        margin-right:1em;
        margin-bottom:0.6em;
}

img.header {
        float: left;
        top:0;
	}

img.thumbs {
        border-style:solid;
        border-color: #242138;
	border-width: 1px 4px 4px 1px;
        margin-left: 0.8em;
        margin-bottom:0.8em;
	}

/* default link style set all links to have no underline, purple colour */
a {
   list-style:none;
   text-decoration: none;

/* css validation will give a warning if color is set without background color. this will explicitly tell this element to inherit bg colour from parent element */
   background-color: inherit; 
   color: white; 
}

/*link colour for navigation menu differing from body links*/
a.body {
   text-decoration: none; 
   color: #9999cc; 
}

/* on hover change color */
a.body:hover {
   text-decoration: underline;
   color: #A6CC05;
}

a:visited {
   text-decoration: none;
}


/* on hover change color */
a:hover {
   text-decoration: none;
   color: #e4f333;
}
	
/*****************
basic layout 
*****************/


div#pagewrapper {
	/*border:1px solid blue; so that you can identify content affected*/
        position:absolute;
        background-image: url("uploads/images/header_extn2.gif");
        background-repeat: repeat-x;
        top: 0;
        left: 0; 
        right: 0;
        width:100%;

}

/*** header ***/

#header {
	/*border:1px solid crimson; so that you can identify content affected*/
	height: 174px;  /* adjust according your image size */ 
        width:913px;
        position: relative;
        margin-left:auto;
        margin-right:auto;
}

#nav{
   /*border:1px solid yellow;*/
   position:relative;  
   width:708px;
   display:inline;
}


#headergalleries{
  /*border:1px solid purple; so that you can identify content affected*/
   position:relative;   
   width:195px;
   display:block;
   float:left;
}

div#content {
   /*border:1px solid orange; so that you can identify content affected*/
   position: relative;  
   width: 913px;
   padding-top:3em;
   margin-left: auto;
   margin-right: auto;
   clear:both;
}

div#sidebar {
  /* border:1px dotted white; so that you can identify content affected*/
   position: relative;
   width: 300px;  /* sidebar width, if you change this please also change #main margins */
   padding-left:2em;
   float:left;
   left:0;
}

div#main {
  /* border:1px dotted #333366; so that you can identify content affected*/
   position: relative;
   width: 480px;
   padding-left:2em;
   margin-left:2em;
   float:left;
   left:0;
}

div.services{
        padding-top: 1em;
        padding-right:1em;
        padding-bottom:2em;
        float:left;
}

div.section{
	overflow: auto;
        margin:0 auto;
	width: 280px;
        clear:both;
	}

div.section2{
	overflow: visible;
	width: 450px;
        clear:both;
	}

.thumbnails{
	padding: 2px 2px 4px 2px;
	background-color: #242138;
	float: left;
        display:inline;
	margin-right: 0.8em;
	margin-bottom: 1em;
	}

div#footer {
	/*border:1px solid red; so that you can identify content affected*/
        position:relative;
        width:300px;
        height: 30px;
        margin-top:2em;
        margin-left: 1.6em;
        clear:both;
}


/********************
CONTENT STYLING
*********************/


/* HEADINGS */
#content h1{	 /* all text headings highest visual order*/
	font-size:1em;
	font-weight:bold;
	color: #ccff00;
	}
	

	
#content h2{					/* all text subheadings second visual order*/
	font-size:0.88em;
	text-transform: uppercase;
	font-weight:bold;
	color: black;
	}
	
#content h3{					/* all text subsub headings third visual order*/
	font-size:0.80em;
	text-transform: uppercase;
	font-weight:bold;
        color: #242138;
	}

/* TEXT */
p{ 
	font-size: 0.75em;  /* all bodycopy writing*/
        line-height:1.25em;
        max-width:460px;

}

p.footer{ 
	font-size: 0.60em;  /* footer note only*/
}

ul.square{    list-style-position:inside;
        list-style-type:square;
	font-size: 0.75em;  
        line-height:1.25em;
        padding-left:2em;
}

ul{
list-style-type:none;
padding:0px;
margin:0px;

}

li.tick{
background-image:url("uploads/images/icon_tick.jpg");
background-repeat:no-repeat;
background-position:0px 2px; 
padding-left:28px;
        line-height:1.6em;
}


strong, b {
/* explicit setting for these */
   font-weight: bold;
}
em, i {
/* explicit setting for these */
   font-style:italic;
}
/* End of 'Layout Appearance' */

