*{
    margin: 0;
    padding: 0;    
}

@font-face{
    font-family: 'Roboto'; 
	src: url(fonts/Roboto.ttf); 
}

body{
    background: #ffffff;
    overflow-x: hidden;
}

h1, h2, p{
    font-size: 'Roboto';
}

header {
    width: 100%;    
    background: #776345;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 1vh 0vh;  
    border-radius: 0.2vh;
    margin: 1.5vh auto;
    top: 0;
    left: 0;
    right: 0;    
    box-shadow: 0 0 0.2vh 0 rgba(255, 255, 255, 0.76); 
    z-index: 1000;
}

.logo img {
    display: flex;
    width: 22vh;
    height: 8vh;
    margin-left: 2vh;
}

header a {
    font-family: 'Roboto';
    color: #ffffff;
    text-decoration: none;
    font-size: 2.4vh; 
    border-radius: 0.5vh;  
    margin-right: 2vh;
    transition: 0.2s;      
}
  
header a:hover {
    text-shadow: 0 0 0.6vh #e2dbcc;
    color: #ffffff;
    transform: scale(1.05);
}

.banner{
    width: 60%;
    /*background: linear-gradient(90deg, rgba(47,34,24,1) 0%, rgba(125,65,18,1) 25%, rgba(91,49,9,1) 45%, rgba(215,137,26,1) 72%, rgba(215,149,26,1) 90%);*/
    background: #776345;
    margin-left: 40vh;
    padding: 2vh;
    margin-top: 4vh;
    border-radius: 2vh;
}

.banner h1{
    text-align: center;
    color: #ece4d7;
    font-family: 'Roboto';
    font-size: 3.5vh;
    font-weight: 400;
    margin-top: -1vh;
}

.lead{    
    text-align: center;
    color: #ece4d7;
    font-family: 'Roboto';
    font-size: 2.5vh;
    font-weight: 400;
}

nav {
    display: flex;
    align-items: center; 
    padding: 1vh; 
      
}

.search-container {
    display: flex;
    align-items: center;
    width: 20%;
}

.search-input {
    padding: 1vh;
    border: 0.1vh solid #ccc;
    border-top-left-radius: 1.2vh;
    border-bottom-left-radius: 1.2vh;
    width: 20vh; 
    height: 1.3vh;
    font-size: 1.5vh;
    font-family: 'Roboto';
}

.search-button {
    height: 3.5vh;
    padding: 1vh 2vh;
    border-top-right-radius: 1.2vh;
    border-bottom-right-radius: 1.2vh;
    background-color: #5f4722; 
    color: #ffffff;
    font-size: 2vh;   
    border: none;     
    cursor: pointer;
    transition: 0.8s;
    text-align: center; 
    display: inline-block;
}

button { text-align: center; }

.search-button:hover {
    background: #412f15;
}


.link-active{ 
    color: #000000;
    font-weight: 700;
    font-family: 'Roboto';
}

.footer {
    background:  #776345;
    width: 100%;
    height: 35vh;
    color: #fff;
    padding: 1vh 0vh;
    font-family: 'Roboto';
    margin-top: 10vh;  
}

.footer-container {
    width: 95%;
    display: flex;
   justify-content: space-around;
    margin-left: 2vh;
    flex-wrap: wrap;
}

.footer-logo p {
    font-family: 'Roboto';
    max-width: 25vh;
    margin-top: 1vh;
    font-size: 0.9em;
    color: #ccc;
}

.footer h3 {
    font-size: 1.2em;
    margin-bottom: 1vh;
}

.footer-links-right ul {
    list-style-type: none;
    padding: 0;
}

.footer-links-right  ul li {
    margin: 1.5vh 0;
    transition: 0.2s;
    margin-left: 3.2vh;     
}

.footer-links-right  ul li:hover {
    transform: translateY(-10%);
}

.footer-links-right  a {
    color: #fff;
    text-decoration: none;
    transition: 0.3s;
    font-size: 2.2vh;
    text-decoration: none; 
    padding: 0.5vh 0; 
}

.footer-links-right{
    margin-right: 2vh;
}

.footer-links-left ul {
    list-style-type: none;
    padding: 0;
}

.footer-links-left  ul li {
    margin: 1.5vh 0;
    transition: 0.2s;         
}

.footer-links-left h3
{
    margin-top: 1.8vh;
}

.footer-links-right h3{
    margin-top: 1.8vh;
    margin-left: 3.2vh;
}

.footer-links-left  ul li:hover {
    transform: translateX(10%);
}

.footer-links-left  a {
    color: #fff;
    text-decoration: none;
    transition: 0.3s;
    font-size: 2.2vh;
    text-decoration: none; 
    padding: 0.5vh 0; 
}

.footer-links-right  h3{
    font-size: 2.4vh;
}

.footer-links-right  a:hover {
    text-shadow: 0 0 0.8vh #d8c997;
    color: #ffffff;
    transform: translateY(20%); 
}

.footer-links-left  h3{
    font-size: 2.4vh;
}

.footer-links-left  a:hover {
    text-shadow: 0 0 0.8vh #d8c997;
    color: #ffffff;
    transform: translateY(20%); 
}

.footer-info p,
.footer-subscribe p {
    margin: 0.5vh 0;
}

.footer-socials a {
    color: #1af2bc;
    text-decoration: none;
    margin-right: 10px;
}

.footer-socials a:hover {
    color: #fff;
}


.footer-bottom {
    text-align: center;
    margin-top: 18vh;
    margin-right: 15vh;
    font-size: 0.9em;
    color: #ccc;
}

.icon{
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 3vh;
    padding-top: 8vh;     
    width: 28vh;
    height: 3vh;
    margin-left: 39vh;
    margin-right: -13vh;
} 

.icon-text{   
    width: 26vh;
    margin-right: -104vh;
    padding-top: 2vh;
}

.icon-text h1{
    font-family: 'Roboto';
    font-size: 2.4vh;   
}

.footer-icons{
    transition: 0.2s; 
    width: 6vh;      
}

.footer-icons img{
    width: 5vh;
}

.footer-icons:hover{
    transform: scale(1.4);
}

.footer-text{
    background-color:  #241602;
    width: 100%;
    height: 4vh;
    text-align: center;
    margin-top: 1vh;

}

.footer-text p{
    font-family: 'Roboto'; 
    font-weight: 400;
    font-size: 2vh;
    color: #ffffff; 
    padding-top: 1vh;      
}

