/* NORMALIZER*/
html{margin:0;padding:0;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{background:#e3e2e0;margin:0;padding:0;font:16px/1 txt;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family: arial, verdana, tahoma, sans-serif;}
div,article,aside,footer,header,nav,section,summary,li,b,i{display:block;box-sizing:border-box}
b,i{font-weight:inherit;font-style:inherit;position:absolute;padding:0;margin:0;}
a{text-decoration:none;background-color:transparent;-webkit-transition: background-color 0.5s,box-shadow 1s,border 0.5s,color 0.5s;transition: background-color 0.5s,box-shadow 1s,border 0.5s,color 0.5s;box-sizing:border-box;font-family: arial, verdana, tahoma, sans-serif}
a:active,a:hover{outline:0;text-decoration:underline;color:#26a5dc}
input{box-sizing:border-box}
h1,h2,h3,h4,p,blockquote,figure,ol,ul,input{margin:0;padding:0}
h1,h2,h3,h4{font-size:inherit}
strong{font-weight:700}
a,button{color:inherit}
button{overflow:visible;border:0;font:inherit;-webkit-font-smoothing:inherit;letter-spacing:inherit;background:none;cursor:pointer}
::-moz-focus-inner{padding:0;border:0}
:focus{outline:0}
img{max-width:100%;height:auto;border:0}




.S{ /* SPRITE */
    background: url(s/1.png);
    background-size: 512px 512px;
}
#BG{ /* PAGE BLUE BAR SECTION */
    width:100%;
    height:280px;
    top:28px;
    background-color: #506978;
    background-image: -ms-linear-gradient(top, #506978 0%, #22383c 100%);
    background-image: -moz-linear-gradient(top, #506978 0%, #22383c 100%);
    background-image: -o-linear-gradient(top, #506978 0%, #22383c 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #506978), color-stop(100, #22383c));
    background-image: -webkit-linear-gradient(top, #506978 0%, #22383c 100%);
    background-image: linear-gradient(to bottom, #506978 0%, #22383c 100%);
    box-shadow:inset 0 10px 0 -1px #152224,inset 0 11px 0 -1px #425261,inset 0 15px 5px -5px #000, inset 0 -2px 0 -1px #000, inset 0 -2px 1px -1px #FFF, inset 0 -8px 4px -6px #000;
}
#BG:before{
    content:"";
    position:absolute;
    top:-27px;
    left:0;
    width:100%;
    height:32px;
    background-color: #301a16;
    background: url(b/5.png);
    box-shadow:0 0 0 2px #40241c,inset 0 -1px 2px rgba(0,0,0,0.7);
    border-bottom:dashed 1px #805640;
}
#BG:after{
    content:"";
    position:absolute;
    bottom:-4px;
    left:0;
    width:100%;
    height:1px;
    background-color: #111;
    box-shadow:0 0 0 2px #40241c,inset 0 1px 2px rgba(0,0,0,0.7),0 2px 4px #000,0 2px 4px #000;
    border-top:dashed 1px #805640;
}
#BG2{
    margin:0;
    left:0;
    top:286px;
    width:1013px;
    width:100%;
    height:154px;
    background-color:#3a342d;
}
#BG3{
    top:1429px;
    left:0;
    width:100%;
    height:100px;
    background-color: #3a342d;
    box-shadow:inset 0 -200px 100px -200px #000,0 0 5px #000;
}
#BG4{
    position:absolute;
    margin-left:50%;
    left:-507px;
    width:1013px;
    top:317px;
    height:1114px;
    box-shadow:0 7px 20px rgba(0,0,0,0.3);
}


#MAIN{
    margin:0 auto;
    position:relative;
    top:0;
    width:1013px;
    font-size:14pt;
    color:#000;
    line-height: 1.5;
    min-height:100%;
}

#HEAD{ /* PAGE HEADER */
    width:673px;
    height:305px;
    left:340px;
    top:0;
}
#AP{ /* THE AP OR CONTENTS SECTION */
    width:676px;
    height:684px;
    left:337px;
    top:438px;
    overflow-y:auto;
}
#SIDE{ /* SIDE MENU */
    width:336px;
    height:403px;
    left:0px;
    top:438px;
    overflow:hidden;
    -webkit-transition: height 0.5s;transition: height 0.5s;
}
#NEWS{ /* NEWS SECTION */
    width:100%;
    height:164px;
    left:0;
    top:1264px;
    background-color: #FFF;
    overflow:hidden;
}
#INFO{ /* INFO SECTION */
    width:100%;
    height:140px;
    left:0;
    top:1123px;
    color: #555;
    font-size:14px;
    text-align: justify;
    padding:5px;
    background-color: #FFF;
    font-family: "Open Sans", arial, verdana, tahoma, sans-serif;
    line-height: 130%;
    overflow:auto;
}
#FOOT{ /* MEDIA LINKS */
    width:100%;
    left:0;
    top:1450px;
    overflow:hidden;
    text-align:right;
    font-size:14px;
    padding-top:5px;
    color: #9b978d;
}
#AD1{ /* AD 1 ON TOP */
    width:336px;
    height:280px;
    top:13px;
    left:0;
}
#AD2{ /* AD 2 ON RIGHT */
    width:336px;
    height:280px;
    top:842px;
    left:0;
} /* AD 3 SMALL ON LEFT */
#AD3{
    width:970px;
    height:90px;
    top:330px;
    left:21px;
    text-align:center;
}










