body{margin: 0;padding: 0;color: #183F5F; font-family: Arial;background:url(images/fon.gif);}

.1       { font-size: 9pt; color: #20527B }
.2       { font-size: 10pt; color: #20527B }
a:hover  { color: #000000; text-decoration: underline; font-weight: bold }
a:visited{ color: #0D4BF0; text-decoration: none; font-weight: bold }
a:link   { color: #0D4BF0; font-weight: bold }


.box{width: 775px;margin: 0 auto;}
.center{text-align: center;}
.clr{clear: both;}
table{border: 0}
hr {color: gray; height: 1px; margin: 7px 0px; }

#top{width: 100%;height: 123px;}
#top .box{background: url(images/pt_01.gif) center top no-repeat, url(images/pt_07.gif) 17px bottom no-repeat;overflow: hidden;box-sizing:border-box;padding-top: 27px;}
#top .bl{background: url(images/pt_02.gif) center top no-repeat;width: 17px;height: 96px;float: left;}
#top .logo{display: block;width: 237px;float: left;}
#top .logo_mob{display: none;}
#top .rht{float: left;width: 493px;height: 79px;background: url(images/pt_04.gif) center top no-repeat,url(images/pt_06.gif) center bottom no-repeat;box-sizing:border-box;padding: 10px 10px 10px 5px;font-size: 13px;text-align: justify;color: #20527B;}
#top .br{background: url(images/pt_05.gif) center top no-repeat;width: 28px;height: 96px;float: left;}


#body{position: relative;}
#body .box{position: relative;overflow: hidden;}

#body .rht {position: absolute;right: 0;width: 200px;height: 100%;margin-right: 26px;background: url(images/bg-rht.png);box-sizing:border-box;padding: 10px 14px 10px 20px;}
#body .rht .bot_bg{background: url(images/bg-rht-bot.png) center bottom no-repeat;position: absolute;bottom: 0;left: 0;width: 200px;height: 25px;}
#body .rht .bottom_rht{position: absolute;bottom: 13px;left: 13px;width: 86%;border:1px solid rgba(18,88,159,.3);background: #fff;border-radius:18px;box-sizing:border-box;padding: 30% 0;}
#body ul.menu{margin: 20px 0 ;padding: 0;list-style: none;}
#body ul.menu li{margin: 0;padding: 2.5px 0;}
#body ul.menu li.ln{padding: 10px 0;}
#body ul.menu li a{font-weight: bold;}

#body .rand{overflow: hidden;border-radius:18px;border:1px solid rgba(18,88,159,.3); background: #f4f9fe;float: left;width: 531px;margin-left: 12px;margin-top: 5px;box-sizing:border-box;padding: 20px 15px;}

#body .lft{overflow: hidden;background: #fff;border-radius:18px;float: left;border:1px solid rgba(18,88,159,.3);width: 531px;margin-left: 12px;margin-top: 5px;box-sizing:border-box;padding: 30px 10px 50px;}
#body .lft .ttl{color: #20527B;font-weight: bold;}
#body .lft .cats{padding-left: 25px;}
#body .lft h1{text-align: center;font: bolder 18px Arial;}
#body .lft .txt_prev{font-size: 17px;}
#body .lft .pages{margin: 15px 0;}
#body .lft .pages a{display: inline-block;text-decoration: none;font-size: 14px;font-weight: normal;padding: 1px 3px;margin: 5px 2px;background: rgba(0, 195, 128, 0.13);border: 1px solid #0180FE;}
#body .lft #comment_form{font-size: 16px;}
#body .lft #comment_form .row{margin: 6px 0;}
#body .lft #comment_form .row input[name="comment_name"]{width: 240px;float: right;}
#body .lft #comment_form .row textarea{width: 100%;font: 13px Arial;}

#body .lft .addpor{font-size: 16px;}
#body .lft .addpor .row{margin: 6px 0;overflow: hidden;}
#body .lft .addpor .row input[type="text"]{width: 240px;float: right;}
#body .lft .addpor .row .radio{float: right;text-align: right;}
#body .lft .addpor .row input[name="story_name"]{width: 90%;float: none;}
#body .lft .addpor .row textarea{width: 100%;font: 12px Arial;}

#ftr {font-size: 11px; margin-top: 20px;padding: 0px 5px; text-align: center;}



.burger {display: none;width: 100%;box-sizing:border-box;position: absolute;top: 0;right: 0;z-index: 999;background: #0180FE;margin-top: 5px;padding: 10px;border-radius: 7px;}
.burger .txt{text-align: center;color: #fff;}
.burger .wrp {float: right;width: 30px;position: absolute;top: 50%;right: 5px;margin-top: -14px;padding: 5px;background: #fff;border-radius: 5px;}
.burger .wrp span {width: 100%;height: 2px;margin: 3px 0;background: #0180FE;display: block;}



@media (max-width:775px) {
.box{width: 90%;}
#top{height: auto;}
#top .box{border-radius:18px;border:5px solid #87b9f0;background: #e4f0fd;margin-top: 5px;padding-top: 15px;}
#top .logo_mob{margin: 0 auto;display: block;width: 237px;}
#top .rht{float: none;margin: 0 auto;width: 90%;height: auto;background: none;}
#top .bl, #top .br, #top .logo{display: none;}
#body .rht {position: relative;right: 0;width: 100%;height: auto;margin: 5px 0 0;border-radius:18px;border:5px solid #87b9f0;background: #e4f0fd;padding: 10px 14px;}
#body .rht .bot_bg{display: none;}
#body .rht .bottom_rht{position: relative;width: 100%;height: auto;margin: 10px 0;left: 0;bottom: 0;padding: 10px 0;}
#body .lft, #body .rand{float: none;border:5px solid rgba(18,88,159,.3);width: 100%;margin: 48px 0 0;padding: 30px 10px;}
#body .rand{margin: 10px 0;}
#body .rht{display: none;}
.burger{display: block;}
#body .show_lft{display: block;}
}


@media (max-width: 500px) {

#body .lft #comment_form .row input[name="comment_name"]{width: 100%;float: none;}
}