
@font-face{
    font-family:"Open Sans";
    src: url("../fonts/OpenSans.ttf"); } 
@font-face{
    font-family:"Arial";
    src: url("../fonts/Arial.ttf"); } 

@font-face{
    font-family:"DroidSans"; 
    src: url("../fonts/DroidSans.ttf"); } 


body,html{
margin: 0px;
padding: 0px;
font-family: "Open Sans",sans-serif;
color: #FFFAFA;
background:*#f8f2e0;}                    
 
#conteiner {margin:0 auto;
            text-align:left; 
            width:1024px;
            height:100%;
           /* border: 1px groove;*/
            background-color:#FFEFD9;
            box-shadow: 0 0 5px 4px rgba(122,122,122,0.5);}
.top-line{border:2px solid #8A6128;}            
#header{width: 1024;
        height: 150px;
        border:4px solid #FFEFD9;
        background: url("../images/shapka2.png") no-repeat;
        background-size: cover;} 
#navWrap{ display: flex;
        flex-direction:row;
        justify-content:flex-start;
        height: 30px;
        margin:125px 0px 6px;} 
#navWrap a {
    display: block;
	  font-family: "Open Sans",sans-serif;
    font-size: 13px;
    font-weight:bold;
	  color: black;
	  padding: 0 10px;
	  height: 30px;
	  text-decoration: none;
}       
#navWrap a:last-child {border-left: none;}
#navWrap a:hover{color:#8B4513;}
#navWrap .price{color:#2E8B57;}

#top_menu {
width:1024px;
height:50px;}
ul.h-menu {
  list-style: none; 
  margin: 0; 
  padding-left: 0; 
  margin-top:10px;
}
ul.h-menu li a {
text-decoration: none; 
background: rgb(155,106,63); 
background: -moz-linear-gradient(top, rgba(155,106,63,1) 20%, rgba(104,67,12,1) 52%, rgba(104,67,12,1) 52%, rgba(104,67,12,1) 71%, rgba(104,67,12,1) 71%); 
background: -webkit-linear-gradient(top, rgba(155,106,63,1) 20%,rgba(104,67,12,1) 52%,rgba(104,67,12,1) 52%,rgba(104,67,12,1) 71%,rgba(104,67,12,1) 71%); 
background: linear-gradient(to bottom, rgba(155,106,63,1) 20%,rgba(104,67,12,1) 52%,rgba(104,67,12,1) 52%,rgba(104,67,12,1) 71%,rgba(104,67,12,1) 71%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9b6a3f', endColorstr='#68430c',GradientType=0 ); 
  color:#fff; 
  padding:15px; 
  font-family:"Arial",sans-serif ; 
  font-size: 14px;
  border-radius:4px; 
  -moz-transition: all 0.3s 0.01s ease; 
  -o-transition: all 0.3s 0.01s ease;
  -webkit-transition: all 0.3s 0.01s ease;
}
ul.h-menu li  {
  float:left;
  margin-right:2px; 
}

ul.h-menu li a:hover {
 background: rgb(178,164,142); /* Old browsers */
background: -moz-linear-gradient(top, rgba(178,164,142,1) 0%, rgba(211,204,186,1) 14%, rgba(211,204,186,1) 14%, rgba(137,109,72,1) 68%, rgba(137,91,30,1) 97%, rgba(191,110,78,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(178,164,142,1) 0%,rgba(211,204,186,1) 14%,rgba(211,204,186,1) 14%,rgba(137,109,72,1) 68%,rgba(137,91,30,1) 97%,rgba(191,110,78,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(178,164,142,1) 0%,rgba(211,204,186,1) 14%,rgba(211,204,186,1) 14%,rgba(137,109,72,1) 68%,rgba(137,91,30,1) 97%,rgba(191,110,78,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2a48e', endColorstr='#bf6e4e',GradientType=0 );
}




#center{width: 1024;
height: 900px;
background: #FFEFD9;
}
#centerbig{width: 1024;
height: 1200px;
background: #FFEFD9;
}
.headline{font-family:"Open Sans",sans-serif; 
  font-size: 18px;
  color: black;
  position: relative;
  margin-left: -22px; 
  margin-right: -22px;
  padding: 15px;
  background: #DCCBBD;
  box-shadow: 0 -0.5px 0 rgb(155,106,63) inset;
  text-shadow: 0 1px 0 #fff;
}

.headline:before, .headline:after{
  position: absolute;
  left: 0;
  bottom: -6px;
  content:'';
  border-top: 6px solid #555;
  border-left: 6px solid transparent;}
.headline:before{
  border-top: 6px solid #555;
  border-right: 6px solid transparent;
  border-left: none;
  left: auto;
  right: 0;
  bottom: -6px
}

#product{width: 1024;
  display:flex;
flex-flow:row wrap;
align-content:space-around;
margin-left: 30px;}

.foto1{
  float: left; 
  width: 165px;
  height: auto;
  margin: 10px 13px 20px; padding: 0px; 
  border-top: 3px solid #DEB887;
  box-shadow: 5px 5px rgb(196,174,149); 
}
.foto1:hover{box-shadow: 2px 2px rgb(196,174,149);}


#footer{
  margin:0 auto;
  width: 1024px;
  height: 100px;
  background:#8A6128;
  font-family: "Arial",sans-serif;
  font-size: 14px;
  color: white;
  float: center;
  clear:both;
  padding-top: 5px;
}
#footer li{text-align: left;
margin-left: 8px;
padding: 5px 3px;
}
#footer p {text-align: center;
font-size: 12px;
padding-bottom: 10px;}






