/*global classes*/

  /*--------------- Css Reset ---------------*/

  ::-webkit-scrollbar {

    width: 5px;

  }

  /* Track */

  ::-webkit-scrollbar-track {

    /*box-shadow: inset 0 0 5px grey; */

  }

  /* Handle */

  ::-webkit-scrollbar-thumb {

    background-image: linear-gradient( #DD1C1D, #DD1C1D, #DD1C1D );

    border-radius: 10px;

  }

  html {

      font: 400 14px/1.5 'PT Sans' ;

      scroll-behavior: smooth;

  }

  body {

      margin: 0;

      right: 0;

       -webkit-transition: margin-left .3s ease-in-out;

      transition: margin-left .3s ease-in-out;

      scroll-behavior: smooth;

      -webkit-overflow-scrolling: touch;

      overflow-x: hidden;

      font: 400 14px/1.5 'PT Sans';

      color:#fcfcfc;

      background: #1D1D1D;

  }

  * {

      box-sizing: border-box;

  }

  *,

  :after,

  :before {

      -webkit-font-smoothing: antialiased;

      -moz-osx-font-smoothing: grayscale;

  }

  :after,

  :before {

      -webkit-box-sizing: inherit;

      box-sizing: inherit;

  }
 

  a {

      outline: none;

      text-decoration: none;

      color: inherit;

      cursor: pointer;

      transition-duration: 0.8s;

       position: relative;

  }

  a.active,

  a:active,

  a:focus,

  a:hover {

      color: #F78400 !important;

      outline: none !important;

      text-decoration: none;

  }

  b,

  strong {

      font-weight: 700;

  }

  audio,

  img,

  video {

      max-width: 100%;

      height: auto;

  }

  h1,h2,h3,h4,h5,h6{

    font-family: 'Bebas Neue';

    font-weight: 400;

    text-shadow: 0px 13px 14px rgba(0, 0, 0, 0.212);

    

  }

  h1 {

    font-size: 80px;

  }

  h2 {

    font-size: 55px;

  }

  h3 {

    font-size: 35px;

  }

  h4 {

      font-size: 30px;

  }

  h5 {

      font-size: 25px;



  }

  h6 {

      font-size: 20px;

  }

  .f-24{

    font-size: 24px;

  }

  .f-18{

    font-size: 18px;

  }

  .f-12{

    font-size: 12px;

  }

  .f-35{

    font-size: 35px;

  }

  .fw-400{

      font-weight: 400;

  }

  .fw-600{

      font-weight: 600;

  }

  .fw-700{

      font-weight: 700;

  }

  button {

    background: none;

    padding: 16px 65px;

    color: #fff;

    transition-duration: 0.8s;

    border-radius: 5px;

    border: none;

    position: relative;

    border: none;

    /* box-shadow: 0px 0px 36px #FC2C2C; */

    background: #C20000;

}

  button:hover, button:active, button:focus {

      transition-duration: 0.8s;

      background: #F78400;

      /* box-shadow: 0px 0px 36px #EDE715; */

      outline: none;

      color: #fff;

  }

  button.white{

    color: #Ffff;

    transition-duration: 0.8s;

    background: none;

    border: 1px solid #fff;

  }

  button.white:hover,button.white:active,button.white:focus{

       transition-duration: 0.8s;

      background:#AA1D22;

      outline: none;

      border-color:  #AA1D22;

      color: #fff;  

  }

  input, .form-control, select {

    /* background: #b5763794; */

    border: none;

    box-shadow: 0px 3px 21px rgba(0, 0, 0, 0.219);

    color: #f9f9f9;

    padding: 23px 24px;

    transition-duration: 0.8s;

    

    background: #252525;

    height: auto;

}

  input:focus, .form-control:focus {

      /* background: #e8f2ff; */

      outline: none;

      color: #efefef;

      box-shadow: none;

      /* border-radius: 0px 25px 25px 0px; */

      

      background: #b5b5b547;

    

  }

  .text-white input,.text-white .form-control,.text-white select {

      border-color:#fff; 

      color: #fff;

  }

  .text-white input:focus,.text-white .form-control:focus{

    background: #000;

    color: #fff

  }

  .text-white input::placeholder,.text-white .form-control::placeholder{

    color: #fff;

    opacity: 1; /* Firefox */

  }

  input:focus::placeholder, .form-control:focus::placeholder{

      color: #333;

  }

  input::placeholder,.form-control::placeholder{

    color: #ACACAC;

    opacity: 1; /* Firefox */

  }

  input::-webkit-outer-spin-button,

  input::-webkit-inner-spin-button {

    -webkit-appearance: none;

    margin: 0;

  }

  .clr-1{

    color: #DD1C1D;

  }

  .clr-2{

    color: #F78400;

  }
  
  .clr-3{

    color: #848484;

  }
 



  /* Firefox */

  input[type=number] {

    -moz-appearance: textfield;

  }

  label.h{

    position: absolute;

    opacity: 0;

    z-index: -999999999

  }

  section{

        overflow: hidden;

  }

  .p-200 {

    padding: 200px 0;

}

  /*global end*/

  .nav-bar{

    position: fixed;

    height: 100%;

    background: #000;

    color: #fff;

    top: 0;

    right: 0;

      clip-path: circle(0.2% at 100% 0);

    transition-duration: 1s;

    overflow-y: scroll;

    overflow-x: hidden;

    color: #fff;

    z-index: 9;

    /*clip-path: circle(0 at 100% 0);*/

  }

  .nav-bar.active{

    clip-path: circle(141.2% at 100% 0);

    /*clip-path: circle(70.7% at 50% 50%);*/

  }







.wave {

  background: url(../img/wave-1.svg) repeat-x; 

  position: absolute;

  top: -198px;

  width: 6400px;

  height: 198px;

  animation: wave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) infinite;

  transform: translate3d(0, 0, 0);

}