/* -------------------------------------------  */
#Hn{ /* HEADER MAIN MENU NAV */
    width:500px;
    height:50px;
    top:120px;
    left:0px;
    background: #a49c95;
    box-shadow: 3px 2px 3px #2d2c2b,inset 0 -3px 1px -2px #000;
}
#Hn:before{
    width:800px;
    width:calc( 50vw - 50% + 75px );
    content:"";
    position:absolute;
    right:100%;
    top:0;
    height:100%;
    background: #a49c95;
    background-image: -ms-linear-gradient(left, #3b525c 0%, #a49c95 100%);
    background-image: -moz-linear-gradient(left, #3b525c 0%, #a49c95 100%);
    background-image: -o-linear-gradient(left, #3b525c 0%, #a49c95 100%);
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #3b525c), color-stop(100, #a49c95));
    background-image: -webkit-linear-gradient(left, #3b525c 0%, #a49c95 100%);
    background-image: linear-gradient(to right, #3b525c 0%, #a49c95 100%);
    box-shadow: 0 4px 3px -3px #2d2c2b,inset 0 -3px 1px -2px #000;
}
#Hnf2{display:none;left:0;width:100%} /* FRAME FOR THE SECOND MENU LAYOUT */
#Hnl{ /* MAIN MENU NAV LINE */
    width:386px;
    height:1px;
    left:2px;
    top:43px;
    background: #496671;
    border-radius:2px;
    box-shadow:1px 1px 0 rgba(255,255,255,0.3), -1px -1px 1px #2d2c2b;
}
#Hnll{ /* MAIN MENU NAV LINE LIGHT */
    width:35px;
    height:50px;
    left:1px;
    top:-42px;
    background-position: 30px 0;
}
.Hnb{ /* MAIN MENU NAV BUTTON */
    position:relative;
    display:inline-block;
    left:4px;
    top:5px;
    width:32px;
    height:38px;
    font-size:7px;
    padding-top:24px;
    text-align:center;
    box-shadow:0 0 2px rgba(50, 45, 36,0),inset 0 20px 20px -20px rgba(0,0,0,0);
    color:#5a5751;
    margin-right:12px;
    border-radius: 3px 3px 0 0;
}
.Hnb:hover{
    color: #000;
    background-color: rgba(255,255,255,0.2);
    box-shadow:0 0 2px rgba(50, 45, 36,1),inset 0 -20px 20px -20px rgba(0,0,0,1);
    text-decoration: none;
}
#Hnmb{
    position:absolute;
    top:7px;
    left:10px;
    background-position: 0 -38px;
    border-radius: 3px;
}
.Hnb1{
    background-position: 0px 0;
}
.Hnb2{
    background-position: -32px 0;
}
.Hnb3{
    background-position: -64px 0;
}
.Hnb4{
    background-position: -96px 0;
}
.Hnb5{
    background-position: -128px 0;
}
.Hnb6{
    background-position: -160px 0;
}
.Hnb7{
    background-position: -192px 0;
}
.Hnb8{
    background-position: -224px 0;
}
.Hnb9{
    background-position: -256px 0;
}
.Hnb10{
    background-position: -288px 0;
}


#Hl{ /* HEADER LOGO */
    position:absolute;
    width:300px;
    height:80px;
    left:10px;
    top:40px;
    background-position: 300px 80px;
}
#Hl2{
    position:absolute;
    width:150px;
    height:40px;
    left:40px;
    top:2px;
    background-position: 150px 125px;
}

#Hw{ /* HEADER WINDOW */
    width:460px;
    height:120px;
    left:0;
    top:180px;
    font-family: arial, verdana, tahoma, sans-serif;
    color:#ada69e;
    font-size:18px;
}
#Hwt{ /* HEADER WINDOW TEXT OR TITLE */
    left:0;
    width:100%;
    height:40px;
    font-size:55px;
    top:35px;
    padding-left:15px;
    font-weight: bold;
    color: #26231f;
    text-shadow:-1px -1px 1px #000,1px 1px 0 rgba(255,255,255,0.1);
}
#Hwl{ /* HEADER WINDOW LABEL */
    left:10px;
    top:20px;
    color: #8d867e;
    font-size:18px;
}
#Hwv{ /* HEADER WINDOW VALUE */
    width:100%;
    height:90px;
    left:0;
    padding-left:5px;
    top:25px;
    font-family: 'Roboto Mono', arial, verdana, tahoma, sans-serif;
    color:#38a4d6;
    font-size:60px;
    text-shadow: 2px 2px 3px #000;
}




/* --------------------------------------- */
#Hc{ /* HEADER CLOCK */
    background-position: -788px -110px;
    background-size: 1024px 1024px;
    width:235px;
    height:235px;
    left:450px;
    top:54px;
}


