/*Оптимизация для телефон или по просту ад*/

/*Общий дизайн*/
body{
    background: #2b2b2f;
    border-bottom-style: none;
    font-family: Arial;
    background-color: #c7c7c7;
    background-image: url(img/1642747867_99-phonoteka-org-p-belii-fon-dlya-saita-100.png);
    background-size: 100% auto;
    margin-top: -2px;
    margin-bottom: 1px;
}

/*Настройка главного экрана*/

.page{
    width: 1250px;
    margin: auto auto;
    background-color: #fff;  
}

.page-index{
  height: 2066px;
}

.main{
  margin-left: 60px;
}

.main-news{
  margin-left: 20px;
}

/*Меню*/

.heder-1{
    background-color: #343434;
    padding: 30px;
}
/*Перевод в flex*/
.menu-aside{
    display: flex;
}
/*Перевод в левую часть*/
.menu-left{
    float: left;
    margin-top: -10px;
}
/*Дизайн кнопок в главном меню*/
.nav-lin{
    display: inline-block;
    padding: 8px 12px;
    text-decoration: none;
    color: #ffffff;
    margin-right: 7px;
    font-size: 20px;
    text-align: end;
    font-weight: bold;
}
.nav-lin_down{
  display: inline-block;
  padding: 8px 12px;
  text-decoration: none;
  color: #ffffff;
  margin-right: 7px;
  font-size: 20px;
  text-align: end;
  font-weight: bold;
}
/*Цвет кнопок в главном меню*/
.nav-lin:hover{
    color:#9a9a9a
}

/*Выпадающие меню*/

.dropbtn {
    background-color: #343434;
    padding: 8px 12px;
    font-weight: bold;
    font-size: 16px;
    border: none;  
    color: #ffffff;
    margin-right: 7px;
    font-size: 20px;
  }
  
  .dropdown {
    position: relative;
    display: inline-block;
  }
  
  .dropdown-content {
    display: none;
    position: absolute;
    background-color: #eee;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
  }
  
  .dropdown-content a {
    color: black;
    text-align: left;
    padding: 12px 16px;
    text-decoration: none;
    font-weight: bold;    
    display: block;
  }
  
  .dropdown:hover .dropdown-content {display: block;}

/*Контент*/

.content{
    float: left;
    margin-right: 30px;
    background-color: #eee;
    width: 220px;
    border-radius: 10px;
    padding: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: 1px;
}

.width-img{
  width: 350px;
}
/*Дизайн фоток в контенте*/
.content-img{
    height: 190px;
    width: 100%;
    object-fit: cover;  
    border-radius: 7px;
    width: 200px;
}
/*Дизайн title в контенте*/
.content-title{
    margin-top: 20px;
    font-size: 20px;
    font-weight: bold;
}
/*Дизайн в контект тексте*/
.content-text{
    font-size: 15px;
    font-weight: bold;
    margin-top: 20px;
}
/*Слаживание в 1 сторочке звезд*/
.content-ocenivanie{
    margin-bottom: 0;
    padding-left: 0;
    list-style-type: none;
}
/*Слаживание в 1 сторочке звезд*/
.content-ocenivanie li{
    display: inline-block;
    margin-right: 5px;
    color:rgb(207, 207, 0)
}
/*Дизайн цены в контенте*/
.content-price{
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
}
/*Дизайн кнопки корзины*/
.content-but{
    border: none;
    width: 40px;
    height: 40px;
    display: flex;
    font-size: 25px;
    align-items: center;
    justify-content: center;
    background-color: rgb(0, 145, 0);
}

.glav-but{
  border: none; 
  width: 40px; 
  height: 40px; 
  text-align:center; 
  font-size: 25px; 
  background-color: rgb(0, 145, 0);
}

.content-but:hover{
    color:black;
}

.vniz{
  margin-bottom: 1126px;
}

.vniz-katalog{
  margin-bottom: 2126px;
}

.vniz-news{
  margin-bottom: 126px;
}
  
/* Подвал сайта */

.footer{
    height: 40px;
    margin-top: 20px;
    text-align: center;
    display: flex;
    justify-content: space-between;
    padding: 20px;
    background-color: #343434;
}