.wave:nth-of-type(2) {

   background: url(../img/wave.svg) repeat-x; 

  top: -175px;

  animation: wave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) -.125s infinite, swell 7s ease -1.25s infinite;

  opacity: 1;

}



@keyframes wave {

  0% {

    margin-left: 0;

  }

  100% {

    margin-left: -1600px;

  }

}



@keyframes swell {

  0%, 100% {

    transform: translate3d(0,-25px,0);

  }

  50% {

    transform: translate3d(0,5px,0);

  }

}

   .mainoverlay.active {

    height: 100vh;

    width: 100%;

    z-index: 1;

    background: #0000007a;

    position: fixed;

    top: 0;

}





header{

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

z-index: 9  ;

}



.banner{

  height: 100vh;

  background-position: top !important;

  background-repeat: no-repeat !important;

  background-size: cover !important;

  overflow: hidden;

}

.banner .overlay{

    background: rgba(0, 0, 0, 0.39);

    height: 100vh;

}

.bg-1{

  background: #D6274C;

}



.h-90{

  height: 90%;

}

.nav-tabs  li a {

  border: unset !important;

}

.nav-tabs{

  border: unset !important;

}

.text-shadow{

  text-shadow: 8px 9px 9px #dd1c1d7d;

}

.nav-open span{

    font-size: 29px;

}

.painting{

  height: 800px;

  background-size: cover;

  background-repeat: no-repeat ;

  background-position: center ;

  overflow: hidden;

  transition-duration: 0.5s;

}

.painting:hover{

  transform: scale(1.2) !important;

  transition-duration: 0.5s;

  z-index: 9;

}