.idei{
    margin-top: 4vh;
}

.zagolovok{
    cursor: default;
    padding: 0.3vh 0vh 0vh 0vh;
    width: 40vh;    
    background: #8a6c3f;
    border-radius: 2vh;
    height: 5vh;
    text-align: center;
    margin-left: 84vh; 
    margin-top: 2vh;
    margin-bottom: 2vh;
    transition: 0.2s;
}

.zagolovok h1{
    color: #ece4d7;
    text-align: center;
    font-family: 'Roboto';
    font-size: 2.6vh;
    font-weight: 400;
    margin-top: 0.4vh;
}

.history h1, .mission h1, .advantages h1, .video-tur h1{
    color: #ffffff;
    font-size: 3.4vh;
    text-align: center;
    font-family: 'Roboto';
    padding-bottom: 1.5vh;
}

.history p, .mission p, .advantages p{
    font-size: 2vh;
    padding-left: 1vh;
    color: #ffffff;
    font-family: 'Roboto';
}


.product-card {
    width: 30%;
    border: 1px solid #ddd;
    border-radius: 0.2vh;
    padding: 2vh;
    margin-bottom: 30px;
    text-align: center;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);
   
}

.filter-section {
    margin-bottom: 3vh;
}

nav ul {
    list-style-type: none;
    padding: 0;
}

nav ul li {
    display: inline;
    margin-right: 2vh;
}

nav a {
    color: #ffffff;
    text-decoration: none;
    
}

.nav a:hover{
    text-shadow: 0 0 0.4vh #f3ecec;
}

.product-list {
    width: 80%;
    padding: 2vh;
    display: flex;
    flex-direction: column;
    gap: 8vh;    
}

.product-list h2 {
    margin-top: 0;
    font-size: 2.2vh;
    text-align: center;
}

.product-card {
    border: 0.1vh solid #dddddd;
    border-radius: 0.5vh;
    padding: 1.5vh;
    margin-bottom: 2vh;
    text-align: center;
}

.product-card img {
    max-width: 50%;
}

.product-card h3 {
    margin: 1vh 0;
    font-size: 2vh;
}

.product-card p{
    font-size: 1.5vh;
}

.product-card button {
    padding: 1vh 1.5vh;
    background-color: #333;
    color: #ffffff;
    border: none;
    cursor: pointer;
    font-size: 1.5vh;
    border-radius: 2vh;
    background: #1af2bc;
    transition: 0.2s;
}

.product-card button:hover {
    transform: scale(1.2)
}

.submit-filter{   
    background-color: #774d27;
    color: #ffffff;
    width: 18vh;
    height: 4.2vh;
    padding: 1vh 1.5vh;
    border-radius: 1vh;
    transition: 0.2s; 
    margin:0 auto;
    margin-top: 1vh;
    margin-left: 6vh;
    font-size: 1.4vh;    
    transition: 0.5s;
}

.submit-filter:hover{
    transform: scale(1.1);
    background: #684b31;
}


.cart-about-top{
    width: 60%;
    height: 40vh;    
    margin-top: 2%;
    margin-left:20%;  
    padding: 0.5vh;
    
}

.cart-history{
    width: 50%;
    height: 20vh;
    background: #776345;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);
    border-radius: 2vh;
    transition: 0.8s;
}

.cart-history:hover{
    transform: scale(1.1);
}

.cart-mission{
    width: 50%;
    height: 20vh;
    background: #776345;
    margin-bottom: 2%;
    margin-left: 50%;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);
    border-radius: 2vh;
    transition: 0.8s;
}

.cart-mission:hover{
    transform: scale(1.1);
}

.cart-about-bottom{
    width: 60%;
    height: 70vh;    
    margin-left:20%;  
    padding: 0.5vh;
}

.cart-advantages{
    width: 50%;
    height: 20vh;
    background: #776345;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);
    border-radius: 2vh;
    transition: 0.8s;
}

.cart-advantages:hover{
    transform: scale(1.1);
}

.cart-video-tur{
    width: 50%;
    height: 50vh;
    background: #776345;
    margin-bottom: 2%;
    margin-left: 50%;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);
    border-radius: 2vh;
    transition: 0.8s;
}

.container {
    max-width: 50vh;
    margin: auto;
    background: #ecebe9;

    padding: 2vh;
    border-radius: 0.5vh;
     
}

h1 {
    text-align: center;
    font-size: 2.5vh;
}

.form-group {
    margin-bottom: 1.5vh;
}

label {
    display: block;
    margin-bottom: 0.5vh;
}

input[type="text"],
input[type="email"],
input[type="password"],
textarea {
    width: 98%;
    padding: 1vh;
    border: 1px solid #b8b5b5;
    border-radius: 0.8vh;
    font-size: 2vh;
}

.forma{
    box-shadow: 0 0.4vh 1.5vh rgba(0, 0, 0, 0.5);
    background: #ffffff;
    padding: 1vh;
    width: 40%;
    margin-left: 30%;
    margin-top: 2vh;
    margin-bottom: 2vh;
    border-radius: 2vh;
}

.forma h1{
    font-size: 3vh;
    font-family: 'Roboto';
    text-align: center; 
    font-weight: 400;

}

label{
    font-size: 2vh;
}

.button-registr{
    background: #ffffff;
    color: #000000;
    width: 17vh;
    height: 4.5vh;   
    padding: 1vh 1.5vh;
    border-radius: 1vh;
    transition: 0.2s; 
    font-size: 1.4vh; 
    margin-top: 4vh; 
    margin-left: 18vh;
    transition: 0.4s;
    font-family: 'Roboto';
}

.button-registr:hover {
    background: #776345;
    color: #ffffff;
    transform: scale(1.05);
    border: none;
}

.podder{
    width: 7.2vh;
    height: 5.8vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    border: 0.2vh solid #000000;
    border-radius: 1.5vh;
    margin-right: -4vh;
    background-color: #ffffff;
}

.info-block a {
    color: black;
    text-decoration: none;
    transition: all .3s ease-in-out;
}



.content {
    max-width: 100vh;
    margin: auto;
    display: flex;
    justify-content: space-between;
    gap: 4vh;
    margin-top: 6vh;
    margin-bottom: 4vh;
    background-color: #ffffff;
    border-radius: 2vh;
}

.contact-info {
    flex-grow: 1;
    width: 100%;
}

