html { background: #003659; }

body { 
  background: #003659 url('/theme/img/tile.jpg') repeat-x center 165px;  
  text-align: center; }

.wrap {
  width: 1200px;
  margin-top: 0;
  position: relative; } 

/* Site Header
------------------------------------ */

header {
  background: none;
  width: 1200px;   
  height: 115px;
  position: relative; 
  color: #fff;
  border-bottom: 40px #ad2624 solid; }

#logo {
  display: block;
  opacity: 1;
  position: absolute; 
  left: -10px;
  top: 0;
  z-index: 10;
  -webkit-transition: opacity .5s ease-in-out;
  -moz-transition:    opacity .5s ease-in-out;
  -o-transition:      opacity .5s ease-in-out;
  -ms-transition:     opacity .5s ease-in-out;
  transition:         opacity .5s ease-in-out; }
/*   left: 27px; top: 13px;
------------------------------------ */
  
#logo:hover { opacity: 1; }
#logo:active { opacity: .7; }

/* --- Join Form --- */

.join { 
  border-right: 1px solid rgba(0,0,0,.2);
  padding-right: 19px;
  display: inline;
  text-align: left; 
  position: absolute;
  right: 160px;
  top: 27px; } 

.join li { 
  padding: 0 2px; 
  display: inline-block;
  float: left;
  text-align: left; }

.join .title { 
  width: 70px;
  margin: 6px 5px 0 0;
  display: block;
  position: relative;
  font: 300 16px/1 museo-sans, arial;
  color: #8c9ca3;
  text-transform: uppercase;
  text-align: right;
  -webkit-transition: color .3s ease-in-out;
  -moz-transition:    color .3s ease-in-out;
  -o-transition:      color .3s ease-in-out;
  -ms-transition:     color .3s ease-in-out;
  transition:         color .3s ease-in-out; }
.subscribe a.title:hover { color: #e79706; }
.subscribe a.title:active { color: #eb6e1f; }

.join input { 
  background: #e4e4e4;   
  border: none;
  width: 96%;
  margin: 0 auto;
  padding: 6px 2%; 
  cursor: pointer; 
  -moz-border-radius:    4px; 
  -webkit-border-radius: 4px;
  border-radius:         4px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  line-height: 11px;
  color: #012140;
  transition:         all .35s ease-in-out;    
  -webkit-transition: all .35s ease-in-out;  
  -moz-transition:    all .35s ease-in-out;  
  -o-transition:      all .35s ease-in-out;  
  -ms-transition:     all .35s ease-in-out; } 
.join .zip_code {  width: 65px !important; }

.join input:hover { 
  background-color: #e4e4e4;
  color: #606060;
  box-shadow:         1px 1px 2.5px rgba(0, 0, 0, 0.1);       
  -moz-box-shadow:    1px 1px 2.5px rgba(0, 0, 0, 0.1);    
  -webkit-box-shadow: 1px 1px 2.5px rgba(0, 0, 0, 0.1); }

/* ---- Placeholder Text Equalizer - NEEDED!! ---- */
.join #content input:-moz-placeholder                 { opacity: 1; }
.join #content input::-moz-placeholder                { opacity: 1; }
.join #content input:-ms-input-placeholder            { color: #fdbc32; }
.join #content input::-webkit-input-placeholder       { color: #fdbc32; }
.join #content input:hover:-ms-input-placeholder      { color: #fff; }
.join #content input:hover::-webkit-input-placeholder { color: #fff; }       

.join input:focus { 
  background-color: #e9e9e9;
  color: #606060;
  cursor: text; 
  box-shadow:         inset 1.5px 1.5px 3.5px rgba(0, 0, 0, 0.25);       
  -moz-box-shadow:    inset 1.5px 1.5px 3.5px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: inset 1.5px 1.5px 3.5px rgba(0, 0, 0, 0.25); }

.join button {
  background: rgba(235, 110, 31, 1) url(/theme/img/go.png) no-repeat center center; 
  width: 25px;
  height: 25px;
  border: none;   
  overflow: hidden;
  display: inline-block;
  float: left;
  position: relative;
  cursor: pointer;
  -moz-border-radius:    4px;
  -webkit-border-radius: 4px;
  border-radius:         4px;
  -webkit-transition: all .35s ease-in-out;  
  -moz-transition:    all .35s ease-in-out;  
  -o-transition:      all .35s ease-in-out;  
  -ms-transition:     all .35s ease-in-out;
  transition:         all .35s ease-in-out; } 
.join button:hover { background-color: rgba(26, 57, 71, 1) }  
.join button:active { 
  background-color: rgba(253, 184, 37, 1);
  box-shadow:         inset 1.5px 1.5px 3.5px rgba(0, 0, 0, 0.25);		 
  -moz-box-shadow:    inset 1.5px 1.5px 3.5px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: inset 1.5px 1.5px 3.5px rgba(0, 0, 0, 0.25); } 


/* --- Site Header --- */

ul#connect {
list-style: none;
display: inline;
position: absolute;
right: 25px;
top: 27px; }
ul#connect > li {
width: 25px;
display: inline-block; }

ul#connect > li a {
  background: rgba(26, 57, 71, .5) url(/theme/img/connect.png) no-repeat 0 0;
  height: 25px;
  display: block;
  position: relative;
  -moz-border-radius:    6px;
  -webkit-border-radius: 6px;
  border-radius:         6px;
  -webkit-transition: background-color .5s ease-in-out;
  -moz-transition:    background-color .5s ease-in-out;
  -o-transition:      background-color .5s ease-in-out;
  -ms-transition:     background-color .5s ease-in-out;
  transition:         background-color .5s ease-in-out; }
ul#connect > li a:hover { background-color: rgba(235, 110, 31, 1); }
ul#connect > li a:active { 
  background-color: rgba(253, 184, 37, 1);
  -moz-box-shadow:    inset 1px 1px 2px rgba(0, 0, 0, .25);
  -webkit-box-shadow: inset 1px 1px 2px rgba(0, 0, 0, .25);
  box-shadow:         inset 1px 1px 2px rgba(0, 0, 0, .25); }

ul#connect li.facebook a { background-position: 0 0; }
ul#connect li.twitter a { background-position: -25px 0 !important; }
header ul#connect li.youtube a { background-position: -50px 0 !important; }
header ul#connect li.flickr a { background-position: -75px 0 !important; }


/* Site Footer
------------------------------------ */

footer {
  width: 1174px;
  padding: 20px 13px;
  margin-top: 1em;
  font-size: 13px;
  line-height: 13px;
  background: #e1e1e1; }
footer a { color: #646464; }

nav#footer {
   border-top: #bbb 1px solid;
   border-bottom: #bbb 1px solid;
   padding: 15px;
   margin: 1em 0; }

footer address {
  font-style: normal;
  text-align: left;
  float: left; }  
footer address strong { 
  display: block; 
  font-weight: 400; }  

footer .links { float: right; } 