.pain-discription{

  width: 100%;

  text-align: center;

  height: 300px;

  bottom: 0;

  right: 0;

  transform: translatey(350px);

  left: 0;

  background: #373B44;

  background: -webkit-linear-gradient(to right, #4286f4, #373B44);

  background: linear-gradient(to top, #f7840077 , #c2000077);

  position: absolute;

  clip-path: polygon(0 42%, 100% 0, 100% 100%, 0% 100%);

  transition-duration : 0.8s;

}

.painting:hover .pain-discription{

  transform: translatey(0);

  transition-duration : 0.8s ;

}

.pt-125{

  padding-top: 125px;

}

.overflow{

  overflow: hidden;

}

.painting-slider{

  width: 100% !important;

  height: 550px;

  overflow: hidden;

 

}

.w-450{

  width: 450px;

  overflow: hidden;

}

.col-border{

  border-top: 30px solid rgb(255 255 255 / 10%);

  border-right: 30px solid rgb(255 255 255 / 10%);

  border-bottom: 30px solid rgb(255 255 255 / 10%);

}

.color-img{

  background-size: cover;

  background-repeat:no-repeat;

  background-position : center;

  display: flex;

  height: 610px;

  justify-content: center;

}

.artist{

  width: 350px;

  height: 495px;

  align-self: center;

  overflow: hidden;

  background-position: center;

  border-radius: 30px 0px 30px;

  background-repeat: no-repeat;

  background-size: cover;

}

.cta-img{

  height: 300px;

  background-size: cover ;

  background-repeat: no-repeat;

  background-position: center;

}



.cta button {

  position: absolute;

  top: 4px;

  right: 6px;

  font-size: 21px;

  padding: 19px 23px;

  border-radius: 50px;

}

.cta form{

  position: relative !important;

}

.f-20{

  font-size: 20px;

}

.future-img{

  position: absolute;

  left: -3%;

  top: 0;

}

.brush-img{

  bottom: -36%;

  position: absolute;

  right: -5%;

}

.paint-img{

  position: absolute;

  top: 0;

  left: -46px;

}

.paint-img-2{

  right: 0;

  background-position: center;

  bottom: 0;

  position: absolute;

  right: -2%;

}

.item{

  overflow-x: hidden;

  height: 500px;

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  overflow: hidden;

  position: relative;

}

.item-discription{

  height: 166px;

  clip-path: polygon(0 36%, 100% 0, 100% 100%, 0% 100%);

  position: absolute;

  width: 100%;

  bottom: 0;

  background: olive;

  transform: translateY(300px);

  transition-duration: 0.5s;

  background: -webkit-linear-gradient(to right, #4286f4, #373B44);

  background: linear-gradient(to top, #f7840077 , #c2000077);

}

.item:hover .item-discription{

  transform: translateY(0);

  transition-duration: 0.5s;



}





.mouse {

    width: 40px;

    height: 77px;

    border-radius: 20px;

    border: 3px solid #fff;

    position: absolute;

    bottom: 0;

    left: 10px;

    transition-duration: 0.5s;

}

.mouse:before, .mouse:after {

  content: "";

  display: block;

  position: absolute;

}



.scroldown {

    overflow-x: hidden;

    height: 95px;

    position: absolute;

    z-index: 1;

    width: 65px;

    bottom: 0;

    cursor: pointer;

    

}

.scroldown:hover .mouse{

  background: #C20000;

  border-color: #C20000;



}
.inner-scroldown {

  overflow-x: hidden;

  height: 95px;

  position: absolute;

  z-index: 1;

  width: 65px;

  bottom: 200px;

  cursor: pointer;

  

}

.inner-scroldown:hover .mouse{

background: #C20000;

border-color: #C20000;



}





.m-3:before {

  width: 6px;

  height: 6px;

  border-radius: 50%;

  top: 6px;

  left: calc(50% - 3px);

  box-shadow: 0 6px 0 0 #fff, 0 18px 0 0 #fff, 0 30px 0 0 #fff;

  -webkit-animation: m-3-ball 1.2s ease-in-out infinite;

          animation: m-3-ball 1.2s ease-in-out infinite;

}


.inner-banner{

  height: 80vh;

  background-position: top !important;

  background-repeat: no-repeat !important;

  background-size: cover !important;

  overflow: hidden;

}

.inner-banner .overlay{

    background: rgba(0, 0, 0, 0.39);

    height: 80vh;

}
.product-select{
  background: #C20000;
  color: white;
  border-radius: 5px;
  padding: 17px 45px;
}
.cool-link::after {
  content: "";
  /* display:  block; */
  position: absolute;
  width: 40%;
  bottom: 0;
  height: 2px;
  background: #C20000;
  transition: width 0.3s;
  left: 0;
  /* transform: translateX(-500%); */
  /* transform: translate(-50px); */
}

.cool-link:hover::after {
  width: 100%;
  /* transform: translateX(0); */
  transition: width 0.3s;
}
.card-header {
  padding: unset; 
   margin-bottom: unset; 
   background-color: unset; 
   border-bottom: unset;
}
.card{
  background: unset !important;
}
.accordion-btn{
  background: #880A0A !important;
  color: white !important;

}
.accordion-btn:focus{
  box-shadow: unset !important;
}
.product{
  height: 550px;

  overflow: hidden;
  position: relative;
  
  transition-duration: 0.5s ;
  
}
.product img{
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.product:hover{
  transform: scale(1.1);
  transition-duration: 0.5s ;
  z-index: 9999;
}

.product-discription{

height: 275px;



position: absolute;




width: 100%;

clip-path: polygon(0 24%, 100% 0%, 100% 100%, 0% 100%);



bottom: 0;

background: olive;

transform: translateY(300px);

transition-duration: 0.5s;

background: -webkit-linear-gradient(to right, #4286f4, #373B44);

background: linear-gradient(to top, #f7840077 , #c2000077);
}

.product:hover .product-discription{

  transform: translateY(0);

  transition-duration: 0.5s;



}
.pagination{
  justify-content: flex-end;
}
.page-link {
  position: relative;
  display: block;
  padding: .5rem .75rem;
  margin-left: -1px;
  line-height: 1.25;
  box-shadow: 0px 0px 16px black;
  border-radius: 4px;
  color: #ffffff;
  background-color: #dd1c1d;
border: unset !important;
}
.productslider .slick-dots li {
  width: 150px;
  height: 200px;
}
.productslider .slick-dots {
  position: relative;
  min-width: 200px;
  top: 0;
  left: 0;
  /* height: 609px; */
  overflow-y: scroll;
  overflow-x: hidden;
}
.slick-dots li{
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 18px 27px;
  padding: 0;
  cursor: pointer;
}
.detail-description{
  background: #9F0606;
  border-radius: 7px;
}
.views-num{
  background: white;
  color: black;
  border-radius: 7px;
  box-shadow: 0px 3px 22px rgba(0, 0, 0, 0.144);
}
.detail-description-btn{
  background: unset !important;
  border: 3px solid white;
  border-radius: 3px;
}
.detail-accordion-btn{
  background: unset !important;
  color: white !important;

}
.detail-accordion-btn:focus, .detail-accordion-btn:hover  {
  box-shadow: unset !important;
  text-decoration: unset !important;
}
.artist-picture-detail{
  height: 220px;
  overflow: hidden;
border-radius: 50%;

}
.artist-picture-detail img{
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.quantity input{
  border-radius: unset !important;
  background: #93540D ;
  
  padding: 18px 20px;
}
.quantity .plus, .quantity .minus{
  padding: 20px 20px;
  background: #F78400;
}
.checkout-side{
  background: #F78400;
}
.artist-picture{
  border-radius: 50%;
  border: 8px solid #dd1c1d;
  overflow: hidden;
  height: 373px;
  width: 373px;

}
.artist-picture img{
  width: 100%;
  height: 100%;
  object-fit: cover;

}
.br-2{
  border-color: #dd1c1d !important;
}
.-margin{
  margin-top: -186.5px;
}
.profile-overlay{
  background: rgba(0, 0, 0, 0.712) !important;
  height: 80vh;
}
.follow-btn{
  border-radius: unset;
  padding: 5px 50px;
}
.cta-input{
  border-radius: 31px !important;
}
.contact-img{
  height: 500px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.login-banner{
  height: 100vh;
  background-position: top !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  overflow: hidden;
}
.login-banner .overlay{

  background: rgba(0, 0, 0, 0.39);

  height: 100vh;

}
.panel input{
  background: rgba(255, 255, 255, 0.322) !important ;
}
.panel input::placeholder{
  color: white !important;
  font-weight: 700;
}
.about-side{
  height: 800px;
overflow: hidden;
}
.about-side img{
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.blog{
  height: 250px;
  overflow: hidden;
}
.blog img{
  object-fit: cover;
  height: 100%;
}
.blog-shadow{
  box-shadow: 0px 0px 35px #00000085;
}
.blog-detail{
  height: 600px;
  background-size: cover;
  background-position: center ;
  background-repeat: no-repeat  ;
  border-radius: 50px 0px 0px 0px;
  box-shadow: 0px 0px 35px #00000085;
  overflow: hidden;
}
.faq h5{
  font-family:  'PT Sans' ;
}
.faq button{
  color: white !important;
  font-weight: 700;
}
.faq h4{
  color: #dd1c1d;
}
div#stars {}
#stars .rating-group {
    display: inline-flex;
}
#stars .rating__icon {
    pointer-events: none;
}
#stars .rating__input {
    position: absolute !important;
    left: -9999px !important;
}
#stars .rating__input--none {
    display: none;
}
#stars .rating__label {
    cursor: pointer;
    padding: 0 0.1em;
    font-size: 2rem;
}
#stars .rating__icon--star {
    color: #ffce00;
}
#stars .rating__input:checked ~ .rating__label .rating__icon--star {
    color: #e5e5e5;
}
#stars .rating-group:hover .rating__label .rating__icon--star {
    color: #ffce00;
}
#stars .rating__input:hover ~ .rating__label .rating__icon--star {
    color: #e5e5e5;
}




@-webkit-keyframes m-3-ball {

  0%, 100% {

    box-shadow: 0 6px 0 0 rgba(153, 153, 153, 0.25), 0 18px 0 0 rgba(153, 153, 153, 0.25), 0 30px 0 0 rgba(153, 153, 153, 0.25);

  }

  25% {

    box-shadow: 0 6px 0 0 #fff, 0 18px 0 0 rgba(153, 153, 153, 0.25), 0 30px 0 0 rgba(153, 153, 153, 0.25);

  }

  50% {

    box-shadow: 0 6px 0 0 rgba(153, 153, 153, 0.25), 0 18px 0 0 #fff, 0 30px 0 0 rgba(153, 153, 153, 0.25);

  }

  75% {

    box-shadow: 0 6px 0 0 rgba(153, 153, 153, 0.25), 0 18px 0 0 rgba(153, 153, 153, 0.25), 0 30px 0 0 #fff;

  }

}



@keyframes m-3-ball {

  0%, 100% {

    box-shadow: 0 6px 0 0 rgba(153, 153, 153, 0.25), 0 18px 0 0 rgba(153, 153, 153, 0.25), 0 30px 0 0 rgba(153, 153, 153, 0.25);

  }

  25% {

    box-shadow: 0 6px 0 0 #fff, 0 18px 0 0 rgba(153, 153, 153, 0.25), 0 30px 0 0 rgba(153, 153, 153, 0.25);

  }

  50% {

    box-shadow: 0 6px 0 0 rgba(153, 153, 153, 0.25), 0 18px 0 0 #fff, 0 30px 0 0 rgba(153, 153, 153, 0.25);

  }

  75% {

    box-shadow: 0 6px 0 0 rgba(153, 153, 153, 0.25), 0 18px 0 0 rgba(153, 153, 153, 0.25), 0 30px 0 0 #fff;

  }

}

.m-3:after {

  bottom: 10px;

  left: calc(50% - 5px);

  border: 5px solid transparent;

  border-top-color: #fff;

  -webkit-animation: m-5-arrow 1.2s ease-in-out infinite;

  animation: m-5-arrow 1.2s ease-in-out infinite;

}

@-webkit-keyframes m-5-arrow {

  20%, 100% {

    transform: translateY(0);

  }

  50% {

    transform: translateY(9px);

  }

  80% {

    transform: translateY(-3px);

  }

}



@keyframes m-5-arrow {

  20%, 100% {

    transform: translateY(0);

  }

  50% {

    transform: translateY(9px);

  }

  80% {

    transform: translateY(-3px);

  }

}

.one-time .slider .slick-prev {

    left: 10px;

    z-index: 9999999;

}

.one-time .slider .slick-next {

    right: 10px;

    z-index: 9999999;

}

.slick-next:before, .slick-prev:before{

  /* use !important to prevent issues with browser extensions that change fonts */

  font-family: 'icomoon' !important;

  speak: never;

  font-style: normal;

  font-weight: normal;

  font-variant: normal;

  text-transform: none;

  line-height: 1;



  /* Better Font Rendering =========== */

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

}

.slick-prev:before{

  content: "\f177";

}

.slick-next:before{

  content: "\f178";

}

.responsive .slick-prev {

    top: -10%;

    right: 20%;

    left: auto;

}

.responsive .slick-next {

    top: -10%;

    right: 10%;

    /*left: auto;*/

}

@supports (-moz-appearance:none) {



  SELECT

  {

  -moz-appearance:none !important;

  background: transparent url('data:image/gif;base64,R0lGODlhBgAGAKEDAFVVVX9/f9TU1CgmNyH5BAEKAAMALAAAAAAGAAYAAAIODA4hCDKWxlhNvmCnGwUAOw==') right center no-repeat !important;

  background-position: calc(100% - 5px) center !important;

  }



}

  @media (min-width: 1367px){

   

    .w-xl-80{

      width: 80%;

    }
    .w-xl-90{

      width: 90%;

    }

  }

  @media (max-width: 1025px){

   

  }

  @media (max-width: 768px) {

    h1 {

      font-size: 45px;

  }

  .w-100-btn{

    width: 100%;

  }

  .over-x .nav-item{

    font-size: 10px;

  }

  .painting-slider{

    width: 377px !important;

    height: 550px;

    overflow: hidden;

  }

  form.subscribe button {

    position: absolute;

    top: 0;

    right: 0;

    padding: 14px 35px;

    box-shadow: none;

    border-radius: 0 25px 25px 0;

}

  @media screen and (max-width: 576px){

     .f-24{

    font-size: 18px;

  }

  

.f-md{

      position: fixed;

      bottom: 0;

      box-shadow: 0 -5px 16px #fd2d2c12;

      left: 0;

      right: 0;

      background: rgb(0, 0, 0);

      z-index: 999;

      color: rgb(255, 255, 255)  !important;

      

    }

     .search-box{

       top: 85%;

     }

  .f{

    color: black !important;

  }

  }
  @media screen and (max-width: 376px){
  }
  @media screen and (max-width: 322px){
  }
  select, textarea, input[type="text"], input[type="password"],input[type="datetime"], input[type="datetime-local"],input[type="date"], input[type="month"], input[type="time"],input[type="week"], input[type="number"], input[type="email"],input[type="tel"], input[type="url"]{
    font-size: 16px; 
  }