/**
  Theme Name: KW Design
  Theme URI: 
  Version: 1
  Author:
  Author URI:
  Tags: fixed width, left sidebar, two columns, blue, valid XHTML, valid CSS
  Licence: KW Design
  
  Description:
*/

/***** Reset *****/
body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote,
pre, form, fieldset, table, th, td { margin: 0; padding: 0; }
  
/***** Basic Elements *****/
body {font:13px Arial, Helvetica, sans-serif; background-color: #00103d; color:#d2e5fa;}
p {font-size:13px; line-height:18px; padding:9px 0 9px 0;}
.clear {clear:both; height:1px;}

/***** Generic Classes *****/
/* Define styles for simple things like floating to the sides, removing a bottombottom margin on elements, etc
Yes, these may not be as semantic as we would all like, but they are necessary for coding efficiently */

/***** Basic Layout *****/
#container-bg {background: #00103d url(images/body-bg.jpg) center 0 no-repeat;}
#container {width:960px; margin-left:auto; margin-right:auto;}

/***** Header *****/
#header {height:144px; background: url(images/header-bg.jpg) top center repeat-x;}
#branding {width:960px; height:102px; margin-left:auto; margin-right:auto;}
#logo {display:block; float:left; width:260px; height:102px; background-color: #001654; text-align: center;}
#logo img {border:0; margin-top: 15px;}
h1#tagline {width:660px; display:block; float:left; padding: 24px 0 0 40px;}
h1#tagline em {display:none;}

#extra {width:960px; height:42px; margin-left:auto; margin-right:auto;}
#url {display:block; float:left; width:230px; height:30px; background-color: #1d3066; padding:12px 0 0 30px; text-decoration: none; color:#587da8; margin-right: 40px;}
#extra h2 {color:black; font-size:16px; font-weight: normal; line-height:40px; color:#182854;}

/***** Sidebar *****/
#sidebar {display:block; float:left; width:260px; padding-bottom:10px}
#contact {background: url(images/sidebar-contact-bg.png) center top repeat-y; margin-bottom:12px;}
#contact div {background: url(images/sidebar-contact-bg.png) left top no-repeat;}
#contact div div {background-position: right bottom; padding:30px 30px 24px 30px; color:white;}
#contact h3 {color:#d2e5fa; padding: 0 0 12px 0; font-size:14px;}
p#address {color:#9cc1eb; padding:0;}
p#phone-fax-email {color:#587da8; line-height:21px; padding-top: 12px;}
p#phone-fax-email img {display: block; float:left; padding:4px 6px 0 0}
p#phone-fax-email em {color:#d2e5fa; font-style:normal;}
p#phone-fax-email a {color:#d2e5fa;}
p#phone-fax-email a:hover {color:white;}
#buttons a {margin-bottom:3px;}
#buttons a img {border:none;}

/***** Content *****/
#content {width:660px; display:block; float:left; padding: 30px 0 0 40px;}
#content h2 {width:300px; font-weight:normal; font-size:24px; line-height:29px;}
#content h3.gmap {font-size:18px; line-height: 18px; margin: 9px 0 12px 0; font-weight:normal;}
#content p {width:380px;}
#content a {color:#9dc1eb;}
#content a:hover {color:white;}
#projects {padding-top: 33px;}
#navigation {width:480px; height:160px; background: url(images/projects-bg.jpg); overflow:hidden;}
#navigation ul li {display:block; float:left; width:160px; height:160px;}
#navigation ul li a {display:block; float:left; width:160px; height:160px; cursor:pointer; text-decoration:none;}
#navigation ul li a img {border:none;}
#navigation ul li a h2 {position:relative; display:block; width:160px; height:125px; margin-top:-163px; text-align:center; padding-top:35px; color:white;}

#navigation ul li a:hover h2, #navigation a:hover h2 {background-color:#233566;}

#nav-photos {width:480px; height:160px; /*background: url(images/projects-bg.jpg);*/ overflow:hidden; clear:both;}
#nav-photos ul li {display:block; float:left; width:160px; height:160px;}
#nav-photos a {cursor:pointer;}
#nav-photos a img {border:none;}

#projects div#photos {display:block; float:right; width:320px; height:380px; margin:36px 20px 20px 20px;}

#details {display:block; float:left; width:390px; padding:30px 10px 30px 0;}
#details h2 {width:auto;}
#details p {width:auto;}

#project-details {display:block; float:left; width:280px; padding:30px 10px 30px 0;}
#project-details h2 {width:auto;}
#project-details p {width:auto;}

#previous-next {width:640px; height:19px; margin-bottom:10px; clear:both;}
#previous-next div {display:block; float:left; height:19px;  margin-right: 4px;}
#previous-next a#go-left, #previous-next a#go-right {display:block; float:left; width:19px; height:19px; margin-left:6px;}
#previous-next a#go-right {margin-left:3px; margin-right:10px;}
#previous-next a img {border:none;}

/***** Footer *****/
#footer {clear:both; width:960px; padding:21px 0 30px 0; margin:0 auto; background:#00103d url(images/footer-bg.png) top center no-repeat;}
#footer p {color:#9cc1eb;}
#footer a {color:#9cc1eb;}
#footer a:hover {color:white;}
#footer div.fleft {display: block; float: left; width: 640px;}
#footer div.fleft ul {list-style:none;}
#footer div.fleft ul li {display:block; float: left; margin-right:9px;}
#footer div.fright {display: block; float: right; width: 300px; text-align: right;}


/*preload classes*/ 
.svw {width: 50px; height: 20px; background: #fff;} 
.svw ul {position: relative; left: -999em;} 
 
/*core classes*/ 
.stripViewer {  
position: relative; 
overflow: hidden; 
margin: 0 0 3px 0; 
} 
.stripViewer ul { /* this is your UL of images */
margin: 0;
padding: 0;
position: relative;
left: 0;
top: 0;
width: 1%;
list-style-type: none;
}
.stripViewer ul li {
float:left;
}

.stripTransmitter {
overflow: auto;
margin-top:0px;
}
.stripTransmitter ul {
margin: 0;
padding: 0;
position: relative;
list-style-type: none;
}
.stripTransmitter ul li{
width: 24px;
float:left;
margin: 0 3px 3px 0;
}
.stripTransmitter a{
font-weight:bold;		
text-align: center;
line-height: 24px;
background-color: #233566;
text-decoration: none;
display: block;
}
.stripTransmitter a a:hover, a.current{
background-color: #4a63a8;
}