/* Start of CMSMS style sheet 'CAVLab: Layout' */
/*****************
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;
}

/*
Set initial font styles
*/

body {
   text-align: left;
   font-family: Arial, Verdana, Geneva,  Helvetica, sans-serif;
   font-size: 80%;
   line-height: 1em;
   color: #999;
}

/*
set font size for all divs,
this overrides some body rules
*/

div {
   font-size: 1em;
}

/*
if img is inside "a" it would have 
borders, we don't want that
*/
img {
   border: 0;
}

/*
default link styles
*/
/* set all links to have underline and bluish color */
a,
a:link 
a:active {
   text-decoration: underline;
/* 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: #18507C; 
}

a:visited {
   text-decoration: underline;
   background-color: inherit;
  color: #18507C;                /* a different color can be used for visited links */
}


/* remove underline on hover and change color */
a:hover {
   text-decoration: none;
   color: #385C72;
}


/*****************
basic layout 
*****************/

body {
   background: url(images/cms/page-bg.jpg) repeat-x #666666;	
   color: #333;
   margin:1em; /* gives some air for the pagewrapper */
}

/* center wrapper, min max width */
div#pagewrapper {
   border: 3px solid white;
   margin: 0 auto;     /* this centers wrapper */
   width: 80em; /* IE wont understand these, so we will use javascript magic */
   
   background-color: #fff;;
   color: black;
}


/*** header ***
we will hide text and replace it with a image
we need to assign a height for it
*/

div#header {
   height: 125px; /* adjust according your image size */
   background:white url(images/cms/header-bg.gif) top right no-repeat;
}

div#header h1 a {
/* you can set your own image here */
   background: url(images/cms/logo.gif) no-repeat top left; 
   display: block; 
   height: 96px;             /* adjust according your image size */
   width: 206px;
   margin: 20px 0 0 10px;
   float: left;
   text-indent: -999em;  /* this hides the text */
   text-decoration:none; /* old firefox would have shown underline for the link, this explicitly hides it */
}

div#search {
   float: right;
   width: 23em;     /* enough width for the search input box */
   text-align: right;
   padding: 0.6em 0 0.2em 0;
   margin: 0 1em;
}

div.breadcrumbs {
   padding: .5em 0 .5em 24em; /* CSS short hand rule first value is top then right, bottom and left */
   font-size: 90%;             /* its good to set fontsizes to be relative, this way viewer can change his/her fontsize */
   margin: 0 1em;              /* css shorthand rule will be opened to be "0 1em 0 1em" */
   color: #666;
}

 div.breadcrumbs span.lastitem { 
   font-weight:bold; 
 } 

 div#content {
   margin: 1.5em auto 2em 0; /* some air above and under menu and content */

}

div#main {
   margin-left: 28%; /* this will give room for sidebar to be on the left side, make sure this space is bigger than sidebar width */
   margin-right: 2%; /* and some air on the right */
   padding: 15px 0 0 0;
   
}


div#sidebar {
   float: left;  /* set sidebar on the left side. Change to right to float it right instead. */
   width: 26%;    /* sidebar width, if you change this please also change #main margins */
   display: inline;  /* FIX ie doublemargin bug */
   margin-left: 0;

}

/* if sidebar doesnt include menu but content add class="hascontent" */
div#sidebar.hascontent {
   padding: 0 1%;
   width: 24%;  /* make width smaller if there's padding, or it will get too wide for the floated divs in IE */
}

div#sidebar h4{
   color: #fff;
   font-size: 130%;
   font-weight: bold;
   padding: .7em 0 0.8em .65em;
   background: url(images/cms/service-nav-header-bg.gif) repeat-x top left;
   line-height: 1em;
   margin: 0;
   font-family: "Trebuchet MS";
   text-transform:uppercase; 
   letter-spacing:.06em; 

}



div#footer {
   border-top: 1px dotted #999;
   clear:both;       /* keep footer below content and menu */
   background: url(images/cms/footer-bg.jpg) repeat-x bottom left;/* same bg color as in header */
   padding: 1em;
}

div#footer-wrapper{
width: 900px;
margin: 0 auto;

}

div#footer a {
   letter-spacing:.05em; 
   font-size: 1em;
   text-decoration:none;
}

div#footer a:hover {
   text-decoration:underline;
   color:#cc0000;
}

div#footer ul{
   display: block;
   margin:1em;
   list-style:none;
}


div#footer li{
   float:left;
   margin: 0 .5em 0 .5em;
   padding: 1em;
   line-height:1.5em;
   border-right: 1px dotted #999;

}
div#footer h3{
   font-family: "Trebuchet MS";
   text-transform:uppercase; 
   letter-spacing:.06em; 
   font-size: 1em;
   margin-bottom:.25em;
}

