/*
 *  Core Layout Styles
 *
 *  This stylesheet is essentially the layout shell
 *  mostly common structure related styles, see relevent
 *  stylesheets for more specific styles.
 *
 *  Some color and background styles may be found in
 *  silos.css, particulary for elements that have
 *  different color schemes for each silo.
 *
 */

/****************************************************
  Foundations
****************************************************/
body {
  background: #fff url(/images/layout/bg-topbar.gif) top repeat-x;
}

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


/****************************************************
  Header
****************************************************/
#header {
  height: 110px;
  margin: 0 0 10px;
  padding: 2px 0 0;
  position: relative;
  background: url(/images/layout/header-bg.gif) top left;
}

  #header .tagline {
    text-align: right;
    padding-bottom: 29px;
  }
  #header .tagline a {
    color: #fff;
    font-size: 0.9em;
    text-transform: uppercase;
  }
  #header .tagline a:hover { text-decoration: underline; }
  
  #header .logo { 
    float: left;
    text-indent: -999em; 
  }
  #header .logo a {
    display: block;
    overflow: hidden;
    width: 136px; height: 52px;
    background: url('../images/layout/logo.png') no-repeat;
  }
  
  
  /****************************************************
    Header: Navigation
  ****************************************************/
  #header .navigation {
    float: right;
    padding-top: 10px;
    width: 700px;
  }
    #header .navigation li {
    	float: left;
    	margin: 0; 
    	padding: 0;
    	line-height: 50px;
    }
    #header .navigation li a,
    #header .navigation form input {
      display: block;
      float: left;
      overflow: hidden;
      width: 120px; height: 50px;
      background: url('../images/layout/navbar.png') no-repeat;
    }
    #header .navigation li a { text-indent: -999em; }
    #header .navigation li a:focus { outline: 0; }
    
    #header .navigation li.home a 				  { width: 122px; background-position: 0 0; }
    #header .navigation li.home a:hover,
    #header .navigation li.home a:focus 		{ background-position: 0 -50px;   }
    
    #header .navigation li.blog a 				  { background-position: -122px 0; }
    #header .navigation li.blog a:hover,
    #header .navigation li.blog a:focus 		{ background-position: -122px -50px; }
    
    #header .navigation li.about a 			  { background-position: -242px 0; }
    #header .navigation li.about a:hover,
    #header .navigation li.about a:focus { background-position: -242px -50px; }
    
    #header .navigation li.contact a  			{ background-position: -362px 0; }
    #header .navigation li.contact a:hover,
    #header .navigation li.contact a:focus 	{ background-position: -362px -50px; }

    #header .navigation li.search form { width: 218px; background: none; }
    #header .navigation li.search form input.text { 
      width: 139px; 
      height: 37px;
      border: 0;
      margin: 0;
      padding: 13px 18px 0;
      background-position: -483px 0; 
    }
    #header .navigation li.search form input.text:hover,
    #header .navigation li.search form input.text:focus  { background-position: -483px -50px; } 
    
    #header .navigation li.search form input.submit { 
      width: 40px; 
      border: 0;
      font-size: 1px;
      background-position: -659px 0; 
    }    
    #header .navigation li.search form input.submit:hover,
    #header .navigation li.search form input.submit:focus { background-position: -659px -50px; }    

/****************************************************
  HEADING
****************************************************/
#heading {
  padding: 12px 0;
  margin-bottom: 12px;
  border: dotted #c5c5c5;
  border-width: 1px 0 1px 0;
}
#heading h1, #heading p {
  margin: 0;
  font-weight: normal;
}
#heading span { 
  display: inline-block;
  background: #f2f2f2; 
}
#heading h1 span { padding: 5px 8px; }
#heading p span { 
  color: #848484;
  margin-top: 2px; 
  padding: 6px 9px; 
  font-size: 1.3em;
  letter-spacing: 0.09em;
  font-family: Georgia, 'Times New Roman', Serif;
}

#flippy {
  margin-bottom: 20px;
}

#intro {
  padding: 0 8px;
  border-bottom: 1px dotted #c5c5c5;
}
#intro p {
  margin: 0;
  padding: 0 0 10px;
}

/****************************************************
  Content
****************************************************/
#content {
  clear: both;
  float: left;
  width: 930px;
}

  /****************************************************
    Content: Lists
  ****************************************************/
  #content ul {
    margin-left: 10px;
  }
  #content ul li {
    padding-left: 22px;
    background: url('../images/icons/bullet_green.gif') left no-repeat;
  }

  /****************************************************
    Content: Main
  ****************************************************/
  #main {
    float: left;
    width: 590px;
  }
  
    /****************************************************
      Content: Main: Links
    ****************************************************/
    #main a {
     padding: 0 1px;
     border-bottom: 1px dotted #b5dcb4;
    }
  
  
  /****************************************************
    Content: Sidebar
  ****************************************************/
  #sidebar {
    float: right;
    width: 300px;
  }
  

/****************************************************
  Footer
****************************************************/
#footer {
  clear: both;
  padding: 20px 0;
}

  #footer .copyright {
    background: #f5f5f5 url('../images/layout/footer-icon.gif') 9px 6px no-repeat;
  }
  #footer .copyright p {
    margin: 0;
    color: #888888;
    padding: 9px 37px;
  }