.social-list {
    list-style-type: none;
}

.social-list li {
    display: inline-block;
    vertical-align: middle;
    margin-right: 1.5vh;
}

.social-list img {
    width: 4.8vh;
}

.map-container {
    position: relative;
    overflow: hidden;
    width: calc(100% );
    padding-top: 56.25%;
}

.map-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}


.zag {
    border-bottom: 0.1vh solid #0a0a0a;
    width: 80%;
    padding-top: 1.5vh;
    text-decoration: none;
    font-size: 3.2vh;
    font-family: 'Roboto';
    color: #B0BEC5;
}
    
.zag a {
    text-decoration: none;
    font-size: 3.2vh;
    font-family: 'Roboto';
    color: #B0BEC5;
}
    
.blok {
    display: flex;
    flex-wrap: wrap;           
    gap: 1vh;
    padding-top: 2vh;
    width: 65%;
    margin-left: 60vh; 

}
    
.blok  a {
    font-family: 'Roboto';
    text-decoration: none;
    color: #B0BEC5;
}
    
.blokr {
    display: flex;
    flex-wrap: wrap;
    gap: 1.4vh;
    padding-top: 2vh;
    width: 80%;
}
    
.blokr  a {
    font-family: 'Roboto';
    text-decoration: none;
    color: #B0BEC5;
}
    
.card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 40vh;
    height: 45vh;
    background-color: #774d27;
    border: 0.1vh solid #030303;
    border-radius: 2vh;
    overflow: hidden;
    transition: 0.8s;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);    
}
    
.card:hover {
    background-color: #5a3b0cb3;
    transform: scale(1.05);
    border-radius: 2vh;
}
    
.card img {
    border-radius: 0.5vh;
    width: auto;
    height: 40vh;    
}
    
.name {
    text-decoration: none;
    text-align: center;
    width: 100%;
    height: 5vh;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Roboto';
    color: #ffffff;
    font-size: 2vh;        
}
    
.additional-info {
    position: absolute;
    padding: 1.5vh 0 1.5vh 3vh;
    background-color: rgba(0, 0, 0, 0.7); 
    color: #ffffff;    
    font-size: 2vh;
    font-family: 'Roboto';    
    transition: 0.3s;
    transform: translateY(100%);
}

.add-to-cart{
    background-color: #774d27;
    color: #ffffff;
    width: 17vh;
    height: 4.5vh;    
    border: none;
    padding: 1vh 1.5vh;    
    border-radius: 1vh;
    transition: 0.2s; 
    margin:0 auto;
    font-size: 1.4vh;
    margin-top: 48vh;
    margin-right: -30vh;
    margin-left: -30vh;
    transition: 0.5s;
}

.add-to-cart:hover{
    transform: scale(1.2);
    background: #301d0c;
}

nav a {
    color: #ffffff;
    margin-right: 1.5vh;
    text-decoration: none;
}

.sposob{
    margin-top: -7vh;
    margin-bottom: 7vh;
    
}


.payment-methods, .delivery-methods {
    margin-top: 2vh;
    font-size: 1.2vh;      
}

.payment-methods label, .delivery-methods label{
    font-family: 'Roboto';
    font-weight: 100;
    margin-right: 4vh;    
}

.payment-methods{
    padding: 2vh;
    background: #776345;
    border-radius: 2vh;  
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);  
    margin-top: 10vh;
}

.delivery-methods {
    padding: 2vh;
    background: #776345;
    border-radius: 2vh; 
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);
    margin-top: 2vh;
    
}

.payment-methods h1, .delivery-methods h1{
    font-family: 'Roboto';
    font-size: 2.2vh;
    margin-bottom: 1vh;
    margin-top: -1.5vh;
    margin-right: 5vh;
    color:#ffffff;
    font-weight: 300;
}

.sposob label{
    font-size: 2vh;
    color: #ffffff;
}

.basket-container{
    width: 75%;
    height: 130vh;
    margin-left: 40vh;
    margin-top: -41vh;
    margin-bottom: 2vh;
    padding: 1vh;
    border-radius: 1vh;   
}

.basket-container h1{
    font-size: 3.5vh;
    font-family: 'Roboto';
    font-weight: 500;
    color: #817058; 
}

.tovar{
    width: 60%;
    background: #ffffff;
    margin-top: 2vh;
    display: flex; 
    margin-left: 2vh;  
    border-radius: 2vh;
    padding: 1vh;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);
    transition: 0.8s;
}

.tovar:hover{
    box-shadow: 0 0.4vh 1vh rgba(0, 0, 0, 1);
}

.photo-tovar{
    width:15vh;
    height: 15vh;
    background: #ffffff;
    margin-left: 2vh;  
}

.photo-tovar img{
    width:15vh;
    height: 15vh;
}

.product-name{
    width: 15vh;
    height: 15vh;
    background: #ffffff;
    margin-left: 2vh;  
}

.product-price{
    width: 15vh;
    height: 15vh;
    background: #ffffff;   
    margin-left: 2vh;  
}

.product-quantity{
    width: 15vh;
    height: 15vh;
    background: #ffffff;    
    margin-left: 2vh;  
}

.product-name h1, .product-price h1, .product-quantity h1{
    font-size: 2.4vh;
    font-family: 'Roboto';
    font-weight: 500;
    margin-top: 4vh;
    color: #4b3c27;
}

.product-price p, .product-quantity p{
    font-size: 2.6vh;
    font-family: 'Roboto';
    font-weight: 600;
    margin-top: 0.5vh;
    text-align: center;
}

.colichestvo{
    width: 80%;
    height: 4vh;
    background: #b9b7b5;
    display: flex;    
    margin-left: 1.5vh;
    margin-top: 0.4vh;
    border-radius: 1vh;
}

.quantity{
    width: 4vh;
    height: 4vh;
    margin-top: -3.2vh;    
}

.quantity h1{
    color: #000;
    margin-top: 3.5vh;
}

.total{
    width: 30%;
    height: 26vh;
    background: #9b7b57;
    margin-left: 110vh;
    margin-top: -120vh;
    border-radius: 1vh;
    box-shadow: 0 0.4vh 0.8vh rgba(0, 0, 0, 0.4); 

}

.total h1{
    color: #ffffff;
}

.summa, .sale{
    width: 100%;
    background: #ffffff;
    border-bottom-left-radius: 1vh; 
}

