*
{
 padding: 0;
 margin: 0;
 font-family: verdana, sans-serif;
 font-size: 12pt;
}

html
{
 overflow-y: scroll;
}

body
{
 background: #000 url(../img/back.jpg);
}

a
{
 text-decoration: none;
}

.clr
{
 clear: both;
}

#container
{
 width: 1020px;
 margin: 0 auto;
}

#greenlight
{
 float: right;
 margin: 0 100px 0 0;
}


#cog-logo
{
 float: left;
 margin: 0 0 0 130px;
}

header
{
 position: relative;
 top: 0;
 left: -63px;
 width: 1020px;
 height: 325px;
}

header.index
{
 height: 785px;
}

#header-image
{
 position: absolute;
 top: 167px;
 left: 107px;
 z-index: 5;
}

#header-logo
{
 position: absolute;
 top: -103px;
 left: 270px;
 z-index: 10;
}

#header-logo a
{
 background: url(../img/logo4.png) no-repeat;
 display: block;
 width: 620px;
 height: 321px;
}

#header-pipe
{
 position: absolute;
 top: 150px;
 left: 0;
 z-index: 20;
 width: 1130px;
 height: 190px;
 background: url(/img/pipes.png);
}

header.index #header-pipe
{
 height: 650px;
 background: url(/img/pipes_i.png);
}

ul#menu
{
 list-style-type: none;
 position: absolute;
 top: 263px;
 left: 100px;
 z-index: 30;
}

header.index ul#menu
{
 top: 723px;
}

ul#menu > li
{
 float: left;
 text-align: center;
}

ul#menu > li > a
{
 font-size: 20pt;
 font-weight: bold;
 text-transform: uppercase;
 color: #ec9;
}

ul#menu > li.menu1
{
 margin-left: 10px;
 width: 160px;
}

ul#menu > li.menu2
{
 margin-left: 80px;
 width: 160px;
}

ul#menu > li.menu3
{
 margin-left: 75px;
 width: 160px;
}

ul#menu > li.menu4
{
 margin-left: 80px;
 width: 160px;
}

#content
{
 background: url(../img/paper_mid_2.png) repeat-y;
 padding: 0 10em 2em 10em;
}

#content iframe
{
 max-width: 100%;
}

#content-header
{
 width: 1020px;
 height: 160px;
 background: url(../img/paper_top_2.png) no-repeat;
}

#content-footer
{
 width: 1020px;
 height: 90px;
 background: url(../img/paper_bottom_2.png) -10px 0 no-repeat;
 text-align: center;
}

#content h1,
#content-header h1
{
 font-family: garamond, serif;
 color: #491b00;
 font-size: 24pt;
 margin-bottom: .5em;
 text-align: center;
}

#content-header > h1
{
 padding: 80px 30px 0 30px;
 background: url(../img/divider.png) center 115px no-repeat;
}

#content h1::after
{
 clear: both;
 content: " ";
 display: block;
 margin: 0 auto;
 width: 266px;
 height: 46px;
 background: url(../img/divider.png) center 0 no-repeat;
}

#content h2,
#content h2 > a
{
 font-family: garamond, serif;
 color: #491b00;
 font-size: 18pt;
 font-weight: bold;
 margin-bottom: 0;
}

#content p.date
{
 font-size: 10pt;
 margin-bottom: 0;
}

#content > p
{
 margin-bottom: 1em;
}

#content p img
{
 max-width: 100% !important;
 height: auto;
}

footer
{
 margin: 10px auto 0 auto;
 padding: 5px;
 text-align: center;
}

footer > p
{
 font-size: 9pt;
 color: #eee;
}

footer > p > a
{
 font-size: 9pt;
 color: #eee;
}

#footer-social
{
 margin-bottom: 20px;
}

#footer-social a
{
 margin-right: 30px;
}

#footer-social img
{
 width: 160px;
 height: auto;
}

#footer-social a:last-of-type
{
 margin-right: 0;
}

.gallery-image-list-item
{
 width: 200px;
 min-height: 50px;
 _height: 200px;
 text-align: center;
 margin: 0 20px 10px 0;
 vertical-align: top;
 display: inline-block;
 display: -moz-inline-stack;
 zoom: 1;
 *display: inline;
}

.news-piece
{
 clear: both;
 margin-bottom: 1em;
}

.news-piece img
{
 float: left;
 margin-right: 1em;
}

@media screen and (max-width: 1280px)
{
 #greenlight
 {
   position: static;
   text-align: center;
   margin: 0 auto;
 }
}

@media screen and (max-width: 1020px)
{
 #container
 {
   width: 100%;
 }
 #content-header, #content-footer
 {
   width: 100%;
   background-position: center;
 }
 #content
 {
   background-position: center;
   padding: 1em 2em;
 }
}

@media screen and (max-width: 640px)
{

 #header-image, #header-pipe {display: none;}
 header, header.index {position: static; width: 100%; height: auto; top: auto; left: auto; margin: 0 auto; text-align: center;}
 ul#menu {position: static; display: inline-block; background: url(../img/pipe-mobile.png) no-repeat; width: 477px; height: 196px;}
 ul#menu > li.menu1 {margin-left: 40px; margin-top: 35px; width: 160px;}
 ul#menu > li.menu2 {margin-left: 80px; margin-top: 35px; width: 160px;}
 ul#menu > li.menu3 {margin-left: 45px; margin-top: 65px; width: 160px;}
 ul#menu > li.menu4 {margin-left: 80px; margin-top: 65px; width: 160px;}

 #header-logo {display: inline-block; position: static; top: auto; left: auto; margin: 0 auto;}
 #header-logo a {background: url(../img/logo-mobile.png) no-repeat; max-width: 400px; height: 187px;}
 #header-logo img {width: 100%;}

 #content {overflow: hidden;}

 #content h1, #content-header h1
 {
   font-size: 150%;
 }
 #content-header h1
 {
   background: none;
 }
 #content h2, #content h2 a
 {
   font-size: 125%;
 }
 #content p
 {
  font-size: 100%;
 }
 #greenlight iframe {width: 100%; min-width: 300px; max-width: 336px;}
 #footer-social a {margin-right: 0;}
 #footer-social a img {margin-bottom: 5px;}
 #cog-logo {margin: 0 0 0 0;}
 
 .news-piece img {float: none; max-width: 300px; max-width: 100%; margin: 0 auto; clear: both; text-align: center;}
}

@media screen and (max-width: 479px)
{
 #header-pipe {height: 0;}
 header, header.index {width: 100%; height: auto;}
 #header-logo a {width: 300px; height: 140px; background-size: 300px 140px;}
 ul#menu {background-size: 100%; width: 100%; height: auto;}
 ul#menu > li {width: 45%; text-align: center;}
 ul#menu > li.menu1, ul#menu > li.menu2, ul#menu > li.menu3, ul#menu > li.menu4 {margin: 6% 5% 6% 5%; width: 40%; text-align: center;}
}

@media screen and (max-device-width: 320px)
{
 #greenlight {}
}