
:root{
    --main: #ecb915;
    --orange: #fd5502;
    --sky: #1bbde8;
    --dark: #11161e;
    --dark-blue: #151a32;
    --grey: #606060;
    --yellow: #ffc107;
    --white: #fff;
}

/* 1.2: common css */
/* body {
    overflow-x: hidden !important;
    width: 100%;
    max-width: 100%;
    position: relative;
  } */
* {
    margin: 0;
    padding: 0;
    font-family: 'Josefin Sans', sans-serif;
}

img {
    vertical-align: middle;
}

ol,
ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

a,
a:hover,
a:focus {
    text-decoration: none;
}

.clr {
    clear: both;
}

button:focus {
    outline: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ol,
ul,
li,
a {
    margin-top: 0;
    margin-bottom: 0;
    -webkit-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
    transition: all linear 0.3s;
}



button {
  outline: none;
  border: 0;
  cursor: pointer;
  background: transparent;
}

button:focus {
  outline: none;
}

.clearfix {
  clear: both;
  display: block;
}

input[type="number"] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
}

::-moz-selection {
  background: #ecb915;
  color: var(--white);
  text-shadow: none;
}

::selection {
  background: #ecb915;
  color: var(--white);
  text-shadow: none;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-transition: background-color 5000s ease-in-out 0s;
  transition: background-color 5000s ease-in-out 0s;
}

textarea {
  resize: none;
}
.sum {
  
    position: fixed;
    left: 15px;
    bottom: 200px;
    z-index: 9999;
}

img {
  max-width: 100%;
  height: auto;
}

a,
a:hover,
a:active,
a:focus {
  text-decoration: none;
  outline: none;
}
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}


/* 1.3: headings */
h1 {
  font-size: 65px;
  line-height: 75px;
}

h2 {
  font-size: 38px;
  line-height: 62px;
  color: #623f22;
  font-weight: 700;
}

h3 {
  font-size: 35px;
  line-height: 54px;
  color: #a9110f;
}

h4 {
  font-size: 30px;
  line-height: 46px;
}

h5 {
  font-size: 24px;
  line-height: 38px;
}

h6 {
  font-size: 20px;
  line-height: 28px;
}
p {
    font-size: 16px;
    line-height: 28px;
    color: var(--grey);
    font-weight: 400;
}

/* 1.4: padding margin */

.p-10 {
  padding: 10px 0;
}

.pt-10 {
  padding-top: 10px;
}

.pb-10 {
  padding-bottom: 10px;
}

.p-20 {
  padding: 20px 0;
}

.pt-20 {
  padding-top: 20px;
}

.pb-20 {
  padding-bottom: 20px;
}

.p-30 {
  padding: 30px 0;
}

.pt-30 {
  padding-top: 30px;
}

.pb-30 {
  padding-bottom: 30px;
}

.p-40 {
  padding: 40px 0;
}

.pt-40 {
  padding-top: 40px;
}

.pb-40 {
  padding-bottom: 40px;
}

.p-50 {
  padding: 50px 0;
}

.pt-50 {
  padding-top: 50px;
}

.pb-50 {
  padding-bottom: 50px;
}

.p-60 {
  padding: 60px 0;
}

.pt-60 {
  padding-top: 60px;
}

.pb-60 {
  padding-bottom: 60px;
}

.p-70 {
  padding: 70px 0;
}

.pt-70 {
  padding-top: 70px;
}

.pb-70 {
  padding-bottom: 70px;
}

.p-80 {
  padding: 80px 0;
}

.pt-80 {
  padding-top: 80px;
}

.pb-80 {
  padding-bottom: 80px;
}

.p-90 {
  padding: 90px 0;
}

.pt-90 {
  padding-top: 90px;
}

.pb-90 {
  padding-bottom: 90px;
}

.p-100 {
  padding: 100px 0;
}

.pt-100 {
  padding-top: 100px;
}

.pb-100 {
  padding-bottom: 100px;
}
.p-110 {
  padding: 110px 0;
}

.pt-110 {
  padding-top: 110px;
}

.pb-110 {
  padding-bottom: 110px;
}
.p-120 {
  padding: 120px 0;
}

.pt-120 {
  padding-top: 120px;
}

.pb-120 {
  padding-bottom: 120px;
}

.m-10 {
  margin: 10px 0;
}

.mt-10 {
  margin-top: 10px;
}

.mb-10 {
  margin-bottom: 10px;
}

.m-20 {
  margin: 20px 0;
}

.mt-20 {
  margin-top: 20px;
}

.mb-20 {
  margin-bottom: 20px;
}

.m-30 {
  margin: 30px 0;
}

.mt-30 {
  margin-top: 30px;
}

.mb-30 {
  margin-bottom: 30px;
}

.m-40 {
  margin: 40px 0;
}

.mt-40 {
  margin-top: 40px;
}

.mb-40 {
  margin-bottom: 40px;
}

.m-50 {
  margin: 50px 0;
}

.mt-50 {
  margin-top: 50px;
}

.mb-50 {
  margin-bottom: 50px;
}

.m-60 {
  margin: 60px 0;
}

.mt-60 {
  margin-top: 60px;
}

.mb-60 {
  margin-bottom: 60px;
}

.m-70 {
  margin: 70px 0;
}

.mt-70 {
  margin-top: 70px;
}

.mb-70 {
  margin-bottom: 70px;
}

.m-80 {
  margin: 80px 0;
}

.mt-80 {
  margin-top: 80px;
}

.mb-80 {
  margin-bottom: 80px;
}

.m-90 {
  margin: 90px 0;
}

.mt-90 {
  margin-top: 90px;
}

.mb-90 {
  margin-bottom: 90px;
}

.m-100 {
  margin: 100px 0;
}

.mt-100 {
  margin-top: 100px;
}

.mb-100 {
  margin-bottom: 100px;
}
.m-110 {
  margin: 110px 0;
}

.mt-110 {
  margin-top: 110px;
}

.mb-110 {
  margin-bottom: 110px;
}
.m-120 {
  margin: 120px 0;
}

.mt-120 {
  margin-top: 120px;
}

.mb-120 {
  margin-bottom: 120px;
}
/*===========================================================
02: preloader CSS
=============================================================*/
.preloader {
  height: 100vh;
  width: 100%;
  position: fixed;
  background: var(--white);
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999999999;
}


.preloader-orbit-loading {
  position: relative;
  top: 50%;
  left: 50%;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  -o-border-radius: 50%;
  -ms-border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  perspective: 780px;
  transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
}
.preloader-orbit-loading .cssload-inner {
  position: absolute;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  border-radius: 50%;
  -o-border-radius: 50%;
  -ms-border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
}
.preloader-orbit-loading .cssload-inner.cssload-one{
  left: 0%;
  top: 0%;
  animation: cssload-rotate-one 1.15s linear infinite;
  -o-animation: cssload-rotate-one 1.15s linear infinite;
  -ms-animation: cssload-rotate-one 1.15s linear infinite;
  -webkit-animation: cssload-rotate-one 1.15s linear infinite;
  -moz-animation: cssload-rotate-one 1.15s linear infinite;
  border-bottom: 5px solid #ecb915;
}
.preloader-orbit-loading .cssload-inner.cssload-two{
  right: 0%;
  top: 0%;
  animation: cssload-rotate-two 1.15s linear infinite;
  -o-animation: cssload-rotate-two 1.15s linear infinite;
  -ms-animation: cssload-rotate-two 1.15s linear infinite;
  -webkit-animation: cssload-rotate-two 1.15s linear infinite;
  -moz-animation: cssload-rotate-two 1.15s linear infinite;
  border-right: 5px solid #ecb915;
}
.preloader-orbit-loading .cssload-inner.cssload-three{
  right: 0%;
  bottom: 0%;
  animation: cssload-rotate-three 1.15s linear infinite;
  -o-animation: cssload-rotate-three 1.15s linear infinite;
  -ms-animation: cssload-rotate-three 1.15s linear infinite;
  -webkit-animation: cssload-rotate-three 1.15s linear infinite;
  -moz-animation: cssload-rotate-three 1.15s linear infinite;
  border-top: 5px solid #ecb915;
}
@keyframes cssload-rotate-one {
  0% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
  }

  100% {
    transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
  }
}


@-o-keyframes cssload-rotate-one {
  0% {
    -o-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
  }

  100% {
    -o-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
  }
}


@-ms-keyframes cssload-rotate-one {
  0% {
    -ms-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
  }

  100% {
    -ms-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
  }
}


@-webkit-keyframes cssload-rotate-one {
  0% {
    -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
  }

  100% {
    -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
  }
}


@-moz-keyframes cssload-rotate-one {
  0% {
    -moz-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
  }

  100% {
    -moz-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
  }
}


@keyframes cssload-rotate-two {
  0% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
  }

  100% {
    transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
  }
}


@-o-keyframes cssload-rotate-two {
  0% {
    -o-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
  }

  100% {
    -o-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
  }
}


@-ms-keyframes cssload-rotate-two {
  0% {
    -ms-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
  }

  100% {
    -ms-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
  }
}


@-webkit-keyframes cssload-rotate-two {
  0% {
    -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
  }

  100% {
    -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
  }
}


@-moz-keyframes cssload-rotate-two {
  0% {
    -moz-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
  }

  100% {
    -moz-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
  }
}


@keyframes cssload-rotate-three {
  0% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
  }

  100% {
    transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
  }
}


@-o-keyframes cssload-rotate-three {
  0% {
    -o-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
  }

  100% {
    -o-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
  }
}


@-ms-keyframes cssload-rotate-three {
  0% {
    -ms-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
  }

  100% {
    -ms-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
  }
}


@-webkit-keyframes cssload-rotate-three {
  0% {
    -webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
  }

  100% {
    -webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
  }
}


@-moz-keyframes cssload-rotate-three {
  0% {
    -moz-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
  }

  100% {
    -moz-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
  }
}
/*================================================
03: section title css style
==================================================*/
.section-title{
  text-align: center;
  padding-bottom: 40px;
}
.section-title h3{
  font-weight: 700;
  color:#aa1312;
  position: relative;
  margin-top: -10px;
  text-transform: capitalize;
}
.section-title h3:after{
  content: '';
  height: 4px;
  width: 130px;
  background: #ecb915;
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
}
.home2 .section-title h3:after{
  width: 174px;
  height: 5px;
  background: url(../images/home2/border.png) no-repeat center;
}
.home3 .section-title h3:after{
  width: 174px;
  height: 5px;
  background: url(../images/home3/border.png) no-repeat center;
}
/*================================================
04: button style css style
==================================================*/
.button-style1{
  display: inline-block;
  font-size: 18px;
  text-transform: capitalize;
  font-weight: 500;
  color: var(--white);
  background:#b22826;
  line-height: 50px;
  padding: 0 40px;
    margin-top: 10px;
  text-align: center;
  position: relative;
}
.button-style1:before{
  content: '';
  height: 100%;
  width: 100%;
  background: transparent;
  border: 2px solid rgba(194, 166, 115, 0.5);
  position: absolute;
  top: 8px;
  left: 8px;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.button-style1:hover{
  color: var(--white);
  background: #623f22;
}
.button-style1:hover:before{
  top: -8px;
  left: -8px;
  height: calc(100% + 16px);
  width: calc(100% + 16px);
}
.button-style2,
.button-style3{
  display: inline-block;
  font-size: 18px;
  text-transform: capitalize;
  font-weight: 500;
  color: var(--white);
  background: var(--orange);
  line-height: 50px;
  padding: 0 25px;
  text-align: center;
}
.button-style3{
  background: var(--sky);
}

.button-style2:hover,
.button-style3:hover{
  color: var(--white);
  background: #623f22;
}
/*================================================
05: item animation css style
==================================================*/
.item-animation {
  position: relative;
}
.item-animation:before {
  content: "";
  background: rgba(194, 166, 115, 0.6);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  right: 50%;
  opacity: 1;
  width: 0;
  z-index: 1;
}
.item-animation:after {
  content: "";
  background: rgba(194, 166, 115, 0.6);
  position: absolute;
  bottom: 50%;
  left: 0;
  right: 0;
  top: 50%;
  opacity: 1;
  width: 0;
  z-index: 1;
}
.home2 .item-animation:before,
.home2 .item-animation:after{
  background: rgba(253, 86, 2, 0.6);
}
.item-animation:hover:before {
  left: 0;
  right: 0;
  opacity: 0;
  width: auto;
  transition: all linear 1s;
  -webkit-transition: all linear 1s;
  -moz-transition: all linear 1s;
  -ms-transition: all linear 1s;
  -o-transition: all linear 1s;
}
.item-animation:hover:after {
  top: 0;
  bottom: 0;
  opacity: 0;
  width: auto;
  transition: all linear 1s;
  -webkit-transition: all linear 1s;
  -moz-transition: all linear 1s;
  -ms-transition: all linear 1s;
  -o-transition: all linear 1s;
}
.item-animation2{
  position: relative;
}
.item-animation2:before{
  transition: all .5s ease;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(51, 51, 51, 0.5);
  transform: scale(0);
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -ms-transition: all .5s ease;
  -o-transition: all .5s ease;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  z-index: 1;
}
.item-animation2:after{
  transition: all .6s ease .2s;
  content: "";
  position: absolute;
  top: 8px;
  left: 8px;
  right: 8px;
  bottom: 8px;
  border: 1px solid #aaa;
  background: rgba(0, 0, 0, 0.35);
  transform: scale(0);
  -webkit-transition: all .6s ease .2s;
  -moz-transition: all .6s ease .2s;
  -ms-transition: all .6s ease .2s;
  -o-transition: all .6s ease .2s;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  z-index: 2;
}
.item-animation2:hover:before{
transform: scale(1);
}
.item-animation2:hover:after{
transform: scale(1);
}

/*================================================
06: scroll top button css style
==================================================*/
.scroll-top{
  position: fixed;
  bottom: 50%;
  right: 30px;
  z-index: 99999;
  transition: 0.8s ease;
  -webkit-transition: 0.8s ease;
  -moz-transition: 0.8s ease;
  -ms-transition: 0.8s ease;
  -o-transition: 0.8s ease;
  opacity: 0;
  visibility: hidden;
}
.scroll-top.show{
  bottom: 40px;
  opacity: 1;
  visibility: visible;
}
.scroll-top button{
  height: 40px;
  width: 40px;
  background: #ecb915;
  position: relative;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.scroll-top button:after{
  content: '';
  height: 100%;
  width: 100%;
  border: 2px solid #ecb915;
  position: absolute;
  top: 5px;
  left: 5px;
  background: transparent;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.scroll-top button i{
  font-size: 20px;
  color: var(--white);
  line-height: 40px;
}

.scroll-top button:hover:after{
  top: -4px;
  left: -4px;
  width: calc(100% + 8px);
  height: calc(100% + 8px);
}
.home2.scroll-top button{
  background: var(--orange);
}
.home2.scroll-top button:after{
  border-color: var(--orange);
}
.home3.scroll-top button{
  background: var(--sky);
}
.home3.scroll-top button:after{
  border-color: var(--sky);
}
/*=========================================================
    07: fancybox
===========================================================*/
.window-open {
  overflow: hidden;
}

.fancybox .fancybox-bg {
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.5);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999999;
  opacity: 0;
  visibility: hidden;
  transition: 0.8s;
  -webkit-transition: 0.8s;
  -moz-transition: 0.8s;
  -ms-transition: 0.8s;
  -o-transition: 0.8s;
}
.fancybox .fancybox-content {
  height: 435px;
  width: 870px;
  background: #fff;
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 9999999;
  opacity: 0;
  visibility: hidden;
  transition: 0.6s;
  -webkit-transition: 0.6s;
  -moz-transition: 0.6s;
  -ms-transition: 0.6s;
  -o-transition: 0.6s;
  transform: translate(-50%, -50%) scale(0.6);
  -webkit-transform: translate(-50%, -50%) scale(0.6);
  -moz-transform: translate(-50%, -50%) scale(0.6);
  -ms-transform: translate(-50%, -50%) scale(0.6);
  -o-transform: translate(-50%, -50%) scale(0.6);
}
.fancybox .fancybox-content .popup-img img {
  height: 100%;
}
.fancybox .fancybox-content .popup-content {
  margin-left: -70px;
  height: 100%;
  padding: 0 45px;
}
.fancybox .fancybox-content .popup-content h2 {
  font-size: 30px;
  font-weight: 700;
  padding-top: 40px;
  line-height: 50px;
}
.fancybox .fancybox-content .popup-content h5 {
  font-size: 19px;
  font-weight: 700;
  text-transform: capitalize;
  padding-top: 10px;
  padding-bottom: 10px;
}
.fancybox .fancybox-content .popup-content form {
  padding-top: 30px;
}
.fancybox .fancybox-content .popup-content form .inputs {
  width: 300px;
  height: 54px;
  border: 1px solid #ddd;
  padding: 0 15px;
  outline: 0;
}
.fancybox .fancybox-content .popup-content form button {
  width: 130px;
  line-height: 54px;
  background: #ecb915;
  font-size: 16px;
  font-weight: 600;
  text-transform: capitalize;
  color: var(--white);
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.fancybox .fancybox-content .popup-content form button:hover{
  background: #623f22;
}
.fancybox .fancybox-content .popup-content form label {
  position: absolute;
  bottom: 20px;
  right: 30px;
  font-size: 16px;
  line-height: 28px;
  padding-left: 25px;
  color: var(--grey);
  text-transform: capitalize;
}
.fancybox .fancybox-content .popup-content form .check {
  opacity: 0;
  display: none;
}
.fancybox .fancybox-content .popup-content form .check-custom {
  position: absolute;
  top: 5px;
  left: 0;
  height: 15px;
  width: 15px;
  border: 1px solid #ddd;
  box-sizing: border-box;
  cursor: pointer;
}
.fancybox .fancybox-content .popup-content form .check-custom:after {
  content: "";
  position: absolute;
  display: none;
  left: 4px;
  top: 0px;
  width: 5px;
  height: 10px;
  border: solid var(--white);
  border-width: 0 2px 2px 0;
  cursor: pointer;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}
.fancybox .fancybox-content .popup-content form .check:checked ~ .check-custom {
  background: #ecb915;
  border-color: #ecb915;
}
.fancybox .fancybox-content .popup-content form .check:checked ~ .check-custom:after {
  display: block;
}
.fancybox .fancybox-content .close-fancy {
  position: absolute;
  top: 0;
  right: 0;
}
.fancybox .fancybox-content .close-fancy button {
  width: 40px;
  height: 40px;
  background: #ecb915;
  text-align: center;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.fancybox .fancybox-content .close-fancy button i {
  font-size: 20px;
  line-height: 40px;
  color: var(--white);
}
.fancybox .fancybox-content .close-fancy button:hover {
  background: #623f22;
}
.fancybox.window-show .fancybox-bg {
  opacity: 1;
  visibility: visible;
}
.fancybox.window-show .fancybox-content {
  transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
  -moz-transform: translate(-50%, -50%) scale(1);
  -ms-transform: translate(-50%, -50%) scale(1);
  -o-transform: translate(-50%, -50%) scale(1);
  opacity: 1;
  visibility: visible;
}

.home2.fancybox .fancybox-content .popup-content form button {
  background: var(--orange);
}
.home2.fancybox .fancybox-content .close-fancy button {
  background: var(--orange);
}
.home2.fancybox .fancybox-content .popup-content form .check:checked ~ .check-custom {
  background: var(--orange);
  border-color: var(--orange);
}
.home2.fancybox .fancybox-content .close-fancy button:hover,
.home2.fancybox .fancybox-content .popup-content form button:hover{
  background: #623f22;
}


.home3.fancybox .fancybox-content .popup-content form button {
  background: var(--sky);
}
.home3.fancybox .fancybox-content .close-fancy button {
  background: var(--sky);
}
.home3.fancybox .fancybox-content .popup-content form .check:checked ~ .check-custom {
  background: var(--sky);
  border-color: var(--sky);
}
.home3.fancybox .fancybox-content .close-fancy button:hover,
.home3.fancybox .fancybox-content .popup-content form button:hover{
  background: #623f22;
}


/*================================================
08: home 1 css style
==================================================*/
/*================================================
8.1: topbar css Style
==================================================*/
.home1.topbar{
  padding: 14px 0;
        background-color: #ecb915;
}
.home1.topbar p{
  font-size: 14px;
        color: #fff;
}

/*=========================================================
    8.2: Sticky header
===========================================================*/
.menubar.sticky {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100%;
  z-index: 999;
  animation: mymove 0.4s linear;
  -webkit-box-shadow: 0 5px 50px 0 rgba(33, 33, 33, 0.2);
  box-shadow: 0 5px 50px 0 rgba(33, 33, 33, 0.2);
  background: var(--white);
  border-bottom: 2px solid #623f22;
}

@keyframes mymove {
  0% {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
}

.menubar.sticky .menu-bg:before,
.menubar.sticky .menu-bg:after{
  display: none;
}
.home2.menubar.sticky{
  border-color: var(--orange);
}
.home3.menubar.sticky{
  border-color: var(--sky);
}
/*================================================
8.3: menubar css style
==================================================*/
.menubar{
  position: absolute;
  top: 56px;
  left: 0;
  width: 100%;
  z-index: 999;
}
.menubar .menu-bg{
  display: block;
  position: relative;
  z-index: 1;
}
.menubar .menu-bg:before{
  content: '';
  display: block;
  height: 100%;
  width: calc(100% + 100px);
  background: var(--white);
  box-shadow: 2px 0 75px rgba(0, 0, 0, 0.1);
  transform: skewX(-40deg);
  -webkit-transform: skewX(-40deg);
  -moz-transform: skewX(-40deg);
  -ms-transform: skewX(-40deg);
  -o-transform: skewX(-40deg);
  position: absolute;
  top: 0;
  left: -50px;
  z-index: -1;
}
.menubar .menu-bg:after{
  content: '';
  height: 100%;
  width: calc(100% + 100px);
  background: transparent;
/*  border: 2px solid #623f22;*/
  transform: skewX(-40deg);
  -webkit-transform: skewX(-40deg);
  -moz-transform: skewX(-40deg);
  -ms-transform: skewX(-40deg);
  -o-transform: skewX(-40deg);
  position: absolute;
  top: 8px;
  left: -42px;
  z-index: -2;
}


/* main menu */

.menubar .main-menu ul > li a {
  display: block;
  font-size: 18px;
  line-height: 30px;
  font-weight: 400;
  text-transform: capitalize;
  position: relative;
  padding: 30px 0;
  color: #ba4546;
  padding-left: 30px;
  padding-right: 30px;
}
.menubar .main-menu ul > li > a:not(:only-child):after {
  border: 7px solid transparent;
  content: "";
  top: 54%;
  left: auto;
  position: absolute;
  transform: translate(-50%, -50%);
  border-top-color: #623f22;
  right: 0;
  z-index: 9;
}
.menubar .main-menu ul > li:hover > a{
  color: #ecb915;
}
.menubar .main-menu ul > li:hover > a:not(:only-child):after{
  border-top-color: #ecb915;
}
.menubar .main-menu ul li {
  display: inline-block;
}
.menubar .main-menu ul li .submenu-list {
  position: absolute;
  top: 100%;
  z-index: 100;
  background: #fff;
  min-width: 300px;
  overflow: visible;
  box-shadow: 10px 0 90px rgba(0, 0, 0, 0.1);
  margin-top: 60px;
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
}
.menubar .main-menu ul li .submenu-list li {
  display: block;
  overflow: visible;
  position: relative;
}
.menubar .main-menu ul li .submenu-list li a {
  color: var(--dark);
  padding: 0;
     font-size: 17px;
    padding: 4px 30px;
}
.menubar .main-menu ul li .submenu-list li .menu-img img {
  position: absolute;
  top: 0;
  left: 300px;
  width: 200px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  backface-visibility: hidden;
  transition: 0.4s;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -ms-transition: 0.4s;
  -o-transition: 0.4s;
}
.menubar .main-menu ul li .submenu-list li:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 30px;
  height: 2px;
  width: 0;
  background: #ecb915;
  transition: 0.5s;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
}
.menubar .main-menu ul li .submenu-list li ul {
  position: absolute;
  top: 0;
  left: 100%;
  background: var(--white);
  box-shadow: 10px 0 90px rgba(0, 0, 0, 0.1);
  min-width: 200px;
  margin-top: 60px;
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
}
.menubar .main-menu ul li .submenu-list li ul li a {
  white-space: nowrap;
}
.menubar .main-menu ul li .submenu-list li:hover > a {
  padding-left: 40px;
  background: #f7f7f7;
}
.menubar .main-menu ul li .submenu-list li:hover > ul {
  margin-top: 0;
  opacity: 1;
  visibility: visible;
}
.menubar .main-menu ul li .submenu-list li:hover:after {
  width: 50px;
}
.menubar .main-menu ul li .submenu-list li:hover .menu-img img {
  opacity: 1;
  visibility: visible;
}
.menubar .main-menu ul li .mega-submenu {
  margin-top: 60px;
  background: var(--white);
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  z-index: 100;
  box-shadow: 10px 0 90px rgba(0, 0, 0, 0.1);
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
}
.menubar .main-menu ul li .mega-submenu .submenu-inside {
  padding: 30px 0;
}
.menubar .main-menu ul li .mega-submenu .ad-part a {
  padding: 0;
}
.menubar .main-menu ul li .mega-submenu ul li {
  display: block;
  position: relative;
}
.menubar .main-menu ul li .mega-submenu ul li a {
  display: block;
  padding: 0;
  margin: 0;
  color: var(--dark);
  font-size: 14px;
  width: 100%;
}
.menubar .main-menu ul li .mega-submenu ul li a span {
  display: block;
  color: var(--grey);
  line-height: 20px;
}
.menubar .main-menu ul li .mega-submenu ul li:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  width: 0;
  background: #ecb915;
  transition: 0.5s;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
}
.menubar .main-menu ul li .mega-submenu ul li:hover a {
  padding-left: 10px;
  background: #f7f7f7;
}
.menubar .main-menu ul li .mega-submenu ul li:hover:after {
  width: 50px;
}
.menubar .main-menu ul li .mega-submenu .big-item li {
  padding-bottom: 5px;
}
.menubar .main-menu ul li .mega-submenu h4 {
  text-transform: capitalize;
  font-weight: 700;
  padding-bottom: 10px;
  font-size: 20px;
}
.menubar .main-menu ul li:hover .mega-submenu {
  opacity: 1;
  margin-top: 0;
  visibility: visible;
}
.menubar .main-menu ul li:hover .submenu-list {
  opacity: 1;
  margin-top: 0;
  visibility: visible;
}
.menubar .main-menu ul li .submenu-list li > a:after {
  display: none;
}

/* mobile-menu */
.menubar .mobile-menu{
  display: none;
}
.menubar .header-menu{
  text-align: center;
}
.menubar .header-menu #menu-button i{
  font-size: 26px;
  color:#aa1211;
}
.home2.menubar .header-menu #menu-button i{
  color: var(--orange);
}
.home3.menubar .header-menu #menu-button i{
  color: var(--sky);
}
/* notification */

