/* Common */
.clear {clear: both; background: none; }
.left {float:left;margin-right:1em;}
.right {float:right;margin-left:1em;}
.center {text-align:center;}
.first {margin-left:0 !important;}
.last {margin-right:0 !important;}
.top {margin-top:0 !important;}
.bottom {margin-bottom:0 !important;} 
.hidden, .print {display:none;}

.error {color:red;}

abbr[title], acronym[title] {cursor:help;}
img {border:none;}   
hr {display:none;} 


/* Layout */
body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 13px;
 background: #EEEEEE url(../public/layout/bg.png) repeat-x scroll 0 0;
}

#wrapper { 
 margin: 0 auto;
 width: 968px;
}

#faux {
 background: url(../public/layout/content-bg.png);
 margin-bottom: 0px;
 overflow: hidden; 
 width: 100%;
} 

#header {
 width: 948px;
 padding: 10px;
 height: 100px;
 margin: 10px 0px 0px 0px;
 background: transparent url(../public/layout/header-bg.png);
}

#header #logo {
 display:block;
 float:left;
 padding:15px 10px 15px 20px;
}


#header h1 {
 margin: 15px 0px 0px 0px;
 font-size:32px;
 color:#4B8099;
 font-weight:bold;
}

#header h1 a {  
 color: #4B8099;
}

#header h1 a:hover {  
 color: #666;
}  

#header #slogan {
 color: #616E33;
 text-shadow:1px 1px 0 #FFFFFF;
 padding:0px 0px 0px 2px;
}


#nav {
 width: 961px;
 padding: 0px;
 height: 34px;
 margin: 0px 5px 0px 4px;
 background: transparent url(../public/layout/nav-bg.png) repeat-x scroll 0 0;
 border-top:1px solid #666666;
 border-bottom:1px solid #CCC;
}


#snapshot {
 padding-bottom: 9px;
}



#footer { 
 width: 929px;
 height: 35px;
 clear: both;
 background: transparent url(../public/layout/footer-bg.png) no-repeat scroll 0 0;
 margin: 0px 0px 10px 0px;
 padding: 10px 20px;
 
 color: #777;
}


/* column layouts 

// 2 columns
<div class="cols"> 
 <div class="col first"> </div> 
 <div class="col"> </div> 
</div> 

// 3 columns   
<div class="cols cols3"> 
 <div class="col first"> </div> 
 <div class="col"> </div> 
 <div class="col"> </div> 
</div> 
*/

.cols {} /* main column container class */
.col {
 float:left;
 display:inline;
 width:48%;margin-left:4%; /* 2 equal width columns layout - default */
} 
*html .col {
 margin-left:3%;
}
.cols3 .col {width:30%;margin-left:5%;} /* 3 equal width columns layout */
.cols4 .col {width:22%;margin-left:4%;} /* 4 equal width columns layout */
  
/* use following classes to build custom grid (add as many as you want) */
.col1, .col2, .col3 {float:left;display:inline;}
.col1 {}
.col2 {}
.col3 {}



/* Text */

h1, h2, h3, h4, h5, h6{
 font-weight:normal;
 margin:0;
} 
h1 {
 color: #4B8099;
 font-size:20pt; 
 margin-bottom:15px;
} 
h2 {
 color: #4B8099; 
 font-size:18pt;
 margin-bottom:10px;
 padding-top:10px;
} 
h3 {
 color: #4B8099;
 font-size:16pt;
 margin-bottom:10px;
 padding-top:10px;
}
h4 {
 color: #4B8099;
 font-size:14pt;
 margin-bottom:10px;
}
h5,h6 {
 font-size:12pt;
 margin-bottom:10px;
 font-weight:bold;
}

p, blockquote, ul, ol, dl, form, table, pre{
 line-height:inherit;
 margin:0 0 1.5em 0;
}

p {
 color: #333;
}

a, a:visited {
 text-decoration:none;
 color:#4B8099;
}

a:hover {
 color:#999;
}

ul, ol, dl {padding:0;}
ul ul, ul ol, ol ol, ol ul, dd {margin:0;}
li {
 margin:0 0 0 2em;
 display:list-item;
 list-style-position:outside;
} 



ins {
 text-decoration:none;
 color:#900;
 font-style:italic;
}
code {color:#555;}
pre {
 color: #333;
 margin-left:2em;
 padding-left:2em;
 border-left:1px solid #ccc;
}

blockquote {
 margin-left:2em;
 border-left:1px solid #ccc;
 font-style:italic;
} 

dt {font-weight:bold;}
  

.pullquote{
 width:20%;
 float:left;
 margin-right:2em;
 padding-right:2em;
 border-right:1px solid #ccc;
 text-align:right;
 font-size:1.1em;
 font-style:italic;
 color:#777;
 margin-bottom:.5em;
}

.boxout{
 width:20%;
 float:right;
 margin-left:2em;
 padding:1em 2em;
 border:1px solid #ccc;
 margin-bottom:.5em;
}
 
small {font-size:.9em;}
sup, sub{font-size:.8em;}
em, cite, q{font-style:italic;}


.date {
 color:#777;
 font-style:italic;

}


/* Table */
table {
 width:100%;
 border-collapse:collapse;
}
th,caption {
 text-align:left;
}
th, td {
 padding:.5em 1em;
 line-height:1.5em;
}  
th {
 background:#ABBEBE;
}
td {
 border-bottom:1px solid #eee;
}
caption {
 font-style:italic;
 color:#555;
 margin:.5em 0;
} 




/* Form */

form div {margin:.5em 0;clear:both;}
label {
 display:block;
 margin:0;
padding:0;
}
fieldset {margin:0;padding:0;border:none;}
legend {font-weight:bold;}
input[type="radio"],input[type="checkbox"], .radio, .checkbox{margin:0 .25em 0 0;}


fieldset{
 border:1px solid #ccc;
 padding:1em 2em;
 margin:0 0 1.5em 0;
}

legend {padding:2px 5px;} 
form div.col {clear:none;}form div.first{clear:both;}
form div {overflow:hidden;}
 
input[type="text"], input[type="password"], textarea, .field, .area, select{
 border:1px solid #aaa;
 padding:5px;
 background:#fff;
 width:300px;
 line-height:1em;
 margin:0;
}

select {width:312px;}
textarea, .area {overflow:auto; height:150px; width:400px;}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus, select:focus, .focus {background:#f5f5f5;outline:none;}
.submit {}
button {
 border:none;
 background:#555;
 color:#fff;
 padding:0 2.5em;
 height:2em;
 line-height:2em;
 cursor:pointer;
} 



/* comments */

.commentsitem {
 background:url("../images/bg_comment-btm.png") no-repeat scroll right bottom transparent;
 margin: 5px 0 15px 0;
 width: 630px;
 position:relative;
}

.commentsitem-name {
 float:left;
 text-align: right;
 width:88px;
 margin:18px 10px 0 0;
}


.commentsitem-comment {
 background:url("../images/bg_comment-top.png") no-repeat scroll right top transparent; 
 float:left;
 width: 496px;
 margin-bottom: 0;
 padding:18px 13px 18px 23px;
}






/* Clearfix see http://www.quirksmode.org/css/clearing.html */
.cols:after, .fixed:after{
 content:"."; 
 display:block; 
 height:0; 
 clear:both; 
 visibility:hidden;
}
.cols, .fixed { display:block; min-height:1%;}
* html .inner, * html, * html .cols, * html .fixed {height:1%;}