/* ------------ */
#Hcd{ /* HEADER CLOCK DIGITAL */
    width:160px;
    height:37px;
    right:30px;
    top:0;
    line-height: 100%;
    color:#747067;
    background-color: #2d1e16;
    box-shadow:0 0 0 1px #000, 1px 1px 2px #000;
    border:solid 1px #7e5637;
    font-family: arial, verdana, tahoma, sans-serif;
    font-weight:bold;
}
#Hcd:before { /* HEADER CLOCK DIGITAL DISPLAY COLON */
    content:":";
    position:absolute;
    left:25px;
    width:40px;
    height:35px;
    top:4px;
    text-align:center;
    font-size: 18px;
}
#Hcd:hover {
    color: #2492c6;
}
#Hcdh { /* HEADER CLOCK DIGITAL HOUR */
    left:0;
    top:9px;
    width:40px;
    font-size:37px;
    text-align:right;
}
#Hcdm { /* HEADER CLOCK DIGITAL MINUTE */
    left:50px;
    top:4px;
    font-size:20px;
}
#Hcds { /* MAIN MENU CLOCK DIGITAL SECOND */
    left:49px;
    top:18px;
    font-size:10px;
}
#Hcdp { /* HEADER CLOCK DIGITAL PM */
    left:66px;
    top:18px;
    font-size:10px;
}
#Hcdi { /* HEADER CLOCK DIGITAL INFO */
    left:80px;
    top:-2px;
    font-size:10px;
    width:80px;
    text-align: center;
}
#Hcdc { /* HEADER CLOCK DIGITAL CALENDAR */
    left:80px;
    top:12px;
    font-size:10px;
    line-height:100%;
    width:80px;
    text-align: center;
}
#Hcdy { /* HEADER CLOCK DIGITAL YEAR */
    right:3px;
    top:8px;
    font-size:10px;
}





#Hcm{ /* HEADER CLOCK MOTOR */
    background-position: -866px -237px;
    background-size: 1024px 1024px;
    width:75px;
    height:75px;
    left:78px;
    top:127px;
}
#Hchh{ /* CLOCK HOUR HAND */
    background-position: -420px -212px;
    width:15px;
    height:73px;
    left:107px;
    top:53px;
    transform-origin:center 63px;
    -webkit-transform-origin:center 63px;
    transform:rotate(0);
}
#Hcmh{ /* CLOCK MINUTE HAND */
    background-position: -406px -212px;
    width:14px;
    height:90px;
    left:108px;
    top:36px;
    transform-origin:center 80px;
    -webkit-transform-origin:center 80px;
    transform:rotate(0);
}
#Hcsh{ /* CLOCK SECOND HAND */
    background-position: -437px -212px;
    width:9px;
    height:110px;
    left:110px;
    top:32px;
    transform-origin:center 84px;
    -webkit-transform-origin:center 84px;
    transform:rotate(0);
}
#Hchs{ /* CLOCK HOUR SHADOW */
    background-position: -460px -212px;
    width:18px;
    height:70px;
    left:108px;
    top:56px;
    transform-origin:center 63px;
    -webkit-transform-origin:center 63px;
    transform:rotate(0);
}
#Hcms{ /* CLOCK MINUTE SHADOW */
    background-position: -447px -212px;
    width:16px;
    height:93px;
    left:109px;
    top:39px;
    transform-origin:center 80px;
    -webkit-transform-origin:center 80px;
    transform:rotate(0);
}

#Hcs{ /* CLOCK SEARCH */
    left:5px;
    top:6px;
    width:200px;
}

#Hcst{ /* CLOCK SEARCH TEXT */
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:24px;
    padding:0 0 0 24px;
    border:none;
    font-size:12pt;
    color: #de955c;
    background-color: #2d1e16;
    box-shadow:-1px -1px 1px #000, 1px 0 1px #a4a093;
    line-height:100%;
    border-radius:20px;
    box-shadow:0 0 0 1px #000, 1px 1px 2px #000;
    border:solid 1px #7e5637;
}
#Hcst:hover{border:solid 1px #de955c;box-shadow:0 0 0 1px #000, 1px 1px 2px #de955c;}
#Hcsi{ /* CLOCK SEARCH ICON*/
    left:4px;
    top:5px;
    width:15px;
    height:15px;
    background-position: -2px -117px;
    opacity:0.6;
}
#Hcsb{/* CLOCK SEARCH BUTTON */
    position:absolute;
    right:3px;
    top:2px;
    width:20px;
    height:20px;
    border:none;
    border-radius:20px;
    background-position:0 -135px;
    padding:0;
    background-color: #a4a093;
    box-shadow:inset -1px -1px 4px #333;
}
#Hcsb:hover{
    box-shadow:0 0 1px #555,0 0 5px #efdbb6;
    background-color: #FFF;
}









