html
{ }

*
{ margin: 0;
  padding: 0;}

img.resize { max-width: 75%; max-height: 75%; }

body
{ font-family: "trebuchet ms", arial, sans-serif;
  font-size: .84em;
  color: #222;
  line-height: 1.4em;
  background: #FFFFFF;
  width: 900px;
  margin: 10px auto 0px auto;}
  
h1, h2, h3, h4, h5, h6 
{ color: #FFA509;
  letter-spacing: 0em;
  padding: 0 0 5px 0;}

h1, h2, h3
{ font: normal 170% 'lucida sans', arial;
  margin: 0 0 15px 0;
  padding: 0 0 5px 0;
  color: #000;}

h2
{ font-size: 130%;
  padding: 9px 0 5px 0;
  color: #555;}

h3
{ font-size: 140%;
  padding: 5px 0 0 0;}

h4, h6
{ color: #009FBC;
  padding: 0 0 5px 0;
  font: normal 110% arial;
  text-transform: uppercase;}

h5, h6
{ color: #888;
  font: normal 95% arial;
  letter-spacing: normal;
  padding: 0 0 15px 0;}

a, a:hover
{ outline: none;
  text-decoration: none;
  border-bottom: none;
  color: #B40404;}

p
{ line-height: 1.5em;
  padding-bottom: 17px;}

blockquote
{ margin: 20px 0; 
  padding: 10px 20px 0 20px;
  border: 1px solid #E5E5DB;
  background: #FFF;}

ul
{ margin: 2px 0 12px 0;}

ul li
{ list-style-type: none;
  background: url(bullet.png) no-repeat;
  margin: 0 0 0 0; 
  padding: 0 0 4px 25px;
  line-height: 1.5em;}

ol
{ margin: 8px 0 22px 0;}

ol li
{ margin: 0 0 11px 20px;}

.left
{ float: left;
  width: auto;
  margin-right: 10px;}

.right
{ float: right; 
  width: auto;
  margin-left: 10px;}

.center
{ display: block;
  text-align: center;
  margin: 20px auto;}

#basic-accordian
{ padding: 20px;
  background: #FFF;}

.accordion_headings
{ padding: 10px 25px 10px 25px;
  background: #1C1C1C;
  color: #FFFFFF;
  border-top: 1px solid #FFF;
  border-bottom: 1px solid #CCC;
  cursor: pointer;
  font-size: 120%;
  position: relative;
  z-index: 20;}

.accordion_headings:hover
{ background: #B40404;
  color: #FFFFFF;}

.accordion_child
{ padding: 25px;
  background: #FFF;}

.header_highlight
{ background: #1C1C1C;
  color: #FFFFFF;}

#logo
{ width: 100%;
  height: 200pxpx;
  background: transparent;
  color: #444;
  position: relative;
  z-index: 10;
  padding-top: 15px;}

#logo h1
{ font: normal 600% 'century gothic', arial;
  padding: 0px 20px 20px 20px;
  margin: 0;
  color: #000000;}

#footer p
{ letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: center;
  padding: 20px;
  color: #444;
  font-size: 90%;}

#footer a, #footer a:hover
{ color: #76786A;
  text-decoration: none;
  border: 0;}

.search
{ color: #5D5D5D; 
  border: 1px solid #BBB; 
  width: 134px; 
  padding: 4px; 
  font: 100% arial, sans-serif;}

.form_settings
{ margin: 15px 0 0 0;}

.form_settings p
{ padding: 0 0 4px 0;}

.form_settings span
{ float: left; 
  width: 200px; 
  text-align: left;}
  
.form_settings input, .form_settings textarea
{ padding: 5px; 
  width: 299px; 
  font: 100% arial; 
  border: 1px solid #E5E5DB; 
  background: #FFF; 
  color: #47433F;}
  
.form_settings .submit
{ font: 100% arial; 
  border: 0; 
  width: 99px; 
  margin: 0 0 0 212px; 
  height: 33px;
  padding: 2px 0 3px 0;
  cursor: pointer; 
  background: #EEE; 
  color: #111;}

.form_settings textarea, .form_settings select
{ font: 100% arial; 
  width: 299px;}

.form_settings select
{ width: 310px;}

.form_settings .checkbox
{ margin: 4px 0; 
  padding: 0; 
  width: 14px;
  border: 0;
  background: none;}

.separator
{ width: 100%;
  height: 0;
  border-top: 1px solid #D9D5CF;
  border-bottom: 1px solid #FFF;
  margin: 0 0 20px 0;}
  
table
{ margin: 10px 0 30px 0;}

table tr th, table tr td
{ background: #EFEFEF;
  color: #111;
  padding: 7px 4px;
  text-align: left;}
  
table tr td
{ background: #F8F8F8;
  color: #47433F;
  border-top: 1px solid #FFF;}

/*lightbox*/

/* Styles the thumbnail */

a.lightbox img {
height: 150px;
border: 3px solid white;
box-shadow: 0px 0px 8px rgba(0,0,0,.3);
margin: 94px 20px 20px 20px;
}

/* Styles the lightbox, removes it from sight and adds the fade-in transition */

.lightbox-target {
position: fixed;
top: -100%;
width: 100%;
background: rgba(0,0,0,.7);
width: 100%;
opacity: 0;
-webkit-transition: opacity .5s ease-in-out;
-moz-transition: opacity .5s ease-in-out;
-o-transition: opacity .5s ease-in-out;
transition: opacity .5s ease-in-out;
overflow: hidden;
}

/* Styles the lightbox image, centers it vertically and horizontally, adds the zoom-in transition and makes it responsive using a combination of margin and absolute positioning */

.lightbox-target img {
margin: auto;
position: absolute;
top: 0;
left:0;
right:0;
bottom: 0;
max-height: 0%;
max-width: 0%;
border: 3px solid white;
box-shadow: 0px 0px 8px rgba(0,0,0,.3);
box-sizing: border-box;
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
}

/* Styles the close link, adds the slide down transition */

a.lightbox-close {
display: block;
width:50px;
height:50px;
box-sizing: border-box;
background: white;
color: black;
text-decoration: none;
position: absolute;
top: -80px;
right: 0;
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
}

/* Provides part of the "X" to eliminate an image from the close link */

a.lightbox-close:before {
content: "";
display: block;
height: 30px;
width: 1px;
background: black;
position: absolute;
left: 26px;
top:10px;
-webkit-transform:rotate(45deg);
-moz-transform:rotate(45deg);
-o-transform:rotate(45deg);
transform:rotate(45deg);
}

/* Provides part of the "X" to eliminate an image from the close link */

a.lightbox-close:after {
content: "";
display: block;
height: 30px;
width: 1px;
background: black;
position: absolute;
left: 26px;
top:10px;
-webkit-transform:rotate(-45deg);
-moz-transform:rotate(-45deg);
-o-transform:rotate(-45deg);
transform:rotate(-45deg);
}

/* Uses the :target pseudo-class to perform the animations upon clicking the .lightbox-target anchor */

.lightbox-target:target {
opacity: 1;
top: 0;
bottom: 0;
}

.lightbox-target:target img {
max-height: 100%;
max-width: 100%;
}

.lightbox-target:target a.lightbox-close {
top: 0px;
}