.notification ul li {
  padding-left: 20px;
}
.notification ul li a {
  display: block;
  position: relative;
}
.notification ul li i {
  font-size: 26px;
  color: var(--grey);
}
.notification ul li .quantity {
  display: inline-block;
  height: 20px;
  width: 20px;
  background: var(--dark);
  line-height: 20px;
  color: var(--white);
  text-align: center;
  font-size: 10px;
  font-weight: 400;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  position: absolute;
  top: -5px;
  right: -10px;
}
.notification .dropdown .quantity{
  background: #ecb915;
}
.notification .dropdown .dropdown-toggle:after {
  display: none;
}
.notification .dropdown .dropdown-menu {
  width: 300px;
  border: 0;
  padding: 20px;
  box-shadow: 1px 0 55px rgba(0, 0, 0, 0.1);
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
}
.notification .dropdown .dropdown-menu .heading {
  border-bottom: 1px solid #ddd;
  padding-bottom: 5px;
}
.notification .dropdown .dropdown-menu .heading h5 {
  text-transform: capitalize;
  font-weight: 700;
  color: var(--dark);
}
.notification .dropdown .dropdown-menu .heading a {
  display: inline-block;
  font-weight: 700;
  text-transform: capitalize;
  color: var(--dark);
}
.notification .dropdown .dropdown-menu .heading a:hover {
  color: #ecb915;
}
.notification .dropdown .dropdown-menu ul {
  padding-top: 10px;
}
.notification .dropdown .dropdown-menu ul li {
  padding: 0;
  padding-bottom: 10px;
}
.notification .dropdown .dropdown-menu ul li .text {
  padding-right: 40px;
}
.notification .dropdown .dropdown-menu ul li .text h5 {
  text-transform: capitalize;
  font-weight: 700;
  color: var(--dark);
  font-size: 16px;
  line-height: 20px;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.notification .dropdown .dropdown-menu ul li .text h5:hover {
  color: #ecb915;
}
.notification .dropdown .dropdown-menu ul li .text p {
  font-size: 14px;
}
.notification .dropdown .dropdown-menu ul li .text .icon {
  position: absolute;
  top: 10px;
  right: 0;
}
.notification .dropdown .dropdown-menu ul li .text .icon i {
  font-size: 16px;
  color: var(--dark);
}
.notification .dropdown .dropdown-menu ul li img {
  width: 70px;
  margin-right: 10px;
}
.notification .dropdown .dropdown-menu .total {
  border-top: 1px solid #ddd;
  padding-top: 5px;
}
.notification .dropdown .dropdown-menu .total p {
  font-size: 16px;
  font-weight: 700;
  text-transform: capitalize;
}
.notification .dropdown .dropdown-menu .check {
  padding-top: 10px;
}
/*================================================
8.4: banner css style
==================================================*/
.home1.banner{
  padding-top: 195px;
  padding-bottom: 50px;
  position: relative;
}

.home1.banner h5{
  font-size: 25px;
  font-weight: 500;
  color: #ecb915;
}
.home1.banner h1{
  font-size: 85px;
  line-height: 100px;
  font-weight: 700;
  color: var(--dark);
  padding-top: 25px;
}
.home1.banner p{
  padding-top: 5px;
  padding-bottom: 30px;
}
.home1.banner .collection{
  display: inline-block;
  font-weight: 300;
  font-size: 12px;
  line-height: 28px;
  color: var(--grey);
  text-transform: uppercase;
  letter-spacing: 3px;
  position: absolute;
  top: 50%;
  left: 100px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: vertical-rl;
}
.home1.banner .collection:before{
  content: '';
  height: 120px;
  width: 2px;
  background: #ddd;
  position: absolute;
  top: -90%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
}

/*================================================
8.5: category css style
==================================================*/
.home1.category{
  padding-bottom: 50px;
}
.home1.category .single-item{
  box-shadow: 2px 0 90px rgba(0, 0, 0, 0.15);
  position: relative;
  margin-bottom: 30px;
  overflow: hidden;
}
.home1.category .single-item img{
  width: 100%;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.home1.category .single-item:hover img{
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.home1.category .single-item .content{
  position: absolute;
  top: 30px;
  left: 30px;
  z-index: 9;
}
.home1.category .single-item h5{
  font-weight: 500;
  text-transform: uppercase;
  color: var(--dark);
}
.home1.category .single-item h5 span{
  display: block;
  font-weight: 700;
}
.home1.category .single-item a{
  display: inline-block;
  font-size: 16px;
  line-height: 32px;
  font-weight: 400;
  text-transform: uppercase;
  color: var(--dark);
  text-decoration: underline;
  margin-top: 5px;
}
.home1.category .single-item a:hover{
  color: #ecb915;
}
/*================================================
8.6: trending css style
==================================================*/
.home1.trending{
  padding-bottom: 50px;
}
.home1.trending .single{
  background: var(--white);
  box-shadow: 1px 0 72px rgba(0, 0, 0, 0.1);
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}
.home1.trending .single .offer{
  display: inline-block;
  line-height: 25px;
  font-size: 15px;
  font-weight: 400;
  color: var(--white);
  background: #ecb915;
  padding: 10px 0;
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: vertical-rl;
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  position: absolute;
  top: -55px;
  right: 15px;
  z-index: 9;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.trending .single:hover .offer{
  top: 0;
}
.home1.trending .single .image a{
  display: block;
}
.home1.trending .single .image img{
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.home1.trending .single .image .img-hover{
  
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
}
.home1.trending .single:hover .image .img-main{
  opacity: 0;
  transform: scale(0.8);
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
}
.home1.trending .single:hover .image .img-hover{
  opacity: 1;
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
}
.home1.trending .single .content{
  padding: 0 20px 20px 20px;
  position: relative;
}
.home1.trending .single .content h6{
  font-weight: 600;
  color: #623f22;
  text-transform: capitalize;
  padding-top: 15px;
}
.home1.trending .single .content h6:hover{
  color: #ecb915;
}
.home1.trending .single .content p{
  padding: 8px 0;
}
.home1.trending .single .content p span{
  text-decoration: line-through;
}
.home1.trending .single .content .rating{
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.trending .single .content ul li{
  padding-right: 10px;
}
.home1.trending .single .content ul li i{
  font-size: 14px;
  color: var(--yellow);
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.trending .single .action{
  position: absolute;
  bottom: 20px;
  left: 20px;
}
.home1.trending .single .action ul li{
  opacity: 0;
  visibility: hidden;
}
.home1.trending .single .action ul li a{
  display: inline-block;
  position: relative;
}
.home1.trending .single .action ul li a i{
  display: inline-block;
  text-align: center;
  height: 35px;
  width: 40px;
  background: #cacaca;
  position: relative;
  z-index: 5;
  font-size: 16px;
  color: var(--white);
  line-height: 35px;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}

.home1.trending .single .action ul li a .my-tooltip{
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  box-shadow: 3px 0 13px rgba(0, 0, 0, 0.12);
  font-size: 12px;
  color: var(--white);
  background: #ecb915;
  text-transform: capitalize;
  line-height: 30px;
  padding: 0 5px;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -ms-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  text-align: center;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  z-index: 1;
  opacity: 0;
  visibility: hidden;
}
.home1.trending .single .action ul li a .my-tooltip:after{
  content: '';
  height: 10px;
  width: 10px;
  position: absolute;
  bottom: -5px;
  left: 50%;
  background: #ecb915;
  transform: translateX(-50%) rotate(45deg);
  -webkit-transform: translateX(-50%) rotate(45deg);
  -moz-transform: translateX(-50%) rotate(45deg);
  -ms-transform: translateX(-50%) rotate(45deg);
  -o-transform: translateX(-50%) rotate(45deg);
}
.home1.trending .single .action ul li a:hover i{
  background: #ecb915;
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
}
.home1.trending .single .action ul li a:hover .my-tooltip{
  opacity: 1;
  visibility: visible;
}
.home1.trending .single:hover .content p{
  padding-bottom: 23px;
}
.home1.trending .single:hover .content h6{
  padding-top: 0;
}
.home1.trending .single:hover .content .rating{
  opacity: 0;
  visibility: hidden;
}
.home1.trending .single:hover .action ul li{
  opacity: 1;
  visibility: visible;
}
.home1.trending .single:hover .action ul li:nth-child(1) a{
  animation: fade-in-down 0.3s ease-in-out;
  -webkit-animation: fade-in-down 0.3s ease-in-out;
}
.home1.trending .single:hover .action ul li:nth-child(2) a{
  animation: fade-in-down 0.5s ease-in-out;
  -webkit-animation: fade-in-down 0.5s ease-in-out;
}
.home1.trending .single:hover .action ul li:nth-child(3) a{
  animation: fade-in-down 0.7s ease-in-out;
  -webkit-animation: fade-in-down 0.7s ease-in-out;
}
.home1.trending .single:hover .action ul li:nth-child(4) a{
  animation: fade-in-down 0.9s ease-in-out;
  -webkit-animation: fade-in-down 0.9s ease-in-out;
}
@keyframes fade-in-down {
  0% {
    opacity: 0;
    transform: translateY(25px);
    -webkit-transform: translateY(25px);
    -moz-transform: translateY(25px);
    -ms-transform: translateY(25px);
    -o-transform: translateY(25px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
  }
}

/*================================================
8.7: offer css style
==================================================*/
.home1.offer .bg{
  background: var(--white);
  border-radius: 25px;
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  -ms-border-radius: 25px;
  -o-border-radius: 25px;
  box-shadow: 1px 0 72px rgba(0, 0, 0, 0.1);
  padding:10px;
    text-align:left;
    margin: 26px 0;
}
.home1.offer .content h6{
  font-weight: 400;
  color: #623f22;
  padding-bottom: 5px;
}
.home1.offer .content h3{
     font-weight: 700;
    color:#aa0e0a;
    text-transform: capitalize;
    font-size: 30px;
 
}

.home1.offer .content ul li {
     margin: 5px 10px;
    position: relative;
  
    list-style: circle;
}
.home1.offer .content ul{
  margin-top: 20px;
  margin-bottom: 30px;
}

.home1.offer .content ul li h3 {
  width: 100%;
  padding-top: 5px;
  font-weight: 700;
  color: #623f22;
}
.home1.offer .content ul li span {
  display: inline-block;
  font-size: 18px;
  font-weight: 700;
  text-transform: capitalize;
  padding-bottom: 10px;
  color: var(--grey);
}
.home1.offer .content ul li:last-child {
  margin-right: 0;
}
.home1.offer .content ul li:last-child:after {
  display: none;
}
.home1.offer .image{
  position: relative;
}
.home1.offer .image a{
  display: inline-block;
  height: 85px;
  width: 85px;
  border: 2px solid var(--white);
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  padding: 10px;
  text-align: center;
}
.home1.offer .image a i{
  display: block;
  text-align: center;
  height: 100%;
  width: 100%;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background: #ecb915;
  line-height: 60px;
  font-size: 20px;
  color: var(--white);
}
/*================================================
8.8: product css style
==================================================*/
.home1.product .nav-tabs {
  border: 0;
  justify-content: center;
  margin-bottom: 45px;
}
.home1.product .nav-tabs .nav-link {
  padding: 0 25px;
  border: 0;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  font-size: 18px;
  line-height: 26px;
  text-transform: capitalize;
  color: #623f22;
  font-weight: 600;
}
.home1.product .nav-tabs .nav-link.active {
  color: #ecb915;
  text-decoration: underline;
}
.home1.product .single-item {
  overflow: hidden;
  position: relative;
  margin-bottom: 30px;
}
.home1.product .single{
  background: var(--white);
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}

.home1.product .single .image{
  background: #f5f6f8;
}
.home1.product .single .image img{
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.home1.product .single .image .img-hover{
  transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}
.home1.product .single:hover .image .img-main{
  opacity: 0;
  transform: scale(0.8);
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
}
.home1.product .single:hover .image .img-hover{
  opacity: 1;
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
}
.home1.product .single .content{
  padding: 0 20px 15px 20px;
  position: relative;
  border: 1px solid #ddd;
  border-top: 0;
}
.home1.product .single .content h6{
  font-weight: 600;
  color: #623f22;
  text-transform: capitalize;
  padding-top: 15px;
}
.home1.product .single .content h6:hover{
  color: #ecb915;
}
.home1.product .single .content p{
  padding: 8px 0;
}
.home1.product .single .content p span{
  text-decoration: line-through;
}
.home1.product .single .content .rating{
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.product .single .content ul li{
  padding-right: 10px;
}
.home1.product .single .content ul li i{
  font-size: 14px;
  color: var(--yellow);
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.product .single .image .action{
  position: absolute;
  top: 15px;
  left: 15px;
  z-index: 10;
}
.home1.product .single .image .action ul li{
  opacity: 0;
  visibility: hidden;
  padding-bottom: 10px;
}
.home1.product .single .image .action ul li a{
  display: inline-block;
  position: relative;
}
.home1.product .single .image .action ul li a i{
  display: inline-block;
  text-align: center;
  height: 35px;
  width: 40px;
  background: #cacaca;
  position: relative;
  z-index: 5;
  font-size: 16px;
  color: var(--white);
  line-height: 35px;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}

.home1.product .single .image .action ul li a .my-tooltip{
  position: absolute;
  left: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
  box-shadow: 3px 0 13px rgba(0, 0, 0, 0.12);
  font-size: 12px;
  color: var(--white);
  background: #ecb915;
  text-transform: capitalize;
  line-height: 30px;
  padding: 0 20px;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -ms-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  text-align: center;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  z-index: 1;
  opacity: 0;
  visibility: hidden;
}
.home1.product .single .image .action ul li a .my-tooltip:after{
  content: '';
  height: 10px;
  width: 10px;
  position: absolute;
  left: -5px;
  top: 50%;
  background: #ecb915;
  transform: translateY(-50%) rotate(45deg);
  -webkit-transform: translateY(-50%) rotate(45deg);
  -moz-transform: translateY(-50%) rotate(45deg);
  -ms-transform: translateY(-50%) rotate(45deg);
  -o-transform: translateY(-50%) rotate(45deg);
}
.home1.product .single .image .action ul li a:hover i{
  background: #ecb915;
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
}
.home1.product .single:hover .image .action ul li,
.home1.product .single .image .action ul li a:hover .my-tooltip{
  opacity: 1;
  visibility: visible;
}

.home1.product .single:hover .image .action ul li:nth-child(1) a{
  animation: fade-in-left 0.3s ease-in-out;
  -webkit-animation: fade-in-left 0.3s ease-in-out;
}
.home1.product .single:hover .image .action ul li:nth-child(2) a{
  animation: fade-in-left 0.5s ease-in-out;
  -webkit-animation: fade-in-left 0.5s ease-in-out;
}
.home1.product .single:hover .image .action ul li:nth-child(3) a{
  animation: fade-in-left 0.7s ease-in-out;
  -webkit-animation: fade-in-left 0.7s ease-in-out;
}
.home1.product .single:hover .image .action ul li:nth-child(4) a{
  animation: fade-in-left 0.9s ease-in-out;
  -webkit-animation: fade-in-left 0.9s ease-in-out;
}
@keyframes fade-in-left {
  0% {
    transform: translateX(-25px);
    -webkit-transform: translateX(-25px);
    -moz-transform: translateX(-25px);
    -ms-transform: translateX(-25px);
    -o-transform: translateX(-25px);
}
  100% {
    transform: translateX(0);
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
  }
}
/*================================================
8.9: order css style
==================================================*/
.home1.order .item{
  position: relative;
}
.home1.order .item img{
  width: 100%;
}
.home1.order .item .content{
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.2);
  text-align: center;
}
.home1.order .item .content:before{
  content: '';
  height: calc(100% - 100px);
  width: calc(100% - 150px);
  border-top: 1px solid var(--white);
  border-bottom: 1px solid var(--white);
  position: absolute;
  top: 50px;
  bottom: 50px;
  left: 75px;
  right: 75px;
  z-index: 5;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.order .item .content:after{
  content: '';
  height: calc(100% - 60px);
  width: calc(100% - 190px);
  border-left: 1px solid var(--white);
  border-right: 1px solid var(--white);
  position: absolute;
  top: 30px;
  bottom: 30px;
  left: 95px;
  right: 95px;
  z-index: 5;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.order .item:hover .content:before{
  height: calc(100% - 60px);
  top: 30px;
  bottom: 30px;
}
.home1.order .item:hover .content:after{
  width: calc(100% - 150px);
  left: 75px;
  right: 75px;
}
.home1.order .item .content .text{
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  z-index: 9;
}
.home1.order .item .content h6{
  font-size: 20px;
  font-weight: 400;
  text-transform: capitalize;
  color: var(--white);
}
.home1.order .item .content h4{
  font-weight: 700;
  color: var(--white);
  padding: 10px 0;
    font-size:23px;
}
.home1.order .item .content a{
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: var(--white);
  text-transform: capitalize;
  text-decoration: underline;
}
/*================================================
8.10: featured css style
==================================================*/
.home1.featured .title-area{
  padding-bottom: 200px;
}
.home1.featured .product-area{
  margin-top: -200px;
}
.home1.featured .single{
  background: var(--white);
  box-shadow: 1px 0 72px rgba(0, 0, 0, 0.1);
  position: relative;
  overflow: hidden;
   height: 520px;
        border: 5px solid #b52822;
}
.home1.featured .single .offer{
  display: inline-block;
  line-height: 25px;
  font-size: 15px;
  font-weight: 400;
  color: var(--white);
  background: #ecb915;
  padding: 10px 0;
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: vertical-rl;
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  position: absolute;
  top: -55px;
  right: 15px;
  z-index: 9;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.featured .single:hover .offer{
  top: 0;
}
.home1.featured .single .image img{
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.featured .single .image .img-hover{
  transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}
.home1.featured .single:hover .image .img-main{
  opacity: 0;
  transform: scale(0.8);
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
}
.home1.featured .single:hover .image .img-hover{
  opacity: 1;
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
}
.home1.featured .single .content{
  padding: 0 20px 20px 20px;
  position: relative;
}
.home1.featured .single .content h6{
  font-weight: 700;
  color:#a50908;
  text-transform: capitalize;
  padding-top: 15px;
}
.home1.featured .single .content h6:hover{
  color: #ecb915;
}
.home1.featured .single .content p{
  padding: 8px 0;
}
.home1.featured .single .content p span{
  text-decoration: line-through;
}
.home1.featured .single .content .rating{
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.featured .single .content ul li{
  padding-right: 10px;
}
.home1.featured .single .content ul li i{
  font-size: 14px;
  color: var(--yellow);
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.featured .single .action{
  position: absolute;
  bottom: 20px;
  left: 20px;
}
.home1.featured .single .action ul li{
  opacity: 0;
  visibility: hidden;
}
.home1.featured .single .action ul li a{
  display: inline-block;
  position: relative;
}
.home1.featured .single .action ul li a i{
  display: inline-block;
  text-align: center;
  height: 35px;
  width: 40px;
  background: #cacaca;
  position: relative;
  z-index: 5;
  font-size: 16px;
  color: var(--white);
  line-height: 35px;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}

.home1.featured .single .action ul li a .my-tooltip{
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  box-shadow: 3px 0 13px rgba(0, 0, 0, 0.12);
  font-size: 12px;
  color: var(--white);
  background: #ecb915;
  text-transform: capitalize;
  line-height: 30px;
  padding: 0 20px;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -ms-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  text-align: center;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  z-index: 1;
  opacity: 0;
  visibility: hidden;
}
.home1.featured .single .action ul li a .my-tooltip:after{
  content: '';
  height: 10px;
  width: 10px;
  position: absolute;
  bottom: -5px;
  left: 50%;
  background: #ecb915;
  transform: translateX(-50%) rotate(45deg);
  -webkit-transform: translateX(-50%) rotate(45deg);
  -moz-transform: translateX(-50%) rotate(45deg);
  -ms-transform: translateX(-50%) rotate(45deg);
  -o-transform: translateX(-50%) rotate(45deg);
}
.home1.featured .single .action ul li a:hover i{
  background: #ecb915;
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
}
.home1.featured .single .action ul li a:hover .my-tooltip{
  opacity: 1;
  visibility: visible;
}
.home1.featured .single:hover .content p{
  padding-bottom: 23px;
}
.home1.featured .single:hover .content h6{
  padding-top: 0;
}
.home1.featured .single:hover .content .rating{
  opacity: 0;
  visibility: hidden;
}
.home1.featured .single:hover .action ul li{
  opacity: 1;
  visibility: visible;
}
.home1.featured .single:hover .action ul li:nth-child(1) a{
  animation: fade-in-down 0.3s ease-in-out;
  -webkit-animation: fade-in-down 0.3s ease-in-out;
}
.home1.featured .single:hover .action ul li:nth-child(2) a{
  animation: fade-in-down 0.5s ease-in-out;
  -webkit-animation: fade-in-down 0.5s ease-in-out;
}
.home1.featured .single:hover .action ul li:nth-child(3) a{
  animation: fade-in-down 0.7s ease-in-out;
  -webkit-animation: fade-in-down 0.7s ease-in-out;
}
.home1.featured .single:hover .action ul li:nth-child(4) a{
  animation: fade-in-down 0.9s ease-in-out;
  -webkit-animation: fade-in-down 0.9s ease-in-out;
}

/*================================================
8.11: quick-view css style
==================================================*/
.home1.quick-view .single-item{
  box-shadow: 0 0 90px rgba(0, 0, 0, 0.15);
  position: relative;
  overflow: hidden;
}
.home1.quick-view .single-item img{
  width: 100%;
}
.home1.quick-view .single-item .content{
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 5;
  padding: 30px;
  
}
.home1.quick-view .single-item .content a{
  display: inline-block;
  position: absolute;
  bottom: 20px;
  left: 20px;
  z-index: 5;
  font-size: 18px;
  font-weight: 500;
  color: var(--grey);
  text-transform: capitalize;
  text-decoration: underline;
}
.home1.quick-view .single-item .content a:hover{
  color: #ecb915;
}
.home1.quick-view .single-item p{
  text-transform: capitalize;
}
.home1.quick-view .single-item h5{
  text-transform: capitalize;
  font-weight: 700;
  color: #623f22;
  padding: 5px 0;
}
.home1.quick-view .single-item .price{
  font-size: 18px;
  font-weight: 500;
}
.home1.quick-view .single-item .price span{
  font-size: 15px;
  text-decoration: line-through;
}
.home1.quick-view .title{
  padding-bottom: 35px;
}
.home1.quick-view .title h5{
  text-transform: capitalize;
  font-weight: 700;
  color: #623f22;
  position: relative;
}
.home1.quick-view .title h5:after{
  content: '';
  height: 2px;
  width: 60px;
  background: #ecb915;
  position: absolute;
  bottom: 0;
  left: 0;
}
.home1.quick-view .item{
  width: 100%;
  background: var(--white);
  box-shadow: 1px 0 72px rgba(0, 0, 0, 0.1);
  margin-bottom: 30px;
}
.home1.quick-view .item .image{
  overflow: hidden;
}
.home1.quick-view .item .image img{
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home1.quick-view .item:hover img{
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.home1.quick-view .item h6{
  font-weight: 600;
  color: #623f22;
  text-transform: capitalize;
}
.home1.quick-view .item h6:hover{
  color: #ecb915;
}
.home1.quick-view .item p span{
  text-decoration: line-through;
}
.home1.quick-view .item ul li{
  padding-right: 10px;
}
.home1.quick-view .item ul li i{
  font-size: 14px;
  color: var(--yellow);
}
/*================================================
8.12: client css style
==================================================*/
.home1.client .single{
  background: var(--white);
  box-shadow: 0 0 90px rgba(0, 0, 0, 0.1);
  padding: 50px 30px;
  border-top: 2px solid transparent;
}
.home1.client .center-item{
  border-color: #ecb915;
}
.home1.client .single h5{
  text-transform: capitalize;
  font-weight: 700;
  color: #623f22;
  padding-top: 30px;
}
.home1.client .single span{
  display: inline-block;
  text-transform: capitalize;
  font-weight: 400;
  font-size: 20px;
  line-height: 26px;
  color: var(--grey);
}
.home1.client .center-item span{
  color: #ecb915;
}
.home1.client .single p{
  padding-top: 10px;
  padding-bottom: 10px;
}
.home1.client .single ul li{
  padding: 0 5px;
}
.home1.client .single ul li i{
  font-size: 14px;
  color: var(--yellow);
}
/*================================================
8.13: blog css style
==================================================*/
.home1.blog{
  padding-bottom: 70px;
}
.home1.blog .single .image img{
  width: 100%;
}
.home1.blog .single .content{
  margin-right: 2px;
  margin-top: -2px;
  background: var(--white);
  padding: 1px 19px 0px 20px;
  position: relative;
  z-index: 4;
}
.home1.blog .single .content p{
  text-transform: capitalize;
}
.home1.blog .single .content h6{
      font-weight: 600;
    color: #6e482b;
    padding-top: 8px;
    padding-bottom: -2px;
}
.home1.blog .single .content p:hover,
.home1.blog .single .content h6:hover{
  color: #ecb915;
}
/*================================================
8.14: overview css style
==================================================*/
.home1.overview .bg{
  border: 2px solid #ac1614;
  padding: 14px;
  background: transparent;
}
.home1.overview .bg .bg-inner{
  background: var(--white);
  padding: 40px 0;
  box-shadow: 2px 0 90px rgba(0, 0, 0, 0.15);
}
.home1.overview .item{
  position: relative;
  padding: 15px 0;
}
.home1.overview .item .icon{
  margin-right: 20px;
}
.home1.overview .item .icon i{
  font-size: 50px;
  color:#a50808;
}
.home1.overview .item h5{
  font-size: 22px;
  font-weight: 700;
  color: #623f22;
  text-transform: capitalize;
}
.home1.overview .item h6{
  font-weight: 500;
  color: var(--grey);
  font-size: 18px;    
}
.home1.overview .item:after{
  content: '';
  height: 100%;
  width: 4px;
  background: #623f22;
  position: absolute;
  top: 0;
  right: 0;
}
.home1.overview .last-item:after{
  display: none;
}

/*================================================
8.15: footer css style
==================================================*/
.footer{
     background: #222736;
    padding-top: 119px;
    margin-top: -95px;
}
/*================================================
8.15.1: footer-top css style
==================================================*/
.footer-top .title{
  padding-bottom: 45px;
}
.footer-top .title h5{
  text-transform: capitalize;
  color: var(--white);
  font-weight: 700;
  position: relative;
}
.footer-top .title h5:after{
  content: '';
  background: var(--white);
  height: 2px;
  width: 60px;
  position: absolute;
  bottom: -10px;
  left: 0;
}
.footer-top p{
  color: var(--white);
  font-size: 15px;
    line-height: 22px;
    text-align: justify;
}
.footer-top .follow{
  padding-top: 20px;
}
.footer-top .follow h6{
  color: var(--white);
  font-weight: 500;
  text-transform: capitalize;
}
.footer-top .follow ul li{
  padding-right: 17px;
}
.footer-top .follow ul li a i{
  color: var(--white);
  font-size: 14px;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.footer-top .follow ul li a:hover i{
  color: #ecb915;
}
.footer-top ul li a{
  font-weight: 400;
  font-size: 16px;
  line-height: 30px;
  text-transform: capitalize;
  color: var(--white);
}
.footer-top ul li a:hover{
  color: #ecb915;
}
.footer-top .address li:not(:last-child){
  padding-bottom: 10px;
}
.footer-top .address li .icon{
  margin-right: 20px;
}
.footer-top .address li i{
  font-size: 24px;
  color:#a90e0d;
}
.footer-top .address li h6{
  font-weight: 700;
  text-transform: capitalize;
  color: var(--white);
}
/*================================================
8.15.2: footer-bottom css style
==================================================*/

.footer-bottom .border-area{
  border-top: 1px solid rgba(255, 255, 255, 0.35);
  padding: 10px 0;
}
.footer-bottom p{
  color: var(--white);
    text-align: center;
}
.footer-bottom p a{
    color: #ecb915;
}
.footer-bottom ul li{
  padding-left: 10px;
}
/*================================================
8.16: quick-view-modal css style
==================================================*/
.quick-view-modal .modal-dialog {
  max-width: 950px;
}
.quick-view-modal .modal-header{
  border-bottom: 0;
}
.quick-view-modal .image-area img{
  width: 100%;
}
.quick-view-modal .image-area .product-gallery{
  margin-bottom: 20px;
}


.quick-view-modal .image-area .product-thumb .swiper-slide-active{
  border: 1px solid #ecb915;
}


.quick-view-modal .detail-content .stock {
  font-size: 18px;
  color: #623f22;
  display: inline-block;
  text-transform: capitalize;
  margin-bottom: 10px;
}
.quick-view-modal .detail-content .stock  span{
  color: #ecb915;
}
.quick-view-modal .detail-content h5 {
  font-weight: 700;
  text-transform: capitalize;
}
.quick-view-modal .detail-content h5 span {
  text-decoration: line-through;
}
.quick-view-modal .detail-content .review-area {
  padding: 10px 0;
}
.quick-view-modal .detail-content .review-area .rating li {
  padding-right: 10px;
}
.quick-view-modal .detail-content .review-area .rating li i {
  font-size: 16px;
  color: #ffc107;
}
.quick-view-modal .detail-content .review-area p {
  padding-left: 5px;
}
.quick-view-modal .detail-content p {
  text-transform: capitalize;
}
.quick-view-modal .detail-content .desc {
  padding: 10px 0;
  text-transform: none;
}
.quick-view-modal .detail-content .desc-list {
  padding-left: 20px;
}
.quick-view-modal .detail-content .desc-list li {
  list-style: square;
}
.quick-view-modal .detail-content .color-pallate {
  padding-top: 10px;
}
.quick-view-modal .detail-content .color-pallate p,
.quick-view-modal .detail-content .category p {
  font-weight: 600;
  color: #623f22;
}
.quick-view-modal .detail-content .category p a{
  font-size: 16px;
  line-height: 24px;
  text-transform: capitalize;
  color: var(--grey);
  font-weight: 400;
}
.quick-view-modal .detail-content .category p a:hover{
  color: #ecb915;
}
.quick-view-modal .detail-content .color-pallate ul li {
  padding-left: 10px;
}
.quick-view-modal .detail-content .color-pallate ul li a {
  display: inline-block;
  height: 20px;
  width: 20px;
}
.quick-view-modal .detail-content .color-pallate ul li .blue {
  background: #5ba7e8;
}
.quick-view-modal .detail-content .color-pallate ul li .red {
  background: #e8785b;
}
.quick-view-modal .detail-content .color-pallate ul li .pink {
  background: #e85bc5;
}

.quick-view-modal .border-area {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding-top: 20px;
  padding-bottom: 15px;
  margin-top: 30px;
  margin-bottom: 20px;
}
.quick-view-modal .border-area .number-spinner{
  width: 160px;
  height: 55px;
  border: 1px solid #ddd;
}
.quick-view-modal .border-area .number-spinner button {
  height: 100%;
  width: 30%;
  display: block;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  
}

.quick-view-modal .border-area .number-spinner button i {
  color: var(--grey);
  font-size: 18px;
  line-height: 55px;
}

.quick-view-modal .border-area .number-spinner .input-value {
  height: 100%;
  width: 40%;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  color: #ecb915;
  font-size: 30px;
  font-weight: 400;
  border: 0;
  outline: none;
  padding: 0;
}
.quick-view-modal .border-area .cart{
  display: inline-block;
  font-size: 18px;
  line-height: 55px;
  font-weight: 500;
  text-transform: capitalize;
  padding: 0 60px;
  background: #ecb915;
  color: var(--white);
  margin-left: 10px;
}
.quick-view-modal .border-area .cart:hover{
  background: #623f22;
}
.quick-view-modal .border-area .add-more a {
  display: inline-block;
  height: 55px;
  width: 55px;
  text-align: center;
  border: 1px solid #ecb915;
  margin-left: 10px;
}
.quick-view-modal .border-area .add-more a i {
  color: #ecb915;
  line-height: 55px;
  font-size: 24px;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.quick-view-modal .border-area .add-more a:hover {
  background: #ecb915;
}
.quick-view-modal .border-area .add-more a:hover i {
  color: var(--white);
}

.quick-view-modal .share h5{
  font-size: 22px;
}
.quick-view-modal .share ul li {
  padding-left: 10px;
}
.quick-view-modal .share ul li a{
  display: inline-block;
  height: 36px;
  width: 36px;
  background: #ddd;
  text-align: center;
}
.quick-view-modal .share ul li a i {
  font-size: 18px;
  line-height: 36px;
  color: #623f22;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.quick-view-modal .share ul li a:hover{
  background: #ecb915;
}
.quick-view-modal .share ul li a:hover i {
  color: var(--white);
}
/*================================================
09: home 2 css style
==================================================*/
/*================================================
9.1: topbar css Style
==================================================*/
.home2.topbar{
  padding: 14px 0;
  background: #fdf4ef;
}
.home2.topbar p{
  font-size: 14px;
}

.home2.topbar ul > li{
  padding-left: 45px;
}
.home2.topbar ul > li:first-child{
  margin-left: 0;
}
.home2.topbar ul li p i{
  padding-right: 10px;
}
.home2.topbar ul li ul li{
  padding-left: 20px;
}
.home2.topbar .notification .dropdown .dropdown-menu .heading a:hover,
.home2.topbar .notification .dropdown .dropdown-menu ul li .text h5:hover {
  color: var(--orange);
}
.home2 .notification .dropdown .quantity{
  background: var(--orange);
}

/*================================================
9.2: menubar css Style
==================================================*/ 
.home2.menubar .main-menu ul > li.logo a{
  padding-top: 0;
  padding-bottom: 0;
}
.home2.menubar .menu-bg:after {
  border-color: var(--orange);
}
.home2.menubar .main-menu ul li .mega-submenu ul li::after ,
.home2.menubar .main-menu ul li .submenu-list li::after {
  background: var(--orange);
}
.home2.menubar .main-menu ul > li:hover > a{
  color: var(--orange);
}
.home2.menubar .main-menu ul > li:hover > a:not(:only-child):after{
  border-top-color: var(--orange);
}
/*================================================
9.3: banner css Style
==================================================*/ 
.home2.banner{
  padding-top: 250px;
  padding-bottom: 145px;
}
.home2.banner h6{
  font-weight: 500;
  color: var(--grey);
  padding-left: 30px;
  text-transform: capitalize;
  position: relative;
}
.home2.banner h6:before{
  content: '';
  height: 15px;
  width: 15px;
  background: var(--dark);
  transform: skewX(-5deg);
  -webkit-transform: skewX(-5deg);
  -moz-transform: skewX(-5deg);
  -ms-transform: skewX(-5deg);
  -o-transform: skewX(-5deg);
  position: absolute;
  top: 0;
  left: 0;
}
.home2.banner h6:after{
  content: '';
  height: 15px;
  width: 15px;
  background: var(--orange);
  transform: skewX(-5deg);
  -webkit-transform: skewX(-5deg);
  -moz-transform: skewX(-5deg);
  -ms-transform: skewX(-5deg);
  -o-transform: skewX(-5deg);
  position: absolute;
  top: 4px;
  left: 5px;
}
.home2.banner h1{
  font-weight: 700;
  color: var(--dark);
  text-transform: capitalize;
  padding-top: 20px;
}
.home2.banner p{
  position: relative;
  padding-left: 15px;
  margin-top: 10px;
  margin-bottom: 40px;
}
.home2.banner p:before{
  content: '';
  height: 100%;
  width: 2px;
  background: var(--orange);
  position: absolute;
  top: 0;
  left: 0;
}

.home2.banner a i{
  padding-left: 10px;
}
/*================================================
9.4: category css Style
==================================================*/ 
.home2.category .single-item{
  position: relative;
  margin-bottom: 30px;
}
.home2.category .single-item img{
  width: 100%;
}
.home2.category .single-item .content{
  position: absolute;
  top: 0;
  left: 0;
  padding: 40px;
  z-index: 9;
}
.home2.category .single-item h6{
  font-size: 20px;
  font-weight: 500;
  color: var(--grey);
  text-transform: capitalize;
}
.home2.category .single-item h5{
  font-weight: 600;
  color: #623f22;
  text-transform: capitalize;
  width: 68%;
  padding-top: 5px;
  padding-bottom: 20px;
}
.home2.category .single-item a{
  display: flex;
  align-items: center;
  font-size: 16px;
  font-weight: 400;
  text-transform: capitalize;
  color: var(--grey);
}
.home2.category .single-item a i{
  color: var(--orange);
  padding-left: 10px;
}
.home2.category .single-item a:hover{
  color: var(--orange);
}
/*================================================
9.5: product css Style
==================================================*/ 
.home2.product .nav-tabs {
  border: 0;
  justify-content: center;
  margin-bottom: 45px;
}
.home2.product .nav-tabs .nav-link {
  padding: 0 25px;
  border: 0;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  font-size: 18px;
  line-height: 26px;
  text-transform: capitalize;
  color: #623f22;
  font-weight: 600;
}
.home2.product .nav-tabs .nav-link.active {
  color: var(--orange);
}

.home2.product .single{
  background: var(--white);
  box-shadow: 1px 0 72px rgba(0, 0, 0, 0.1);
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}
.home2.product .single .offer{
  display: inline-block;
  line-height: 25px;
  font-size: 15px;
  font-weight: 400;
  color: var(--white);
  background: var(--orange);
  padding: 10px 0;
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: vertical-rl;
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  position: absolute;
  top: -55px;
  right: 15px;
  z-index: 9;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home2.product .single:hover .offer{
  top: 0;
}

.home2.product .single .image img{
  width: 100%;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.home2.product .single .image .img-hover{
  transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}
.home2.product .single:hover .image .img-main{
  opacity: 0;
  transform: scale(0.8);
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
}
.home2.product .single:hover .image .img-hover{
  opacity: 1;
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
}
.home2.product .single .content{
  padding-top: 15px;
}
.home2.product .single .content p{
  text-transform: capitalize;
}
.home2.product .single .content p span{
  text-decoration: line-through;
}
.home2.product .single .content h6{
  font-weight: 700;
  color: #623f22;
  text-transform: capitalize;
}
.home2.product .single .action{
  width: 100%;
  position: absolute;
  bottom: -100px;
  left: 0;
  z-index: 5;
  background: var(--white);
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home2.product .single .action ul li{
  padding: 0 20px;
}

.home2.product .single .action ul li a{
  display: inline-block;
  position: relative;
}
.home2.product .single .action ul li a i{
  display: inline-block;
  line-height: 50px;
  text-align: center;
  position: relative;
  z-index: 5;
  font-size: 20px;
  color: var(--grey);
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}

.home2.product .single .action ul li a .my-tooltip{
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  box-shadow: 3px 0 13px rgba(0, 0, 0, 0.12);
  font-size: 12px;
  color: var(--white);
  background: var(--orange);
  text-transform: capitalize;
  line-height: 30px;
  padding: 0 20px;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -ms-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  text-align: center;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  z-index: 1;
  opacity: 0;
  visibility: hidden;
}
.home2.product .single .action ul li a .my-tooltip:after{
  content: '';
  height: 10px;
  width: 10px;
  position: absolute;
  bottom: -5px;
  left: 50%;
  background: var(--orange);
  transform: translateX(-50%) rotate(45deg);
  -webkit-transform: translateX(-50%) rotate(45deg);
  -moz-transform: translateX(-50%) rotate(45deg);
  -ms-transform: translateX(-50%) rotate(45deg);
  -o-transform: translateX(-50%) rotate(45deg);
}
.home2.product .single .action ul li a:hover i{
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
}
.home2.product .single .action ul li a:hover .my-tooltip{
  opacity: 1;
  visibility: visible;
}

.home2.product .single .action .add-cart{
  display: inline-block;
  width: 100%;
  line-height: 42px;
  background: var(--orange);
  color: var(--white);
  text-transform: uppercase;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
}
.home2.product .single .action .add-cart i{
  padding-right: 10px;
  font-size: 20px;
}

.home2.product .single:hover .action {
  bottom: 0;
}
/*================================================
9.6: deal css Style
==================================================*/ 
.home2.deal{
  padding: 75px 0;
}
.home2.deal .content ul li {
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  width: 105px;
  margin: 0 22px;
  position: relative;
  box-shadow: 0 0 59px rgba(0, 0, 0, 0.19);
  background: var(--white);
}
.home2.deal .content ul{
  margin-bottom: 40px;
}
.home2.deal .content ul li:after {
  content: ':';
  height: 25px;
  width: 12px;
  position: absolute;
  top: 18%;
  right: -30px;
  font-size: 35px;
  font-weight: 700;
}
.home2.deal .content ul li h3 {
  width: 100%;
  font-weight: 700;
  color: #623f22;
  padding-top: 5px;
}
.home2.deal .content ul li span {
  display: inline-block;
  font-size: 18px;
  font-weight: 700;
  text-transform: capitalize;
  padding-bottom: 10px;
  color: var(--grey);
}
.home2.deal .content ul li:last-child {
  margin-right: 0;
}
.home2.deal .content ul li:last-child:after {
  display: none;
}
/*================================================
9.7: trending css Style
==================================================*/ 
.home2.trending .single-item{
  box-shadow: 1px 0 72px rgba(0, 0, 0, 0.1);
  position: relative;
}
.home2.trending .single-item img{
  width: 100%;
}
.home2.trending .single-item .content{
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  padding: 30px;
}
.home2.trending .single-item h4{
  font-weight: 700;
  color: #623f22;
  width: 70%;
  padding-bottom: 10px;
}
.home2.trending .single-item h4:hover,
.home2.trending .single-item p span{
  color: var(--orange);
}
.home2.trending .single-item h6{
  font-weight: 400;
  color: var(--grey);
  position: absolute;
  bottom: 30px;
  left: 30px;
}
.home2.trending .single-item h6 span{
  font-size: 15px;
}

.home2.trending .single{
  background: var(--white);
  box-shadow: 1px 0 72px rgba(0, 0, 0, 0.1);
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}
.home2.trending .single .offer{
  display: inline-block;
  line-height: 25px;
  font-size: 15px;
  font-weight: 400;
  color: var(--white);
  background: var(--orange);
  padding: 10px 0;
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: vertical-rl;
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  position: absolute;
  top: -55px;
  right: 15px;
  z-index: 9;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home2.trending .single:hover .offer{
  top: 0;
}
.home2.trending .single .image{
  border: 1px solid #ddd;
  overflow: hidden;
}
.home2.trending .single .image img{
  width: 100%;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.home2.trending .single:hover .image img{
  transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
}

.home2.trending .single .content{
  padding-top: 15px;
}
.home2.trending .single .content p{
  text-transform: capitalize;
}
.home2.trending .single .content p span{
  text-decoration: line-through;
}
.home2.trending .single .content h6{
  font-weight: 700;
  color: #623f22;
  text-transform: capitalize;
}
.home2.trending .single .action{
  width: 100%;
  position: absolute;
  bottom: -92px;
  left: 0;
  z-index: 5;
  background: var(--white);
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home2.trending .single .action ul li{
  padding: 0 20px;
}

.home2.trending .single .action ul li a{
  display: inline-block;
  position: relative;
}
.home2.trending .single .action ul li a i{
  display: inline-block;
  line-height: 50px;
  text-align: center;
  position: relative;
  z-index: 5;
  font-size: 20px;
  color: var(--grey);
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}

.home2.trending .single .action ul li a .my-tooltip{
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  box-shadow: 3px 0 13px rgba(0, 0, 0, 0.12);
  font-size: 12px;
  color: var(--white);
  background: var(--orange);
  text-transform: capitalize;
  line-height: 30px;
  padding: 0 20px;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -ms-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  text-align: center;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  z-index: 1;
  opacity: 0;
  visibility: hidden;
}
.home2.trending .single .action ul li a .my-tooltip:after{
  content: '';
  height: 10px;
  width: 10px;
  position: absolute;
  bottom: -5px;
  left: 50%;
  background: var(--orange);
  transform: translateX(-50%) rotate(45deg);
  -webkit-transform: translateX(-50%) rotate(45deg);
  -moz-transform: translateX(-50%) rotate(45deg);
  -ms-transform: translateX(-50%) rotate(45deg);
  -o-transform: translateX(-50%) rotate(45deg);
}
.home2.trending .single .action ul li a:hover i{
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
}
.home2.trending .single .action ul li a:hover .my-tooltip{
  opacity: 1;
  visibility: visible;
}

.home2.trending .single .action .add-cart{
  display: inline-block;
  width: 100%;
  line-height: 42px;
  background: var(--orange);
  color: var(--white);
  text-transform: uppercase;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
}
.home2.trending .single .action .add-cart i{
  padding-right: 10px;
}

.home2.trending .single:hover .action {
  bottom: 0;
}

/*================================================
9.8: video css Style
==================================================*/ 
.home2.video .content{
  padding: 60px 50px;
}
.home2.video .content h6{
  font-size: 20px;
  font-weight: 600;
  color: var(--dark);
  text-transform: capitalize;
}
.home2.video .content h2{
  font-weight: 600;
  color: var(--dark);
  text-transform: capitalize;
  padding-top: 10px;
  padding-bottom: 15px;
}
.home2.video .vid-area{
  position: relative;
}
.home2.video .vid-area a{
  display: inline-block;
  height: 65px;
  width: 65px;
  border: 2px solid var(--orange);
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  padding: 10px;
  text-align: center;
}
.home2.video .vid-area a i{
  display: block;
  text-align: center;
  height: 100%;
  width: 100%;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background: var(--orange);
  line-height: 40px;
  font-size: 18px;
  color: var(--white);
}
/*================================================
9.9: quick-view css Style
==================================================*/ 
.home2.quick-view img{
  width: 100%;
}
.home2.quick-view .big-item{
  position: relative;
}
.home2.quick-view .content{
  background: rgba(0, 0, 0, 0.4);
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.home2.quick-view .content .text{
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
}
.home2.quick-view .content h5{
  font-size: 25px;
  color: var(--white);
  font-weight: 600;
  text-transform: capitalize;
  white-space: nowrap;
}
.home2.quick-view .content h5:hover{
  color: var(--orange);
}
.home2.quick-view .content h2{
  color: var(--white);
  font-weight: 600;
  text-transform: capitalize;
  white-space: nowrap;
}

.home2.quick-view .title{
  padding-bottom: 25px;
}
.home2.quick-view .title h5{
  text-transform: capitalize;
  font-weight: 700;
  color: #623f22;
  position: relative;
}
.home2.quick-view .title h5:after{
  content: '';
  height: 2px;
  width: 60px;
  background: var(--orange);
  position: absolute;
  bottom: 0;
  left: 0;
}
.home2.quick-view .item{
  width: 100%;
  background: var(--white);
  box-shadow: 1px 0 72px rgba(0, 0, 0, 0.1);
  margin-bottom: 30px;
}
.home2.quick-view .item .image{
  overflow: hidden;
  border: 1px solid #ddd;
  margin-right: 25px;
}
.home2.quick-view .item .image img{
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home2.quick-view .item:hover img{
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.home2.quick-view .item h6{
  font-weight: 600;
  color: #623f22;
  text-transform: capitalize;
}
.home2.quick-view .item h6:hover{
  color: var(--orange);
}
.home2.quick-view .item p span{
  text-decoration: line-through;
}
.home2.quick-view .item ul li{
  padding-right: 10px;
}
.home2.quick-view .item ul li i{
  font-size: 14px;
  color: var(--yellow);
}
/*================================================
9.10: client css Style
==================================================*/
.home2.client .center-item {
  border-color: var(--orange);
} 
.home2.client .center-item span {
  color: var(--orange);
}
/*================================================
9.11: blog css Style
==================================================*/
.home2.blog{
  padding-bottom: 60px;
}
.home2.blog .single .content p:hover,
.home2.blog .single .content h6:hover{
  color: var(--orange);
}
/*================================================
9.12: overview css Style
==================================================*/
.home2.overview .bg {
  border-color: var(--orange);
}
.home2.overview .item .icon i {
  color: var(--orange);
}
/*================================================
9.13: footer css Style
==================================================*/ 
.home2.footer .footer-top .follow ul li a:hover i ,
.home2.footer .footer-top ul li a:hover {
  color: var(--orange);
}

/*================================================
10: home 3 css style
==================================================*/
/*================================================
10.1: menubar css style
==================================================*/
.home3.menubar{
  top: 0;
}
.home3.menubar .menu-bg:after,
.home3.menubar .menu-bg:before{
  display: none;
}
.home3 .notification .dropdown .quantity{
  background: var(--sky);
}


.home3.menubar .menu-bg:after {
  border-color: var(--sky);
}
.home3.menubar .main-menu ul li .mega-submenu ul li::after ,
.home3.menubar .main-menu ul li .submenu-list li::after {
  background: var(--sky);
}
.home3.menubar .main-menu ul > li:hover > a{
  color: var(--sky);
}
.home3.menubar .main-menu ul > li:hover > a:not(:only-child):after{
  border-top-color: var(--sky);
}
.home3.menubar .notification .dropdown .dropdown-menu .heading a:hover,
.home3.menubar .notification .dropdown .dropdown-menu ul li .text h5:hover {
  color: var(--sky);
}
.home3.menubar .notification .dropdown .quantity{
  background: var(--sky);
}
/*================================================
10.2: banner css style
==================================================*/
.home3.banner{
  background: #f2fdff;
  padding-top: 300px;
  padding-bottom: 270px;
}

.home3.banner h6::after,
.home3.banner p::before {
  background: var(--sky);
}
.home3.banner .text-part{
  position: relative;
  z-index: 4;
}
.home3.banner .image{
  position: absolute;
  bottom: -260px;
  right: 0;
}

/*================================================
10.3: category css style
==================================================*/
.home3.category{
  margin-top: -120px;
}
.home3.category .bg{
  background: var(--white);
  box-shadow: 2px 0 56px rgba(0, 0, 0, 0.1);
  padding: 40px 100px 65px 100px;
}
.home3.category .item h6{
  font-weight: 500;
  color: var(--dark);
  text-transform: capitalize;
}
.home3.category .item h6:hover{
  color: var(--sky);
}
.home3.category .buttons button{
  height: 40px;
  width: 40px;
  border: 1px solid var(--sky);
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background: transparent;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  z-index: 9;
}
.home3.category .buttons button i{
  font-size: 18px;
  line-height: 40px;
  color: var(--sky);
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home3.category .buttons button:hover{
  background: var(--sky);
}
.home3.category .buttons button:hover i{
  color: var(--white);
}
.home3.category .buttons .btn-prev{
  left: 40px;
}
.home3.category .buttons .btn-next{
  right: 40px;
}
/*================================================
10.4: product css Style
==================================================*/
.home3.product .nav-tabs {
  border: 0;
  justify-content: center;
  margin-bottom: 45px;
}
.home3.product .nav-tabs .nav-link {
  padding: 0 25px;
  border: 0;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  font-size: 18px;
  line-height: 26px;
  text-transform: capitalize;
  color: #623f22;
  font-weight: 600;
}
.home3.product .nav-tabs .nav-link.active {
  color: var(--sky);
}
.home3.product .single{
  background: var(--white);
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}
.home3.product .single .offer{
  display: inline-block;
  line-height: 25px;
  font-size: 15px;
  font-weight: 400;
  color: var(--white);
  background: var(--sky);
  padding: 0 10px;
  border-bottom-right-radius: 12px;
  border-top-right-radius: 12px;
  position: absolute;
  left: -55px;
  top: 20px;
  z-index: 9;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home3.product .single:hover .offer{
  left: 0;
}
.home3.product .single .image{
  background: #f5f5f5;
}
.home3.product .single .image img{
  width: 100%;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.home3.product .single .image .img-hover{
  transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}

.home3.product .single:hover .image .img-main{
  opacity: 0;
  transform: scale(0.8);
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
}
.home3.product .single:hover .image .img-hover{
  opacity: 1;
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
}
.home3.product .single .content h6{
  padding-top: 15px;
  font-weight: 600;
  text-transform: capitalize;
  color: var(--dark);
}
.home3.product .single .content h6:hover{
  color: var(--sky);
}
.home3.product .single .content p{
  padding-bottom: 10px;
}
.home3.product .single .content p span{
  text-decoration: line-through;
}
.home3.product .single .content ul li{
  padding-right: 10px;
}
.home3.product .single .content ul li:first-child{
  padding-right: 20px;
}
.home3.product .single .content ul li:last-child{
  padding-right: 0;
}
.home3.product .single .content ul li a{
  display: inline-block;
  position: relative;
}
.home3.product .single .content ul li a i{
  display: inline-block;
  height: 45px;
  width: 45px;
  border: 1px solid #ddd;
  text-align: center;
  font-size: 16px;
  color: var(--grey);
  line-height: 45px;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home3.product .single .content ul li .add-cart{
  width: auto;
  padding: 0 20px;
  border: 0;
  line-height: 45px;
  background: var(--sky);
  font-size: 16px;
  font-weight: 500;
  color: var(--white);
  text-transform: capitalize;
}
.home3.product .single .content ul li .add-cart i{
  color: var(--white);
  padding-right: 10px;
  width: auto;
  height: auto;
  border: none;
  line-height: 1;
}

.home3.product .single .content ul li a .my-tooltip{
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  box-shadow: 3px 0 13px rgba(0, 0, 0, 0.12);
  font-size: 12px;
  color: var(--white);
  background: var(--sky);
  text-transform: capitalize;
  line-height: 30px;
  padding: 0 5px;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -ms-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  text-align: center;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  z-index: 1;
  opacity: 0;
  visibility: hidden;
}
.home3.product .single .content ul li a .my-tooltip:after{
  content: '';
  height: 10px;
  width: 10px;
  position: absolute;
  bottom: -5px;
  left: 50%;
  background: var(--sky);
  transform: translateX(-50%) rotate(45deg);
  -webkit-transform: translateX(-50%) rotate(45deg);
  -moz-transform: translateX(-50%) rotate(45deg);
  -ms-transform: translateX(-50%) rotate(45deg);
  -o-transform: translateX(-50%) rotate(45deg);
}
.home3.product .single .content ul li a:hover i{
  background: var(--sky);
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  color: var(--white);
  border-color: var(--sky);
}
.home3.product .single .content ul li a:hover .my-tooltip{
  opacity: 1;
  visibility: visible;
}
.home3.product .single .content ul li .add-cart:hover{
  background: #623f22;
}
.home3.product .single .content ul li .add-cart:hover i{
  background: transparent;
  transform: rotate(0);
  -webkit-transform: rotate(0);
  -moz-transform: rotate(0);
  -ms-transform: rotate(0);
  -o-transform: rotate(0);
}
/*================================================
10.5: video css Style
==================================================*/
.home3.video .content{
  padding: 80px;
}
.home3.video .content h6,
.home3.video .content h3,
.home3.video .content h5{
  text-transform: capitalize;
  font-weight: 700;
  color: var(--blue);
}
.home3.video .content h3{
  padding: 5px 0;
}
.home3.video .content a{
  display: inline-block;
  font-size: 18px;
  text-transform: capitalize;
  font-weight: 600;
  color: #623f22;
  text-decoration: underline;
  margin-top: 15px;
}
.home3.video .content a:hover{
  color: var(--sky);
}
.home3.video .vid-area{
  position: relative;
}
.home3.video .vid-area a{
  display: inline-block;
  height: 65px;
  width: 65px;
  border: 2px solid var(--sky);
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  padding: 10px;
  text-align: center;
}
.home3.video .vid-area a i{
  display: block;
  text-align: center;
  height: 100%;
  width: 100%;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background: var(--sky);
  line-height: 40px;
  font-size: 18px;
  color: var(--white);
}
/*================================================
10.6: deal css Style
==================================================*/
.home3.deal{
  padding-bottom: 65px;
}
.home3.deal .single-item{
  background: var(--white);
  box-shadow: 1px 0 72px rgba(0, 0, 0, 0.1);
  padding: 40px;
}
.home3.deal .single-item h4{
  font-weight: 700;
  color: #623f22;
}
.home3.deal .single-item p span{
  color: var(--sky);
}
.home3.deal .single-item img{
  padding-top: 15px;
  padding-bottom: 15px;
}
.home3.deal .single-item ul li {
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  margin: 0 22px;
  position: relative;
}
.home3.deal .single-item ul{
  margin-bottom: 40px;
}
.home3.deal .single-item ul li:after {
  content: ':';
  height: 25px;
  width: 12px;
  position: absolute;
  top: 18%;
  right: -30px;
  font-size: 35px;
  font-weight: 700;
}
.home3.deal .single-item ul li h3 {
  width: 100%;
  font-weight: 700;
  color: #623f22;
  padding-top: 5px;
}
.home3.deal .single-item ul li span {
  display: inline-block;
  font-size: 18px;
  font-weight: 700;
  text-transform: capitalize;
  padding-bottom: 10px;
  color: var(--grey);
}
.home3.deal .single-item ul li:last-child {
  margin-right: 0;
}
.home3.deal .single-item ul li:last-child:after {
  display: none;
}


.home3.deal .single{
  background: var(--white);
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}
.home3.deal .single .offer{
  display: inline-block;
  line-height: 25px;
  font-size: 15px;
  font-weight: 400;
  color: var(--white);
  background: var(--sky);
  padding: 0 10px;
  border-bottom-right-radius: 12px;
  border-top-right-radius: 12px;
  position: absolute;
  left: -55px;
  top: 20px;
  z-index: 9;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home3.deal .single:hover .offer{
  left: 0;
}
.home3.deal .single .image{
  background: #f5f5f5;
}
.home3.deal .single .image img{
  width: 100%;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.home3.deal .single .image .img-hover{
  transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
}

.home3.deal .single:hover .image .img-main{
  opacity: 0;
  transform: scale(0.8);
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
}
.home3.deal .single:hover .image .img-hover{
  opacity: 1;
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
}
.home3.deal .single .content{
  text-align: center;
}
.home3.deal .single .content h6{
  padding-top: 15px;
  font-weight: 600;
  text-transform: capitalize;
  color: var(--dark);
}
.home3.deal .single .content h6:hover{
  color: var(--sky);
}
.home3.deal .single .content p{
  padding-bottom: 10px;
}
.home3.deal .single .content p span{
  text-decoration: line-through;
}
.home3.deal .single .content ul li{
  padding-right: 10px;
}

.home3.deal .single .content ul li:last-child{
  padding-right: 0;
}
.home3.deal .single .content ul li a{
  display: inline-block;
  position: relative;
}
.home3.deal .single .content ul li a i{
  display: inline-block;
  height: 45px;
  width: 45px;
  border: 1px solid #ddd;
  text-align: center;
  font-size: 16px;
  color: var(--grey);
  line-height: 45px;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home3.deal .single .content ul li .add-cart{
  width: auto;
  padding: 0 20px;
  border: 0;
  line-height: 45px;
  background: var(--sky);
  font-size: 16px;
  font-weight: 500;
  color: var(--white);
  text-transform: capitalize;
}
.home3.deal .single .content ul li .add-cart i{
  color: var(--white);
  padding-right: 10px;
  width: auto;
  height: auto;
  border: none;
  line-height: 1;
}

.home3.deal .single .content ul li a .my-tooltip{
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  box-shadow: 3px 0 13px rgba(0, 0, 0, 0.12);
  font-size: 12px;
  color: var(--white);
  background: var(--sky);
  text-transform: capitalize;
  line-height: 30px;
  padding: 0 5px;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -ms-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  text-align: center;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  z-index: 1;
  opacity: 0;
  visibility: hidden;
}
.home3.deal .single .content ul li a .my-tooltip:after{
  content: '';
  height: 10px;
  width: 10px;
  position: absolute;
  bottom: -5px;
  left: 50%;
  background: var(--sky);
  transform: translateX(-50%) rotate(45deg);
  -webkit-transform: translateX(-50%) rotate(45deg);
  -moz-transform: translateX(-50%) rotate(45deg);
  -ms-transform: translateX(-50%) rotate(45deg);
  -o-transform: translateX(-50%) rotate(45deg);
}
.home3.deal .single .content ul li a:hover i{
  background: var(--sky);
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  color: var(--white);
  border-color: var(--sky);
}
.home3.deal .single .content ul li a:hover .my-tooltip{
  opacity: 1;
  visibility: visible;
}
.home3.deal .single .content ul li .add-cart:hover{
  background: #623f22;
}
.home3.deal .single .content ul li .add-cart:hover i{
  background: transparent;
  transform: rotate(0);
  -webkit-transform: rotate(0);
  -moz-transform: rotate(0);
  -ms-transform: rotate(0);
  -o-transform: rotate(0);
}
/*================================================
10.7: newsletter css Style
==================================================*/
.home3.newsletter{
  padding: 70px 0;
}
.home3.newsletter .content h2{
  font-size: 40px;
  font-weight: 700;
  color: #623f22;
}
.home3.newsletter form{
  background: var(--white);
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  padding: 6px;
}
.home3.newsletter form .inputs{
  height: 54px;
  width: calc(100% - 145px);
  background: transparent;
  padding: 0 15px;
  outline: none;
  border: 0;
}
.home3.newsletter form .inputs::placeholder{
  text-transform: capitalize;
  font-size: 16px;
  font-weight: 400;
  color: var(--grey);
}
.home3.newsletter form button{
  line-height: 54px;
  font-size: 19px;
  font-weight: 600;
  color: var(--white);
  text-transform: capitalize;
  background: var(--sky);
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  padding: 0 30px;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.home3.newsletter form button:hover{
  background: #623f22;
}
/*================================================
10.8: quick-view css Style
==================================================*/
.home3.quick-view .title h5::after {
  background: var(--sky);
}
.home3.quick-view .content h5:hover,
.home3.quick-view .item h6:hover {
  color: var(--sky);
}


/*================================================
10.9: client css Style
==================================================*/
.home3.client .center-item {
  border-color: var(--sky);
} 
.home3.client .center-item span {
  color: var(--sky);
}
/*================================================
10.10: blog css Style
==================================================*/
.home3.blog{
  padding-bottom: 60px;
}
.home3.blog .single .content p:hover,
.home3.blog .single .content h6:hover{
  color: var(--sky);
}
/*================================================
10.11: overview css Style
==================================================*/
.home3.overview .bg {
  border-color: var(--sky);
}
.home3.overview .item .icon i {
  color: var(--sky);
}
/*================================================
10.12: footer css Style
==================================================*/ 
.home3.footer .footer-top .follow ul li a:hover i ,
.home3.footer .footer-top ul li a:hover {
  color: var(--sky);
}

/*================================================
11: inner-page css Style
==================================================*/ 
/*================================================
11.1: menubar css Style
==================================================*/ 
.inner-page.menubar{
  top: 0;
}
/*================================================
11.2: banner css Style
==================================================*/
.inner-page.banner{
  padding-top: 220px;
  padding-bottom: 130px;
}
.inner-page.banner h2{
  font-size: 40px;
  font-weight: 700;
  text-transform: capitalize;
  color: #fff;
}
.inner-page.banner .breadcrumb-item a,
.inner-page.banner .breadcrumb-item.active{
  font-size: 18px;
  line-height: 28px;
  font-weight: 700;
  color: #fff;
  text-transform: capitalize;
}
.inner-page.banner .breadcrumb-item a:hover{
  color: #ecb915;
}
.breadcrumb-item + .breadcrumb-item::before {
  color: #623f22;
}
/*================================================
12: about page css Style
==================================================*/ 
/*================================================
12.1: about css Style
==================================================*/ 
.about-page.about{
  padding-bottom: 130px;
}
.about-page.about .image{
  position: relative;
}
.about-page.about .image .img2{
  border: 10px solid var(--white);
  box-shadow: 12px 0 56px rgba(0, 0, 0, 0.2);
  position: absolute;
  top: 110px;
  left: 160px;
  z-index: 4;
}
.about-page.about .content h2{
  font-size: 40px;
  font-weight: 700;
  color: #623f22;
  padding-bottom: 10px;
  padding-right: 100px;
}
.about-page.about .content h6{
  font-weight: 700;
  color: #623f22;
  text-transform: capitalize;
  padding-top: 20px;
  padding-bottom: 5px;
}
.about-page.about .content .text p{
  width: 63%;
}
.about-page.about .content a{
  margin-top: 30px;
}
/*================================================
12.2: offer css Style
==================================================*/ 
.about-page.offer{
  padding-top: 75px;
  padding-bottom: 90px;
}
.about-page.offer .content h4,
.about-page.offer .content h6{
  font-weight: 700;
  color: #623f22;
}
.about-page.offer .content a{
  margin-top: 25px;
}
/*===========================================================
12.3: team
=============================================================*/

.about-page.team .single {
  box-shadow: 0 0 90px rgba(0, 0, 0, 0.15);
  background: var(--white);
}
.about-page.team .single .image-area {
  position: relative;
}
.about-page.team .single .image-area img {
  width: 100%;
}
.about-page.team .single .image-area ul {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
}
.about-page.team .single .image-area ul li {
  padding: 0 5px;
}
.about-page.team .single .image-area ul li a {
  display: inline-block;
  text-align: center;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background: var(--white);
  transform: scale(0);
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  opacity: 0;
}
.about-page.team .single .image-area ul li a i {
  font-size: 20px;
  line-height: 40px;
  color: #ecb915;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.about-page.team .single .image-area ul li a:hover {
  background: #ecb915;
}
.about-page.team .single .image-area ul li a:hover i {
  color: var(--white);
}
.about-page.team .single .bottom-area {
  padding-top: 15px;
  padding-bottom: 15px;
}
.about-page.team .single .bottom-area h5 {
  font-size: 22px;
  font-weight: 600;
  color: #623f22;
  text-transform: capitalize;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.about-page.team .single .bottom-area h5:hover {
  color: #ecb915;
}
.about-page.team .single .bottom-area p {
  text-transform: capitalize;
}
.about-page.team .single:hover .image-area ul li a {
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  opacity: 1;
}
/*===========================================================
12.4: client
=============================================================*/
.about-page.client{
  background: #fff9ed;
}
.about-page.client .single{
  border: 0;
}
.about-page.client .single span{
  color: #ecb915;
}
/*===========================================================
 13: account page
=============================================================*/
.account-page.account .item {
  background: var(--white);
  box-shadow: 2px 0 95px rgba(0, 0, 0, 0.15);
  padding: 25px 30px;
}
.account-page.account .item h5 {
  font-weight: 700;
  text-align: left;
  padding-bottom: 5px;
}
.account-page.account .item p {
  text-align: left;
}
.account-page.account .item form {
  padding-top: 25px;
}
.account-page.account .item form .inputs {
  width: 100%;
  height: 55px;
  outline: none;
  border: 1px solid #ddd;
  padding: 0 15px;
  margin-bottom: 18px;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}
.account-page.account .item form .inputs::placeholder {
  text-transform: capitalize;
  color: var(--grey);
  font-size: 16px;
  font-weight: 400;
}
.account-page.account .item form .inputs:hover,
.account-page.account .item form .inputs:focus{
  border-color: #ecb915;
}
.account-page.account .item form label {
  position: relative;
  font-size: 16px;
  line-height: 28px;
  color: var(--grey);
  padding-left: 35px;
  text-transform: capitalize;
}
.account-page.account .item form .check {
  opacity: 0;
  display: none;
}
.account-page.account .item form .check-custom {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  border: 1px solid #ddd;
  box-sizing: border-box;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  cursor: pointer;
}
.account-page.account .item form .check-custom:after {
  content: "";
  position: absolute;
  display: none;
  left: 9px;
  top: 3px;
  width: 6px;
  height: 13px;
  border: solid var(--white);
  border-width: 0 2px 2px 0;
  cursor: pointer;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}
.account-page.account .item form .check:checked ~ .check-custom {
  background: #ecb915;
  border-color: #ecb915;
}
.account-page.account .item form .check:checked ~ .check-custom:after {
  display: block;
}
.account-page.account .item form a p {
  color: #e72f07;
  text-transform: capitalize;
}
.account-page.account .item form button {
  width: 100%;
  font-size: 16px;
  line-height: 55px;
  color: var(--white);
  background: #ecb915;
  text-transform: capitalize;
  margin-top: 20px;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.account-page.account .item form button:hover{
  background: #623f22;
}
.account-page.account .item .or {
  display: block;
  font-size: 16px;
  text-transform: uppercase;
  position: relative;
  margin-top: 15px;
  margin-bottom: 15px;
}
.account-page.account .item .or:after, .account-page.account .item .or:before {
  content: '';
  height: 1px;
  width: 47%;
  background: #ddd;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
.account-page.account .item .or:before {
  left: auto;
  right: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
.account-page.account .item ul li {
  width: 33.33%;
}
.account-page.account .item ul li a {
  width: 100%;
  display: inline-block;
  text-align: center;
  text-transform: capitalize;
  color: var(--white);
  font-size: 16px;
  line-height: 42px;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}
.account-page.account .item ul li .fb {
  background: #3b5998;
}
.account-page.account .item ul li .gl {
  background: #d85040;
}
.account-page.account .item ul li .tw {
  background: #007bff;
}
.account-page.account .item ul li:not(:last-child) {
  padding-right: 15px;
}
.account-page.account .item h6 {
  font-weight: 500;
  padding-top: 15px;
}
.account-page.account .signin form label {
  text-transform: none;
}
.account-page.account .signin form button {
  margin-top: 0;
  margin-bottom: 10px;
}

/*================================================
14: shop page css Style
==================================================*/ 
.shop-page{
  padding-top: 70px;
}
.shop-page .title{
  padding-bottom: 20px;
}
.shop-page .title p{
  font-size: 18px;
}
.shop-page .select{
  width: 120px;
}
.shop-page .select2-container--default 
.select2-selection--single {
  background-color: transparent;
  border: 0;
  border-radius: 0;
  outline: none;
}
.shop-page .select2-selection--single 
.select2-selection__rendered {
  color: var(--grey) !important;
  text-transform: capitalize;
  text-align: right;
  font-size: 18px;
  font-weight: 400;
}
.shop-page .select2-container--default 
.select2-selection--single .select2-selection__arrow b {
  border-color: var(--grey) transparent transparent transparent;
  border-width: 8px 7px 0 7px;
}
.shop-page .select2-container--default.select2-container--open 
.select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--grey) transparent;
  border-width: 0 7px 8px 7px;
}
/*===========================================================
 14.1: pagination
=============================================================*/
.pages ul li {
  padding: 0 5px;
}
.pages ul li a {
  display: inline-block;
  height: 40px;
  width: 40px;
  border: 1px solid #ddd;
  background: #fff;
  font-size: 15px;
  line-height: 40px;
  text-align: center;
  color: #623f22;
  font-weight: 500;
}
.pages ul li a:hover, .pages ul li a.active {
  background: #ecb915;
  color: var(--white);
  border-color: #ecb915;
}
.pages ul li a i {
  font-size: 14px;
}
/*===========================================================
 14.2: shop page sidebar CSS
=============================================================*/
.shop-page .sidebar .title {
  padding-bottom: 20px;
}
.shop-page .sidebar .title h5 {
  font-size: 22px;
  font-weight: 700;
  color: #623f22;
  text-transform: capitalize;
  border-bottom: 1px solid #ddd;
  position: relative;
  padding-bottom: 5px;
}
.shop-page .sidebar .title h5:after{
  content: '';
  height: 3px;
  width: 80px;
  background: #ecb915;
  position: absolute;
  bottom: -1px;
  left: 0;
  z-index: 4;
}
.shop-page .sidebar .section {
  margin-bottom: 40px;
  background: var(--white);
}
.shop-page .sidebar .section:last-child {
  margin-bottom: 0;
}
.shop-page .sidebar .search form {
  position: relative;
}

/* search */
.shop-page .sidebar .search form .inputs {
  height: 50px;
  width: 100%;
  border: 1px solid #ddd;
  outline: none;
  padding: 0 30px 0 15px;
}
.shop-page .sidebar .search form .inputs::placeholder {
  text-transform: capitalize;
  font-size: 16px;
  color: var(--grey);
  font-weight: 400;
}
.shop-page .sidebar .search form button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  right: 10px;
  z-index: 9;
}
.shop-page .sidebar .search form button i {
  color: #623f22;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.shop-page .sidebar .search form button:hover i {
  color: #ecb915;
}

/* price filter */
.shop-page .sidebar .price-filter-range .price-range {
  margin-top: 15px;
}
.shop-page .sidebar .price-filter-range input,
.shop-page .sidebar .price-filter-range p {
  width: auto;
  height: auto;
  border: none;
  background-color: transparent;
  font-size: 16px;
  font-weight: 400;
  color: var(--grey);
  text-transform: capitalize;
  outline: none;
}
.shop-page .sidebar .price-filter-range .ui-slider-handle {
  height: 12px;
  width: 12px;
  border-radius: 50%;
  background-color: #ecb915;
  border: none;
  cursor: pointer;
  outline: none;
}
.shop-page .sidebar .price-filter-range .ui-widget.ui-widget-content {
  border: none;
  height: 3px;
  background-color: #ddd;
  position: relative;
  margin-left: 10px;
}
.shop-page .sidebar .price-filter-range .ui-slider-horizontal .ui-slider-range {
  background: #ecb915;
}
.shop-page .sidebar .price-filter-range button {
  font-size: 16px;
  text-transform: capitalize;
  background: #623f22;
  padding: 0 18px;
  line-height: 30px;
  color: var(--white);
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  float: right;
}
.shop-page .sidebar .price-filter-range button:hover {
  background: #ecb915;
}

/* category */
.shop-page .sidebar .category ul li {
  padding: 5px 0 5px 30px;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  position: relative;
}
.shop-page .sidebar .category ul li:before{
  content: '';
  position: absolute;
  top: 10px;
  left: 0;
  height: 15px;
  width: 15px;
  border: 2px solid #ecb915;
  background: transparent;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}

.shop-page .sidebar .category ul li p {
  font-weight: 600;
  text-transform: capitalize;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.shop-page .sidebar .category ul li.active, 
.shop-page .sidebar .category ul li:hover {
  border-color: #ecb915;
}
.shop-page .sidebar .category ul li.active:before, 
.shop-page .sidebar .category ul li:hover:before {
  background: #ecb915;
}
.shop-page .sidebar .category ul li.active p, 
.shop-page .sidebar .category ul li:hover p {
  color: #ecb915;
}

/* color */
.shop-page .sidebar .color ul li {
  padding: 5px 0 5px 30px;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  position: relative;
}
.shop-page .sidebar .color ul li:before{
  content: '';
  position: absolute;
  top: 10px;
  left: 0;
  height: 15px;
  width: 15px;
  background: transparent;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.shop-page .sidebar .color ul .blue:before{
  background: #1e4ff3;
}
.shop-page .sidebar .color ul .brown:before{
  background: #944605;
}
.shop-page .sidebar .color ul .green:before{
  background: #045e01;
}
.shop-page .sidebar .color ul .grey:before{
  background: #777b7c;
}
.shop-page .sidebar .color ul .indigo:before{
  background: #630850;
}
.shop-page .sidebar .color ul li p {
  font-weight: 600;
  text-transform: capitalize;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}

/* small item */
.shop-page .sidebar .small-item .item {
  margin-bottom: 20px;
}
.shop-page .sidebar .small-item .item .image {
  margin-right: 15px;
}
.shop-page .sidebar .small-item .item .image img{
  width: 100%;
}
.shop-page .sidebar .small-item .item .item-body {
  flex: 1;
}
.shop-page .sidebar .small-item .item h6 {
  color: #623f22;
  font-weight: 600;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  text-transform: capitalize;
}
.shop-page .sidebar .small-item .item h6:hover {
  color: #ecb915;
}
.shop-page .sidebar .small-item .item p span {
  text-decoration: line-through;
}
.shop-page .sidebar .small-item .item:last-child {
  margin-bottom: 0;
}
.shop-page .sidebar .tags .title {
  padding-bottom: 10px;
}
.shop-page .sidebar .tags .all-tag a {
  display: inline-block;
  line-height: 35px;
  padding: 0 10px;
  border: 1px solid #ddd;
  margin-right: 10px;
  margin-top: 10px;
  text-transform: capitalize;
}
.shop-page .sidebar .tags .all-tag a:hover {
  background: #ecb915;
  color: var(--white);
  border-color: #ecb915;
}

.shop-page .pages{
  margin-top: 10px;
}
/*===========================================================
 14.3: shop list CSS
=============================================================*/
.shop-list-page{
  padding: 80px 0;
}


/* product list */
.shop-page .shop-list .product-list .item{
  margin-bottom: 30px;
}
.shop-page .shop-list .product-list li .image{
  background: #e9e9e9;
  margin-right: 30px;
  position: relative;
}
.shop-page .shop-list .product-list li .image img{
  width: 100%;
}
.shop-page .shop-list .product-list li .text{
  flex: 1;
}
.shop-page .shop-list .product-list li h6{
  text-transform: capitalize;
  font-weight: 700;
  color: #623f22;
}
.shop-page .shop-list .product-list li h6:hover{
  color: #ecb915;
}
.shop-page .shop-list .product-list li p span{
  text-decoration: line-through;
}
.shop-page .shop-list .product-list li .desc{
  padding-right: 105px;
}
.shop-page .shop-list .product-list li .rating{
  padding-bottom: 10px;
}
.shop-page .shop-list .product-list li .rating li{
  padding-right: 10px;
}
.shop-page .shop-list .product-list li .rating li i{
  font-size: 14px;
  color: var(--yellow);
}
.shop-page .shop-list .product-list li .add-cart{
  display: inline-block;
  line-height: 40px;
  padding: 0 20px;
  background: #623f22;
  color: var(--white);
  text-transform: capitalize;
  font-size: 16px;
  font-weight: 500;
  margin-top: 20px;
}
.shop-page .shop-list .product-list li .add-cart:hover{
  background: #ecb915;
}

.shop-page .shop-list .product-list li .image .action{
  position: absolute;
  top: 15px;
  left: 15px;
  z-index: 10;
}
.shop-page .shop-list .product-list li .image .action ul li{
  opacity: 0;
  visibility: hidden;
  padding-bottom: 10px;
}
.shop-page .shop-list .product-list li .image .action ul li a{
  display: inline-block;
  position: relative;
}
.shop-page .shop-list .product-list li .image .action ul li a i{
  display: inline-block;
  text-align: center;
  height: 35px;
  width: 40px;
  background: #cacaca;
  position: relative;
  z-index: 5;
  font-size: 16px;
  color: var(--white);
  line-height: 35px;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}

.shop-page .shop-list .product-list li .image .action ul li a .my-tooltip{
  position: absolute;
  left: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
  box-shadow: 3px 0 13px rgba(0, 0, 0, 0.12);
  font-size: 12px;
  color: var(--white);
  background: #ecb915;
  text-transform: capitalize;
  line-height: 30px;
  padding: 0 20px;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -ms-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  text-align: center;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  z-index: 1;
  opacity: 0;
  visibility: hidden;
}
.shop-page .shop-list .product-list li .image .action ul li a .my-tooltip:after{
  content: '';
  height: 10px;
  width: 10px;
  position: absolute;
  left: -5px;
  top: 50%;
  background: #ecb915;
  transform: translateY(-50%) rotate(45deg);
  -webkit-transform: translateY(-50%) rotate(45deg);
  -moz-transform: translateY(-50%) rotate(45deg);
  -ms-transform: translateY(-50%) rotate(45deg);
  -o-transform: translateY(-50%) rotate(45deg);
}
.shop-page .shop-list .product-list li .image .action ul li a:hover i{
  background: #ecb915;
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
}
.shop-page .shop-list .product-list li:hover .image .action ul li,
.shop-page .shop-list .product-list li .image .action ul li a:hover .my-tooltip{
  opacity: 1;
  visibility: visible;
}

.shop-page .shop-list .product-list li:hover .image .action ul li:nth-child(1) a{
  animation: fade-in-left 0.3s ease-in-out;
  -webkit-animation: fade-in-left 0.3s ease-in-out;
}
.shop-page .shop-list .product-list li:hover .image .action ul li:nth-child(2) a{
  animation: fade-in-left 0.5s ease-in-out;
  -webkit-animation: fade-in-left 0.5s ease-in-out;
}
.shop-page .shop-list .product-list li:hover .image .action ul li:nth-child(3) a{
  animation: fade-in-left 0.7s ease-in-out;
  -webkit-animation: fade-in-left 0.7s ease-in-out;
}
.shop-page .shop-list .product-list li:hover .image .action ul li:nth-child(4) a{
  animation: fade-in-left 0.9s ease-in-out;
  -webkit-animation: fade-in-left 0.9s ease-in-out;
}
.shop-page .shop-list .pages{
  margin-top: 10px;
}

/* product list reverse */
.shop-page .shop-list .list-reverse li .image{
  margin-right: 0;
  margin-left: 30px;
}


/*===========================================================
 15: shop details page css
=============================================================*/
.shop-page.shop-detail{
  padding-top: 80px;
}
.shop-page.shop-detail .image-area{
  position: relative;
}
.shop-page.shop-detail .image-area img{
  width: 100%;
}

.shop-page.shop-detail .image-area .product-gallery{
  margin-bottom: 20px;
}
.shop-page.shop-detail .image-area .product-gallery-tab .item a,
.shop-page.shop-detail .image-area .product-gallery .item a{
  display: inline-block;
  height: 40px;
  width: 40px;
  background: var(--white);
  position: absolute;
  top: 15px;
  left: 20px;
  z-index: 9;
  text-align: center;
}
.shop-page.shop-detail .image-area .product-gallery-tab .item a{
  left: auto;
  right: 20px;
}
.shop-page.shop-detail .image-area .product-gallery-tab .item a i,
.shop-page.shop-detail .image-area .product-gallery .item a i{
  line-height: 40px;
  color: #ecb915;
}
.shop-page.shop-detail .image-area .product-thumb{
  margin: 0 40px;
}
.shop-page.shop-detail .image-area .product-thumb-tab{
  position: absolute;
  top: 50%;
  left: 0;
  height: 350px;
  width: 100px;
  z-index: 199;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
.shop-page.shop-detail .image-area .product-thumb-tab .swiper-slide-active,
.shop-page.shop-detail .image-area .product-thumb .active{
  border: 1px solid #ecb915;
}
.shop-page.shop-detail .image-area .product-thumb-tab .item img{
  height: 100%;
}

.shop-page.shop-detail .detail-content .stock {
  font-size: 18px;
  color: #623f22;
  display: inline-block;
  text-transform: capitalize;
  margin-bottom: 10px;
}
.shop-page.shop-detail .detail-content .stock  span{
  color: #ecb915;
}
.shop-page.shop-detail .detail-content h5 {
  font-weight: 700;
  text-transform: capitalize;
}
.shop-page.shop-detail .detail-content h5 span {
  text-decoration: line-through;
}
.shop-page.shop-detail .detail-content .review-area {
  padding: 10px 0;
}
.shop-page.shop-detail .detail-content .review-area .rating li {
  padding-right: 10px;
}
.shop-page.shop-detail .detail-content .review-area .rating li i {
  font-size: 16px;
  color: #ffc107;
}
.shop-page.shop-detail .detail-content .review-area p {
  padding-left: 5px;
}
.shop-page.shop-detail .detail-content p {
  text-transform: capitalize;
}
.shop-page.shop-detail .detail-content .desc {
  padding: 10px 0;
  width: 72%;
  text-transform: none;
}
.shop-page.shop-detail .detail-content .desc-list {
  padding-left: 20px;
}
.shop-page.shop-detail .detail-content .desc-list li {
  list-style: square;
}
.shop-page.shop-detail .detail-content .color-pallate {
  padding-top: 10px;
}
.shop-page.shop-detail .detail-content .color-pallate p,
.shop-page.shop-detail .detail-content .category p {
  font-weight: 600;
  color: #623f22;
}
.shop-page.shop-detail .detail-content .category p a{
  font-size: 16px;
  line-height: 24px;
  text-transform: capitalize;
  color: var(--grey);
  font-weight: 400;
}
.shop-page.shop-detail .detail-content .category p a:hover{
  color: #ecb915;
}
.shop-page.shop-detail .detail-content .color-pallate ul li {
  padding-left: 10px;
}
.shop-page.shop-detail .detail-content .color-pallate ul li a {
  display: inline-block;
  height: 20px;
  width: 20px;
}
.shop-page.shop-detail .detail-content .color-pallate ul li .blue {
  background: #5ba7e8;
}
.shop-page.shop-detail .detail-content .color-pallate ul li .red {
  background: #e8785b;
}
.shop-page.shop-detail .detail-content .color-pallate ul li .pink {
  background: #e85bc5;
}

.shop-page.shop-detail .border-area {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding-top: 20px;
  padding-bottom: 15px;
  margin-top: 30px;
  margin-bottom: 20px;
}
.shop-page.shop-detail .border-area .number-spinner{
  width: 160px;
  height: 55px;
  border: 1px solid #ddd;
}
.shop-page.shop-detail .border-area .number-spinner button {
  height: 100%;
  width: 30%;
  display: block;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  
}

.shop-page.shop-detail .border-area .number-spinner button i {
  color: var(--grey);
  font-size: 18px;
  line-height: 55px;
}

.shop-page.shop-detail .border-area .number-spinner .input-value {
  height: 100%;
  width: 40%;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  color: #ecb915;
  font-size: 30px;
  font-weight: 400;
  border: 0;
  outline: none;
  padding: 0;
}
.shop-page.shop-detail .border-area .cart{
  display: inline-block;
  font-size: 18px;
  line-height: 55px;
  font-weight: 500;
  text-transform: capitalize;
  padding: 0 70px;
  background: #ecb915;
  color: var(--white);
  margin-left: 10px;
}
.shop-page.shop-detail .border-area .cart:hover{
  background: #623f22;
}
.shop-page.shop-detail .border-area .add-more a {
  display: inline-block;
  height: 55px;
  width: 55px;
  text-align: center;
  border: 1px solid #ecb915;
  margin-left: 10px;
}
.shop-page.shop-detail .border-area .add-more a i {
  color: #ecb915;
  line-height: 55px;
  font-size: 24px;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.shop-page.shop-detail .border-area .add-more a:hover {
  background: #ecb915;
}
.shop-page.shop-detail .border-area .add-more a:hover i {
  color: var(--white);
}

.shop-page.shop-detail .share h5{
  font-size: 22px;
  color: #ecb915;    
}
.shop-page.shop-detail .share ul li {
  padding-left: 10px;
}
.shop-page.shop-detail .share ul li a{
  display: inline-block;
  height: 36px;
  width: 36px;
  background: #ddd;
  text-align: center;
}
.shop-page.shop-detail .share ul li a i {
  font-size: 18px;
  line-height: 36px;
  color: #623f22;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.shop-page.shop-detail .share ul li a:hover{
  background: #ecb915;
}
.shop-page.shop-detail .share ul li a:hover i {
  color: var(--white);
}
.zoomContainer {
  z-index: 101;
}
/*===========================================================
 15.1: review CSS
=============================================================*/
.shop-page.shop-review{
  padding-bottom: 70px;
}
.shop-page.shop-review .nav-tabs {
  border-bottom: 2px solid #ddd;
  justify-content: center;
  margin-bottom: 25px;
}
.shop-page.shop-review .nav-tabs .nav-link {
  padding: 0 25px;
  border: 0;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  font-size: 24px;
  font-weight: 700;
  background: transparent;
  text-transform: capitalize;
}
.shop-page.shop-review .nav-tabs .nav-link.active {
  color: #ecb915;
}
.shop-page.shop-review .tab-content .product-detail {
  padding: 25px 0;
}
.shop-page.shop-review .tab-content .description p{
  padding-bottom: 20px;
}
.shop-page.shop-review .tab-content .comment li:not(:last-child) {
  margin-bottom: 30px;
}
.shop-page.shop-review .tab-content .comment .item .image {
  padding-right: 20px;
}
.shop-page.shop-review .tab-content .comment .item .image img {
  width: 100%;
}
.shop-page.shop-review .tab-content .comment .item .media-body {
  flex: 1;
}
.shop-page.shop-review .tab-content .comment .item .rating li {
  padding-right: 10px;
  margin-bottom: 0;
}
.shop-page.shop-review .tab-content .comment .item .rating li i {
  font-size: 15px;
  color: #ffc107;
}
.shop-page.shop-review .tab-content .comment .item .rating li:last-child i {
  color: #ddd;
}
.shop-page.shop-review .tab-content .comment .item h6 {
  font-weight: 700;
  color: #623f22;
  text-transform: capitalize;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.shop-page.shop-review .tab-content .comment .item h6:hover {
  color: #ecb915;
}
.shop-page.shop-review .tab-content .comment .item p {
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.shop-page.shop-review .tab-content .comment .item a:hover p {
  color: #ecb915;
}
.shop-page.shop-review .tab-content .add-review h6 {
  text-transform: capitalize;
  font-weight: 700;
  color: #623f22;
}
.shop-page.shop-review .tab-content .add-review .rating-stars p {
  text-transform: capitalize;
  color: #ecb915;
  padding-right: 10px;
}
.shop-page.shop-review .tab-content .add-review .rating-stars ul {
  list-style-type: none;
  padding: 0;
  -moz-user-select: none;
  -webkit-user-select: none;
}
.shop-page.shop-review .tab-content .add-review .rating-stars ul > li.star {
  display: inline-block;
}
.shop-page.shop-review .tab-content .add-review .rating-stars ul > li.star > i {
  font-size: 15px;
  color: #ddd;
  cursor: pointer;
}
.shop-page.shop-review .tab-content .add-review .rating-stars ul > li.star.selected > i {
  color: #ffc107;
}
.shop-page.shop-review .tab-content .add-review form {
  padding-top: 25px;
}
.shop-page.shop-review .tab-content .add-review form .inputs {
  width: 100%;
  height: 40px;
  background: transparent;
  border: 1px solid #ddd;
  padding: 0 12px;
  outline: none;
  margin-bottom: 15px;
}
.shop-page.shop-review .tab-content .add-review form .inputs:focus, 
.shop-page.shop-review .tab-content .add-review form .inputs:hover {
  border-color: #ecb915;
}
.shop-page.shop-review .tab-content .add-review form .inputs::placeholder {
  text-transform: capitalize;
}
.shop-page.shop-review .tab-content .add-review form textarea.inputs {
  height: 200px;
  resize: vertical;
  padding: 15px 12px;
  resize: none;
}
.shop-page.shop-review .tab-content .add-review form button {
  width: 100%;
  line-height: 45px;
  margin-top: 5px;
  font-size: 22px;
  font-weight: 500;
  text-transform: capitalize;
  color: var(--white);
  background: #ecb915;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.shop-page.shop-review .tab-content .add-review form button:hover{
  background: #623f22;
}



/*===========================================================
 16: cart page CSS
=============================================================*/
/*===========================================================
 16.1: cart detail CSS
=============================================================*/

.cart-page.cart-detail .table {
  margin-bottom: 0;
}
.cart-page.cart-detail .table thead tr {
  background: #ffefd6;
}
.cart-page.cart-detail .table thead tr th {
  text-transform: capitalize;
  font-size: 18px;
  line-height: 28px;
  font-weight: 700;
  color: #623f22;
  padding: 10px 0;
  text-align: center;
  border: 0;
}
.cart-page.cart-detail .table tbody tr .pro-img {
  min-width: 105px;
}
.cart-page.cart-detail .table tbody tr .pro-name {
  min-width: 250px;
}
.cart-page.cart-detail .table tbody tr .pro-price,
.cart-page.cart-detail .table tbody tr .pro-cart,
.cart-page.cart-detail .table tbody tr .pro-stock,
.cart-page.cart-detail .table tbody tr .pro-total {
  min-width: 150px;
}
.cart-page.cart-detail .table tbody tr .pro-quantity{
  min-width: 180px;
}
.cart-page.cart-detail .table tbody tr .pro-delete {
  min-width: 100px;
}

.cart-page.cart-detail .table tbody tr td {
  padding: 30px 0;
  vertical-align: middle;
  text-align: center;
}

.cart-page.cart-detail .table tbody tr td p {
  text-transform: capitalize;
}
.cart-page.cart-detail .table tbody tr td a {
  text-transform: capitalize;
  font-size: 18px;
  font-weight: 600;
  line-height: 28px;
  color: #623f22;
}

.cart-page.cart-detail .table tbody tr td a:hover {
  color: #ecb915;
}

.cart-page.cart-detail .table tbody tr td i {
  font-size: 16px;
  color: #623f22;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}

.cart-page.cart-detail .table tbody tr td i:hover {
  color: #ecb915;
}

.cart-page.cart-detail .table tbody tr td .stock{
  background: #ffefd6;
  width: fit-content;
  width: -moz-fit-content;
  margin: auto;
  padding: 0 20px;
}
.cart-page.cart-detail .table tbody tr .pro-cart a{
  display: inline-block;
  background: #ecb915;
  color: var(--white);
  line-height: 40px;
  padding: 0 20px;
}
.cart-page.cart-detail .table tbody tr .pro-cart a:hover{
  background: #623f22;
  color: var(--white);
}
.cart-page.cart-detail .table tbody tr td .number-spinner{
  width: 160px;
  height: 55px;
  border: 1px solid #ddd;
  margin: auto;
}
.cart-page.cart-detail .table tbody tr td .number-spinner button {
  height: 100%;
  width: 30%;
  display: block;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}

.cart-page.cart-detail .table tbody tr td .number-spinner button i {
  color: var(--grey);
  font-size: 18px;
  line-height: 55px;
}

.cart-page.cart-detail .table tbody tr td .number-spinner .input-value {
  height: 100%;
  width: 40%;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  color: #ecb915;
  font-size: 30px;
  font-weight: 400;
  border: 0;
  outline: none;
  padding: 0;
}

.cart-page.cart-detail .table tbody tr:last-child td {
  border: 0;
}
.cart-page.cart-detail .coupon-area {
  padding-top: 10px;
}
.cart-page.cart-detail .coupon-area .coupon-input .inputs {
  height: 40px;
  width: 305px;
  background: #e8e8e8;
  margin-right: 20px;
  border: 0;
  padding: 0 15px;
  outline: none;
}
.cart-page.cart-detail .coupon-area .coupon-input .inputs::placeholder {
  text-transform: capitalize;
  font-size: 16px;
  font-weight: 400;
  color: var(--grey);
}
.cart-page.cart-detail .coupon-area button {
  line-height: 40px;
  padding: 0 20px;
  font-size: 16px;
  font-weight: 400;
  color: var(--white);
  background: #ecb915;
  text-transform: capitalize;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.cart-page.cart-detail .coupon-area button:hover{
  background: #623f22;
}

/*===========================================================
 16.2: cart total CSS
=============================================================*/

.cart-page.cart-total .total-content {
  border: 1px solid #ddd;
  padding: 30px;
}
.cart-page.cart-total .title {
  padding-bottom: 15px;
  margin-top: -8px;
}
.cart-page.cart-total .title h6 {
  font-weight: 700;
  color: #623f22;
  text-transform: capitalize;
}
.cart-page.cart-total .sub {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 15px 0;
}
.cart-page.cart-total .sub p {
  text-transform: capitalize;
}
.cart-page.cart-total .ship {
  padding-top: 15px;
  padding-bottom: 15px;
}
.cart-page.cart-total .ship p {
  padding-bottom: 15px;
}
.cart-page.cart-total .input-container {
  position: relative;
  display: block;
  padding-left: 40px;
  padding-bottom: 20px;
}
.cart-page.cart-total .input-container:last-child {
  padding-bottom: 0;
}
.cart-page.cart-total .input-container span {
  text-transform: capitalize;
}
.cart-page.cart-total .input-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}
.cart-page.cart-total .input-container input:checked ~ .checkmark:after {
  display: block;
}
.cart-page.cart-total .input-container .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}
.cart-page.cart-total .input-container .checkmark:after {
  content: "";
  position: absolute;
  display: none;
  top: 8px;
  left: 8px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background: #ecb915;
}
.cart-page.cart-total .input-container:hover input ~ .checkmark {
  background: #ffefd6;
}
.cart-page.cart-total .estimate {
  padding-bottom: 15px;
}
.cart-page.cart-total .estimate h6,
.cart-page.cart-total .checkout h6 {
  font-size: 16px;
  font-weight: 700;
  color: #623f22;
  text-transform: capitalize;
}
.cart-page.cart-total .estimate p {
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.cart-page.cart-total .estimate p:hover {
  color: #ecb915;
}
.cart-page.cart-total .checkout {
  border-top: 1px solid #ddd;
  padding-top: 10px;
}

.cart-page.cart-total .checkout a {
  display: inline-block;
  text-align: center;
  width: 100%;
  line-height: 40px;
  border: 1px solid #ecb915;
  font-size: 18px;
  font-weight: 700;
  text-transform: capitalize;
  color: #ecb915;
  margin-top: 10px;
}
.cart-page.cart-total .checkout a:hover{
  background: #ecb915;
  color: var(--white);
}

/*===========================================================
 17: checkout page CSS
=============================================================*/
.checkout-page.checkout {
  padding-bottom: 45px;
}
.checkout-page.checkout .billing-details .title {
  padding-bottom: 30px;
}
.checkout-page.checkout .billing-details .title h5 {
  font-weight: 700;
  text-transform: capitalize;
  border-bottom: 1px solid #ddd;
}
.checkout-page.checkout .billing-details .bill-input {
  width: 100%;
  border: 1px solid #ddd;
  outline: none;
  height: 40px;
  padding: 0 15px;
  margin-bottom: 30px;
}
.checkout-page.checkout .billing-details .bill-input:hover, 
.checkout-page.checkout .billing-details .bill-input:focus {
  border-color: #ecb915;
}
.checkout-page.checkout .billing-details .bill-input::placeholder {
  text-transform: capitalize;
  font-size: 16px;
  color: var(--grey);
  font-weight: 400;
}
.checkout-page.checkout .billing-details .select2-dropdown {
  border-color: #ddd;
}
.checkout-page.checkout .billing-details .select2-container--default {
  width: 100% !important;
  margin-bottom: 30px;
}
.checkout-page.checkout .billing-details .select2-container--default
.select2-selection--single .select2-selection__rendered {
  padding: 0 15px;
  text-transform: capitalize;
  color: var(--grey);
  line-height: 40px;
}
.checkout-page.checkout .billing-details .select2-container--default
.select2-selection--single {
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-color: #ddd;
  height: 40px;
  outline: none;
}
.checkout-page.checkout .billing-details .select2-container--default
.select2-selection--single .select2-selection__arrow {
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
.checkout-page.checkout .billing-details .select2-container--default
.select2-search--dropdown .select2-search__field {
  outline: none;
  border-color: #ddd;
}
.checkout-page.checkout .billing-details .create {
  padding-bottom: 30px;
}
.checkout-page.checkout .billing-details .create .accordion-item {
  border: 0;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
}
.checkout-page.checkout .billing-details .create .accordion-item:not(:last-child) {
  padding-bottom: 15px;
}
.checkout-page.checkout .billing-details .create .accordion-header {
  padding: 0;
  border: 0;
  border-radius: 0;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  background: transparent;
}
.checkout-page.checkout .billing-details .create .accordion-header label {
  padding: 0;
  border: 0;
  font-size: 16px;
  font-weight: 400;
  color: var(--grey);
  background: transparent;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  margin: 0;
  position: relative;
  padding-left: 40px;
}
.checkout-page.checkout .billing-details .create .accordion-header label:after {
  display: none;
}
.checkout-page.checkout .billing-details .create .accordion-header .check {
  opacity: 0;
  display: none;
}
.checkout-page.checkout .billing-details .create .accordion-header .check-custom {
  position: absolute;
  top: 2px;
  left: 0;
  height: 25px;
  width: 25px;
  border: 1px solid #ddd;
  box-sizing: border-box;
  cursor: pointer;
}
.checkout-page.checkout .billing-details .create .accordion-header .check-custom:after {
  content: "";
  position: absolute;
  display: none;
  left: 9px;
  top: 3px;
  width: 6px;
  height: 13px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  cursor: pointer;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}
.checkout-page.checkout .billing-details .create .accordion-header .check:checked ~ .check-custom {
  background: #ecb915;
  border-color: #ecb915;
}
.checkout-page.checkout .billing-details .create .accordion-header .check:checked ~ .check-custom:after {
  display: block;
}
.checkout-page.checkout .billing-details .create .accordion-item .accordion-collapse {
  border: 0;
}
.checkout-page.checkout .billing-details .create .accordion-item .accordion-body {
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 0;
}
.checkout-page.checkout .billing-details .notes textarea {
  height: 155px;
  padding: 15px;
  resize: vertical;
}
.checkout-page.checkout .total-content {
  border: 1px solid #ddd;
  padding: 30px;
}
.checkout-page.checkout .total-content .title {
  padding-bottom: 15px;
  margin-top: -8px;
}
.checkout-page.checkout .total-content .title h5 {
  font-weight: 700;
  text-transform: capitalize;
}
.checkout-page.checkout .total-content .sub {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 15px 0;
}
.checkout-page.checkout .total-content .sub p {
  text-transform: capitalize;
}
.checkout-page.checkout .total-content .ship {
  padding-top: 15px;
  padding-bottom: 15px;
}
.checkout-page.checkout .total-content .ship p {
  padding-bottom: 15px;
}
.checkout-page.checkout .total-content .input-container {
  position: relative;
  display: block;
  padding-left: 40px;
  padding-bottom: 20px;
}
.checkout-page.checkout .total-content .input-container:last-child {
  padding-bottom: 0;
}
.checkout-page.checkout .total-content .input-container span {
  display: inline-block;
  text-transform: capitalize;
  font-size: 16px;
  line-height: 28px;
  color: var(--grey);
}
.checkout-page.checkout .total-content .input-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}
.checkout-page.checkout .total-content .input-container input:checked ~ .checkmark:after {
  display: block;
}
.checkout-page.checkout .total-content .input-container .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: var(--white);
  border: 1px solid #ddd;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}
.checkout-page.checkout .total-content .input-container .checkmark:after {
  content: "";
  position: absolute;
  display: none;
  top: 8px;
  left: 8px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background: #ecb915;
}
.checkout-page.checkout .total-content .input-container:hover input ~ .checkmark {
  background: #ffefd6;
}
.checkout-page.checkout .total-content .checkout {
  border-top: 1px solid #ddd;
  padding-top: 10px;
}
.checkout-page.checkout .total-content .checkout .total {
  padding-bottom: 10px;
}
.checkout-page.checkout .total-content .checkout h6 {
  font-size: 16px;
  font-weight: 700;
  color: #623f22;
  text-transform: capitalize;
}
.checkout-page.checkout .total-content .checkout a {
  width: 100%;
  line-height: 40px;
  padding: 0;
}

/*===========================================================
 18: compare page CSS
=============================================================*/

.compare-page.compare .table {
  margin: 0;
}
.compare-page.compare .table thead tr th,
.compare-page.compare .table tbody tr td {
  border: 1px solid #ddd;
  text-align: center;
  vertical-align: middle;
}
.compare-page.compare .table thead tr th:first-child,
.compare-page.compare .table tbody tr td:first-child {
  min-width: 255px;
}
.compare-page.compare .table thead tr th:not(:first-child),
.compare-page.compare .table tbody tr td:not(:first-child) {
  min-width: 400px;
}
.compare-page.compare .table thead tr th{
  padding: 45px 0;
}

.compare-page.compare .table tbody tr td {
  padding: 25px 20px;
}
.compare-page.compare .table span {
  display: inline-block;
  text-transform: capitalize;
  font-size: 24px;
  line-height: 36px;
  font-weight: 700;
  text-transform: capitalize;
}
.compare-page.compare .table h6{
  font-weight: 700;
  text-transform: capitalize;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  color: #623f22;
}
.compare-page.compare .table a:hover h6 {
  color: #ecb915;
}

.compare-page.compare .table p {
  padding: 0 50px;
}
.compare-page.compare .table .dark{
  padding: 0;
  font-weight: 500;
  text-transform: capitalize;
  color: #623f22;
}
.compare-page.compare .table .cart-btn {
  display: inline-block;
  line-height: 40px;
  padding: 0 20px;
  font-size: 16px;
  font-weight: 500;
  color: var(--white);
  background: #ecb915;
  text-transform: capitalize;
}
.compare-page.compare .table .cart-btn:hover{
  background: #623f22;
}
.compare-page.compare .table .rating li {
  padding: 0 5px;
}
.compare-page.compare .table .rating li i {
  font-size: 16px;
  color: var(--yellow);
}
.compare-page.compare .table .delete-icon {
  font-size: 20px;
  color: #623f22;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.compare-page.compare .table .delete-icon:hover {
  color: #ecb915;
}

/*===========================================================
 19: tracking page CSS
=============================================================*/
.tracking{
  padding-top: 70px;
}
.tracking p{
  padding-bottom: 20px;
}
.tracking h5{
  font-weight: 600;
  text-transform: capitalize;
  color: #623f22;
  padding-bottom: 10px;
}
.tracking .inputs{
  width: 100%;
  height: 54px;
  outline: none;
  border: 1px solid #ddd;
  background: transparent;
  padding: 0 18px;
  margin-bottom: 30px;
}
.tracking .inputs:hover,
.tracking .inputs:focus{
  border-color: #ecb915;
}
.tracking button{
  line-height: 40px;
  font-size: 20px;
  font-weight: 600;
  color: var(--white);
  background: #ecb915;
  padding: 0 40px;
  text-transform: capitalize;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.tracking button:hover{
  background: #623f22;
}

/*===========================================================
 20: my-account page CSS
=============================================================*/
.my-account .nav{
  display: block !important;
}
.my-account .nav-tabs{
  background: var(--white);
  box-shadow: 2px 0 90px rgba(0, 0, 0, 0.1);
  padding: 30px;
  border: 0;
}
.my-account .nav-tabs .nav-item:not(:last-child){
  padding-bottom: 20px;
}
.my-account .nav-tabs .nav-link {
  margin: 0;
  padding: 0;
  font-size: 18px;
  line-height: 28px;
  font-weight: 600;
  color: var(--grey);
  text-transform: capitalize;
  outline: none;
  border: 0;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
}

.nav-tabs .nav-item.show .nav-link, 
.nav-tabs .nav-link.active {
  color: #ecb915;
  background-color: transparent;
  border: 0;
  text-decoration: underline;
}
.my-account .content h6{
  padding-bottom: 15px;
}
.my-account .content h6,
.my-account .content h6 a{
  font-weight: 600;
  color: #623f22;
  text-transform: capitalize;
}
.my-account .content h6 span,
.my-account .content h6 a:hover{
  color: #ecb915;
}
.my-account .content p a{
  color: #623f22;
  font-weight: 600;
}
.my-account .content p a:hover{
  color: #ecb915;
}
.my-account .content h4{
  font-weight: 700;
  color: #623f22;
  text-transform: capitalize;
  padding-bottom: 20px;
}
.my-account .content .item{
  background: var(--white);
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border: 1px solid #ddd;
  padding: 30px;
}
.my-account .content .item p{
  text-transform: capitalize;
}
.my-account .content .item .edit{
  padding-top: 20px;
}
.my-account .content .item a{
  display: inline-block;
  font-size: 16px;
  line-height: 28px;
  text-transform: capitalize;
  font-weight: 500;
  color: #623f22;
}
.my-account .content .item a i{
  padding-right: 10px;
}
.my-account .content .item a:hover{
  color: #ecb915;
}
.my-account .content .table .ord-id{
  min-width: 160px;
}
.my-account .content .table .ord-date{
  min-width: 150px;
}
.my-account .content .table .ord-status{
  min-width: 170px;
}
.my-account .content .table .ord-price{
  min-width: 100px;
}
.my-account .content .table .ord-pay{
  min-width: 190px;
}
.my-account .content .table .ord-delivery{
  min-width: 110px;
}
.my-account .content .table .ord-review{
  min-width: 250px;
}
.my-account .content .table tr th{
  text-transform: capitalize;
  font-weight: 700;
  color: #623f22;
  font-size: 18px;
}
.my-account .content .table tr td,
.my-account .content .table tr td a{
  text-transform: capitalize;
  font-size: 16px;
  font-weight: 400;
  color: #623f22;
}
.my-account .content .table tr td a{
  color: #ecb915;
}
.my-account .content .table tr td .pay{
  display: inline-block;
  color: var(--white);
  background: #ecb915;
  line-height: 30px;
  padding: 0 10px;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
}
.my-account .content .table tr td .pay:hover{
  background: #623f22;
}
.my-account .content .info p span{
  color: #623f22;
  font-weight: 600;
  display: inline-block;
  min-width: 100px;
}
.my-account .logout p{
  font-size: 18px;
  text-transform: capitalize;
  padding-bottom: 20px;
}
.my-account .logout a{
  display: inline-block;
  line-height: 40px;
  padding: 0 20px;
  font-size: 18px;
  text-transform: capitalize;
  font-weight: 500;
  color: var(--white);
  background: #ecb915;
}
.my-account .logout a i{
  padding-right: 10px;
}
.my-account .logout a:hover{
  background: #623f22;
}

/*===========================================================
 21: contact page CSS
=============================================================*/
.contact-page.touch .address li{
  position: relative;
  border-bottom: 1px solid #ddd;
  padding: 25px 0 25px 60px;
}
.contact-page.touch .address li:last-child{
  border-bottom: 0;
}
.contact-page.touch .address li .icon{
  position: absolute;
  top: 25px;
  left: 0;
}
.contact-page.touch .address li .icon i{
  font-size: 35px;
  color:#aa1c1b;
}
.contact-page.touch .address li .text h5{
  text-transform: capitalize;
  font-weight: 600;
  color: #a71111;
}
.contact-page.newsletter .location #map {
  width: 100%;
  height: 435px;
}
.contact-page.newsletter label{
  position: relative;
  width: 100%;
  margin-bottom: 45px;
}
.contact-page.newsletter .inputs{
  height: 50px;
  width: 100%;
  border: 0;
  border-bottom: 1px solid #ddd;
  outline: none;
  background: transparent;
  padding-right: 20px;
}
.contact-page.newsletter .inputs:hover,
.contact-page.newsletter .inputs:focus{
  border-color: #ecb915;
}
.contact-page.newsletter textarea.inputs{
  padding-top: 15px;
  padding-bottom: 15px;
  height: 130px;
}
.contact-page.newsletter .inputs::placeholder{
  text-transform: capitalize;
  font-weight: 400;
  font-size: 16px;
  color: var(--grey);
}
.contact-page.newsletter label i{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  right: 0;
  font-size: 14px;
  color: var(--grey);
}
.contact-page.newsletter .msg i{
  top: 15px;
}
table, td, th {  
  border: 1px solid #ddd;
  text-align: left;
}

table {
  border-collapse: collapse;
  width: 100%;
}

th, td {
  padding: 15px;
}
.contact-page.newsletter button{
  font-size: 20px;
  text-transform: capitalize;
  line-height: 60px;
  padding: 0 40px;
  color: var(--white);
  background: #aa1514;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.contact-page.newsletter button:hover{
  background: #623f22;
}
/*===========================================================
 22: blog page CSS
=============================================================*/

.blog-page.blog .single{
  margin-bottom: 20px;
}
.blog-page.blog .pages{
  margin-top: 10px;
}
/*===========================================================
 23: blog detail page CSS
=============================================================*/
.blog-page.blog-detail .content .blog-img {
  position: relative;
}
.blog-page.blog-detail .content .blog-img img {
  width: 100%;
}
.blog-page.blog-detail .content .blog-img .date {
  height: 55px;
  width: 55px;
  background: #ecb915;
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 9;
  text-align: center;
}
.blog-page.blog-detail .content .blog-img .date p {
  text-transform: capitalize;
  color: var(--white);
  line-height: 20px;
  padding-top: 8px;
}
.blog-page.blog-detail .content .blog-img .date a {
  display: block;
  height: 100%;
  width: 100%;
}
.blog-page.blog-detail .content p {
  padding-top: 20px;
}
.blog-page.blog-detail .content .new {
  font-size: 18px;
}
.blog-page.blog-detail .content h5 {
  font-weight: 700;
  color: #623f22;
  padding-top: 15px;
  width: 70%;
}
.blog-page.blog-detail .content .special {
  padding-top: 25px;
  padding-bottom: 15px;
}
.blog-page.blog-detail .content .special .image{
  margin-right: 30px;
}
.blog-page.blog-detail .content .special img {
  width: 100%;
}
.blog-page.blog-detail .content .special ul {
  flex: 1;
}
.blog-page.blog-detail .content .special ul li {
  font-size: 18px;
  line-height: 26px;
  font-weight: 500;
  display: flex;
  align-items: center;
}
.blog-page.blog-detail .content .special ul li i {
  padding-right: 15px;
  font-size: 20px;
}
.blog-page.blog-detail .content .special ul li:not(:last-child) {
  padding-bottom: 10px;
}
.blog-page.blog-detail .content blockquote {
  background: var(--white);
  box-shadow: 0 0 90px rgba(0, 0, 0, 0.1);
  padding: 30px 35px;
  text-align: center;
  margin-top: 20px;
  position: relative;
}
.blog-page.blog-detail .content blockquote p {
  padding-top: 0;
  font-size: 18px;
  color: #623f22;
  position: relative;
  z-index: 1;
}
.blog-page.blog-detail .content blockquote i {
  font-size: 90px;
  color: #eee7d9;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  z-index: 0;
}
.blog-page.blog-detail .content .share-blog {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 10px 30px;
  margin-top: 35px;
}
.blog-page.blog-detail .content .share-blog span {
  display: inline-block;
  font-size: 18px;
  color: #ecb915;
  text-transform: capitalize;
  font-weight: 600;
}
.blog-page.blog-detail .content .share-blog .social li {
  padding: 0 7px;
}
.blog-page.blog-detail .content .share-blog .social li a i {
  color: #623f22;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.blog-page.blog-detail .content .share-blog .social li a:hover i {
  color: #ecb915;
}
.blog-page.blog-detail .content .share-blog p {
  text-transform: capitalize;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.blog-page.blog-detail .content .share-blog .right-part i {
  color: #623f22;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.blog-page.blog-detail .content .share-blog .right-part a p {
  padding-top: 0;
}
.blog-page.blog-detail .content .share-blog .right-part a i {
  padding-right: 10px;
}
.blog-page.blog-detail .content .share-blog .right-part a:hover p, 
.blog-page.blog-detail .content .share-blog .right-part a:hover i {
  color: #ecb915;
}

.blog-page.blog-detail .content .comment {
  padding-top: 30px;
}
.blog-page.blog-detail .content .comment .title h5 {
  text-transform: capitalize;
  font-weight: 700;
  color: #623f22;
  padding-bottom: 16px;
  position: relative;
}
.blog-page.blog-detail .content .comment .title h5:after {
  content: "";
  height: 2px;
  width: 90px;
  background: #ecb915;
  position: absolute;
  bottom: 0;
  left: 0;
}
.blog-page.blog-detail .content .comment .leave h5 {
  padding-top: 10px;
}
.blog-page.blog-detail .content .comment .all-comment li {
  position: relative;
  margin: 50px 0;
}
.blog-page.blog-detail .content .comment .all-comment li ul {
  margin-left: 70px;
}
.blog-page.blog-detail .content .comment .all-comment li ul li {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 50px 0;
}
.blog-page.blog-detail .content .comment .all-comment li ul li img {
  margin-top: 50px;
}
.blog-page.blog-detail .content .comment .all-comment li ul li .reply {
  top: 50px;
}
.blog-page.blog-detail .content .comment .all-comment li h6, 
.blog-page.blog-detail .content .comment .all-comment li p {
  padding-top: 0;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.blog-page.blog-detail .content .comment .all-comment li img {
  position: absolute;
  top: 0;
  left: 0;
  height: 120px;
  width: 120px;
  border-radius: 50%;
}
.blog-page.blog-detail .content .comment .all-comment li .comment-body {
  padding-left: 155px;
}
.blog-page.blog-detail .content .comment .all-comment li .comment-body h6 {
  font-weight: 700;
  font-size: 20px;
  color: #623f22;
  text-transform: capitalize;
}
.blog-page.blog-detail .content .comment .all-comment li .comment-body h6:hover {
  color: #ecb915;
}
.blog-page.blog-detail .content .comment .all-comment li .comment-body .time {
  padding-bottom: 5px;
}
.blog-page.blog-detail .content .comment .all-comment li .comment-body .time:hover {
  color: #ecb915;
}
.blog-page.blog-detail .content .comment .all-comment li .reply {
  position: absolute;
  top: 0;
  right: 0;
}
.blog-page.blog-detail .content .comment .all-comment li .reply i {
  margin-right: 10px;
  color: #ecb915;
}
.blog-page.blog-detail .content .comment .all-comment li .reply p {
  text-transform: capitalize;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.blog-page.blog-detail .content .comment .all-comment li .reply:hover p {
  color: #ecb915;
}
.blog-page.blog-detail .content .comment form {
  margin-top: 50px;
  margin-bottom: 0;
}
.blog-page.blog-detail .content .comment .input-field {
  width: 100%;
  height: 50px;
  background: #f4f4f4;
  padding: 0 20px;
  outline: none;
  border: 0;
  margin-bottom: 30px;
}
.blog-page.blog-detail .content .comment .input-field::placeholder {
  text-transform: capitalize;
}
.blog-page.blog-detail .content .comment textarea.input-field {
  height: 215px;
  padding: 20px;
}
.blog-page.blog-detail .content .comment button {
  line-height: 50px;
  padding: 0 35px;
  background: #ecb915;
  font-size: 18px;
  text-transform: capitalize;
  font-weight: 500;
  color: var(--white);
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.blog-page.blog-detail .content .comment button:hover{
  background: #623f22;
}

/* blog-sidebar */
.blog-page .blog-sidebar .section{
  margin-bottom: 30px;
}
.blog-page .blog-sidebar .section:last-child{
  margin-bottom: 0;
}
.blog-page .blog-sidebar .section .search-area{
  width: 100%;
  position: relative;
}
.blog-page .blog-sidebar .section .search-area .inputs{
  width: 100%;
  height: 40px;
  border: 1px solid #ddd;
  padding-left: 15px;
  padding-right: 30px;
  outline: none;
}
.blog-page .blog-sidebar .section .search-area .inputs::placeholder{
  text-transform: capitalize;
  color: var(--grey);
  font-size: 16px;
  font-weight: 400;
}
.blog-page .blog-sidebar .section .search-area .inputs:hover,
.blog-page .blog-sidebar .section label .inputs:focus{
  border-color: #ecb915;
}
.blog-page .blog-sidebar .section .search-area button{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  right: 10px;
}
.blog-page .blog-sidebar .section .search-area button i{
  font-size: 16px;
  color: #623f22;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
} 
.blog-page .blog-sidebar .section .search-area button:hover i{
  color: #ecb915;
}


.blog-page .blog-sidebar .section .title {
  padding-bottom: 20px;
}
.blog-page .blog-sidebar .section .title h5 {
  font-size: 22px;
  font-weight: 700;
  color: #623f22;
  text-transform: capitalize;
  border-bottom: 1px solid #ddd;
  position: relative;
  padding-bottom: 5px;
}
.blog-page .blog-sidebar .section .title h5:after{
  content: '';
  height: 3px;
  width: 80px;
  background: #ecb915;
  position: absolute;
  bottom: -1px;
  left: 0;
  z-index: 4;
}
.blog-page .blog-sidebar .section .section {
  margin-bottom: 40px;
  background: var(--white);
}
.blog-page .blog-sidebar .section .section:last-child {
  margin-bottom: 0;
}
/* category */
.blog-page .blog-sidebar .category ul li {
  padding: 5px 0 5px 30px;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
  position: relative;
}
.blog-page .blog-sidebar .category ul li:before{
  content: '';
  position: absolute;
  top: 10px;
  left: 0;
  height: 15px;
  width: 15px;
  border: 2px solid #ecb915;
  background: transparent;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}

.blog-page .blog-sidebar .category ul li p {
  font-weight: 600;
  text-transform: capitalize;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.blog-page .blog-sidebar .category ul li.active, 
.blog-page .blog-sidebar .category ul li:hover {
  border-color: #ecb915;
}
.blog-page .blog-sidebar .category ul li.active:before, 
.blog-page .blog-sidebar .category ul li:hover:before {
  background: #ecb915;
}
.blog-page .blog-sidebar .category ul li.active p, 
.blog-page .blog-sidebar .category ul li:hover p {
  color: #ecb915;
}
/* popular */
.blog-page .blog-sidebar .popular ul li:not(:last-child){
  padding-bottom: 30px;
}
.blog-page .blog-sidebar .popular ul li .image{
  margin-right: 15px;
}
.blog-page .blog-sidebar .popular ul li .text{
  flex: 1;
}
.blog-page .blog-sidebar .popular ul li .text h6{
  color: #623f22;
  font-weight: 700;
}
.blog-page .blog-sidebar .popular ul li .text h6:hover{
  color: #ecb915;
}
.blog-page .blog-sidebar .popular ul li .text p{
  text-transform: capitalize;
  padding-top: 5px;
}
.blog-page .blog-sidebar .popular ul li .text p i{
  padding-right: 10px;
}
.blog-page .blog-sidebar .tags{
  margin-bottom: 10px;
}
.blog-page .blog-sidebar .all-tags a{
  display: inline-block;
  font-size: 15px;
  line-height: 45px;
  color: var(--grey);
  text-transform: capitalize;
  font-weight: 400;
  padding: 0 15px;
  border: 1px solid #ddd;
  margin-right: 15px;
  margin-bottom: 20px;
}
.blog-page .blog-sidebar .all-tags a:hover{
  background: #ecb915;
  border-color: #ecb915;
  color: var(--white);
}
.blog-page .blog-sidebar .letter .search-area .inputs{
  border: 0;
  border-bottom: 1px solid #ddd;
  padding-left: 0;
}
.blog-page .blog-sidebar .letter .search-area button{
  right: 0;
}
/*===========================================================
 24: blog-list page CSS
=============================================================*/
.blog-page.blog-list .list-area li{
  padding-bottom: 30px;
}
.blog-page.blog-list .list-area .single .image{
  margin-right: 30px;
}
.blog-page.blog-list .list-area .single .image img{
  width: 100%;
}
.blog-page.blog-list .list-area .single .content{
  flex: 1;
}
.blog-page.blog-list .list-area .single .content a p{
  text-transform: capitalize;
}
.blog-page.blog-list .list-area .single .content h6:hover,
.blog-page.blog-list .list-area .single .content a:hover p{
  color: #ecb915;
}
.blog-page.blog-list .list-area .single .desc{
  padding-right: 100px;
}
.blog-page.blog-list .list-area .single .content h6{
  font-weight: 500;
  color: #623f22;
  padding-top: 10px;
  padding-bottom: 10px;
}
.blog-page.blog-list .list-area .single .content .button-style1{
  margin-top: 25px;
}
.blog-page.blog-list .pages{
  padding-top: 10px;
}
/*===========================================================
 25: faq page CSS
=============================================================*/
/*===========================================================
 25.1: faq CSS
=============================================================*/

.faq-page.faq .accordion-item {
  margin-bottom: 20px;
}
.faq-page.faq .accordion-button {
  font-size: 18px;
  font-weight: 600;
  color: #623f22;
  padding: 0 15px;
  border-color: #ddd;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
}
.faq-page.faq .accordion-button:focus {
  box-shadow: none;
}
.faq-page.faq .accordion-button:not(.collapsed) {
  color: #623f22;
  background-color: #ffefd6;
}
.faq-page.faq .accordion-button:after {
  background-image: none;
  content: '\f078';
  font-family: 'Font Awesome 5 Free';
  font-weight: 600;
  height: auto;
  width: auto;
  color: #623f22;
}
.faq-page.faq .accordion-item .accordion-collapse,
.faq-page.faq .accordion-item .accordion-button.collapsed {
  border-bottom-width: 1px;
}
/*===========================================================
 26: error page CSS
=============================================================*/
.error-page .content h1{
  font-size: 58px;
  font-weight: 600;
  color: #623f22;
  text-transform: capitalize;
  padding: 30px 0;
}

/*===========================================================
 27: coming soon page CSS
=============================================================*/
.coming-soon {
  height: 100vh;
}
.coming-soon .overlay {
  height: 100%;
  width: 100%;
  background: url(../images/coming-soon/overlay.png);
  position: relative;
}
.coming-soon .overlay:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.4);
  z-index: 1;
}
.coming-soon .content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  z-index: 9;
}
.coming-soon .content h1 {
  font-size: 70px;
  line-height: 100px;
  font-weight: 700;
  color: var(--white);
  text-transform: capitalize;
  padding-bottom: 55px;
}
.coming-soon .content .coming-time li {
  width: 118px;
  height: 100px;
  border: 1px solid var(--white);
  padding: 7px;
  margin: 0 15px;
}
.coming-soon .content .coming-time li .inner {
  background: var(--white);
  height: 100%;
  width: 100%;
  padding-top: 8px;
}
.coming-soon .content .coming-time li .inner h2 {
  font-size: 35px;
  line-height: 40px;
  font-weight: 700;
  text-transform: capitalize;
  color: #ecb915;
}
.coming-soon .content .coming-time li .inner span {
  display: block;
  text-transform: capitalize;
  font-size: 18px;
  font-weight: 500;
  color: #ecb915;
}
.coming-soon .content p {
  color: var(--white);
  padding: 25px 18%;
}
.coming-soon .content form {
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 40px;
}
.coming-soon .content form .input {
  width: 435px;
  height: 50px;
  border: 1px solid var(--white);
  border-right: 0;
  background: transparent;
  outline: none;
  padding: 0 20px;
  color: var(--white);
}
.coming-soon .content form .input::placeholder {
  text-transform: capitalize;
  color: var(--white);
}
.coming-soon .content form button {
  line-height: 50px;
  padding: 0 25px;
  font-size: 16px;
  font-weight: 500;
  color: #ecb915;
  background: var(--white);
  text-transform: capitalize;
  transition: all linear 0.3s;
  -webkit-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  -ms-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
}
.coming-soon .content form button:hover{
  color: var(--white);
  background: #ecb915;
}
.coming-soon .content .social li {
  padding: 0 8px;
}
.coming-soon .content .social li a {
  display: inline-block;
  width: 45px;
  height: 40px;
  background: var(--white);
  text-align: center;
}
.coming-soon .content .social li a i {
  font-size: 18px;
  color: #ecb915;
  line-height: 40px;
  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;
}
.coming-soon .content .social li a:hover {
  background: #ecb915;
}
.coming-soon .content .social li a:hover i {
  color: var(--white);
}


.about-image img{
    height: auto;
    width: 100%;
border-radius: 10px 0px 0px 10px}

.single {
    background-color: #fff;
    height: auto;
    width: 100%;
    box-shadow: 1px 1px 3px 1px #ccc;
    text-align: center;
    padding: 0 0 10px;
    margin: 10px 0;
        height: 400px;
}

.single img{
       height: 300px;
    width: 100%;
    object-fit: contain;
    
}

.shop-detail a{
    color: #ecb915;
    text-align: center;
    text-transform: capitalize;
}

.discount-content{
    padding: 30px ;
}

.logo img{
    height: 85px;
}
a.products{
    color: #b02620;
    font-weight: 600;
}
a.products:hover{
    color: #623f22;
}
.quote{
    height: 50px;
    width: 15%;
}
.whatsapp-link img {
    height: 45px;
    width: 45px;
    position: fixed;
    left: 30px;
    bottom: 100px;
    z-index: 9999;
}
.call-btn img {
    height: 45px;
    width: 45px;
    position: fixed;
    left: 30px;
    bottom: 150px;
    z-index: 9999;
}