/* --------------------------------------- */
#Hn2{ /* HEADER MAIN MENU 2 */
    display:none;
    position:absolute;
    width:100%;
    top:120px;
    left:0;
    height:50px;
    background: #a49c95;
    box-shadow: 3px 2px 3px #2d2c2b,inset 0 -3px 1px -2px #000;
}
#Hn2:before{
    content:"";
    position:absolute;
    right:99%;
    top:0;
    height:100%;
    width:800px;
    width:calc( 50vw - 50% - 30px );
    background: #a49c95;
    background-image: -ms-linear-gradient(left, #3b525c 0%, #a49c95 100%);
    background-image: -moz-linear-gradient(left, #3b525c 0%, #a49c95 100%);
    background-image: -o-linear-gradient(left, #3b525c 0%, #a49c95 100%);
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #3b525c), color-stop(100, #a49c95));
    background-image: -webkit-linear-gradient(left, #3b525c 0%, #a49c95 100%);
    background-image: linear-gradient(to right, #3b525c 0%, #a49c95 100%);
    box-shadow: 0 4px 3px -3px #2d2c2b,inset 0 -3px 1px -2px #000;
}
#Hn2b{
    position:absolute;
    display:block;
    left:5px;
    top:8px;
    width:32px;
    height:38px;
    font-size:7px;
    padding-top:24px;
    text-align:center;
    background-position: -387px 0;
    box-shadow:0 0 2px rgba(50, 45, 36,0),inset 0 20px 20px -20px rgba(0,0,0,0);
    color:#5a5751;
    margin-right:12px;
    border-radius: 3px;
}
.Hn2b:hover{
    color: #000;
    background-color: rgba(255,255,255,0.2);
    box-shadow:0 0 2px rgba(50, 45, 36,1),inset 0 -20px 20px -20px rgba(0,0,0,1);
    text-decoration: none;
}


/* ----------------------------------------------------- */
/* SIDE MENU */

#S1{ /* SECTION 1 WITH A DUPLICATE OF THE MAIN MENU */
    display:none;
    position:absolute;
    left:0;
    top:0;
    width:40px;
    height:100%;
    background-color: #aca9a4;
    line-height:80%;
}
#S1 .Hnb{
    box-shadow:0 0 2px rgba(50, 45, 36,0);
    background-color: rgba(255,255,255,0);
    border-radius:3px;
    margin-right:0;
}
#S1 .Hnb:hover {
    box-shadow:0 0 2px rgba(50, 45, 36,1);
    background-color: rgba(255,255,255,0.2);
}
#S2{ /* SECTION 2 WITH SUBMENU LIST */
    position:absolute;
    left:133px;
    top:0;
    width:203px;
    height:100%;
    line-height: 105%;
    background-color: #FFF;
    overflow-y:auto;
}
#S3{ /* SECTION 3 WITH WORLD TIMES */
    position:absolute;
    left:0;
    top:10px;
    width:132px;
    height:100%;
    font-family: Arial, verdana, tahoma, sans-serif;
    font-size:40px;
    line-height:0;
}

#S1h,.Sb1,.Sb2,.Sb3{
    display:inline-block;
    position:relative;
    width:100%;
    color: #287297;
    font-size:20px;
    background-color: #FFF;
    font-family: Arial Narrow, Calibri, Gill Sans, Arial, verdana, tahoma, sans-serif;
    border-bottom:solid 1px #DDD;
    box-shadow:inset 0 50px 20px -20px rgba(0,0,0,0);
}

.Sb1:hover,.Sb2:hover,.Sb3:hover{
    background-color: #38a1d2;
    color:#FFF;
    text-decoration: none;
    box-shadow:inset 0 -20px 20px -20px rgba(0,0,0,0.8);
}
#S1h{
    padding-top:10px;
    padding-left: 27px;
    height:31px;
    background-color:#3a342d;
    color:#AAA;
    font-family: Arial, verdana, tahoma, sans-serif;
    font-size:16px;
}
.Sb1{
    padding-top:3px;
    padding-left: 35px;
    height:27px;
}
.Sb2{
    height:25px;
    font-size:15px;
    padding-left: 42px;
    padding-top:2px;
}
.Sb3{
    height:23px;
    font-size:15px;
    padding-left: 30px;
    padding-top:2px;
}