#newsbox p{
padding: 0 50px;
}

#newsbox h5{
padding: 0 20px;

}
.copyright{
   font-size: .8em;
   clear:both;
   text-align:center;
   font-weight:bold;
}

/* as we hid all hr for accessibility we create new hr with extra div element */
div.hr {
   height: 1px;
   margin: 1em;
   border-bottom: 1px dotted black;
}

/* relational links under content */
div.left49 {
  float: left;
  width: 39%;  /* 50% for both left and right might lead to rounding error on some browser */
  padding: 10px;

}

div.right49 {
  float: right;
  width: 39%;
  text-align: right;
  padding: 10px;


}

#welcome-pane{
   width:100%;
   background: url(images/cms/welcome-pane-plain.jpg) no-repeat left top #fff;

}

#welcome-pane-text{ 
   font-size: 15px;
   font-weight:light;
   border-right: 1px dotted #999;
   padding:10px;
   width: 500px;
   float: left;
   margin:0;
   color: #333333;
}

#wrapper #welcome-pane-text h2{ 
   font-family: "Trebuchet MS";	
   padding: 10px 0 5px 0 0px; 
   margin:0 0 0px 0;	
   letter-spacing:.75px; 

}

#welcome-pane-text p{ 
   margin:0px; 
   padding: 5px 5px 5px 15px; 
   letter-spacing:.75px;  
   font-weight:lighter; 
   }
	
#welcome-pane-text ol{
	margin:0 5px 0 40px;
	padding:0;

	}
	
#welcome-pane-text li{
   padding:.15em;
   line-height:1.2em;

   font-weight:lighter;
   margin: .5em;
   }
	
#welcome-pane-text h6{
	margin:0 10px 0 0;
	padding:0;
	}
	
#sub-content{
	margin:0;
	padding:0;
	}	

.featured-heading{
   font-size: 1.25em;
   }

#featured-services{
   float:left;
   margin: 0;

   }
#featured-products{
   width:355px; 
   float:right;
   margin:0;
   border-left: 1px dotted #999;
   }

#featured-products h3{
padding: 10px;
}


#featured-services h3{
padding: 10px;
}

#featured-services ul{
	list-style:none;
	margin:0;
	padding:0px 0px 0px 00px;
	}

#featured-services li{
	display:block;
	float:left;
	margin:.5em;
	padding:3px;
	}

.btn-learnMore{	
   background:url(images/cms/btn-learnMore.gif) top left repeat-x;
   font-size:.9em;
   font-weight:bold; 
   text-align:center; 
   margin:5px; 
   border:1px solid #999;
   text-decoration:none;
}

.btn-learnMore a:hover{ 
   color: #fff;
   background:url(images/cms/btn-learnMore-on.gif) top left repeat-x; 
   text-decoration:none;
   border-color: #CC6600
}
	
.learnMore{	
   color:#000; 
   padding:9px; 
   display:block; 
   text-decoration:none; 
   text-transform:uppercase; 

}

.btn-learnMore a{	
   text-decoration:none; 
}

.pic{ 
   padding:.25em;
   border: 1px solid #999;
}

.miniButton {
padding: 5px 10px;
margin: 10px;
background:  url(images/cms/btn-learnMore.gif) top left repeat-x;
color: #fff;

border: 1px solid #999;
}

.miniButton a{
text-decoration:none;
}

/********************
CONTENT STYLING
*********************/
div#content {

}

/* HEADINGS */

div#main li {
line-height: 1.75em;
}

div#content h1 {
   font-size: 2em;  /* font size for h1 */
   line-height: 1em;
   margin: 0;
}
div#main h2 {
   color:#990000;
   font-family:"Trebuchet MS";
   font-weight:lighter;
   text-align:center;
   font-size: 1.75em; 
/* some air around the text */
   padding-left: 0.5em;
   padding-bottom: 1px;
/* set borders around header */
    line-height: 1.5em;
/* and some air under the border */
   margin: 0 0 0.5em 0;
}
div#main h3 {
   font-family:"Trebuchet MS";
   color: #CC6600; 
   font-size: 1.4em;
   line-height: 1.3em;
   margin: .25em  .25em .25em;
   font-weight:normal;
}
div#main h4 {
   color: #294B5F; 
   font-size: 1.2em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
div#main h5 {
   font-size: 1.1em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
h6 {
   font-size: 1em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}

.mission{
	display:block;
	float:right;
	width:250px;
	border: 1px solid #CCCCCC;
	border-bottom: 2px solid #CCCCCC;
	border-right: 2px solid #CCCCCC;
	background: url(images/cms/mission-box-bg.jpg) repeat-x #FFFFCC;
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
   padding:10px;

}

