﻿* {margin:0; padding:0}

/*import fonts*/
@font-face {font-family: monocor; src: url('monocor.ttf');}

/*GENERAL CSS*/
body {background:url('bg_pic.jpg'); background-attachment:fixed; background-repeat:no-repeat; background-size:cover; }
#header {max-width:1200px; margin: 8px auto; height:70px; background:linear-gradient(to left, rgba(206,206,218,0.3), rgba(206,206,218,1)); border-radius:15px 15px 0 0;}
#header img {height:60px; margin-top:5px; margin-left:10px;float:left; margin-right:20px}
#header p {text-align:left; font-family:monocor; color:#0B2D51; font-size:30px; line-height:40px; font-weight:bold;}
#header p:last-child {text-align:left; font-family:monocor; color:#000000; font-size:20px; line-height:20px; font-weight:bold;}

#s_zoom {height:40px;max-width:1200px; margin: 8px auto 8px auto; background:linear-gradient(to left, rgba(206,206,218,0.5), rgba(206,206,218,1)); text-align:right;}
#s {width:250px; height:40px; overflow:hidden; position:absolute;}
#zoom {height:40px;}
#zoom p{display:inline;font-family:monocor; font-size:20px;font-weight:bold;color:#0B2D51;vertical-align:top; line-height:40px}
#zoom img {margin-top:7px; margin-left:4px}
#zoom img:hover {background: white;}

#menu {max-width:1200px; margin: 8px auto 8px auto; background:linear-gradient(to left, rgba(206,206,218,0.5), rgba(206,206,218,1)); text-align:center;}
#menu a {padding:3px 7px; display:inline-block; text-decoration:none; font-weight:bold; color:#0B2D51;font-family: "Times New Roman", Times, serif; font-size: large}
#menu a:hover {background:#dddde5}

#main {background: #ceceda; max-width:1200px; margin: 0 auto; }
#content {font-family:"Times New Roman", Times, serif; margin:8px 18px; padding-bottom:10px}
#main p {text-indent:20px;text-align:justify;font-size:20px;line-height:130%;margin-bottom:10px;}
h1 {font-family:monocor; text-align:center; padding-top:10px; padding-bottom:10px; font-size:24pt}
h2 {font-family:"Times New Roman", Times, serif; text-align:center; font-size:18pt; color:#0B2D51; padding-bottom:10px}
h3 {font-family:monocor; text-align:center; font-size:17pt; color:#0B2D51;padding-bottom:7px }
h4 {font-family:"Times New Roman", Times, serif; font-size:14pt; color:#0B2D51; padding-bottom:7px; padding-top:6px}
h5 {font-family:"Times New Roman", Times, serif; text-align:right; font-size:14pt; color:#0B2D51; padding-bottom:7px}
h6 {font-family:"Times New Roman", Times, serif; text-align:center; font-size:14pt; padding-bottom:7px}
a {color:#0B2D51}
a:visited {color:#2D5277}
a:hover {color:#6A6A70}

#way {width:60%; border-bottom:1px #0B2D51 dotted; padding-top:10px}
#way a {text-decoration:none; margin:6px; color:#2D5277;}
#way a:hover {color:#0B2D51}
#way a:last-child {font-weight:bold}
#way:before {content:'► ';color:#2D5277}

.listing {width:320px; overflow:hidden; margin:0 auto; text-align:center; padding:5px 0;border-bottom:1px #0B2D51 dotted;}
.listing a {padding:0 4px; text-decoration:none; font-size:17px}
.listing a span {color:#ceceda;}
.listing a:hover span {color:#0B2D51}
.listing a:hover {color:#0B2D51}

.blue {color:#0B2D51; font-weight:bold}
.red {color:red;}
.marker {border-left:4px #0B2D51 double; margin-left:30px; background:#fff; padding:10px}
.border {border-top:1px #0B2D51 dotted;}
.monocor {font-family:monocor;}
sup {color:#0B2D51; font-size:10pt; vertical-align:super;}
.sup {color:#0B2D51; font-size:10pt; vertical-align:super;}
.mini {font-size:16px!important; line-height:19px!important}

.links {font-size:20px;line-height:130%; font-family:"Times New Roman", Times, serif; margin-left:20px}
.links a {display:block; text-decoration:none; padding:3px 10px}
.links a:hover {background-color:white;}

#footer {max-width:1200px; margin: 8px auto; height:70px; background:linear-gradient(to left, rgba(206,206,218,0.5), rgba(206,206,218,1)); border-radius:0 0 15px 15px; text-align:center; font-family:Arial, Helvetica, sans-serif; font-size:13px; padding:5px; line-height:20px}

/*MOBILE CSS*/
@media only screen and (max-width: 450px) and (min-width: 330px){
#header {height:50px;}
#header img {height:40px; margin-top:5px; margin-left:10px;float:left; margin-right:20px}
#header p {font-size:22px; line-height:26px;}
#header p:last-child {font-size:18px; line-height:18px;}
}
@media only screen and (max-width: 329px){
#header {height:50px;}
#header img {height:40px; margin-top:5px; margin-left:10px;float:left; margin-right:20px}
#header p {font-size:22px; line-height:26px;}
#header p:last-child {display:none}
.listing {width:200px; padding:3px 0;}
.listing a {padding:0 4px; font-size:14px}
.listing a span {display:none;}
}
@media only screen and (max-width: 450px){
#menu a {display:block; border-bottom:1px #0B2D51 dotted}
#menu a:last-child {border-bottom:none}
#s_zoom {text-align:center;height:80px;}
#s {position:static; margin:0 auto}
#way {width:95%;}
}