.S3c{ /* SIDE SECTION 3 CLOCKS */
    display:inline-block;
    position:relative;
    width:100%;
    height:65.5px;
    top:0;
    left:0;
    color:#999;
    background-color: #FFF;
    margin:0;
}
.S3cl{ /* LABEL */
    left:0;
    top:0;
    width:100%;
    height:20px;
    color:#FFF;
    font-size: 16px;
    padding:0 0 0 25px;
    background-color: #ffeed9;

    background-image: -ms-linear-gradient(left, #3a342d 0%, #EEEEEE 100%);
    background-image: -moz-linear-gradient(left, #3a342d 0%, #EEEEEE 100%);
    background-image: -o-linear-gradient(left, #3a342d 0%, #EEEEEE 100%);
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #3a342d), color-stop(100, #EEEEEE));
    background-image: -webkit-linear-gradient(left, #3a342d 0%, #EEEEEE 100%);
    background-image: linear-gradient(to right, #3a342d 0%, #EEEEEE 100%);
    text-align:left;
    line-height: 120%;
}
.S3ci{ /* CLOCK ICON */
    left:3px;
    top:3px;
    width:15px;
    height:15px;
    background-position: -2px -181px;
}
.S3ct{ /* TIME */
    left:0;
    top:25px;
    width:100%;
    height:80px;
    color:#888;
    font-size:38px;
    padding-right:32px;
    text-align:right;
    line-height: 100%;
}
.S3a{ /* SIDE MENU SECTION 3 CLOCK AM PM */
    width:20%;
    top:11px;
    right:5px;
    color:#287297;
    font-size:12px;
    text-align:right;
}
.S3d{ /* SIDE MENU SECTION 3 CLOCK DAY */
    width:20%;
    top:-9px;
    right:5px;
    color: #8e6516;
    font-size:12px;
    text-align:right;
}
#S1hi{
    left:3px;
    width:18px;
    height:18px;
    background-position: -20px -115px;
}
.Sbi{ /* SMALL ICONS */
    position:absolute;
    width:18px;
    height:18px;
}
.Sb1 .Sbi{
    left:5px;
    top:6px;
}
.Sb2 .Sbi{
    left:12px;
    top:2px;
}
.Sbwc{
    background-position: -30px -1px;
}
.Sbwcp{
    background-position: -262px 0;
}


.Sbc{
    left:12px;
    width:18px;
    height:18px;
    background-position: -180px -115px;
}
.Sbd{
    left:12px;
    width:18px;
    height:18px;
    background-position: 0 -155px;
}
.Sba{
    left:12px;
    width:18px;
    height:18px;
    background-position: -40px -115px;
}
.Sbn{
    left:3px;
    width:18px;
    height:18px;
    background-position: -100px -135px;
}
.Sbm{
    left:3px;
    width:18px;
    height:18px;
    background-position: -60px -135px;
}
.Sbb{
    left:12px;
    width:18px;
    height:18px;
    background-position:-20px -135px;
}
.Sbo{
    left:12px;
    width:18px;
    height:18px;
    background-position: -40px -135px;
}
.Sbl{
    left:12px;
    width:18px;
    height:18px;
    background-position: -80px -135px;
}
.Sbw{
    left:3px;
    width:18px;
    height:18px;
    background-position: -60px -155px;
}
.Sbwp{
    left:12px;
    width:18px;
    height:18px;
    background-position: -140px -135px;
}
.Sbwe{
    left:12px;
    width:18px;
    height:18px;
    background-position: -160px -135px;
}
.Sbws{
    left:12px;
    width:18px;
    height:18px;
    background-position: -200px -135px;
}
.Sbwr{
    left:12px;
    width:18px;
    height:18px;
    background-position: -180px -135px;
}
/* LEVEL 2 ICONS ARE MOVED OVER A BIT */
.Sb2 .Sbwr,.Sb2 .Sba,.Sb2 .Sbc{
    left:18px;
}
/* ----------------------------------------------------- */
/* NEWS */
#NEWS a{ /* NEWS BUTTONS */
    vertical-align: text-top;
    display:inline-block;
    position:relative;
    width:252px;
    height:162px;
    color: #7e4e31;
    font-size:13px;
    top:-3px;
    text-align:left;
    padding:6px 5px 3px 5px;
    margin-left:1px;
    background-color: #FFF;
    line-height: 110%;
    overflow:hidden;
    font-family: "Open Sans", arial, verdana, tahoma, sans-serif;
    text-rendering: optimizeLegibility;
    box-shadow:inset 0 0 100px -50px rgba(0,0,0,0);

}
#NEWS a:hover{
    background-color: #287297;
    box-shadow:inset 0 -100px 100px -50px rgba(0,0,0,1);
    color:#FFF;
    text-decoration: none;
}
#NEWS h1{ /* NEWS BUTTON TITLE */
    display:block;
    position:absolute;
    width:140px;
    bottom:10px;
    left:0;
    font-size:20px;
    text-align:center;
    font-weight:normal;
    padding-left:3px;
    margin-top:2px;
    margin-bottom:1px;
    font-family: "Open Sans", arial, verdana, tahoma, sans-serif;
    text-rendering: optimizeLegibility;
}

#NEWS img{ /* NEWS BUTTON IMAGE */
    float:left;
    margin:3px 12px 15px 5px;
}

/* ----------------------------------------------------- */
/* INFO SECTION */

#INFO b{ /* NEWS BUTTON TITLE */
    display:inline-block;
    position:relative;
    font-weight: normal;
    font-size:20px;
    text-align:left;
    padding-left:3px;
    margin-top:4px;
    height:22px;
    font-family: "Open Sans", arial, verdana, tahoma, sans-serif;
    color: #287297;
}
#INFO img{ /* NEWS BUTTON IMAGE */
    float:left;
    margin:0 4px 1px 0;
}


/* ----------------------------------------------------- */
/* MAP ELEMENTS */
#M{ /* MAP */
    position:absolute;
    left:0px;
    top:0;
    width:100%;
    height:684px;
    overflow:hidden;
}
#Ml{ /* MAP LAND */
    position:absolute;
    left:0;
    top:24px;
    background: url(m/1.png);
    width:3040px;
    height:660px;
}
#Ml:before{
    content:"";
    position:absolute;
    left:0;
    width:100%;
    top:-24px;
    height:24px;
    background-color: #efefed;
}
#Mw{ /* MAP WATER */
    position:absolute;
    background: url(m/2.png);
    left:0;
    top:24px;
    width:3040px;
    height:660px;
}



/* ----------------------------------------------------- */
/* AP MENU */
#Am{
    position:absolute;
    width:100%;
    height:30px;
    left:0;
    top:0;
    background-color: #3a342d;
    text-align:left;
    color: #907d76;
    font-size:24px;
    line-height:100%;
    padding-top:4px;
    border-bottom:solid 1px #000;
    box-shadow:0 2px 5px #000;
}

