body{font-family:Arial,Helvetica,sans-serif; line-height:135%; font-size:16px; margin:0; padding:0;background-color:#f2f2f2; }
.rm,.rmf{background-color: #fff;}


h1,h2,h3,h4,h5,h6{font-weight:normal; line-height: 120%;}

p{margin:12px 0;}
a{text-decoration: none; transition: 100ms; color:#A0522D;}
a:hover{ text-decoration: underline;}
input, textarea, select {margin: 5px 0; padding:3px; font-size: 100%; }
big,.big{ font-size: large;}
.small{font-size:85%;}
.center{text-align:center;}
.r{float:right;}
.l{float:left;}
.clearfix{ clear:both;}
.red {color:#FF0000;}

.nobr{white-space:nowrap;}
.big{ transform: scale(1.2);}


.button {color:#FFF; background-color:#4F73FF; padding:7px 10px; text-decoration:none; border: solid 1px #fff; margin:0; font-size: 0.9em; display: inline-block;}
.button:hover{background-color:#aaa; color:#fff; text-decoration:none;}


#menubutton,#toTop {position:fixed; z-index:999; background-color:#333; width:45px; height:45px;}
#menubutton:hover,#toTop:hover {background-color:#777;}
#menubutton {top:0px; left:0px;}
#toTop {bottom:0px; right:0px;}
#menubutton img, #toTop img{width:45px; height:45px;}




#SiteHeader {background-color:#333; line-height: 200%; text-align:center;  overflow: hidden;letter-spacing:0.5px; font-weight:bold; padding:1.5vw 0 0;font-family:Georgia,serif; }

#SiteHeader img{vertical-align: middle; width:auto; height:11vw; margin:10px 8px;}

#site-name{ font-size:4.5vw;  line-height:100%; text-transform: uppercase; text-align:center; padding:0.5vw 0 5vw 0;  color: #FFF; }

#site-sub-name{font-size:4.5vw; color: #FF8C00;   }



#SiteNav{display:none;}
#lang{ height:50px; line-height:50px;  color: #fff; font-size:1.2rem;background-color: #D68C57; padding: 0 16px 0 36px; overflow: hidden; }
#lang a{color:#fff;}
#search{display:inline-block; float: right; padding:0; margin:0;font-size:1rem;}
#search_word{width:37vw; margin-left:20px; background-color:#FCF4E8; border:none;}
#search_button{background:none; border:none; padding:0;}
#search_button img{ top:5px; position: relative; cursor:pointer;}



#menu{clear:both; transition-delay:200ms; background-color:#F9F4EC; overflow: hidden; padding-top: 20px;}
#tree{ overflow:hidden;  }
#menu ul{display:block; overflow: hidden; margin: 0; padding: 0;}
#menu li{-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select:none; list-style:none; list-style-position: inside; line-line-height:130%; margin:12px 0;}
#menu a{display:block; text-decoration:none; color:#000;}
#menu a:hover{text-decoration:underline;}
#menu li.active a{font-weight:bold;}
#menu a span{display:inline-block; background-repeat:no-repeat; padding: 0 20px 0 15px; text-transform: uppercase;}
#menu a span i{
    font-size: 0.85rem; color: #999; font-style: normal;
}

#menu a .sub{background-image: url(../img/arr.png); background-position: right 5px;}
#menu a.open .sub {background-image: url(../img/cl.png);  background-position:right 5px;}

#menu ul a{font-size:1.1rem; }
#menu ul ul a{text-transform: none;line-height: 110%; font-weight: normal; font-size:1rem; padding: 0 0 0 20px;}




#khpg_links_info{background-color:#F9F4EC; margin:32px 0; padding:16px; font-size: 0.95em;}
#khpg_links_info h3{color: #CE661C; font-weight: bold;}
#khpg_links_info a {color: #A0522D; }
#khpg_links_info p{ margin: 16px 0;}





#breadcrumb { overflow:hidden;  color:#fff;  background-color:#D68C57; padding:14px 14px 14px 36px; font-size:1.2rem; font-weight: bold; margin: 0;}
#breadcrumb li{ display: inline; -webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select:none; list-style:none; list-style-position:outside; padding: 0; margin: 0;}
.breadcrumb-item a{  color: #fff; text-decoration: none; text-transform: uppercase; letter-spacing: 0.2px;  }
.breadcrumb-item a:hover{ text-decoration: underline}


.listlink{display:block; margin:40px 10px; color: #000; text-decoration:none;}
.listlink h3{ font-size:1rem; margin:5px 10px 10px; color: #000;  text-align: center; letter-spacing:0.5px;}
.listlink:hover h3{text-decoration: underline;}
.listlink:hover{text-decoration:none;}

.listlink p:not(.date){margin:0;padding:0;}
.date{font-size: 0.85rem; color: #333; margin:5px 0;}

.tmb img{ height: auto; width:100%;}
.tmb {margin: 0 -10px;}

img.small{width:22px; height:22px; vertical-align: middle; float: none; display: inline; margin:0;}




#navigator{ margin-top:60px; }
#navigator input{background:none; height:20px; width:20px; cursor:pointer;}
#navigator span {padding: 0px 7px 0 10px; text-transform:uppercase; color:#777; letter-spacing:0.5px; position: relative; top: -7.5px;}




#navigator_pages{ margin-bottom:20px; overflow: hidden;  color: #000; padding: 0 8px;}
#navigator_pages a{ padding:8px; background-color: #F5EADB; color: #000; margin-bottom:8px; display: inline-block; text-decoration: none; font-size: 1.1em;}
#navigator_pages a:hover{color: #fff;background-color: #CE9346;}

.navigator{margin:30px 0px 0; text-align:center; font-size:1.1em; color:#999; line-height:170%;}
.navigator a,.navigator b{ margin:0 0 15px 8px;}
.navigator a{color:#0000FF;}




.page{ margin:25px 10px;}
.page h1{font-size:1.5rem; margin:25px 0 15px; color:#000; font-weight:bold;}
.page img:not(.small){ height: auto; width: 100vw;  display: block;  position: relative; left: -20px; margin: 10px 0;}
.page b{font-size: 0.93em;}



#SiteAds{background-color:#FFFAF0;}

#addition{margin:32px 16px 8px;}

#addition h2 {font-size:1rem; margin:0; padding:0; color:#777;}
#addition p{ margin:6px 0; }
#addition a{ color: #000; display: block;}
#addition h6{ color:#333;  margin:24px 0 0; font-size: .85em;}

#donate{ margin:32px 0; padding:16px; background-color:#D68C57;}
#donate a{color: #fff; font-size: 1.4em; }
                      //   font-weight: bold;
#SiteFooter{background-color:#333; color:#fff;  padding:10px;  text-align: center;  clear: both; }
#SiteFooter p{margin: 5px 0;}
#SiteFooter a{color:#EDDDC5;}


#soc{margin:20px 0; color:#555; text-align:center;}
#soc span{display:block; text-align:center;}
#soc img{margin:8px; width:30px; height: auto; border-radius:18px; vertical-align:middle; border: solid 1px #000;}
#soc img:hover{ opacity: 0.75;}

.fu{display:none;}
.mo{display: block;}

.alphabet,.submenu{margin: 40px 15px;}
.alphabet a{display: block; color: #000; letter-spacing:0.5px;}
.alphabet a::first-letter{font-size:1.5em; font-weight:bold;}

.submenu li{ display:block; margin:0; padding:0; line-height: 180%;}
.submenu a{ color: #333; text-transform: uppercase;}
.submenu li.active{ font-weight: bold; color: #000;}
.img_description{ margin-bottom: 30px; background-color: #f2f2f2; padding: 7.5px; font-size: 0.85em; position: relative; top: -10px;}




@media screen and (min-width: 280px) {
#search_word{width:40vw;}
}

@media screen and (min-width: 324px) {
#search_word{width:45vw;}
}

@media screen and (min-width: 424px) {
#soc span{display: inline;}
}


@media screen and (min-width: 524px) {
.tmb img{ height: auto; width:92.5%;}
.tmb { float: left; width:50%; margin:0;}
#SiteHeader { font-weight: normal;}

}





@media screen and (min-width: 660px) {
#menubutton{display: none; }
#SiteNav{display: block; }
#search_word{ width: 12vw;}
#SiteHeader p{color:#FFF; font-size:3 vw; line-height:7.5vh; margin: 20px; text-transform: uppercase;  }
#SiteNav{display:block; width:35%; float: left;}
#SiteContent{float: right; width:62.75%;}
#SiteContent h2:first-child {color:#333; margin:35px 10px 20px; padding:0;}

#SiteHeader {background-image: url(../img/bg.jpg); letter-spacing:1px;  padding:10px 0 0;}
#SiteHeader img{width:auto; height:70px; margin:10px 15px; }
#site-name{font-size:36px; padding:10px 0 28px 0;}
#site-sub-name{font-size:30px;}

.listlink h3{ font-size:1.7rem; margin:16px 0px 16px;  text-align: left;}
.page img:not(.small){ height: auto; width:100%;  display: block;  position: static;  margin: 10px 0;}
.page{ margin:25px 10px 25px 0; font-size: 1.10em; letter-spacing:1.5%; line-height: 135%; overflow: hidden;}


#SiteFooter {padding: 30px 0 20px;}
#SiteFooter p{ display: inline-block; padding-right: 20px;}

.fu{display:block;}
.mo{display:none;}
.alphabet,.submenu{ margin: 40px 0px;}



}







@media screen and (min-width: 980px) {
.wrap{width:980px; margin: 0 auto; overflow: hidden;}
.rm{margin:0 auto; overflow: hidden; }
.rmf{background-color: #555; overflow: hidden; }
#addition{margin:32px 0px 8px;}
}






@media screen and (min-width: 1024px) {
.wrapf{width:1024px; margin: 0 auto; overflow: hidden;}
.rm{width:1024px;}
body{ background-image: url(../img/img01.jpg); background-repeat: repeat-x;
 background-position-y: -17px;
}



}



@media screen and (min-width: 1152px) {


}