@charset "UTF-8";
/* CSS Document */

img {border-style: none;}
a {
 color: #000000; /* Цвет обычной ссылки */
 outline:none;
 }
a:hover {
 color: #6baddf; /* Цвет ссылки при наведении на нее курсора мыши */
 text-decoration: none; /* Добавляем подчеркивание */
}
.style1 {font-family: Verdana, Arial, Helvetica, sans-serif;
padding-right:20px;
color:#FFFFFF;
font-size:16px;
text-decoration:none;
}
.style2 {font-family: Verdana, Arial, Helvetica, sans-serif;
padding-right:40px;
color:#000000;
font-size:16px;
}
.style3 {font-family: Verdana, Arial, Helvetica, sans-serif;
color:#4D4D4D;
font-size:97%;
text-align:center;
text-decoration:none;
}
.style4 {font-family: Verdana, Arial, Helvetica, sans-serif;
color:#000000;
font-size:14px;
text-align:justify;
}
.style5 {font-family: Verdana, Arial, Helvetica, sans-serif;
padding-top: 15px;
padding-left:30px;
color:#4D4D4D;
font-size:10px;
text-align:justify;
}
.style6 {padding-top: 15px;
font-size: 24px;
color: #685748;
}
.style66 {
padding-top:1px; 
padding-bottom:1px;
margin-top:0px;
margin-bottom:0px;
font-size: 20px;
color: #685748;
}
.style16 {padding-top: 15px;
font-size: 16px;
color: #000000;
}
.style7 {font-family: Verdana, Arial, Helvetica, sans-serif;
color: #FFF;
font-size:14px;
text-align:left;
text-decoration:none;
}

.style7:hover {
color: #333;
}

body { text-align:center; }
.both { clear:both; }
#out { margin:auto; width:1024px; text-align:left; }
#header { width:1000px; height:300px; background:url(../img/heat.jpg)}
#knop { width:1000px; height:60px;}
#glav {float:left; height:24px; width:110px; margin-top:17px;}
#uslug { float:left; height:24px; width:80px; margin-top:17px; }
#price { float:left; height:24px; width:130px; margin-top:17px;}
#stroy {float:left; height:24px; width:160px; margin-top:17px;}
#electro { float:left; height:24px; width:250px; margin-top:17px;}
#contact { float:left; height:24px; width:240px; margin-top:17px;}
#wrap { }
#content { float:left; width:680px; background:url(/img/polos_dl.jpg) top no-repeat; }
#content1 { float:left; width:100%; }
#icon_uslug { float:left;  height:210px; width:210px; margin-top:30px;  }
#icon_price { float:left; margin-left:25px; height:210px; width:210px; margin-top:30px; }
#icon_stroy {float:left; margin-left:25px; height:210px; width:210px; margin-top:30px; }
#icon_electro { float:left;  height:210px; width:210px; margin-top:50px; }
#icon_contact { float:left; margin-left:25px; height:210px; width:210px; margin-top:50px; }
#icon_glav {float:left; margin-left:25px; height:210px; width:210px; margin-top:50px;}
#sidebar { float:right; width:290px; background:url(/img/polos_kor.jpg) top no-repeat; }
#sidebar_2 { float:right; width:290px; background:url(/img/polos_kor.jpg) top no-repeat; margin-top:15px; }
#icon { width:105px; height:330px; background:url(/img/nadp_glav.jpg); margin-top:15px; }
#icon1 { width:100px; height:330px; background:url(/img/nadp_contact.jpg); margin-top:15px; }
#icon2 { width:140px; height:330px; background:url(/img/nadp_electro.jpg); margin-top:15px; }
#icon3 { width:109px; height:330px; background:url(/img/nadp_price.jpg); margin-top:15px; }
#icon4 { width:200px; height:330px; background:url(/img/nadp_stroy.jpg); margin-top:15px; }
#icon5 { width:105px; height:330px; background:url(/img/nadp_uslug.jpg); margin-top:15px; }
#footer { margin-top:20px; width:1024px; height:50px; /*background:url(/img/footer.jpg) */}