.Amb{ /* MENU BUTTON */
    font-family: arial, verdana, tahoma, sans-serif;
    position:absolute;
    display:inline-block;
    top:3px;
    width:34px;
    height:23px;
    border-radius:3px;
    box-shadow:0 0 1px #24201b,inset 0 30px 15px -10px rgba(0,0,0,0);
    text-shadow: none;
    text-align:center;
    line-height: 100%;
    padding-top:7px;
    font-size:11px;
    color:#AAA;
}
.Amb:hover{
    background-color: #2d7da8;
    text-decoration: none;
    color:#FFF;
    box-shadow:0 0 1px #24201b,inset 0 -10px 15px -10px rgba(0,0,0,1);
}





/* ----------------------------------------------------- */
/* DIRECTORY */
#D{ /* DIRECTORY SPACE (CENTERS THE COLUMNS) */
    position:absolute;
    top:30px;
    left:0;
    width:100%;
    height:654px;
    overflow-y:auto;
    text-align: center;
}
#Dc1{ /* DIRECTORY COLUMN 1 */
    display: inline-block;
    position: relative;
    left:0;
    top:-3px;
    width:100%;
    max-width:676px;
    vertical-align: text-top;
    text-align:center;
}
#Dc2{ /* DIRECTORY COLUMN 2 */
    display: inline-block;
    position: relative;
    left:0;
    top:0;
    width:50%;
    min-width:320px;
    vertical-align: text-top;
    line-height: normal;
}
#Dc3{ /* DIRECTORY COLUMN 3 */
    display: inline-block;
    position: relative;
    left:0;
    top:0;
    width:50%;
    min-width:320px;
    vertical-align: text-top;
}
.Db1,.Db2,.Db3{ /* DIRECTORY BUTTON */
    display: inline-block;
    position: relative;
    width:100%;
    background-color: rgba(255,255,255,0.4);
    box-shadow:0 0 1px #BBB;
    margin:0;
    text-align:center;
    font-size: 24px;
    color: #1c526d;
    font-weight: bold;
    line-height: 90%;
}
.Db1:hover,.Db2:hover,.Db3:hover{
    text-decoration: none;
    color: #1c526d;
    background-color: rgba(217, 240, 255, 0.80);
    box-shadow:1px 1px 4px 0 rgba(0,0,0,1);
}

.Dn{ /* DIRECTORY BUTTON NOTE */
    position:relative;
    top:0;
    width:100%;
    padding:0 20px;
    font-size: 11px;
    color:#111;
    text-align: justify;
    font-weight: normal;
    line-height: 110%;
}
.Di{ /* DIRECTORY BUTTON IMAGE */
    display:inline-block;
    position:relative;
    left:0;
    top:0;
    box-shadow:-1px 0 1px 0 #000,0 -1px 1px 0 #000,1px 1px 0 0 #FFF;

}
.Db1{ /* DIRECTORY BUTTON 1*/
    width:100%;
    max-width:676px;
    margin:0;
    padding:0 0 10px 0;
    font-size: 40px;
    background-color: #3a342d;
    color:#999;
}

.Db1 .Dn{ /* DIRECTORY BUTTON NOTE */
    top:4px;
    padding:0 40px;
    line-height: 140%;
    color:#FFF;
    text-align: center;
}
.Db1:hover .Dn{
    color:#000;
}
.Db1 .Di{ /* DIRECTORY BUTTON IMAGE */
    width:100%;
    max-width:676px;
    height:120px;
    margin-bottom:5px;
    box-shadow:inset 0 0 0 1px #000, inset 0 0 0 2px #287297;
}
.Db1:hover .Di{
    box-shadow:inset 0 0 8px 1px #287297, inset 0 0 0 2px #287297;
}
.Db2{
    padding-bottom:10px;
    max-width:336px;
}
.Db2 .Di{ /* DIRECTORY BUTTON IMAGE */
    width:270px;
    height:80px;
    margin:10px 10px 5px 10px;
}
.Db2 .Dn{
    top:4px;
}
.Db3{ /* DIRECTORY BUTTON 2 */
    height:60px;
    padding:9px 0 0 70px;
    text-align:left;
    font-size: 20px;
    max-width:336px;
}
.Db3 .Di{ /* DIRECTORY BUTTON 2 IMAGE */
    position:absolute;
    left:10px;
    top:10px;
    width:50px;
    height:40px;
}
.Db3 .Dn{ /* DIRECTORY BUTTON NOTE 2 */
    position:relative;
    top:3px;
    text-align: left;
    padding:0;
    margin:0;
    line-height: 100%;
}

/* ----------------------------------------------------- */
/* NEWS */

