header {
    display: flex;
    padding: 1%;
    background-color: #fff500;

}
.logo {
    background-image: url("ДОСКИ 48 вар 4.jpg");
    background-size: 100%;
    height: auto;
    width: 20%;
    background-repeat: no-repeat;
    
}

main {
    height: 100%;
}

.small {
    font-size: 0.5em;
}

body {
    background: #fff7005c;
    box-sizing: border-box;
	margin: 0;
	padding: 0;
}

.menu{
    display: flex;
    align-items: center;
    width: 80%;

}

#o_nac, #main, #kontakts, #katalog{text-decoration:none; text-align:center; 
    padding:11px 32px; 
    background-color: #fff500;
    border: none;
    font-weight: bold;
    height: auto;
    width: 100%;
    font-size: 30px;
    cursor: pointer;

    }
#o_nac:hover, #main:hover, #kontakts:hover, #katalog:hover {
    background-color: rgb(238, 255, 0);
}

.lend {
    background-image: url("shutterstock_1552199918.jpg");
    background-size: 100%;
    background-repeat: no-repeat;
    width: 100%;
    font-family: 'Philosopher', sans-serif;
    padding: 6% 0;
}


.p_lend {
    font-size: 50px;
    color: black;
    width: 50%;
    text-align: center;
    margin: 1% 24%;
}

.h_lend {
    font-size: 70px;
    color: black;

}

.wrap {
    align-items: center;
    justify-content: center;
    text-align: center;
}

.where_lend {
    height: 100px;
    width: 300px;
    font-size: 30px;
    border: #fff500 3px solid;
    background-color: #fff500;
    border-radius: 50px;
    cursor: pointer;
    text-align: center;
}

.where_lend:hover{
    background-color: white;
}

#wrap_about {
    display: flex;
    flex-direction: column;
    text-align: center;
    max-width: 500px;

}

.about {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 1% 1%;

}

.h_about{
    font-family: 'Philosopher', sans-serif;
    font-size: 60px;
    font-weight: bold;
}
.p_about{
    font-size: 30px;
    margin-bottom: 50px;
}

.planks {
    background-color: #fff70091;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-top: 0%;
    padding: 2% 0;
}

#planks_wrap {
    margin-left: 5%;
    margin-right: 5%;
    display: flex;
    flex-direction: column;
    width: 100%;
}
.three_products{
    display: flex;
    width: 100%;
    margin-bottom: 5%;
}

.product{
    display: flex;
    flex-direction: column;
    width: 26%;
    margin-left: 4%;
    border: black 3px solid;
    background-color: #fff500;
    box-shadow: 5px 5px  rgba(104, 104, 2, 0.993);
}

#name {
    font-weight: bold;
}

.product_img {
    height: 60%;
}

.discription {
    color: rgba(0, 0, 0, 0.766);
    font-size: 20px;
    margin: auto 0;
}

.contacts {
    width: 100%;
    background-image: url("cont.jpg");
    background-repeat: no-repeat;
    background-size: 100%;
}

.map {
    width: 70%;
    height: auto;
}
.contact_wrap {
    justify-content: left;
    display: flex;
    justify-content: space-between;
}

.info {
    font-size: 25px;
    font-weight: bolder;
    font-family: 'Philosopher', sans-serif;
    background-color: #fff500;
    padding-left: 1%;
}


#strong {
    font-weight: 900;
}

.social-icons {
    display: flex;
    list-style: none;
    margin-top: 1rem;
    margin-bottom: 1rem;
    padding-left: 0;
    margin-left: 9%;
  }
  .social-icons>li {
    margin-left: 0.25rem;
    margin-right: 0.25rem;
  }
  .social-icons a {
    position: relative;
    background-color: #eee;
    display: block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: background-color .3s ease-in-out;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: .25rem;
    
  }
  .social-icons a:hover {
    background-color: #e0e0e0;
  }
  .social-icons a::before {
    content: "";
    position: absolute;
    width: 1.2rem;
    height: 1.2rem;
    left: .65rem;
    top: .65rem;
    background: transparent no-repeat center center;
    background-size: 100% 100%;
  }
  .social-icons .social-icon-whatsup::before {
    background-image: url("whatsup-logo.png");
  }
  .social-icons .social-icon-vk::before {
    background-image: url("vk-logo.jpg");
  }