.ccc{
	color:#06F;
	background-color:#CCC;
}
.nazv{
	font-weight: bolder;
}
.npp, .razm {
	font-weight: normal;
	color: #666666;
	font-size: 0.725em;
}
.metr1{
	color: #F00;
	font-weight:bold;
/*	background-color: #CCF; */
}
.metr2{
	color: #F00;
	font-weight:bold;
/*	background-color: #9DC47B; */
}
.red { color: #F00; font-weight:bold; }
input {width:70px;}
.hrw { height:2px; background: #808080; }

nav {
 width: 100%; alignment-adjust:central;
 margin: 0px 0px 0px 0px; 
}
 
nav ul {
 list-style: none;
 overflow: hidden;
}

nav li a {
 background: #fff;
 border-right: 1px solid #ccc;
 color: #000;
 display: block;
 float: left;
 font-weight:800;
 font: 400 14px/1.4 'Cutive', Helvetica, Verdana, Arial, sans-serif;
 padding: 4px;
 text-align: center;
 text-decoration: none;
 text-transform: uppercase;
 width: 13%;
}
.lino {
 border-right: none;
}
 
/*SMALL*/
nav small {
 color: #333;	
 font: 100 11px/1 Helvetica, Verdana, Arial, sans-serif;
 text-transform: none;
 
}







.imglogo{ width:100%; max-width: 210px;}
.table1024 {width:1024px;}
#logo1 {display:none;}
#logo {float:left; width:30%; min-width: 210px; color:#000; font-size:1.025em; text-align:left;padding-top:4px; padding-bottom:2px; padding-left:5px; vertical-align:middle;} 
#telephon {float: right;width:40%; color:#333333; min-width:200px; font-weight:500; font-size:1.425em; text-align: right; padding-bottom:2px; padding-top:5px; padding-right:5px; vertical-align:middle;}
#addres {float:right; width:60%; min-width: 200px; max-width:100%; color:#333333; font-size:1.225em; text-align: right; padding-bottom:2px; padding-top:2px; vertical-align:middle; padding-left:2px;}
.web {font-size:12px; color:#FFF;}
#prod{float:left; width:33%; min-width:200px; color:#FFF; font-size:1.025em; text-align: center; padding-bottom:15px;} 
.tel:visited, .tel:active, .tel:link, .tel:hover {color:#333333;}
#prod7{float:left; width:14%; min-width:140px; color:#FFF; font-size:0.955em; text-align: left; padding-bottom:5px;} 


@media(max-width:1024px){
.imglogo {width:100%; min-width:210px; max-width:210px;}
.table1024 {width:100%;}
#out { margin:auto; width:100%; text-align:left; }
#footer { margin-top:20px; width:100%; height:50px;}
}
@media(max-width:700px){
#out { margin:auto; width:100%; text-align:left; }
.table1024 {width:100%;}
.imglogo {width:100%; min-width:150px; max-width:210px; text-align:center;}
#addres {display:none;}
#logo1 {display: inline; width:100%; max-width:156px; text-align:center; padding-top:2px; vertical-align:middle;}
#logo {float: none; width:100%; text-align:center; padding-top:2px; padding-bottom:0px; padding-left:0px; vertical-align:middle;}
#telephon {width:100%; color:#333333; font-size:1.425em; text-align:center; padding-bottom:4px; padding-top:0px; vertical-align:middle;}
#prod {float:left;width:40%; min-width:150px; color:#FFF; font-size:1.125em; text-align: center; padding-bottom:5px;} 
#prod7{float:left;width:33%; min-width:140px; color:#FFF; font-size:0.955em; text-align: left; padding-bottom:5px;} 
#footer { margin-top:20px; width:100%; height:50px;}
}
@media(max-width:380px){
#prod {float:left; width:40%; color:#FFF; font-size:1.225em; text-align: center; padding-bottom:5px;} 
}


.topnav {
  overflow: hidden;
  background-color: #E2D1C1;
}

.topnav a {
  float: left;
  display: block;
  color: #333333;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 14px;
  font-family: Verdana, Arial, Helvetica, sans-serif;
}

.active {
  background-color: #4CAF50;
  color: white;
}

.topnav .icon {
  display: none;
}

.dropdown {
    float: left;
    overflow: hidden;
}

.dropdown .dropbtn {
    font-size: 17px;    
    border: none;
    outline: none;
    color: #333333;
    padding: 14px 16px;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1000;
}

.dropdown-content a {
    float: none;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.topnav a:hover, .dropdown:hover .dropbtn {
  background-color: #FF9933;
  color: #333333;
}

.dropdown-content a:hover {
    background-color: #FF9933;
    color: black;
}

.dropdown:hover .dropdown-content {
    display: block;
}

@media screen and (max-width: 700px) {
  .topnav a:not(:first-child), .dropdown .dropbtn {
    display: none;
  }
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 700px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav.responsive .dropdown {float: none;}
  .topnav.responsive .dropdown-content {position: relative;}
  .topnav.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
}