.summa h1{
    font-size: 2vh;
    font-family: 'Roboto';
    font-weight: 500;
    text-align: left;
    margin-left: 2vh;
    color: #333;
}

.summa p{
    font-size: 1.8vh;
    font-family: 'Roboto';
    font-weight: 600;    
    text-align: center;
    margin-left: 15vh;
    margin-top: -2vh;
}

.sale h1{
    font-size: 2.5vh;
    font-family: 'Roboto';
    font-weight: 500;
    text-align: left;
    margin-left: 2vh;
    margin-top: 2vh;
    color: #333;    
}

.sale p{
    font-size: 2.2vh;
    font-family: 'Roboto';
    font-weight: 600;    
    text-align: center;
    margin-left: 15vh;
    margin-top: -2.3vh;
}

.dostavka{
    width: 100%;
    background: #ffffff; 
    margin-top: 5vh; 
    border-bottom-left-radius: 1vh;   
}


.dostavka p{
    font-size: 2.2vh;
    font-family: 'Roboto';
    font-weight: 400;    
    text-align: left;    
    margin-left: 2vh;
    padding-right: 1vh;
}

.promocod{
    width: 30%;
    height: 26vh;
    background: #776345;
    border-radius: 1vh;
    margin-left: 110vh;
    margin-top: -120vh;
    margin-bottom: 120vh;
    box-shadow: 0 0.6vh 1.2vh rgb(0, 0, 0); 
}

.promocod p{
    font-size: 2.8vh;
    margin-left: 3vh;
    padding-top: 1vh;
    font-family: 'Roboto';
    color: #ece4d7;
}

.promo-blok{
    width: 62%;
    height: 5vh;
    background: #463425;
    margin-left: 3vh;
    margin-top: 4vh;
    border-radius: 0.2vh;
}


.promo-blok h1{
    font-size: 3vh;
    color: #ffffff;
    text-align: left;
    margin-left: 2vh;
    padding-top: 0.6vh;
}

.processing{
    display: flex; 
    align-items: center; 
}

.processing input{
    margin-left: 3vh;
}

.checkbox-label {
    margin-left: 1vh; 
    margin-bottom: 4vh;
}

.processing label{
    font-size: 1.8vh;
    margin-top: 4vh;
    font-family: 'Roboto';
    font-weight: 100;
    border: none;
    color: #ece4d7;
}

.kod{
    width: 4.7vh;
    height: 5vh;
    background: #ffffff;
    margin-left: 30.8vh;
    margin-top: -5vh;
    border-radius: 0.2vh;
}

.kod img{
    width: 4.4vh;
    height: 4.4vh;
    margin-top: 0.2vh;
    transition: 0.8s;
}

.kod img:hover{
    transform: translateX(15%);
}

.summa-container{
    width: 100%;    
    background: #ffffff;    
}

.button-basket{
    background-color:  #ffffff;
    color: #000000;
    width: 17vh;
    height: 4.5vh;  
    padding: 1vh 1.5vh;
    border-radius: 1vh;
    transition: 0.2s; 
    font-size: 1.4vh; 
    margin-top: 4vh; 
    margin-left: 40vh;
    transition: 0.4s;
    font-family: 'Roboto';
}

.button-basket:hover{
    background: #776345;
    color: #ffffff;
    transform: scale(1.05);
    border: none;
}

.zagolovok-basket{
    padding: 0.3vh 0vh 0vh 0vh;
    width: 40vh;    
    background: #925904;
    border-radius: 2vh;
    height: 5vh;
    text-align: center;
    margin-left: 70vh;   
    transition: 0.2s;
    margin-top: 2vh;
}

.zagolovok-basket:hover{
    transform: scale(1.2);
}

.zagolovok-basket h2{
    font-size: 2.4vh;
    font-family: 'Roboto';
}

.sposob{
    width: 15%;
    margin-left: 4vh;
}

.videoContainer{
    width: 62vh;
    height: 44.5vh;
    border-radius: 2vh;
    font-size: 2.2vh;
}

.button-reviews{
    background-color: #ffffff;
    color: #000000;
    border: #000 solid 0.2vh;
    width: 17vh;
    height: 4.5vh;
    padding: 1vh 1.5vh;
    cursor: pointer;
    border-radius: 1vh;
    transition: 0.2s; 
    margin:0 auto;
    font-size: 1.6vh; 
    margin-top: 4vh; 
    margin-left: 46%;
    transition: 0.4s;
    font-family: 'Roboto';
}

.button-reviews:hover{
    background: #776345;
    color: #ffffff;
    transform: scale(1.05);
    border: none;
}

.container-review{
    width: 75%;
    background: ##e1dbd3;
    margin-left: 25vh;
    border-radius: 2vh;
    box-shadow: 0 0.8vh 1.2vh rgba(0, 0, 0, 0.4); 
}

.arrow-reviews-left img{
    width: 6vh;  
    margin-left: 4vh;
    margin-top: 10vh;
    margin-bottom: -28vh;  
    transition: 0.8s;
}

.arrow-reviews-left img:hover{
    transform: translateX(-20%);
}

.arrow-reviews-right img{
    width: 6vh;
    margin-left: 144vh;
    margin-top: -28vh;
    margin-bottom: 24vh;
    transition: 0.8s;
}

.arrow-reviews-right img:hover{
    transform: translateX(20%);
}


.card-reviews {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 2vh; 
    padding: 2vh; 
}

.reviews {
    background-color: #ffffff;
    border-radius: 1vh;   
    box-shadow: 0.4vh 0.8vh 2vh 0.4vh rgba(34, 60, 80, 0.4);
    width: 30vh;
    transition: 0.2s;
    height: 48vh;
}

.reviews:hover {
    transform: scale(1.05);

}

.reviews img{
    border-radius: 50%;
    width: 15vh;
    height: 15vh;
    margin-left: 7vh;
}

.reviews-opisanie {
    padding: 1.5vh;
}

.reviews-opisanie h1{
    font-family: 'Roboto';
    font-size: 2.8vh;
    margin-bottom: 1vh;
}

.reviews-description {
    font-size: 2.3vh;
    color: #000000;
    font-family: 'Roboto';
    height: 18vh; 
    font-weight: 300;  
    text-align: left;
}

.reviews-list{
    width: 40%;
    padding: 1vh;
    margin-left: 26vh;
}

