﻿/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.cpcsi.com/
   TEMPLATE NAME:  CPCSI
   DATE:           Nov 4th-2009
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: white 

} 


.line { border: none; border-bottom: 1px solid #4e5b28; height: 0px; margin: 0 auto }
.clear { clear: both; }
img { border: none; }
.center { text-align: center; padding: 0px 
}	




/* ----------Centered Container Or the Layout--------------------- */

#container { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -4em; /* make sure this matches in the body footer DIV */
width: 961px;
} 


/* --------------LABELS BUTTONS & FORMS-----------*/


#form table {
width: 700px;
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #777;
margin-left: 40px;

}

#form td {
padding: 3px;
text-align: left	
}
 
 
.form, textarea, INPUT[type="text"] {
border: 1px solid #777;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #86878b;
padding: 2px;
margin-bottom: 10px;
}
 
.button {
width: 6em;
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #6e5b3a;      
background: #e7e3c5;
padding: 4px 5px;
border: 1px solid #6e5b3a;
margin-bottom: 40px;
}


/* --------------LOGO IN HEADER *always use this*------------- */

.logolink, #swap { width: 320px; height: 105px;}
.logolink { background-image: url('/images/logo.gif'); background-repeat: no-repeat; float: left;}
.logolink a { float: left;  }
 
#swap { background-image: url(/images/logo.gif); }
 
.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */


/* --------------HEADER------------- */

#header {

height: 115px; 

}

#header ul { padding: 10px; margin-top: 40px}

#header  li {
display: inline;
list-style-type: none;
}

#header li a {
color: #877c77;
text-decoration: none;
border-right: 1px solid;
padding: 0px 10px 0px 10px;
font: 10pt Arial, 'Trebuchet MS', Sans-Serif;
}

#header li a:hover { text-decoration: underline; }

#header .right {
float: right; 
width: 625px	
}

#header .right img {
float: right;	
margin: -50px 0px 0px 0px;
}


/* --------------MISSION------------- */

#mission {

height: 357px;
padding:10px 0px 0px 10px;


}


/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/

#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
background: white; /* Main DIV Background Img */
border: 1px #e7e3c5 solid; 
}

#main .content {
padding: 0px;
margin: 0px;
min-height: 170px; /* Height of Background Img */
height: 100%;
height: auto;

}

#main .right {
float:right;	
width: 355px;
background: url(/images/dotline_v.jpg) repeat-y;
padding:0px 0px 0px 15px;
}

#main .left {
float:left;
width: 585px	
}

#main h1 {
padding:20px 20px 5px 20px;
font: 21pt Arial, 'Trebuchet MS', Sans-Serif;
color: black;
}

#main h2 {
padding:20px 20px 5px 20px;
font: 16pt Arial, 'Trebuchet MS', Sans-Serif;
color: black;
}

#main h3 {
padding:5px 20px 5px 5px;
font: 12pt Arial, 'Trebuchet MS', Sans-Serif;
color: black;
text-align:left;
}



#main p {
padding:5px 40px 20px 30px;
font: 11pt Arial, 'Trebuchet MS', Sans-Serif;
color: black;
text-align:justify;

}

#main .small {
padding:5px 40px 20px 30px;
font: 10pt Arial, 'Trebuchet MS', Sans-Serif;
color: black;
	
	
}


/* --------------FOOTER------------- */


#footer, .push { 
clear: both;
width: 961px;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {

height: 200px;
height: auto;
}

#footer .content { 
width: 961px; 
margin: 0 auto; 
position: relative; 
}


/* --------------FOOTER LINKS------------- */

#footer ul { padding: 10px;}
#footer .links ul { margin: 0px; padding: 0px;}

#footer .links li {
display: inline;
list-style-type: none;
}

#footer .add {
color: #78391b;
display: inline;
list-style-type: none;
font: 10pt Arial, 'Trebuchet MS', Sans-Serif;
padding: 20px;
margin: 10px 0px 10px 0px;
}


#footer .links li a {
color: #877c77;
text-decoration: none;
border-right: 1px solid;
padding: 0px 10px 0px 10px;
font: 10pt Arial, 'Trebuchet MS', Sans-Serif;
}

#footer .links li a:hover { text-decoration: underline; }


/* --------ASC LINKS--------- */

#footer .asc ul { margin: 0px; padding: 0px;}
#footer .asc li { display: block; list-style-type: none;}

#footer .asc li a {
color: #877c77;
text-decoration: none;
padding: 0px 10px 0px 10px;
font: 8pt Arial, 'Trebuchet MS', Sans-Serif;
}

/* --------W3 LINKS--------- */

#footer .w3 ul { margin: 0px; padding: 10px;}
#footer .w3 li { display: inline; list-style-type: none;}
#footer .w3 li a { color: #000; text-decoration: none; border-right: 1px solid; padding: 0px 10px 0px 10px; font: 10pt Arial, 'Trebuchet MS', Sans-Serif;}
#footer .w3 li a:hover { text-decoration: underline;}



/* --------------FOOTER SEO LINKS------------- */


#footer .seo {
height: auto;
text-align: left;
min-height: 100px;
width: 750px;
font: 8pt 'century gothic', Sans-Serif;
}
 

#footer .seo a {
color: #6e4a2f;
text-decoration: none;
font: 8pt 'century gothic', Sans-Serif;
}




#paper { background: #e7e3c5; height: 250px; width: 300px; margin: 20px 46px 15px 5px;}

#paper ul { padding: 10px; margin-top: 5px}

#paper li {
display: block;
padding: 0px 10px 20px 24px;
background: url('images/bullet2.gif') no-repeat;
list-style-position:inside;
list-style-type:none;
 }

#paper li a {
color: black;
text-decoration: none;
font: 13pt Arial, 'Trebuchet MS', Sans-Serif;
}

#paper li a:hover { text-decoration: underline; }

#paper h1 {
padding:10px 10px 5px 10px;
font: 14pt Arial, 'Trebuchet MS', Sans-Serif;
color: #78391b;

}



/* --------------Staff bio------------- */



#staff img  { margin: 0px 10px 5px 0px; border: 1px solid #e7e3c5; padding: 5px; float:left;}