/*Выравние по центу + дизайн*/
.footer-center{
    height: 40px;
    text-align: center;
    padding: 20px;
    background-color: #343434;
}
/*Общий дизайн картинок*/
.footer-img{
    border-bottom-style: none;
    color: #ffffff;
    margin-top: -6px;
}
/*Общий дизайн кнопок*/
.footer-text{
    border-bottom-style: none;
    color: #ffffff;
    margin-top: -20px;
}
/*Фон кнопок*/
.footer-text:hover{
    color:#9a9a9a
}
/*Дизайн кнопок*/
.footer-a{
    border-bottom-style: none;
    text-decoration: none;
    color: white;
    font-weight: bold;
    font-size: 20px;
}
/*замена цвета кнопки*/
.footer-a:hover{
    color:#9a9a9a
}

.text_time_div{
    font-size: 18px;
    color:#fff;
}
/*текст в контактах*/
.kontact{
    color:#fff;
    font-size: 20px;
    font-weight: bold;
}

/*Страница*/

.img_stranic{
  height: 470px;
  width: 800px;
  border-radius: 20px;
  text-align: center;
}

.text-news{
  font-size: 20px;
}
/*Разрешение 992 пикселей*/
@media(max-width:992px){
  /*Page*/
  .page{
    width: 992px;
  }
  /*Контакты в индексе*/
  .zatemnenie-index{
    height: 3395px; 
    margin-top: -1100px;
  }

  /*паге в инде*/

  .page-index{
    height: 2322px;
  }
  /*РІРЅРёР· РІ РёРЅРґРµ*/

  .vniz{
    margin-bottom: 1757px;
  }
  
  
  .vniz-news{
    margin-bottom: 142px
  }
  .vniz-katalog{
    margin-bottom: 2833px;
  }
  .img_stranic{
    height: 400px;
    width: 700px;
    border-radius: 20px;
  }
}

/*Разрешение 776 пикселей*/

@media(max-width:767px){
  /*page в индекс*/
  .page{
    width: 720px;
    margin: auto auto;
  }
  /*отделение в main*/
  .main{
    margin-left: 90px;
  }
  /*контакты в индексе*/
  .zatemnenie-index{
    height: 3495px; 
    margin-top: -1100px;
    width: 100%;
  }
  /*page d index*/
  .page-index{
    height: 3222px;
  }
  /*РІРЅРёР·*/
  .vniz{
    margin-bottom: 2580px;
  }
  .vniz-katalog{
    margin-bottom: 4266px;
  }
  /*вниз в телефоне*/
  .main-katalog{
    margin-left: 80px;
  }
  .img_stranic{
    height: 300px;
    width: 500px;
    border-radius: 20px;
  }
}


/*Разрешение 568 пикселей*/

@media(max-width:568px){
  .page{
    width: 530px;
    margin: auto auto;
  }

  .main{
    margin-left: -20px;
  }

  .main-katalog{
    margin-left: 50px;
  }

  .zatemnenie-index{
    height: 5922px; 
    margin-top: -1100px;
    width: 100%;
  }
  
  .page-index{
    height: 6222px;
  }
  .vniz{
    margin-bottom: 4180px;
  }
  .content{
    margin-left: 125px;
  }
  .vniz-katalog{
    margin-bottom: 8366px;
  }
  
  .img_stranic{
    height: 220px;
    width: 400px;
    border-radius: 20px;
  }
  
}
/*Разришение 500 пх*/
@media(max-width:500px){
  .page{
    width: 500px;
    margin: auto auto;
  }
  .main-katalog{
    margin-left: 1px;
  }
  .main{
    margin-left: -20px;
  }
  .img_stranic{
    height: 200px;
    width: 350px;
    border-radius: 20px;
  }

} 
/*Разрешение 450 пх*/
@media(max-width:450px){
  .page{
    width: 450px;
    margin: auto auto;
  }
  .img_stranic{
    height: 170px;
    width: 300px;
    border-radius: 20px;
  }
}

@media(max-width:440px){
  .page{
    width: 440px;
    margin: auto auto;
  }
}

@media(max-width:420px){
  .page{
    width: 420px;
    margin: auto auto;
  }
}

@media(max-width:400px){
  .page{
    width: 400px;
    margin: auto auto;
  }
  .main{
    margin-left: -43px;
  }
  .img_stranic{
    height: 190px;
    width: 290px;
    border-radius: 20px;
  }
}