﻿html, body { height: 100%; }
#aspnetForm { height: 100%; }
body { background-color: #220033; color: #ddd; font-family: 'Quattrocento Sans' , 'Arial' , Sans-Serif; line-height: 1.8em; font-weight: normal; font-size: 18px; margin: 0px auto; }
#wrap { min-height: 100%; margin-bottom: -80px; spadding-bottom: 30px; }
#wrap:after { display: block; }
#main { overflow: hidden; padding-bottom: 80px; }
.page { width: 1000px; margin: 0px auto; padding: 0px 10px; }

#header { display: block; width: 100%; height: 50px; background-color: #00aacc; sbackground-color: #eecc00; padding: 0px; }

#logo_div { display: block; float: left; width: 250px; height: 50px; font-family: 'Verdana'; font-size: 14px; font-weight: bold; spadding-left: 10px; }
#logo_div a { color: #333; text-decoration: none; }
.LogoHyperlink { font-family: Orbitron, Sans-Serif; font-weight:700; font-size: 40px; color: #fff !important; margin: 0px; padding: 10px 0px 0px 20px; height: 38px; display: block; }
.LogoHyperlink a { color: #d12228; }

#mobile_logo_div { display: none; }
.MobileLogoHyperlink { display: none; }

#mobile_menu_div { display: none; }
#menu_div { float: right; margin: 10px; }

#address_div { float: right; font-family: 'Quattrocento Sans' , 'Arial' , Sans-Serif; font-weight:bold;  font-size: 36px; font-weight: bold; text-align: right; line-height: 1.4em; color: #eeffee; }

#menu { display: block; width: 100%; margin: 0px auto; background-color: #000; }

#mobile-menu { width: 100%; background-color: #222; }

.sms { text-align:center; background-color:#000; }
.smis { padding: 0px 0px; text-align:center; }
.smis a { color: #ddd; display: block; padding: 0px 20px; font-weight: bold; }
.shs a { background-color: #333; color: #FF66CC; }
.sss { background-color: #9900CC; color: #fff; }
.sss a { color: #fff; }

.sms2 { width: 100%; font-size: 24px; }
.smis2 { color: #fff; padding: 0px; }
.smis2 a { color: #ddd; padding: 10px 20px; display: block; }
.shs2 a { background-color: #555; color: #FF66CC; }
.sss2 { background-color: #9900CC; color: #fff; }
.sss2 a { color: #fff; }

h1 { font-size: 40px; font-family: 'Quattrocento Sans' , 'Arial' , Sans-Serif; line-height: 1.3em; }
h2 { font-size: 26px; font-family: 'Quattrocento Sans' , 'Arial' , Sans-Serif; }
h3 { font-size: 20px; font-family: 'Quattrocento Sans' , 'Arial' , Sans-Serif; }
h4 { font-size: 15px; font-weight: bold; line-height: 1.2em; margin-bottom: 0px; }
li { margin-bottom:1.1em; list-style-type:square; }

#footer { padding: 10px; clear: both; background-color: #CC3399; font-size: 15px; color: #eee; }
#footer a { color: #fff; }
#footer a:hover { color: #fff; }

#banner-image { height:480px; }

#content { margin:30px 0px; text-align:center; font-size:18px; line-height:1.5em; }
#content a { color: #ff77aa; font-weight: bolder; }
#content a:hover { color: #00aa00; }

/*

#banner { height: 130px; font-family: 'Quattrocento Sans' , 'Arial' , Sans-Serif; padding-top: 20px; }
#banner-header { font-size: 50px; line-height: 1.4em; }
#banner-body { font-size: 20px; }


#contact1 { float: left; min-width: 350px; padding-bottom: 30px; }
#contact2 { float: left; min-width: 450px; border-left: solid 1px #ddd; padding-left: 40px; padding-bottom: 30px; }
#contact2 input { width: 270px; }
#contact2 textarea { width: 270px; }
.tbl { display: table; }
.tblfw { display: table; width: 100%; }
.tr { display: table-row; }
.th { display: table-cell; }
.td { display: table-cell; vertical-align: top; }

.generated-img { width: 120px; }
*/
@media print {
    #banner { display: none !important; }
    .no-print { display: none !important; }
}
@media screen and (min-width: 800px) and (max-width: 999px) {
    .page { width: 95%; }
    .smis a { display: block; padding: 0px 10px; }

    #contact1 { float: left; min-width: 200px; }
    #contact2 { float: left; min-width: 300px; }
}

@media screen and (min-width: 480px) and (max-width: 799px) {
    .page { width: 95%; }
    #header { height: 70px; }

    #logo_div { display: none; }
    .LogoHyperlink { display: none; }

    #mobile_logo_div { display: block; float: left; width: 120px; height: 70px; }
    .MobileLogoHyperlink { display: block; font-size:30px; font-weight:bold; margin-top:20px; text-decoration:none; color:#fff; }

    #mobile_menu_div { display: block; float: right; position: relative; top: 20px; margin-left:10px; }
    .MobileMenuButton { outline: none; }

    #address_div { font-weight:bold;  font-size: 26px; margin-top:15px; }

    #menu_div { display: none; }
    #menu { display: none; }

    #content { font-size:18px; text-align:left; line-height:1.5em; }

    #banner-header { font-size: 34px; }
    img { width: 100%; }
    #banner-image { height:140px; }
}

@media screen and (max-width: 479px) {
    body { line-height: 1.6em; font-weight: normal; font-size: 18px; margin: 0px auto; }
    .page { width: 95%; }

    #header { height: 60px; }

    #logo_div { display: none; }
    .LogoHyperlink { display: none; }

    #mobile_logo_div { display: block; float: left; width: 90px; height: 50px; }
    .MobileLogoHyperlink { display: block; font-size:20px; font-weight:bold; margin-top:20px; text-decoration:none; color:#fff; }

    #mobile_menu_div { display: block; float: right; position: relative; top: 20px; }
    .MobileMenuButton { outline: none; }

    #address_div { font-weight:bold;  font-size: 16px; margin-top:20px; margin-right:5px; }

    #menu_div { display: none; }
    #menu { display: none; }
    #banner-header { font-size: 34px; }
    #footer { display: block; font-size: 12px; line-height: 1.6em; height: auto; }
    img { width: 100%; }
    li { position:relative; left:-15px; }

    #contact1 { float: none; min-width: 40px; }
    #contact2 { float: none; min-width: 40px; border-left: none; padding-left: 0px; }

    .tbl { display: block; }
    .tblfw { display: block; width: 100%; }
    .tr { display: block; }
    .th { display: block; }
    .td { display: block; }
    
    #content { font-size:20px; text-align:left; line-height:1.5em; }
}

@media screen and (min-width: 380px) and (max-width: 479px) {
    #banner-image { height:180px; }
}

@media screen and (min-width: 300px) and (max-width: 379px) {
   #banner-image { height:160px; }
}