.tern-reviews {
    display: flex;
    padding-top: 1.5vh;
    padding-bottom: 1.5vh;
}

.tern-reviews a {
    font-family: 'Roboto';
    border-radius: 1vh;
    font-size: 2vh;
    text-decoration: none;
    color: #fcf0f0;
    margin-right: 1vh;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4vh;
    height: 4vh;
    background:#776345;
    transition: 0.5s;
}

.tern-reviews a:hover {    
    color: #000000;    
    background:#3f3526;
}

.zagolovok-contact{
    background: #925904;
    padding: 0.3vh 0vh 0vh 0vh;
    width: 40vh;  
    border-radius: 2vh;
    height: 5vh;
    text-align: center;
    margin-left: 80vh;    
    margin-top: 2vh;
    transition: 0.2s;    
}

.contact-information{    
    width: 40%;
    height: 40vh;
    margin-top: 2vh;
    margin-left: 30%;
    border-radius: 2vh;
    padding: 2vh;    
    transition: 0.8s;
    box-shadow: 0 0.4vh 1.2vh rgb(0, 0, 0);
    background: #ffffff;
}

.more h1{
    font-family: 'Roboto';
    font-weight: 100;
    color: #e4e4e4;
    text-align: center;
    padding-left: 2vh;
    margin-top: -3vh;
}

.contact{
    display: flex;
    width: 100%;
    height: 5vh;
    margin-top: 2vh;
}

.icon-contact img{    
    width: 3vh;
    height: 3vh;
    margin-top: 1.2vh;
    margin-left: 0.4vh;
}

.kontakt{
    width: 30%;
    margin-left: 1vh;
}

.kontakt h1{
    text-align: left;
    font-size: 2.5vh;
    margin-top: 1vh;
    font-family: 'Roboto';
    font-weight: 700;   
    color: #353333;
}

.info{
    display: flex;
    width: 78%; 
    margin-left: 2vh;
}

.info h1{
    font-size: 2.5vh;
    text-align: left;
    margin-top: 1vh;
    font-family: 'Roboto';
    font-weight: 400;   
    margin-left: 2vh;
}

.blok-info{
    padding-top: 1vh;
    padding-bottom: 2vh;
    border-radius: 2vh;
}

.contact-information:hover{
    transform: scale(1.05);
}

.gallery{
    display: grid;
    justify-items: center;
    justify-content: center;
    align-items: center;
    width: 95%;
    height: 110vh;
    margin-bottom: 15vh;
    margin-left: 10vh;
    margin-top: 2vh;
    margin-bottom: 2%;
    border-radius: 1vh;
}

.left-cart-gallery{
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100vh;    
}

.first-card{
    display: grid;
    width: 75vh;
    height: 100vh;    
    background-color: #1a1918;
    margin-right: 1.5vh;
    border-radius: 2vh;    
}

.first-card img{
    width: 75vh;
    height: 100vh;
    border-radius: 2vh;
}

.right-cart-gallery{
    display: grid;
    grid-template-rows: repeat(2, 50vh);
    width: 105vh;
    height: 80vh;
}

.second-card {
    display: grid;
    width: 95vh;
    height: 49vh;    
    background-color: #1a1918;
    margin-left: 2vh;
    border-radius: 2vh;
}

.second-card  img{
    width: 95vh;
    height: 49vh; 
    border-radius: 2vh;
}

.third-card {
    display: grid;
    width: 95vh;
    height: 49vh;    
    background-color: #1a1918;
    margin-left: 2vh;
    border-radius: 2vh;
    margin-top: 1vh;
}

.third-card img{
    width: 95vh;
    height: 49vh;
    border-radius: 2vh;
}

.arrangement{    
    width: 85%;   
    margin-top: 2vh;    
    border-radius: 2vh;
    margin-left: 20vh;
    padding-top: 2vh;
    padding-bottom: 2vh;
}

.group-sovet-top{
    display: flex;
    width: 100%;
}

.group-sovet-bottom{
    display: flex;
    width: 100%;
    margin-top: 5vh;  
}

.advice{    
    width: 35vh;
    height: 25vh;
    background: #776345;
    padding: 1vh;
    border-radius: 2vh;
    margin-left: 4vh;
    box-shadow: 0 0.4vh 1.2vh rgb(0, 0, 0);
    transition: 0.8s;
}

.advice:hover{
    transform: scale(1.05);
}

.advice h1{
    color: #ece4d7;
    font-family: 'Roboto';
    text-align: center;     
    font-size: 2.7vh;    
    border-radius: 2vh;
    font-weight: 400;
}

.advice p{
    color: #ece4d7;
    margin-top: 6%;
    font-family: 'Roboto';
    font-size: 2.3vh;
    padding-left: 1vh;
}

.blog{
    width: 68%;
    padding: 2vh;
    margin-left: 35vh;    
    border-radius: 1vh;
}

.post{
    width: 130vh;
    height: 22vh;
    padding: 2vh;
    background: #ffffff;
    border-radius: 1vh;
    margin-top: 2vh;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);
    transition: 0.8s;
}

.post:hover{
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 1);
}

.post-image{    
    width: 30vh;
    height: 20vh;
    background: #ffffff;
    border-radius: 1vh;
}

.post-image img{
    width: 30vh;
    height: 20vh;
    border-radius: 1vh;
}

.title{
    margin-top: -20vh;
    margin-left: 40vh;
}

.title h1{
    color: #7c6654;
    text-align: center;
    font-family: 'Roboto';
    font-size: 3vh;
    font-weight: 500;
}

.published{
    margin-top: 10vh;
}

.published h1{
    color: #000000;
    text-align: left;
    margin-left: 1vh;
    margin-top: 1vh;
    font-family: 'Roboto';
    font-size: 1.8vh;
    font-weight: 300;
    font-style: italic;
}

.read-more{
    width: 12vh;
    height: 2.5vh;  
    padding: 1vh 1.5vh;
    background: #ffffff;
    color: #000000;
    border: #000 solid 0.1vh;
    border-radius: 1vh;
    margin-left: 32vh;
    margin-top: -9vh;
    transition: 0.4s;
    font-family: 'Roboto';
}


.read-more:hover{
    background-color: #776345;
    color: #ffffff;
    transform: scale(1.1);
    border: none;
}

.read-more h1{
    text-align: center;
    font-family: 'Roboto';
    font-size: 1.8vh;
    font-weight: 400;
    margin-top: 0.2vh;
}

