html {scroll-behavior: smooth;}
body {margin: 0; padding: 0; font-family: Arial, sans-serif; font-size: 18px; color:#000;
box-sizing: border-box;
display: flex;
flex-direction: column; 
min-height: 100vh;
background-color:#f7f7f7;
}

.small{font-size:.85em;}
img.small{height:28px; width:auto; vertical-align:middle; position: relative; top:-1.5px;}
p.small{margin:16px 0;}

.r{float: right;}

.grey{color:#696969;}
input,button,textarea,select{padding:3px; font-size:1em; margin: 5px 0;}
h2{margin:6px 0; font-size:1em; color:#666; letter-spacing:.25px;}
h2.title_page { margin:16px 0; font-size:1.4em; color:#000; letter-spacing:.25px;}

h3{ }
a{color:#800000;}
.fullscreen{display:none;}
hr{ border: 1px solid #ccc;}


header {
display: flex;
align-items: center;
justify-content: space-between;

padding: 14px 55px 14px 16px;
}

header .logo {display:flex; align-items: center; color: #000; text-decoration: none;}
header .logo img {height:42px; margin-right:20px;}
header .logo h1 {font-size:12px; line-height: 135%; margin:0; letter-spacing:1px; font-weight:bold; text-transform: uppercase;}




#menu_on,#menu_off {cursor:pointer; position:fixed; z-index:1001; top:0px; right:0px; padding:5px;}
#scroll_top {cursor:pointer; position:fixed; z-index:1001; bottom:0px; right:0px; padding:5px; display:none;}
#menu_on img,#menu_off img,#scroll_top img{ width:40px; height:40px; border-radius:5px;}

#container{margin:4px 0;}
#main{border-top:solid 1px #777; padding:20px 16px; margin-right:0; overflow:hidden;}
#sidebar{border-top:solid 1px #777; display:none; overflow:hidden; background-color:#eaeaea; padding-bottom:16px;}


#menu_h{border-top:solid 1px #777; border-bottom:solid 1px #777; display:none; background-color: #eaeaea;}
#menu_h ul{list-style:none; margin:0; padding:0; text-align: center; }
#menu_h ul li{padding:14px .9vw; display:inline-block;}
#menu_h ul li a{color:#000; text-decoration:none; letter-spacing:.5px;}
#menu_h ul li a:hover{text-decoration: underline; }



#sidebar ul{list-style:none; padding:0 0 0 32px; margin:0; letter-spacing:0.5px;}
#sidebar ul ul{padding:0 0 0 18px;}
#sidebar input[type="checkbox"] {display:none;}
.menu-label {display:block; padding: 6px 0;cursor:pointer; position:relative; transition: background 0.5s ease;}
.menu-label::before {font-size:14px; color:#777; content:'+'; position: absolute; left: -14px; top: 50%;  transform:translateY(-50%); transition: transform 0.5s ease;}
#sidebar a{color:#000; text-decoration:none; display:block; padding: 6px 0;}
#sidebar a.active{font-weight:bold; font-size:.95em;}
#sidebar a:hover{ text-decoration: underline;}
.submenu {margin-left:32px; max-height:0; overflow:hidden; transition: max-height 0.5s ease;}
.submenu a {display:block; padding:6px 0; text-decoration:none; text-transform:none; transition:background 0.5s ease;}
input:checked ~ .submenu {max-height:300px;}
input:checked ~ .menu-label::before{transform: translateY(-50%) rotate(45deg);}



#search_form{display:block; margin:14px 32px; overflow:visible;}
#search_form input {width:98%; margin-right:-30px;}
#search_form button { position:absolute; border:none;  background:none;
background-image: url(../img/search.svg); width:30px; height:30px;
display:inline-block; background-repeat:no-repeat; background-size:30px 30px; background-position-y:2px; vertical-align:middle;}
#lang{ margin: 8px 0; font-size:.85em; color: #666;}
#lang a{display: inline-block; margin:0 2px; }

#sidebar hr { height:2px; border:none; background-color:#fff;}

#breadcrumb{margin:6px 0;}
#breadcrumb a {line-height:150%; letter-spacing:.25px; color:#666; text-decoration:none; font-weight:bold;}
#breadcrumb a:hover { text-decoration: underline;}

.warning{ padding:0 0 10px; border-bottom: solid 1px red; }

.container_3,.container_2,.container_4 {display:grid; rid-template-columns:1fr; gap:20px;}

.news, .mess {padding-bottom:28px; margin-bottom:22px; border-bottom:solid 1px #777;}

.adv{ margin-top:14px;}
h3.title_unit{margin:6px 0;}
.adv h3.title_unit{margin:6px 0 10px;}
h3.title_unit a {font-size:1em; color:#000; text-decoration:none; }
h3.title_unit a:hover {text-decoration: underline; }
.short { line-height: 125%;font-size:.85em;}
.short p { margin: 6px 0;}
.short a { color:#000; text-decoration:none;}
.preview img{ width:100%;}
.call{color:#FF8C00; text-transform:uppercase; font-weight: bold;}

#navigator{ margin: 32px 0 16px;}
#navigator a{display:inline-block; color:#777; padding:0px; text-decoration:none;}
#navigator a:hover{ text-decoration: underline;}
#next{margin-bottom: 16px;}

.act-0, .act-1, .act-2, .act-auction {display:inline-block; font-weight: bold; padding-right:8px; text-transform: uppercase; }
.act-0{color:#aaa;}
.act-1{color:#2E8B57;}
.act-2{color:#1E90FF;}
.act-auction{color:#FF0000;}
.user_info { font-size: 0.85em; background-color:#eee; padding:8px 16px; margin: 16px 0;}
.page{ margin: 16px 0; line-height: 140%;}
.page img {display:block; margin:12px auto; width:100%; max-width:520px;}
.bookmark{cursor:pointer;}
//.download{display: block; font-weight: bold; margin: 10px 0;}
footer {text-align:center; padding: 10px;  background-color: #333;  color: #ccc; margin-top: auto;}


.button{padding:4px 12px; margin:4px; text-decoration:none; border:solid 1px #000; color:#000; background-color: #fff; display:inline-block; border-radius:4px; cursor: pointer; vertical-align: middle;}
.button:hover{color:#fff; background-color: #000;}
#logout_button{float: right; margin-top:20px;}
.reply_comment{}

.edit_buttons{margin:24px 0; padding:8px; background-color: #eaeaea; text-align: right; vertical-align: middle; border-radius: 4px; }


.comments{margin-top:24px; padding-top:20px; border-top:solid 1px #777; ; overflow:hidden; font-size:.85em;}
img.avatar {float:left; margin: 0px 30px 0px 0; width:auto; height:80px; vertical-align: middle; }
.comment{line-height:120%; background-color:#fff; border-radius: 4px;   margin:16px 0; padding:12px 12px 0 12px; overflow: hidden;  width: 66%; }
#comment_form{background-color: #f4f4f4;}
.comment textarea{margin:7px 0;}






fieldset{ border-radius:4px; background-color: #fff; }
.del_img{ padding:4px 12px; margin-right:4px; text-decoration:none; border:solid 1px #000; color:#000; background-color: #fff; display:inline-block; border-radius:4px; cursor: pointer; background-color: #333; color: #fff; position: relative; top:20px; border: solid 1px #fff;}
.del_img:hover{ text-decoration:  underline;}
.del_file{ margin: 0; padding: 0 10px; height:40px; line-height:40px; background-color: #FF8C00; color: #fff; border: none; border: solid 1px #fff;}
.img_edit img{width: 90%; margin: 0px 0 10px 0;}
.attach{font-size:0.85em; color:#777;}
.file_edit{margin:20px 0;}
.block{display:block; font-weight:bold; margin:12px 0;}
#file {margin:10px 0; padding:10px; height:40px; line-height:40px;  border: none;}


#soc a{
display:inline-block;
background-repeat:no-repeat;
background-size: 20px 20px;
background-position:center;
width:20px;
height:20px;
margin: 4px 16px 4px 4px;
line-height: 20px;
vertical-align: middle;
border-radius:20px;
}

#soc { margin:48px 0 8px 0; background-color: #eaeaea; padding:8px 16px 32px 16px; text-align: center; border-radius: 4px;}
#sharer_fb {background-image: url(../img/fb.svg);}
#sharer_tv {background-image: url(../img/tv.svg);}
#sharer_tl {background-image: url(../img/t.svg);}
#sharer_lj {background-image: url(../img/lj.png);}
#sharer_whatsapp {background-image: url(../img/whatsapp.svg);}
#sharer_reddit {background-image: url(../img/reddit.svg);}
#sharer_linkedin {background-image: url(../img/linkedin.svg);}

#banner img{ width:99%; display: block; margin-bottom:10px;}


@media (min-width: 460px) {
header .logo h1 {font-size:2.8vw;}
header .logo img {height:7vw; margin-right: 30px;}
}

@media (min-width: 560px) {
header .logo h1 {font-size:3vw; font-weight: normal;}
}
@media (min-width: 660px) {
header .logo img {height:7vw; margin-right: 30px;}
.container_3 {grid-template-columns: 1fr 1fr;}
.container_2 {grid-template-columns: 1fr 1fr;}
.container_4 { grid-template-columns: 1fr 1fr;}
}
@media (min-width: 760px) {
header .logo h1 {font-size:3.1vw;}
header .logo img {height:7vw; margin-right: 30px;}
#sidebar {flex:1;display:block; margin-right:0px; border: none; }
#menu_on, #menu_off {display:none;}
#container {display:flex; flex:1; flex-direction:row;}
#main {flex:2; border: none;}
#menu_h, #sidebar {display:block;}
.mob{display:none;}
.fullscreen{display:block;}

}

@media (min-width: 860px) {
#menu_h ul li{padding:14px 1.5vw;}
.container_2{ grid-template-columns: 1fr 1fr;}
.container_3{ grid-template-columns: 1fr 1fr 1fr;}
.container_4{ grid-template-columns: 1fr 1fr 1fr 1fr;}
#next{float:right; margin: 0;}
}

@media (min-width: 1024px) {

.wrap {margin: 0 auto; width:1024px;}
header .logo h1 {font-size:32px;}
header .logo img {height:64px; margin-right: 30px;}
#menu_h ul li{padding:14px 17.8px;}
}