#NW{ /* NEWS ARTICLE */
    position:absolute;
    top:30px;
    left:0;
    width:100%;
    height:90%;
    height:calc( 100% - 30px );
    overflow-y:auto;
}
#NW img{
    box-shadow:0 0 0 10px #FFF, 0 0 0 11px #CCC, 1px 1px 2px 11px rgba(0,0,0,0.5);
}
#NW p{
    margin-top:5px;
}
#NW p::first-letter {
    font-size: 200%;
    font-weight: bold;
    color: #287297;
}
.NWil{ /* IMAGE LEFT */
    margin:10px 20px 10px 10px;
    float:left;
    max-width:95%;
}
.NWir{ /* IMAGE RIGHT */
    margin:10px 10px 10px 20px;
    float:right;
    max-width:95%;
}
#NWh{ /* HEADER IMAGE */
    margin:20px 20px 20px 20px;
    width:calc( 100% - 40px );
}
.NWt{ /* NEWS TITLE */
    position:relative;
    width:100%;
    font-family: "Open Sans", arial, verdana, tahoma, sans-serif;
    font-size:36px;
    padding:8px;
    color: rgba(0,0,0,0.6);
    text-align:center;
}
.NWa{ /* NEWS ARTICLE */
    position:relative;
    width:90%;
    width:calc( 100% - 20px );
    left:10px;
    text-align:justify;
    background-color: rgba(255,255,255,0.5);
    font-family: "Open Sans", arial, verdana, tahoma, sans-serif;
    font-size:16px;
    padding:10px;
    line-height: 160%;
    box-shadow:1px 1px 2px 0 rgba(0,0,0,0.5)
}


@media (min-width:1001px){
    #BG4:before{content:"";position:absolute;left:0;top:-320px;width:337px;height:309px;box-shadow:inset 0 -500px 400px -500px rgba(255,255,255,0.2),0 -7px 20px rgba(0,0,0,0.2);}
}


/* ----------------------------------------------------- */
/* PAGE SIZE LAYOUTS */
/* 2 COLUMN (640-1000) */
@media (min-width:640px) and (max-width:1000px){
    #MAIN{width:100%;height:1730px}
    #BG2{width:100%;box-shadow:0 2px 4px #000}
    #BG2:after{height:1400px}
    #BG3{top:1640px}
    #FOOT{top:1670px;width:676px;margin-left:50%;left:-338px}
    #HEAD{margin-left:50%;left:-338px;}
    #Hn:before{width:200px}
    #Hc{left:440px}
    #Hcd{right:37px}
}

/* 728 BANNER TOP AD. MENU BESIDE AP */
@media (min-width:876px) and (max-width:1000px){
    #BG4{margin:0;left:0;width:880px;height:1324px}
    #AD3{margin-left:50%;left:-364px;height:90px;width:728px;}
    #AP{left:204px}
    #AD1{left:204px;top:1125px}
    #AD2{left:544px;top:1125px}
    #INFO{left:204px;width:676px;top:1407px;height:230px}
    #NEWS{width:203px;left:0;top:1125px;height:512px}
    #NEWS a{width:203px;height:125px;font-size:11px;border-bottom:solid 1px #EEE;line-height: 130%}
    #NEWS img{height:90px;width:90px;margin:2px 6px 20px 1px}
    #NEWS h1{width:100px;font-size:14px;bottom:4px}
    #SIDE{width:203px;height:684px;left:0}
    #S2{width:100%;left:0;height:468px}
    #S3{width:100%;top:470px;height:219px}
    .S3c{width:100px;height:73px;margin-left:1px;}
    .S3cl{font-size:14px;}
    .S3ct{font-size:30px;}
    .S3a{top:8px;}
}

/* 336 RECTANGULAR TOP AD. MENU BESIDE TOP AD */
@media (min-width:640px) and (max-width:875px){
    #MAIN{height:1900px;width:100%}
    #BG4{width:100%;box-shadow:none}
    #BG2{height:380px;width:100%;}
    #BG3{top:1873px}
    #BG2:after{height:1640px}
    #AD1{top:347px;margin-left:50%;left:-33px}
    #AD2{margin-left:50%;left:-330px;top:1350px}
    #AD3{height:101px;width:320px;top:1350px;margin-left:50%;left:7px}
    #INFO{top:1451px;margin-left:50%;left:7px;width:320px;height:421px}
    #NEWS{padding-top:1px;margin-left:50%;left:-330px;top:1631px;width:336px;height:241px}
    #NEWS a{width:167px;height:120px;font-size:10px;}
    #NEWS img{height:80px;width:80px;margin:2px 6px 30px 1px}
    #NEWS h1{width:90px;font-size:14px;bottom:4px}
    #SIDE{width:240px;height:310px;margin-left:50%;left:-302px;top:317px;}
    #FOOT{top:1900px;width:639px}
    #S2{width:100%;left:0;top:0;}
    #S3{display:none}
}
@media (min-width:676px) and (max-width:875px) {
    #AP{margin-left:50%;left:-338px;width:676px;top:665px}
}
@media (min-width:640px) and (max-width:675px) {
    #AP{margin-left:0;left:0;width:100%;top:665px}
}
/* SQUISH THE MENU A BIT */
@media (min-width:640px) and (max-width:685px) {
    #HEAD{margin-left:0;left:0;width:100%}
    #Hc{left:auto;right:1px}
    .Hnb{margin-right:8px;}
    #Hwt{font-size:50px}
}