.comment h1{
    text-align: center;
    font-family: 'Roboto';
    font-size: 2.8vh;
    font-weight: 600;
    margin-top: 0.2vh;
    margin-right: 51vh;
    margin-top: 2vh;
    margin-bottom: -3vh;
}

.comment img{
    width: 2.5vh;
    height: 2.5vh;
    margin-left: 35vh;
    margin-bottom: 2vh;
}

.article{
    margin-top: 4vh;
    margin-left: 32vh;
}

.article h1{
    color: #000000;
    text-align: left;
    font-family: 'Roboto';
    font-size: 2.5vh;
    font-weight: 400;
}

.styles{
    display: flex;
    margin-top: 2vh;
    width: 95%;
    padding: 2vh;
    border-radius: 2vh;  
    margin-left: 27vh;      
}

.rooms{
    display: flex;
    padding: 2vh;
    width: 75%;   
    margin-left: 28vh;
    border-radius: 2vh; 
    margin-top: 2vh;
    gap: 2vh;    
}

.text-rooms{
    width: 100%;
    height: 12vh; 
    color: #ece4d7;
    margin-top: -2vh;
    margin-left: 1vh;
    
}

.text-rooms h1{
    font-weight: 100;
    text-align: left;
    font-size: 2.2vh;
    font-family: 'Roboto';
    padding: 0 1vh 0 1vh;
}

.stili{
    display: flex;
    flex-direction: column;
    gap: 1vh;
    width: 45vh;
    margin-left: 3.5vh;
    font-size: 2vh;
    background: #8d765f;
    border-radius: 2vh;
    transition: 0.8s;
}

.stili img{
    width: 100%;
    height: 30vh;
    border-top-left-radius: 2vh;
    border-top-right-radius: 2vh;
}

.stili:hover{
    transform: scale(1.05);
}

.comnata{
    display: flex;
    flex-direction: column;
    gap: 1vh;
    width: 45vh;
    margin-left: 2vh;
    font-size: 2vh;
    background: #8d765f;
    border-radius: 2vh;
    transition: 0.8s;
}

.comnata img{
    border-top-left-radius: 2vh;
    border-top-right-radius: 2vh;
    height: 30vh;
}

.comnata:hover{
    transform: scale(1.1);
}

.popular{
    width: 90%;    
    display: flex;
    padding: 1vh;
    margin-left: 30vh;
    border-radius: 2vh;    
}

.popular-category{
    width: 40vh;
    height: 40vh;
    background: #ffffff;
    margin-left: 5vh;
    border-radius: 2vh;
    transition: 0.8s;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);
}

.popular-category:hover{
    transform: scale(1.05);
}

.image-category img{
    width: 40vh;
    height: 40vh;
    border-radius: 2vh;
}

.blackout{
    width: 40vh;
    height: 40vh;
    margin-top: -40.5vh;
    background-color: rgba(0, 0, 0, 0.5); 
    color: #ffffff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0; 
    transition: 0.8s; 
    border-radius: 2vh;
}

.popular-category:hover .blackout{
    opacity: 1; 
}

.blackout h1{
    margin-top: 35vh;
    font-size: 3vh;
    color:#ece4d7;
    width: 15vh;
    font-weight: 400;
    font-family: 'Roboto';
}

.zagolovok-interior{
    padding: 0.3vh 0vh 0vh 0vh;
    width: 25vh;    
    background: #b69460;
    border-radius: 2vh;
    height: 4vh;
    text-align: center;
    margin-left: 92vh;
    margin-top: 2vh;
    margin-bottom: 2vh;
    color: #000000;    
}

.zagolovok-interior h1{    
    color: #ece4d7;
    text-align: center;
    font-family: 'Roboto';
    font-size: 2.2vh;
    font-weight: 400;
    margin-top: 0.4vh;
    
}

.zagolovok-stili{
    padding: 0.3vh 0vh 0vh 0vh;
    width: 25vh;    
    background: #b69460;
    border-radius: 2vh;
    height: 4vh;
    text-align: center;
    margin-left: 92vh;
    margin-top: 2vh;   
    color: #000000;    
}

.zagolovok-stili h1{
    color: #ece4d7;
    text-align: center;
    font-family: 'Roboto';
    font-size: 2.2vh;
    font-weight: 400;
    margin-top: 0.4vh;    
}

.blog-page{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5vh;
}

.blog-page-number{
    border: 0.1vh solid #000;
    border-radius: 2vh;
    width: 4vh;
    height: 4vh;    
    display: flex;
    align-items: center;
    justify-content: center;
}