.mission h2{
margin:0;
padding:5px 5px 0px 10px;
}

.mission p{
margin:0;
padding:5px 10px 10px 10px;	

}


/* END HEADINGS */

/* TEXT */
p {
   font-size: 1em;
   margin: 0 0 1.5em .5em;  /* some air around p elements */
   line-height:1.4em;
   padding: 0;
}
blockquote {
   border-left: 10px solid #ddd;
   margin-left: 10px;
}
pre {
   font-family: monospace;
   font-size: 1.0em;
}
strong, b {
/* explicit setting for these */
   font-weight: bold;
}
em, i {
/* explicit setting for these */
   font-style:italic;
}

/* Wrapping text in <code> tags. Makes CSS not validate */
code, pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
 font-family: "Courier New", Courier, monospace;
 font-size: 1em;
}

pre {
   border: 1px solid #000;  /* black border for pre blocks */
   background-color: #ddd;
   margin: 0 1em 1em 1em;
   padding: 0.5em;
   line-height: 1.5em;
   font-size: 90%;   /* smaller font size, as these are usually not so important data */
}

textarea{
   width: 300px;
}

.service-box{
     background:none; 
     float:left; 
     width:300px;
     border: 1px dotted #999;
     margin: 5px;
     padding:10px;
     }



/* END TEXT */}

/* LISTS */
div#main ul,
div#main ol,
div#main dl {
  font-size: 1.0em;
   line-height:1.4em;
   margin: 0 0 1.5em 0;
}
div#main ul li,
div#main ol li {
   margin: . 0 0.25em 3em;
}

div#dl dt {
   font-weight: bold;
   margin: 0 0 0.25em 3em;
}
div#dl dd {
   margin: 0 0 0 3em;
}


div#main ul li{

padding: 5px;
margin-left: 25px;
}
/* END LISTS */




/* CODA SLIDER STYLES */

		* { margin: 0; padding: 0 }
		/* I've used a hard CSS reset above, but you should consider a more sophisticated reset, such as this one: http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ */
		
		.stripViewer .panelContainer .panel ul {
			text-align: left;
			margin: 0 15px 0 0px;
		}
		
       .slider-wrap { 
	margin-right: 50px;
        float:right;
		}

		/* These 2 lines specify style applied while slider is loading */
		.csw {width: 100%; height: 460px; background: #fff; overflow: scroll}
		.csw .loading {margin: 200px 0 300px 0; text-align: center}

		.stripViewer { /* This is the viewing window */
			position: relative;
			overflow: hidden; 

			margin: auto;
			width: 400px; /* Also specified in  .stripViewer .panelContainer .panel  below */
			height: 300px;
			clear: both;
			background: #fff;
		}
		
		.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
			position: relative;
			left: 0; top: 0;
			width: 100%;
			list-style-type: none;
			/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
		}
		
		.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
			float:left;
			height: 100%;
			position: relative;
			width: 400px; /* Also specified in  .stripViewer  above */
		}
		
		.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
			padding: 10px;
		}
		
.slider-wrap img {
	margin: 5px;
	padding: 10px;
}

		.stripNav { /* This is the div to hold your nav (the UL generated at run time) */
			margin: auto;
		}
		
		.stripNav ul { /* The auto-generated set of links */
			list-style: none;
		}
		
		.stripNav ul li {
			float: left;
			margin-right: 2px; /* If you change this, be sure to adjust the initial value of navWidth in coda-slider.1.1.1.js */
		}
		
		.stripNav a { /* The nav links */
			font-size: 10px;
			font-weight: bold;
			text-align: center;
			line-height: 32px;
			background: #c6e3ff;
			color: #000;
			text-decoration: none;
			display: block;
			padding: 0 15px;
		}
		
		
		.stripNav li a:hover {
			background: #333;
                        color:#fff;
		}
		
		.stripNav li a.current {
			background: #000;
			color: #fff;
		}
		
		.stripNavL, .stripNavR { /* The left and right arrows */
			position: absolute;
			top: 230px;
			text-indent: -9000em;
		}
		
		.stripNavL a, .stripNavR a {
			display: block;
			height: 40px;
			width: 40px;
		}
		
		.stripNavL {
			left: 0;
		}
		
		.stripNavR {
			right: 0;
		}
		
		.stripNavL {
			background: url("images/arrow-left.gif") no-repeat center;
		}
		
		.stripNavR {
			background: url("images/arrow-right.gif") no-repeat center;
		}
		
/* End of 'CAVLab: Layout' */