
:root {
  --mainYellow: #fdbe02;
  --mainWhite: #fff;
  --mainBlack: #071013;
  --mainGrey: #9b9999;
  --TransGrey: rgba(0, 0, 0, 0.1);
}
body {
  color: var(--mainBlack);
  background: var(--mainWhite);
  font-family: 'Heebo', sans-serif;
  background: url()center/cover
  fixed no-repeat;
}



.text-slanted {
  font-family: 'Heebo', sans-serif;
}

.btn-yellow{
  background: #8bb1c7!important;
  color: var(--mainBlack)!important;
  font-size: 1.2rem;
  border-radius: 0!important;
  transition: background 2s ease!important;
}

.btn-yellow:hover{
  background: #071013;
  color: #8bb1c7;
}


.navbar-toggler{
  outline: none!important;
  border: none;
  font-size: 2.2rem;
  color: var(--mainBlack)!important;
}

.nav-link{
  font-size: 1.2rem;
  border-bottom: 0.1rem solid var(--mainWhite);
}

.nav-active{
  border-bottom: 0.1rem solid var(--mainGrey);
}

.navbar-icon{
  font-size: 1.6rem;
}

.navbar-cart-icon{
  color: var(--mainBlack);
  position: relative;
}

.navbar-cart-icon:hover{
  color: var(--mainGrey);
}

.navbar-background{
  padding: 2px 20px;
}

.cart-items{
  color: var(--mainWhite);
  position: absolute;
  top: -15%;
  right: -25%;
  padding: 0.2rem 0.3rem;
  background: var(--mainYellow);
  font-size: 0.1rem;
  border-radius: 50%;
}

/* banner */
.banner{
  min-height: calc(100vh - 75px);
  background: linear-gradient(rgba(0,0,0,0.2),rgba(0,0,0,0.2)) ,url(img/newHeader.jpg);
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

header h1{
  color: #fff;
}

.product-style{
  border: 1px solid #071013;
}

/* featured section */
.featured-container{
  background: var(--TransGrey);
  position: relative;
  overflow: hidden;
}

.featured-search-icon{
  background: var(--mainWhite);
  display: inline-block;
  padding: 0.2rem 0.4rem;
  position: absolute;
  right: 0%;
  top: 50%;
  font-size: 1.2rem;
  transform: translateX(110%);
  transition: all 1s ease-in-out;
  cursor: pointer;
}

.featured-container:hover .featured-search-icon{
  transform: translateX(0%);
}

.featured-store-link{
  background: #8bb1c7;
  color: var(--mainBlack);
  padding: 0.2rem 0.4rem;
  position: absolute;
  right: 0%;
  top: 70%;
  transform: translateX(110%);
  transition: all 1s ease-in-out;
}

.featured-store-link:hover{
  color: var(--mainBlack);
}

.featured-container:hover .featured-store-link{
  transform: translateX(0%);
}




.old-price{
  text-decoration: line-through;
}

#filler{
  background: linear-gradient(rgba(0,0,0,0.4),rgba(0,0,0,0.4)) ,url(../img/back2.jpg);
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

#filler, h1 p{
  color: #fff;
}

footer{
  background: #8bb1c7;
}

.fab{
  color: #fff;
}

.footer-last{
  background: #7195aa;
}

#fillerSecond{
  background: linear-gradient(rgba(0,0,0,0.2),rgba(0,0,0,0.2)) ,url(../img/productBack.png);
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.backContact{
  background: url(../img/view.jpg);
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
  background-repeat: no-repeat;
  width: 100%;
  height: calc(100vh - 75px);
}

