﻿/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.contentbaby.com
   TEMPLATE NAME:  Content Baby
   DATE:           Jun-17th-2008
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #fff url('http://asamplesite.com/contentbaby/images/bg.gif') repeat-x;
font-family: 'Trebuchet MS', Arial, Tahoma, Verdana, Sans-serif;
} 

/* ----------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: 927px;
} 


/* --------------LABELS BUTTONS & FORMS-----------*/
 
label {
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #777;
}
 
.form, textarea {
width: 20em;
border: 1px solid #777;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #86878b;
padding: 2px;
margin-bottom: 20px;
}
 
.button {
width: 6em;
font: bold 10pt 'Trebuchet MS', Arial, Tahoma, Verdana, Sans-serif;
color: #fff;      
background: #4fc2f0;
padding: 4px 5px;
border: 1px solid #46a1c6;
}

/* --------------HEADER------------- */

#header {
background: url('http://asamplesite.com/contentbaby/images/header_bg.gif') no-repeat left 50%;
height: 96px;
}

/* --------------LOGO IN HEADER *always use this*------------- */

.logolink {
background-image: url('logo.gif');
background-repeat: no-repeat;
height: 90px;
width: 381px;
padding-top: 23px;
}
 
.logolink a { float: left;  }
 
#swap {background-image: url('http://asamplesite.com/images/logo.gif');  
width: 381px; height: 90px; }
 
.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 */

/* --------------MISSION------------- */

#mission {
background: url('http://asamplesite.com/contentbaby/images/mission.jpg') no-repeat;
height: 309px;
margin-bottom: 20px;
}

#mission .holder {
float: right;
width: 470px;
padding: 60px 13px 0px 0px;
}

#mission p {
padding: 0px 0px 0px 10px;
color: #DF0000;
font-weight: bold;
}


/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/

#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
}

#main .content {
padding: 0px 15px 50px 15px;
margin: 0px;
min-height: 170px; /* Height of Background Img */
height: auto;
}

#main img {
float: right;
margin: 30px;
}

#main h1 {
font-size: 25pt;
color: #a19a73;
letter-spacing: -2px;
margin-bottom: 8px;
}

#main p {
color: #000;
font-size: 12pt;
line-height: 24px;
}

#main a {
color: #DF0000;
text-decoration: underline;	
font-weight:bold;
}

#line {
border: none;
border-bottom: 1px solid #a19a73;
height: 0px;
margin-top: 10px;
margin-bottom: 10px;
}


/* --------------FOOTER------------- */

.clear {
clear: both;
}

#footer, .push { 
clear: both;
width: 100%;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
background-color: #76bfff;
height: 120px;
height: auto;
}

#footer .content { 
width: 927px; 
height: 123px;
margin: 0 auto; 
position: relative; 
background-image: url('http://asamplesite.com/contentbaby/images/footer_bg.gif');
}

/* --------------FOOTER LINKS------------- */

#footer ul {
padding-top: 15px;
}

#footer .links ul {
margin: 0px;
padding: 0px;
}

#footer .links li {
display: inline;
list-style-type: none;
}

#footer .links li a {
color: #000;
text-decoration: none;
font: 10pt Arial, 'Trebuchet MS', Sans-Serif;
}

#footer .links li a:hover {
text-decoration: underline;
}

#footer .w3 ul {
margin: 0px;
padding: 0px;
}

#footer .w3 li {
display: inline;
list-style-type: none;
}

#footer .w3 li a {
color: #fff;
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;
}
