/*   ==index==   */

html {height: 100%;}

body {
	min-height:100%;
	height: 100%;
	font-size: 13px;
	font-family:Verdana, sans-serif;
}
a {color: #ff6600;}
h1 {font-size:23px; margin:10px 0 10px 0; font-weight:bold; display:block;}
h2 {font-size:17px; margin:10px 0 5px 0; font-weight:bold; display:block;}
h3 {font-size:14px; margin:10px 0 3px 0; font-weight:bold; display:block;}

#index {
	width:100%;
	margin: auto;

	/*----------------------- 100% высоты контейнера относительно клиентской области и контента для IE, FF, Opera */
	height: auto !important;
	min-height:100%;
	height: 100%;
	/*-----------------------*/
	
	background-color:#fff;
}

#content {width: 100%}

#slogan {font-family:Arial; font-size:18px; color:#e46723; height:30px; margin:-18px 0 0 280px;}

#top {width: 100%}
#logo {background-image:url(../images/logo2.gif); background-repeat:no-repeat; padding:0; width:400px; height:50px;}

.top1 {margin-right: auto; margin-left: auto; width: 1200px; padding-top: 10px;}

.hide {display: none;}

.right-col {float: right; width: 360px}

.tag9 {font-size:15px;}
.tag10 {font-size:15px;}
.tag12 {font-size:15px;}
.tag14 {font-size:15px;}
.tag16 {font-size:15px;}

#top5_on_index {font-size:14px; line-height: 1.5; margin-bottom: 20px;}
#top5_on_index ul {}
#top5_on_index li {padding:4px 0 0 0;}

.tags_on_index {font-size:14px; line-height: 1.5; margin-bottom: 20px;}

#artlist_on_index {font-size:14px; line-height: 1.5; margin-bottom: 20px;}
#artlist_on_index li {padding:4px 0 0 0;}
.art_prev_body {margin-left: 240px;}

.comments_on_index {margin: 0 0 0 0px; font-size:14px; line-height: 1.5; margin-bottom: 20px;}
.comment_on_index {margin:10px 0 0 0;}
.comm_name {font-weight: bold}

.anonces {width: 800px; float: left;}
div.anonce {margin:30px 4px 0 4px;}
.anonce_tags {font-size: 1.0em}
.anonce_text {margin-left: 240px;}
.anonce_image {margin: 20px 20px 10px 10px; float:left;}
.anonce_image img {max-width: 200px;}

#main-text {margin:11px 0 0 0; margin-right: auto; margin-left: auto; width: 1200px;}
#main-text p {margin:14px 0 0 0; font-size: 15px; line-height: 1.5;}

#footer_guarantor {height:184px; clear: both;}

#footer {
	margin: auto;
	margin-top:-130px;
	height:130px;
	clear:both;
	text-align:center;
}

#footer-text {
	color:#000;
	font-size:12px;
	line-height:1.1;
	position:relative;
}

#counters {
	margin:10px 0 0 0;
}

#hint {
	color:#999999;
	width:260px;
	margin:30px 0 0 30px;
	padding:4px;
	font-size:11px;
	border-left:1px #CCCCCC solid;
}

#top-menu {height:30px; background-color:#616164;}

#btn-menu{
  display: none;
}
#btn-menu + label{
  display: none; 
  position: relative;
  color: #fff; 
  height: 25px;
  z-index: 1;
  cursor: pointer;
}
#top-nav {
  background-color:#616164;
}
.mob-nav > li {display:inline; padding:0 5px;}
.mob-nav > li > a {color:#FFF; font-size:14px; padding: 5px 5px;}
.mob-nav > li > a:hover {background-color: #000;}
.mob-nav {list-style:none; padding:6px 4px 10px 0; margin-right: auto; margin-left: auto; width: 1200px;}

@media (max-width: 1200px) and (min-width: 801px) {
    #main-text {width: 800px; clear: right}
    .top1 {margin-right: auto; margin-left: auto; width: 800px; padding-top: 10px;}
    .anonces {width: 800px; }
    .right-col {width: 800px; float: left}
    .mob-nav {width: 800px;}
}

@media (max-width: 800px) {
    #main-text {width: 90%; clear: right}
    .top1 {margin-right: auto; margin-left: auto; margin-bottom: 5px; width: 90%; padding-top: 10px;}
    .art_prev_body {margin-left: 0px;}
    .anonces {width: 100%; }
    .anonce_text {margin-left: 0;}
    .anonce_image {float: none;}
    .anonce_image img {max-width: 100px;}
    .right-col {width: 100%;}
    #slogan {display: none}
    #logo {width:320px; height:50px;}
    
    #top-nav{margin-right: auto; margin-left: auto;}
    .mob-nav{
        display: flex;
        list-style: none;
        padding-left: 0px;
        width: 100%;
    }
    .mob-nav > li > a{
        display: block;
        padding: 5px 10px;
        
    }
    .mob-nav > li > a:hover{
        background-color: #000;  
    }
    
    #btn-menu + label{
      display: inline-block;
      padding: 5px 0 0px 0;
    }
    #btn-menu + label + .mob-nav{
        display: none;
    }
    #btn-menu:checked + label + .mob-nav{
        display: block;
        background-color: #616164;
    }
	
	.right-col {float: left; width: 360px}
}