/* ------------------- */
/* 1 COLUMN ( LESS THAN 640) */
@media (max-width:639px) {
    #BG{height:170px;min-width:336px;}
    #BG2{top:176px;min-width:336px;width:100%;height:158px}
    #BG2:after{height:1630px}
    #BG3{top:1735px}
    #MAIN{width:100%}
    #BG4{width:100%;box-shadow:none}
    #HEAD{left:0;width:100%;height:250px}
    #AP{left:0;top:330px;width:100%;min-width:336px}
    #NEWS{left:0;width:100%;top:1578px;height:156px}
    #NEWS a{width:49.5%;height:76px;padding-top:24px;font-size:10px}
    #NEWS img{width:60px;height:60px;margin-top:-16px}
    #NEWS h1{top:4px;left:80px;text-align:left;font-weight:bold}
    #INFO{left:337px;width:250px;width:calc( 100% - 337px );top:1015px;height:561px}
    #SIDE{top:0;left:auto;right:0;width:250px;height:0;background-color: #DDD;box-shadow:1px 1px 3px #000}
    #AD1{left:0;top:1015px;}
    #AD2{left:0;top:1296px;}
    #AD3{left:20px;top:220px;width:320px;height:101px}
    #FOOT{top:1760px;width:100%;padding-right:8px}
    #HEAD:after{top:251px}

    #Hn{top:36px;width:100%}
    #Hl{display:none}
    #Hnf{display:none}
    #Hnf2{display:block}
    #Hc{left:auto;right:2px;top:60px;}
    #Hcd{right:39px}
    #Hw{width:63%;top:88px;height:110px}
    #Hwt{top:32px;font-size:43px}
    #Hcs{left:20px;top:3px;}
    #S1{display:block;}
    #S2{left:40px;width:208px}
    #S3{display:none}
    /*.Sb1{height:35px;padding-top:6px;}
    .Sb2{height:28px;padding-top:4px;}
    .Sb3{height:25px;padding-top:4px;}*/
}
@media (max-width:630px) {
    #Hw{width:61%}
    #Hwt{font-size:41px}
}

/* NARROW SCREENS */
@media (max-width:610px) {
    #BG{height:345px}
    #BG2{top:350px;height:162px}
    #BG3{top:1910px}
    #Hl2{left:auto;right:0}
    #Hnmb{left:30px}
    /*#Hc{left:auto;right:-30px;top:-12px;-ms-transform: scale(0.5,0.5);-webkit-transform: scale(0.5,0.5);transform: scale(0.5,0.5);}*/
    #Hc{top:35px;margin-left:50%;left:-110px;}
    #Hcd{left:auto;right:0;overflow:hidden;top:95px;width:92px;height:120px;background-color:rgba(0,0,0,0.4);border:solid 2px #a49c95;border-right:none;border-radius:8px 0 0 8px;box-shadow:0 0 3px #000,inset 3px 3px 5px #000}
    #Hcdh{top:13px;left:0;font-size:35px}
    #Hcd:before{left:24px;top:13px;font-size:30px;}
    #Hcdm{left:48px;top:15px;font-size:30px}
    #Hcds{left:24px;top:38px;font-size:14px}
    #Hcdp{left:46px;top:38px;font-size:14px}
    #Hcdi{left:0;top:60px;font-size:12px;width:92px}
    #Hcdc{left:0;top:84px;font-size:12px;width:92px}
    #Hcs{margin-left:50%;left:-100px}
    #Hw{width:90%;left:10%;top:260px;height:120px}
    #Hwt{top:40px;font-size:50px}
    #INFO{top:1195px}
    #NEWS{top:1757px}
    #FOOT{top:1940px}
    #AP{top:510px}
    #AD1{top:1195px}
    #AD2{top:1476px}
    #AD3{margin-left:50%;left:-160px;top:402px}
}
@media (max-width:540px) {
    #Hw{left:7%;width:92%;}
    #Hwt{font-size:48px}
}
@media (max-width:500px) {
    #Hw{left:5%;width:94%;}
    #Hwt{font-size:46px}
}
@media (max-width:530px) {
    #AD1{margin-left:50%;left:-168px;top:1198px;}
    #INFO{left:0;width:100%;top:1481px;height:160px;font-size:11px;}
    #AD2{margin-left:50%;left:-168px;top:1644px;}
    #NEWS{top:1928px;}
    #BG3{top:2065px}
    #FOOT{top:2100px}
}

@media (max-width:480px) {
    #Hc{left:-150px}
    #Hnmb{left:10px}
    #INFO{height:190px;}
    #AD2{top:1674px;}
    #NEWS{top:1958px;height:90px}
    #NEWS a{width:24.6%;height:90px;text-align:center;padding:8px;font-size: 0}
    #NEWS img{float:none;margin:auto;}
    #NEWS h1{top:auto;bottom:10px;left:0;width:100%;font-size:12px;font-weight:normal;text-align:center}
    #BG3{top:2020px}
    #FOOT{top:2065px}
    #Hw{left:3%width:96%;}
    #Hwt{font-size:44px}
}
@media (max-width:400px) {
    #Hc{top:70px;left:-160px}
    #Hcd{top:125px}
    #Hw{left:1%;width:98%;top:278px}
    #Hwl{top:26px}
    #Hwt{font-size:40px}
    #BG{height:365px}
    #BG2{top:370px;}
    #AP{top:530px}
    #AD1{top:1218px}
    #INFO{top:1501px}
    #AD2{top:1694px}
    #NEWS{top:1978px}
    #BG3{top:2040px}
    #FOOT{top:2085px}
    #AD3{top:415px}
}
@media (max-width:380px) {
    #Hwt{font-size:38px}
}
@media (max-width:360px) {
    #Hwt{font-size:36px}
}