.r-link
.l-link
{
    text-decoration:none;
}


.menu{

height:100%;
width:5%;
padding-right:5px;
justify-content:right ;
display: flex;
}

.logo{
width: 20%;
background: orange;
justify-content:left ;
display: flex;

}

#lag{
height: 100%;
padding-top:0px;
width:33%;
background-image: url(../img/0.png);
background-position:center;
background-repeat: no-repeat;
background-size: 100% 100%;

opacity:0.2;
}
#lag1{
height: 85%;
padding-top:0px;
width:100%;
background-image: url(../img/1.png);

background-position:center;
background-repeat: no-repeat;
background-size: 100% 100%;
border-right: 3px solid orange;
border-left: 3px solid orange;
}
#lag2{
height: 100%;

padding-right:0%;
width:33%;
background-position:right;
background-image: url(../img/2.png);
background-repeat: no-repeat;
background-size: 100% 100%;
opacity:0.2;
}

.footer{
background-color:skyblue;

padding:0px 0px;
display: flex;
height:10%
justify-content:bottom;}

.main{
background-color:orange;

height:70%;
background-repeat: no-repeat;
display:flex;

}
.cont{

width:60%;
height:100%;
justify-content:center;
display: flex;
border-width:50x;
border-color:red;

}
.slider{

display:grid; padding:10px 20px 20px 20px;height:300px; width:100%;

}
.soc{
background-color:red;
display: flex;
justify-content:right ;

width:5%
}
a {
text-decoration:none;
padding-right:30px;


}
.best 
{
background:linear-gradient(120deg, orchid 40% , darkorchid 96%);
border-top-right-radius:20px;
border-bottom-right-radius:20px;
border-top-left-radius:20px;
border-bottom-left-radius:20px;
padding-left:4%;
padding-right:4%;
color:white;
display:inline;

}
.best1
{
background:white;


}

.l-link > a:hover{
background:linear-gradient(100deg, rgb(34,34,34) 40% , lightgray 96%);
border-top-right-radius:20px;
border-bottom-right-radius:20px;
}
.r-link > a:hover{
background:linear-gradient(100deg,lightgray 40% , rgb(34,34,34)  96%);
border-top-left-radius:20px;
border-bottom-left-radius:20px;
}
.in-slide{
    display:flex;height:250px;width:100%;padding-top:10px; padding-bottom:20px; 
}
.cap{
margin-top:10%; padding:0px 0px 0px 0px;
}
.ms{
    width:40%;
}
.filter {
    background-color:white;
    display:flex;
    width: 100%;
    justify-content:center;
 
}
.fil1 {
     background-color: mistyrose;
     width:15%; display:flex; justify-content:center;border-top-right-radius:20px;
     border-bottom-right-radius:20px;padding:1% 5px 1% 5px;
}
.fil2{
      background-color: mistyrose;
     width:35%; display:flex; justify-content:flex-start;border-top-right-radius:20px;
border-bottom-right-radius:20px;border-top-left-radius:20px;
border-bottom-left-radius:20px;padding:1% 5px 1% 5px;
}
#container{
    padding-top:8%;
    width:100%;
}
.prod{
  display: grid;
  column-gap:20px;
  grid-template-columns:50% 50%;
  grid-rows:minmax(220px,450px);
  justify-content:center;
  padding-top:8%;
 
}
.one {
  padding:2% 2% 2% 2%;
  display:inline-grid;
  justify-content:center;
  margin:2% 2% 2% 2%;

  background-color:mistyrose;
  border: 2px solid orange;
  border-radius:10px;
}
.tow{
     padding:4% 4% 4% 4%;
     justify-content:center;
     margin:auto;
 grid-column: 2;
  grid-row: 1;
    border: 2px solid orange;
  border-radius:10px;
}
img {
  max-width: 100%;
  
}
.spec{
    visibility:hidden;
    height:0px;
}
.mfooter{
  display:flex;
  width:50%;
}

@media screen and (max-width: 480px){
    .mfooter{
  display:grid;
  width:100%;
}
    .prod {
       
        grid-template-columns: 100%;
    
        padding-top: 15%;
    }
   #container{
        padding-top:18%;
   }
 
    .filter{
    display:grid;
    width:100%;
    justify-content:space-around;
    height:48px;
    padding-top:10%;
    padding-bottom:20px;
    
}
    .fil1{
     width:100%; display:inline-flex; justify-content:flex-start;padding-left:5px;visibility:visible
}
#but{ 
     width:100%; display:inline-flex; justify-content:flex-start;padding-left:5px;visibility:hidden;
}
.fil2{
 visibility:visible;    width:100%; display:inline-flex; justify-content:flex-start;padding-left:5px;font-size:8pt; padding:10px 10px; visibility:hidden;
}

    .best1
{
background:linear-gradient(120deg, orchid 40% , darkorchid 96%);
}
    h2{
        font-size:14pt;
    }
   #lag
  {
    padding-top:10px;
    padding-bottom:10px;
    margin-bottom:10px;
    width:100%;
    height:100%;
    }
   #lag1{
        padding-top:10px;
        padding-bottom:20px;
     
       border-right:0px solid orange;
       border-left: 0px solid orange;

   }
   #lag2{
        padding-top:20px;
        padding-bottom:10px;
      margin-bottom:10px;
       width:100%;
       
   }
   .in-slide{
display:grid;height:400px; width:100%;padding-top:10px; padding-bottom:20px;padding-left:2px; 
padding-right:2px; margin-right:0px;
   }
   .slider{
       height:480px;
        padding-left:10px;
      padding-right:10px;
   }
  .cap{
      padding-top:10%;
  }
  .ms{width:100%;
       padding-bottom:10px;
       padding-top:10px;
       width:100%;
       border-right: 0px solid orange;
       border-left: 0px solid orange;
       border-top: 3px solid orange;
       border-bottom: 3px solid orange;}
  #txt{font-size:11px;height:5%;}
}