.blog-page-number1{
    border-radius: 0.4vh;
    width: 4vh;
    height: 4vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blog-page-number a{
    font-weight: 400;
    font-size: 1.4vh;
    line-height: 160%;    
}

.blog-page-number1 a{
    font-weight: 400;
    font-size: 1.4vh;
    line-height: 160%;
}

.interior-ideas{
    display: flex;
    flex-direction: column;
    gap: 2vh;
    padding: 1vh;
}

.interior-card{
    display: flex;
    flex-direction: column;
    gap: 1vh;
    width: 45vh;    
}

.interior-card h1{
    font-size: 3vh;
    font-family: 'Roboto';
    font-weight: 500;
    color: #ece4d7;
    
}

.slider-blok{
    width: 95%;
    height: 70vh;
    /*background: #cfbfb0;*/
    box-shadow: 0 0.4vh 1vh rgba(0, 0, 0, 1);
    margin-left: 5vh;
    border-radius: 2vh;
    padding: 1vh;
    margin-top: 4vh;
}

.big-image{
    width: 52vh;
    height: 50vh;
    background: #8d765f;
    color: #ece4d7;
    margin-left: 68vh;
    border-radius: 2vh;
    margin-top: -50vh;
    transition: 1s;
}

.big-image:hover{
    transform: scale(1.05);
}

.small-image-left{
    width: 22vh;
    height: 20vh;
    background: #8d765f;  
    color: #ece4d7;
    border-radius: 2vh;
    margin-left: 3vh;
    margin-bottom: -25vh;
    margin-top: 22vh;
    transition: 1s;
}

.small-image-left:hover{
    transform: scale(1.1);
}

.small-image-right{
    width: 22vh;
    height: 20vh;
    background: #8d765f;    
    color: #ece4d7;
    border-radius: 2vh;
    margin-left: 164vh;
    margin-top: -24vh;
    transition: 1s;
}

.small-image-right:hover{
    transform: scale(1.1);
}

.middle-image-left{
    width: 32vh;
    height: 30vh;
    background: #8d765f;   
    color: #ece4d7; 
    border-radius: 2vh;
    margin-left: 30vh;
    margin-bottom: 10vh;
    margin-top: -8vh;
    transition: 1s;
}

.middle-image-left:hover{
    transform: scale(1.05);
}

.middle-image-right{
    width: 32vh;
    height: 30vh;
    background: #8d765f;   
    color: #ece4d7;
    border-radius: 2vh;
    margin-left: 126vh;
    margin-top: -40vh;
    margin-bottom: -4vh; 
    transition: 1s;   
}

.middle-image-right:hover{
    transform: scale(1.05);
}

.arrow-slider-left img{
    width: 5vh;      
    margin-top: 18vh;
    margin-bottom: -35vh;
    transition: 0.8s;
}

.arrow-slider-right img{
    width: 5vh;  
    margin-left: 191vh;
    margin-top: -13vh;
    margin-bottom: 12vh;
    transition: 0.8s;
}

.arrow-slider-left img:hover{
    transform: translateX(-30%);
}

.arrow-slider-right img:hover{
    transform: translateX(30%);
}

.small-image{
    width: 100%;
    height: 85%;
    background: #614830;
    border-top-left-radius: 2vh;
    border-top-right-radius: 2vh;
}

.small-image img{
    border-top-left-radius: 2vh;
    border-top-right-radius: 2vh;
    width: 100%;
    height: 100%;
}

.slider-text-big h1{
    font-size: 3.5vh;
    font-weight: 300;
    margin-top: 1vh;
    font-family: 'Roboto';
}

.slider-text-small h1{
    font-size: 1.8vh;
    font-weight: 300;
    margin-top: 0.2vh;
    font-family: 'Roboto';
}

.slider-text-middle h1{
    font-size: 2.5vh;
    font-weight: 300;
    margin-top: 0.8vh;
    font-family: 'Roboto';
}


.slider-list{
    width: 40%;
    padding: 1vh;
    margin-left: 30vh;    
}

.tern-slider {
    width: 40%;
    display: flex;
    padding-top: 1.5vh;
    padding-bottom: 1.5vh;    
    margin-top: 18vh;
    margin-left: 55vh;
}

.tern-slider a {
    font-family: 'Roboto';
    border-radius: 50%;
    font-size: 2vh;
    text-decoration: none;
    color: #fcf0f0;
    margin-right: 1vh;
    display: flex;
    align-items: center;
    justify-content: center;    
    width: 3.5vh;
    height: 3.5vh;
    border: #000 solid 0.1vh;
    transition: 0.5s;    
}

.tern-slider a:hover {    
    color: #000;    
    background:#41321d;
}

.filters{
    width: 20%;
    height: 52vh;
    background: #ffffff; 
    border: #000 solid 0.1vh;
    border-radius: 2vh;
    margin-left: 2vh;
    margin-top: 4vh;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.8);
}

.filters-zagolovok{
    width: 100%;
    background: #776345;
    margin-bottom: 2vh;
    border-top-left-radius: 2vh;
    border-top-right-radius: 2vh;    
}

.filters-zagolovok h1{        
    font-size: 2.5vh;
    color: #ece4d7;
    font-family: 'Roboto';
    font-weight: 200;

}

.filter-container {
    background-color: #fff;
    padding: 2vh;
    border-radius: 1vh;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.1);
    max-width: 40vh;
    margin: auto;
}

h2 {
    text-align: center;
    margin-bottom: 2vh;
}

.filter-group {
    margin-bottom: 2vh;

}

label {
    display: block;
    margin-bottom: 0.5vh;
    font-weight: bold;
    margin-left: 2.5vh;
    font-family: 'Roboto';
}

select {
    width: 90%;
    padding: 1vh;
    margin-left: 2vh;
    border: 0.1vh solid #ccc;
    border-radius: 0.4vh;
    font-size: 2vh;
    font-family: 'Roboto';
}

option{
    background: #ffffff;
    padding-left: 2vh;
    font-family: 'Roboto';
}

.option:checked{
    background: #776345;
}

.container-categories{
    width: 20%;
    height: 47vh;
    background: #ffffff;    
    border-radius: 2vh;
    margin-left: 2vh;
    margin-top: 4vh;    
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);
}

.categories-zagolovok{
    width: 99.9%;
    height: 5vh;
    background: #776345;
    border: #000 solid 0.1vh;
    border-top-left-radius: 1vh;
    border-top-right-radius: 1vh;    
}

.categories-zagolovok h1{        
    font-size: 2.8vh;
    color: #ece4d7;
    font-family: 'Roboto';
    font-weight: 400;
    padding-top: 1vh;
}

.category{   
    width: 99.9%;
    height: 4vh;
    border: #000 solid 0.1vh;
    background: #918470;
    transition: 0.8s;
}

.category-bottom{   
    width: 99.9%;
    height: 4vh;
    border: #000 solid 0.1vh;
    background: #918470;
    border-bottom-right-radius: 1vh;
    border-bottom-left-radius: 1vh;
    transition: 0.8s;
}

.category:hover{
    background: #5e5445;    
}

.category-bottom:hover{
    background: #5e5445;
}

.category h1, .category-bottom h1{
    font-size: 3vh;
    color: #ece4d7;
    font-family: 'Roboto';
    font-weight: 300;
    transition: 0.8s;
}

.category h1:hover{
    font-weight: 600;
}

.category-bottom h1:hover{
    font-weight: 600;
}

.button-category{
    background-color: #ffffff;
    color: #000000;
    border: #000 solid 0.2vh;
    width: 17vh;
    height: 4.5vh;  
    padding: 1vh 1.5vh;
    border-radius: 1vh;
    transition: 0.2s; 
    font-size: 1.4vh; 
    margin-top: 1.2vh;
    margin-left: 11.5vh;
    transition: 0.4s;
    font-family: 'Roboto';
}

.button-category:hover{
    background-color: #776345;
    color: #ffffff;
    transform: scale(1.1);
    border: none;
}

.zagolovok-catalog{
    padding: 0.3vh 0vh 0vh 0vh;
    width: 40vh;    
    background: #8a6c3f;
    border-radius: 2vh;
    height: 5vh;
    text-align: center;
    margin-left: 100vh;    
    transition: 0.2s;  
    margin-top: -52vh;
    margin-bottom: 100vh;
}

