@font-face {
    font-family: 'poppinsbold';
    src: url('/fonts/poppins-bold-webfont.eot');
    src: url('/fonts/poppins-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/poppins-bold-webfont.woff2') format('woff2'),
         url('/fonts/poppins-bold-webfont.woff') format('woff'),
         url('/fonts/poppins-bold-webfont.ttf') format('truetype'),
         url('/fonts/poppins-bold-webfont.svg#poppinsbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'poppinsregular';
    src: url('/fonts/poppins-regular-webfont.eot');
    src: url('/fonts/poppins-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/poppins-regular-webfont.woff2') format('woff2'),
         url('/fonts/poppins-regular-webfont.woff') format('woff'),
         url('/fonts/poppins-regular-webfont.ttf') format('truetype'),
         url('/fonts/poppins-regular-webfont.svg#poppinsregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Fonts */
body, footer nav { font-family: poppinsregular; }
section article { font-family: Verdana, Helvetica, sans-serif; }
footer { font-family: 'Lucida Sans Unicode', Helvetica, Verdana, sans-serif; }


a[name=top] { position: absolute; display: block; width: 0; height: 0; }
a[rel=up] { display: inline-block; padding: 15px 30px; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }


div.o80, div.w80, div.g70, div.lg60, div.lg70 { display: inline-block; }
.o80, .w80, .g70, .lg60, .lg70 { background-color: transparent; background-repeat: repeat; }
.o80 { background-color: #f90; }
.w80 { background-color: #fff; }
.g70 { background-image: url(/images/g70.png) }
.lg60 { background-image: url(/images/lg60.png) }
.lg70 { background-image: url(/images/lg70.png) }

.bt, .bt a { color: #000; }
.wt, .wt a { color: #fff; }
.gt, .gt a { color: #333; }

body { margin: 0; }
form { position: relative; }
header { background: url(/images/rock-estuary.jpg) center no-repeat; height: 400px; }

div.contact { float: right; font-size: 20px; margin-right: 25px; text-transform: uppercase; }
div.contact div { padding: 0.25em 0.5em; }

#ml, #tnav, label[for=tnav] { display: none; }

nav ul, nav ul li { list-style: none; margin: 0; padding: 0; }
nav ul li { display: inline-block; }

header nav { font-size: 20px; padding: 0 25px 0 0; }
header nav ul.social { display: inline-block; float: right; width: initial; }
header nav ul.social li { padding: 0.2em 0.5em; }
header nav ul.social li img { padding-top: 0.25em; }

header nav ul.topnav { display: inline-block; padding: 0 10px 0 30px; float: left; max-width: calc(100% - 225px); width: initial; }
header nav ul.topnav, header nav ul.topnav a { font-family: poppinsregular; text-transform: uppercase; font-weight: normal; line-height: 1.3em; }
header nav ul.topnav li:after { content: '*'; display: inline-block; font-size: 20px; text-align: center; width: 1.5em; padding-left: 0.2em }
header nav ul.topnav li:last-of-type:after { display: none; }
header nav ul.topnav li { padding: 0.4em 0 0.2em 0; }

header nav ul.topnav, header nav ul.social { min-height: 43px; }

nav.subnav { text-align: right; padding: 0 25px 0 30px; margin: 0.5em 0 0.2em 0; display: inline-block; float: right; clear: both; }
nav.subnav li { padding: 0.25em; display: inline-block; }
nav.subnav a { text-transform: uppercase; font-weight: bold; line-height: 1.3em; font-size: 14px; }
nav.subnav li:after { content: '*'; display: inline-block; font-size: 14px; text-align: right; width: 1.2em; }
nav.subnav li:last-of-type:after { display: none; }

div.strip { background: #f90; text-align: right; padding: 0.45em 25px 0.3em 30px; clear: both; }
div.opening { text-align: center; font-size: 20px; }

.tt { color: #f90; text-align: center; font-size: 33px; font-weight: normal; }

div.pnls { text-align: center; }
aside.p3 { width: 30%; display: inline-block; font-size: 14px; line-height: 1.5em !important; vertical-align: top; }
aside.p3:nth-of-type(2) { margin: 0 1%; }
aside.p3 img { width: 100%; max-width: 600px; }
aside.p3, aside.p3 a { color: #555; }
aside.p3 h4, aside.p3 h4 a { color: #333; }
.lc section .pnls { margin: 1.6em -60px 1em -60px; }

.menus table, table.menu { width: 100% !important; display: table; vertical-align: top; clear: none; margin-bottom: 1em;  }
.menus table td, table.menu td { border-bottom: 1px dashed #333 !important; padding: 0.3em 0; }
.menus table td, table.menu td, .menus table th, table.menu th { text-align: left; font-weight: normal; vertical-align: top; width: auto !important; }
.menus table tr td:nth-of-type(2), table.menu tr td:nth-of-type(2) { text-align: right; padding-left: 2em; }
.menus table tr:first-of-type td:first-of-type, table.menu tr:first-of-type td:first-of-type { text-align: left; }
.menus table h3, table.menu h3 { margin: 0 0 0.75em 0; }
.menus table p, table.menu p { margin: 0; }
.menus table p + p, table.menu p + p { margin: 0.5em 0 0 0; }

.menus table ~ br, table.menu ~ br { display: none; }
.stack table ~ br { display: none; }

.stack > table { width: 100% !important; display: table; vertical-align: top; clear: none;  }
.stack > table td, .stack > table th { width: auto !important; }
.stack > table h3 { margin: 1em 0 0 0; }
.stack > table img { width: 100%; height: auto; }

.menus, .stack {
    margin-top: 1em;
    clear: both;
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 60px;
    -moz-column-gap: 60px;
    column-gap: 60px;
}

.menus table, .menus table.menu, .stack > table {
    width: 100% !important;
    height: auto !important;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
}

.lc section { padding: 1em 60px 0 60px; color: #555; font-size: 20px; line-height: 1.4em; }
.lc section a { color: #f90; }
.lc section h1 { color: #f90; font-size: 36px; padding: 0; margin: 0.35em 0 0.5em 0; font-weight: normal; }
.lc section h1 + h2, .lc section h1 + p, .lc section h2 + p { margin-top: 0.3em; }
.lc section h2 { font-size: 27px; padding: 0; margin: 0.6em 0 0.4em 0; font-weight: normal; }
.lc section h3 { font-size: 22px; padding: 0; margin: 0; font-weight: normal; line-height: 1.3em; }
.lc section h4 { font-size: 14px; padding: 0; margin: 0; font-weight: normal; line-height: 1.5em; }
.lc section h5 { color: #f90; font-size: 14px; padding: 0; margin: 0; font-weight: normal; }
.lc section h5 a { color: #f90; }
.lc section h6 { color: #333; font-size: 11px; padding: 0; margin: 0; font-weight: normal; }
.lc section h6 a { color: #333; }
.lc section p, .lc section li, .lc section th, .lc section td { font-size: 14px; line-height: 1.3em; }


.sfb { background: #f90; padding: 7px 25px 7px 30px; font-size: 14px; }
.sfb img { width: 26px; height: 26px; vertical-align: middle; }
.sfb #socfeed, .sfb .status, .sfb .postdate, .sfb p { display: inline; }
.sfb p, .sfb .status, .sfb .postdate { padding: 3px 0; margin: 0; }


.inf { background: #666; padding: 7px 25px 7px 30px; font-size: 14px; overflow-x: hidden; }
.inf .ttl { vertical-align: middle; margin-bottom: 0.3em; }
.inf .ttl img { vertical-align: middle; }
.inf .imc { overflow-y: hidden; overflow-x: scroll; width: 100%; height: 236px; }
.inf .imgs { width: 4500px; }
.inf .imgs a { display: inline-block; float: left; margin-right: 6px; }
.inf .imgs a:last-of-type { margin-right: 0; }
.inf .imgs img { height: 216px; }


.ss { padding-right: 25px; text-align: right; }


footer { background: #666; text-align: center; padding: 0.8em 25px 1em 30px; color: #fff; margin-top: 0.25em; }
footer nav { padding-bottom: 1em; font-size: 11px; }
footer nav.sitemap li { text-transform: uppercase; }
footer nav.sitemap li:after { content: '*'; display: inline-block; font-size: 11px; text-align: right; width: 0.9em; }
footer nav.sitemap li:last-of-type:after { display: none; }
footer nav, footer nav a { color: #f90; }
footer p { font-size: 11px; line-height: 1.3em; }
footer a { color: #f90; }


#ci { text-align: center; }
#ci .x { font-size: 110%; font-weight: bold; padding: 3px 8px;  }


@media 
    only screen and (min-width : 320px) and (max-width : 749px) and (-webkit-device-pixel-ratio : 1)
{
    .menus, .stack {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
    }
}

@media 
    only screen and (min-width : 750px) and (max-width : 1179px) and (-webkit-device-pixel-ratio : 1)
{
    .menus, .stack {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
}

@media 
    only screen and (min-width : 1180px) and (-webkit-device-pixel-ratio : 1)
{
    .menus, .stack {
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
    }
}

/*All responsive*/
@media 
    only screen and 
    (min-device-width : 300px) and 
    (max-device-width : 1023px) 
{
    body { overflow-x: hidden; }
    header nav, nav.subnav, h2.tt { display: none; }

    a[rel=up] { display: block; text-align: center; padding: 15px 0; }
    div.contact { font-size: 0; }
    a[rel=contact] { position: absolute; top: 10px; right: 10px; padding: 4px; width: 28px; text-align: center; background: #fff; }
    a[rel=contact] img { height: 28px !important; width: 20px !important; }

    nav.sitemap { line-height: 1.6em; }

    /*
    #mt { display: block; width: 26px; height: 26px; background: #555 url(/images/mt.svg) center center no-repeat; 
          background-size: contain; cursor: pointer; position: absolute; top: 10px; left: 10px; border: 5px solid #555; }
    */

    label[for=tnav] { display: block; position: absolute; top: 10px; left: 10px; width: 26px; height: 26px; }
    label[for=tnav]:after { content: ''; display: block; width: 26px; height: 26px; 
          background: #555 url(/images/mt.svg) center center no-repeat; background-size: contain; 
          cursor: pointer; position: absolute; border: 5px solid #555; z-index: 200; }

    #tnav { display: inline-block; visibility: hidden; position: absolute; top: -100px; left: 0; }
    #tnav:checked ~ label {  }
    #tnav:checked ~ label:after {  }

    #tnav:checked ~ #ml { display: block !important; }

    #ml { list-style: none; padding: 0; margin: 0; position: absolute; top: 50px; left: 10px; 
          background: #555; display: none; font-size: 20px; box-shadow: -10px 10px 20px 0px rgba(0,0,0,0.5); }
    /*#ml.sh { display: block !important; }*/
    #ml a { color: #fff; display: block; padding: 0.4em 0.75em; }

    div.hometop { height: 100px; background-size: cover; }

    aside.p3 { width: 100%; }
    aside.p3 p, aside.p3 h4 { display: none; }
    aside.p3:nth-of-type(2) { margin: 0; }
    .lc section .pnls { margin: 1em -20px 0 -20px; }

    .sfb { text-align: center; }

    .lc section { padding: 1em 20px 0 20px; }
    .lc section h1, .lc section h2 { text-align: center; }
    .lc section h1 { margin-top: 0; line-height: 1.2em; }

    .ss { padding-right: 20px; }

    .inf .ttl { text-align: center; }
    .inf .imc { -webkit-overflow-scrolling: touch; }

    .menus, .stack {-webkit-column-count: 1; -moz-column-count: 1; column-count: 1; }
    iframe { width: calc(100% + 40px); margin: 1em 0 0 -20px; }
}

@media 
    only screen and 
    (min-device-width : 700px) and 
    (max-device-width : 1023px) 
{
    aside.p3 { width: 30%; }
    aside.p3 p, aside.p3 h4 { display: block; }

    .lc section { padding: 1em 60px 0 60px; }
    .lc section h1, .lc section h2 { text-align: left; }
    .menus, .stack {-webkit-column-count: 2; -moz-column-count: 2; column-count: 2; }
    iframe { width: 100%; margin: 1em 0 0 0; }
}