/*!
Theme Name: audiphile
Author: olena ost
Description: Description
*/
body,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
p {
  margin: 0;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}
/* -------------- */
/* --------------------------GLOBAL-------------------------- */
body{
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: rgba(255, 255, 255, 1);
  font-family: 'Manrope', sans-serif;
}
.width{
  width: 1110px;
}
a{
    text-decoration: none;
}
button   {
  padding: 0;
  border: none;
  font: inherit;
  color: inherit;
  background-color: transparent;
  cursor: pointer;
}
.hidden{
  display: none;
}
ul{
    list-style-type: none;
    padding: 0; 
}
header, footer{
    width: 100%;
    background-color: rgba(14, 14, 14, 1);
}
.center{
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* ---------------Fonts--------------- */
h1,
p,
.home-text_product,
.btn-orange{
    color:rgba(255, 255, 255, 1)
}

h1{
    font-weight: 700;
    font-size: 56px;
    line-height: 58px;
    letter-spacing: 2px;
}
h2{   
  font-weight: 700;
  font-size: 28px;
  letter-spacing: 2px;
  color:rgba(0, 0, 0, 1);
  margin-bottom: 32px;
  text-transform: uppercase;

}
h3{
  font-weight: 700;
  line-height: 44px;
  font-size: 40px;
  letter-spacing: 1.23px;
  color:rgba(0, 0, 0, 1);
  margin-bottom: 32px;
  text-transform: uppercase;
}
h4{
  font-weight: 700;
  line-height: 32px;
  font-size: 36px;
  letter-spacing: 1.14px;
  color:rgba(0, 0, 0, 1);
  margin-bottom: 32px;
  text-transform: uppercase;

}
h5{
  font-weight: 700;
  font-size: 24px;
  letter-spacing: 1.71px;
  color:rgba(0, 0, 0, 1);
  margin-bottom: 32px;
  text-transform: uppercase;
}
p, 
.option-name{  
  font-weight: 500;
  font-size: 15px;
  line-height: 25px;
  opacity: 75%;
}
.home-text_product{
    font-weight: 400;
    font-size: 14px;
    letter-spacing: 10px;
    text-transform: uppercase;
    opacity: 75%;
}
.shop{
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 1);
  opacity: 50%;
  margin-top: 15px;
  margin-bottom: 30px;
}
.shop:hover{
  color: rgba(216, 125, 74, 1);
}
/* -------------- HEADER-------------- */
.header-conteiner{
    height: 96px;
}
.header-line {
  height: 1px;
  background-color: rgba(151, 151, 151, 1);
}
.footer-conteiner_header, .header-conteiner{
    /* width: 100%; */
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.menu a{
    text-transform:uppercase;
    letter-spacing: 2px;
    font-size: 13px;
    font-weight: 700;
    color:rgba(255, 255, 255, 1);
}
.menu ul{
    display: flex;
    flex-direction: row;
    gap:34px;
}
.basket{
    border: none;
    background: url(./assets/images/icon/basket.png);
    background-repeat: no-repeat;

}

   /* --------fonts------ */
.text-footer_content, .text-footer_copyright{
    opacity: 50%;
    color:rgba(255, 255, 255, 1);
    font-size: 15px;
    line-height: 25px;
    max-width: 540px;
  }

   /* --------Button------ */
.btn-orange,
.widget_wpalsolikepostswidget > div a{
  padding: 15px;
  text-align: center;
  display: inline-block;
  border: none;
  background-color: rgba(216, 125, 74, 1);
  width: 160px;
  height: 48.25px;
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: 1px;
  cursor: pointer;
  color:rgba(255, 255, 255, 1);
}

.btn-orange:hover{
  background-color: rgba(251, 175, 133, 1);
}

main{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  flex-direction: column;
}


  /*----------------------BURGER_MENU----------------------*/
.burger-menu{
    display: none;
}

  /*----------------------________________HOME-New-product________________----------------------*/
.section-product{
  width: 100vw;
  height: 729px;
  background-color: rgba(14, 14, 14, 1);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin-bottom: 120px;
}
.section-product-conteiner{
  position: relative;
  max-width: 1110px;
  display: flex;
  flex-direction: row;

}
.home-photo_product .wp-post-image{
    height: 724px;
    width: 708px;
}

.home-article_product{
    display: flex;
    max-width: 398px;
    gap: 24px;
    flex-direction: column;
    position: relative;
  }
.home-article_product p{
  margin-bottom: 16px;
  }
  /*----------------------________________HOME-CATEGORY________________----------------------*/
.category{
  margin-bottom: 168px;
}
.category-box{
  display: flex;
  flex-direction: row;
  gap:30px;
}
.category-conteiner{
  width: 100%;
  display: flex;
  position: relative;
  width: 350px;
  height: 284px;
  align-items: flex-end;
  justify-content: center;
  cursor: pointer;
}
.category-conteiner:hover{
  color:rgba(216, 125, 74, 1);
  
}
.category-image{
  height: 160px;
  width: 130px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.category-conteiner img{
  width: 125px;
  height: auto;
}
.category-conteiner a{
  font-weight: 700;
  font-size: 18px;
  color: rgba(0, 0, 0, 1);
  letter-spacing: 1.29px;
  text-transform: uppercase;
  height: 284px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
.category-bg{
  position: absolute;
  z-index: -1;
  width: 350px;
  height: 204px;
  background-color: rgba(241, 241, 241, 1);
  border-radius: 8px;
}
.bird{
  display: inline-block;
  background-image: url(./assets/images/icon/bird.png);
  background-repeat: no-repeat;
  width: 8px;
  height: 10px;
  padding-left: 13px;
}
.shadow{
  position: absolute;
  bottom: 70px;
  display: inline-block;
  background-image: url(./assets/images/photo/shadow.png);
  background-repeat: no-repeat;
  width: 209px;
  height: 106px;
}

.category-text{
  display: flex;
  flex-direction: column;
  align-items: center;
}
  /*----------------------________________HOME-ORANGE________________----------------------*/

.orange-conteiner{
  width: 100%;
  height: 560px;
  padding: 95px;
  overflow: hidden;
  background-color: rgba(216, 125, 74, 1);
  background-image: url(./assets/images/background/circle_orange.png);
  background-repeat: no-repeat;
  border-radius: 8px;
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
  position: relative;
  margin-bottom: 48px;
}


.orange-photo_product{
  position: absolute;
  left: 113px;
  bottom: -35px;
  width: 410.23px;
  height: auto;
}

.orange-article_product{
width: 349px;
height: 303px;
}
.orange-article_product h1{
margin-bottom: 24px;
}
.orange-article_product p{
margin-bottom: 40px;
}
.orange-article_product .btn-orange{
  background-color: rgba(0, 0, 0, 1);

}
  /*----------------------________________HOME-grey________________----------------------*/
.grey{
  margin-bottom: 48px;
}

.grey-photo_product{
  padding: 95px;
  display: flex;
  align-items: center;
  background-repeat: no-repeat;
  width: 1110px;
  height: 320px;
  background-position-x: -40px;
  background-position-y: -500px;
  border-radius: 8px;
}
.grey-article_product .btn-orange{
background-color: transparent;
border: 1px solid rgba(0, 0, 0, 1);
color:rgba(0, 0, 0, 1);
}
.grey-article_product .btn-orange:hover{
  background-color:rgba(0, 0, 0, 1);
  color:rgba(255, 255, 255, 1);
}

/*----------------------________________HOME-double________________----------------------*/
.double{
  display: flex;
  flex-direction: row;
  gap:30px;
  margin-bottom: 200px;
}

.double-photo_product{
  background-repeat: no-repeat;
  width: 540px;
  height: 320px;
  background-position-x: -80px;
  background-position-y: -320px;
  border-radius: 8px;
}

.double-bg{
  width: 540px;
  height: 320px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 95px;
  border-radius: 8px;
  background-color:rgba(241, 241, 241, 1) ;
}
/*----------------------________________HOME-advertising________________----------------------*/ 

.advertising-conteiner{
  display: flex;
  flex-direction: row;
  align-items: center;
  gap:30px;
  margin:  0 0 200px 0;
}
.advertising-photo{
  background-repeat: no-repeat;
  width: 540px;
  height: 588px;
  background-position-x: -210px;
  background-position-y: -70px;
  border-radius: 8px;
}
.advertising-article{
  width: 540px;

}
.advertising-article h3,
.advertising-article p{
  max-width: 445px;
}

.advertising-article span{
  color: rgba(216, 125, 74, 1);
}

.advertising-article p{
  color: rgba(0, 0, 0, 1);
}
/* --------------FOOTER-------------- */
footer{
  height: 365px;
}
.footer-conteiner{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
footer, 
.footer-conteiner_header,
.footer-conteiner_central,
.footer-conteiner_footer{
  width: 100%;
}
.facebook_icon_white,
.twitter_icon_white,
.instagram_icon_white,
.basket{
display: inline-block;
width: 24px;
height: 24px;
}
.footer-conteiner_header{
  margin-bottom: 36px;

}
.footer-box_social{
max-width: 104px;
display: flex;
flex-direction: row;
justify-content: space-between;
gap:16px;
}

.facebook_icon_white{
  background: url(./assets/images/icon/facebook.png);
  background-repeat: no-repeat;
}
.facebook_icon_white:hover{
  background: url(./assets/images/icon/facebook-orange.png);
  background-repeat: no-repeat;
}
.twitter_icon_white{
  background: url(./assets/images/icon/twitter.png);
  background-repeat: no-repeat;
}
.twitter_icon_white:hover{
  background: url(./assets/images/icon/twitter-orange.png);
  background-repeat: no-repeat;
}
.instagram_icon_white{
  background: url(./assets/images/icon/insta.png);
  background-repeat: no-repeat;

}
.instagram_icon_white:hover{
  background: url(./assets/images/icon/insta-orange.png);
  background-repeat: no-repeat;
}
.decor-line{
  background-color: rgba(216, 125, 74, 1);
  height: 4px;
  width: 101px;
  margin-bottom: 71px;
}
.footer-box_text{
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 56px; 
}