.zagolovok-category{
    padding: 0.3vh 0vh 0vh 0vh;
    width: 40vh;    
    background: #8a6c3f;
    border-radius: 2vh;
    height: 5vh;
    text-align: center;
    margin-left: 105vh;    
    transition: 0.2s;
}
/*
.zagolovok-category:hover{
    transform: scale(1.1);
}*/

.zagolovok-catalog h1, .zagolovok-category h1{
    color: #ece4d7;
    text-align: center;
    font-family: 'Roboto';
    font-size: 2.6vh;
    font-weight: 400;
    margin-top: 0.4vh;    
}

.category-container{
    display: flex;
    margin-left: 28%;
    margin-top: 6vh;

}

.kategorii{
    display: flex;
    background: #776345;
    width: 40vh;
    height: 46vh;
    border-radius: 1.5vh;
    margin-left: 3vh;
    box-shadow: 0 0.5vh 1vh hsl(0, 0%, 0%);
}


.text-comod{
    width: 40vh;
    margin-left: 61vh;
    margin-top: -4.5vh;
}

.text-closet{
    width: 40vh;
    margin-left: 104vh;
    margin-top: -3vh;
}

.text-charset{
    width: 40vh;
    margin-left: 147vh;
    margin-top: -3vh;
}

.text-comod h1, .text-closet h1, .text-charset h1{
    cursor: default;
    text-align: center;
    color: #ffffff;
    font-size: 2.5vh;   
    font-family: 'Roboto';
    font-weight: 300;
}


.img-container{
    background: #ffffff;
    width: 40vh;
    height: 40vh;
    border-top-left-radius: 1.5vh;
    border-top-right-radius: 1.5vh;
    position: relative;
    overflow: hidden;
}

.img-container img{
    width: 40vh;
    height: 40vh;
}

.image{
    width: 100%;
    transition: 0.8s;
}

.image-hover {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
}

.kategorii:hover .image-main {
    opacity: 0;
}

.kategorii:hover .image-hover {
    opacity: 1;
}

.comod{
    display: flex;
    width: 70%;
    background: #ffffff;
    margin-left: 50vh;
    margin-top: -95vh;
    margin-bottom: 120vh;
    border-radius: 0.2vh;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5); 
    transition: 0.8s;  
}

.comod:hover{
    box-shadow: 0 0.4vh 1vh rgb(0, 0, 0); 
}

.closet{
    display: flex;
    width: 70%;
    background: #ffffff;
    margin-left: 50vh;
    margin-top: -116vh;
    margin-bottom: 116vh;
    border-radius: 0.2vh;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);  
    transition: 0.8s;   
}

.closet:hover{
    box-shadow: 0 0.4vh 1vh rgb(0, 0, 0); 
}

.chair{
    display: flex;
    width: 70%;
    background: #ffffff;
    margin-left: 50vh;
    margin-top: -112vh;
    margin-bottom: 112vh;
    border-radius: 0.2vh;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);  
    transition: 0.8s;   
}

.chair:hover{
    box-shadow: 0 0.4vh 1vh rgb(0, 0, 0); 
}

.table{
    display: flex;
    width: 70%;
    background: #ffffff;
    margin-left: 50vh;
    margin-top: -108vh;
    margin-bottom: 108vh;
    border-radius: 0.2vh;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);   
    transition: 0.8s;  
}

.table:hover{
    box-shadow: 0 0.4vh 1vh rgb(0, 0, 0); 
}

.bed{
    display: flex;
    width: 70%;
    background: #ffffff;
    margin-left: 50vh;
    margin-top: -104vh;
    margin-bottom: 104vh;
    border-radius: 0.2vh;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5); 
    transition: 0.8s;  
}

.bed:hover{
    box-shadow: 0 0.4vh 1vh rgb(0, 0, 0); 
}

.trellis{
    display: flex;
    width: 70%;
    background: #ffffff;
    margin-left: 50vh;
    margin-top: -100vh;
    margin-bottom: 100vh;
    border-radius: 0.2vh;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5); 
    transition: 0.8s;  
}

.trellis:hover{
    box-shadow: 0 0.4vh 1vh rgb(0, 0, 0); 
}

.sofa{
    display: flex;
    width: 70%;
    background: #ffffff;
    margin-left: 50vh;
    margin-top: -96vh;
    margin-bottom: 4vh;
    border-radius: 0.2vh;
    box-shadow: 0 0.2vh 1vh rgba(0, 0, 0, 0.5);
    transition: 0.8s;  
}

.sofa:hover{
    box-shadow: 0 0.4vh 1vh rgb(0, 0, 0); 
}

.photo-mebel{
    width: 18vh;
    height: 18vh;
    background: #ffffff;
}

.photo-mebel img{
    width: 18vh;
    height: 18vh;
}

.furniture-description{
    width: 96vh;
    height: 18vh;
    background: #ffffff;
}

.furniture-description h1{
    text-align: left;
    padding-top: 1vh;
    font-family: 'Roboto';
    font-size: 2.5vh;
    font-weight: 500;
}

.furniture-description p{
    padding-top: 2vh;
    text-align: left;
    font-family: 'Roboto';
    font-size: 2.5vh;
    color: #353333;
    font-weight: 400;
}

.zakaz{
    width: 25vh;
    height: 18vh;
   
}

.zakaz h1{
    text-align: left;
    padding-top: 1vh;
    font-family: 'Roboto';
}

.star img{
    width: 2vh;
    height: 2vh;
    margin-top: 1vh;
}

.button-catalog{
    background-color: #ffffff;
    color: #000000;
    border: #000 solid 0.2vh;
    width: 17vh;
    height: 4.5vh;
    padding: 1vh 1.5vh;
    border-radius: 1vh;
    transition: 0.2s; 
    font-size: 1.4vh; 
    margin-top: 5.5vh;
    transition: 0.4s;
}

.button-catalog:hover{
    background: #776345;
    color: #ffffff;
    transform: scale(1.05);
    border: none;
}

.like img{    
    width: 3vh;
    height: 3vh;
    margin-left: 20vh;
    margin-bottom: 5vh;
    margin-top: -3.5vh;
    transition: 0.8s;
}

.like img:hover{
    transform: scale(1.2);
}