* {
  padding: 0;
  margin: 0;
}

a {
  text-decoration: none;
  color: #000;
}

li {
  list-style: none;
}

img {
  max-width: 100%;
}
button {
  border: none;
}

:root {
  --primary-color: #e23030;
  --secondary-color: #000000;
  --text-color: #474646;
  --primary-font: "Rubik", sans-serif;
  --secondary-font: "Inter", sans-serif;
}

p {
  font-family: var(--secondary-font);
  line-height: 1.6;
}

body {
  font-family: var(--primary-font);
  overflow-x: hidden !important;
}

section {
  padding: 3.4em 0;
}

.ms-align {
  display: flex;
  align-items: center;
}

html{

  scroll-behavior: smooth;
}

/* HEADER */

header {
  padding: 20px 0;
  position: absolute;
  width: 100%;
  z-index: 22;
  transition: all 0.3s linear;
}

header.fixed{

  position: fixed;
  background-color: #fff;
  -webkit-box-shadow: -1px 10px 18px -11px rgba(0,0,0,0.21);
  -moz-box-shadow: -1px 10px 18px -11px rgba(0,0,0,0.21);
  box-shadow: -1px 10px 18px -11px rgba(0,0,0,0.21);
  z-index: 222;
  transition: all 0.3s linear;
}

header.fixed .main-menu ul li a{

  color: #000;
  transition: all 0.3s;
}

header.fixed ul li::before {
  content: "";
  position: absolute;
  bottom: -7px;
  left: 0;
  width: 0;
  height: 2px;
  background-color: var(--primary-color);
  display: block;
  transition: all 0.3s;
  transform: translateX(-1px);
  opacity: 0;
}
.navBar {
  display: flex;
  width: 100%;
  align-items: center;
}

.navBar .navMenu {
  margin-left: auto;
}

.main-menu ul {
  display: flex;
  gap: 40px;
}

.main-menu ul li {
  position: relative;
}

.main-menu ul li a {
  color: #fff;
}

.main-menu ul li::before {
  content: "";
  position: absolute;
  bottom: -7px;
  left: 0;
  width: 0;
  height: 2px;
  background-color: #fff;
  display: block;
  transition: all 0.3s;
  transform: translateX(-1px);
  opacity: 0;
}

.main-menu ul li:hover::before {
  width: 40%;
  opacity: 1;
  transform: translateY(0);
}

.has-sub {

  position: relative;
}

.has-sub a i{

  font-size: 10px;
}
.main-menu .sublist{

  display: block;
  position: absolute;
  top: 24px;
  padding: 8px 12px;
  left: 0;
  width: 240px;
  z-index: 22;
  background: var(--primary-color);
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s linear;
  transform: translateY(-2px);

}
.main-menu .has-sub:hover .sublist{

  opacity: 1;
  visibility: visible;
  transform: translateY(0);

}

.main-menu .sublist li{

  margin: 16px 0;
  transition: all 0.3s;

}

.sublist li:hover{

  transform: translateX(5px);
}

.sublist li:nth-child(1){

  margin-top: 8px;
}

.sublist li:last-child{

  margin-bottom: 8px;
}


.sublist li a{

  transition: all 0.3s;
  color: #fff !important;
}
.logo img {
  width: 130px;
}

.logo a{

  display: flex;
  gap: 10px;
  align-items: center;
}

.logo a h1{

  text-transform: uppercase;
    font-size: 15px;
    color: #fff;
}

.logo a h1 span{

  display: block;
}

.fixed .logo a h1{

  color: #000;
}
/* INNER PAGE HEADER */

.sz-header .main-menu ul li a{

  color: var(--secondary-color);
}
.sz-header{
  position: relative;
}


.sz-header .logo a h1{

  color: #000;
}

header.fixed .navBar{

  border-bottom: none;
  padding-bottom: 0;
}
.sz-header .navBar{

  border-bottom: 1px solid #f1f1f1;
  padding-bottom: 20px;
  transition: all 0.3s;
}


header.fixed .productSubBlk{

  top: 50px;
}

/* MOBILE MENU */

.mob-toggle{

  display: block;
}

.mob-toggle span{
  width: 32px;
  height: 2px;
  display: block;
  margin: 6px 0;
  transform: rotate(0deg);
  background: #fff;
  transition: all 0.3s ease;
}

.mob-toggle.open span:nth-child(1){

  transform:rotate(45deg);
  background: #000;
}

.mob-toggle.open span:nth-child(2){

  transform: rotate(-45deg)translate(7px, -5px);
  background: #000;
}

.mob-toggle.open span{

  transform: rotate(360deg);
}

.sz-header .mob-toggle span{

  background: #000;
}

.mob-toggle{

  display: none;
}

.back{

  display: none;
  width: 40px;
  height: 40px;
  margin: auto;
  line-height: 40px;
}
/* HERO */
.sz-Herobg {
  background-image: url(../assets/img/bg.jpg);

  height: 100%;
  background-size: cover;
  height: 100vh;
  display: flex;
  align-items: center;
}

.sz-heroContent {
  color: #fff;
  width: 700px;
}

.sz-heroContent h1 {
  font-size: 50px;
  margin-bottom: 12px;
}

.sz-heroContent p {
  color: #c9c9c9;
  margin-bottom: 12px;
}
.sz-heroContent a {
  color: var(--secondary-color);
  background: #fff;
  padding: 14px 28px;
  display: inline-block;
  margin: 12px 0;
  padding: 15px 25px;
  border: unset;
  color: #212121;
  z-index: 1;
  background: #e8e8e8;
  position: relative;
  font-size: 16px;
  -webkit-box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
  box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
  transition: all 250ms;
  overflow: hidden;
}

.sz-heroContent a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 0;

  background-color: var(--primary-color);
  z-index: -1;
  -webkit-box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
  box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
  transition: all 250ms;
}

.sz-heroContent a:hover {
  color: #fff;
}

.sz-heroContent a:hover::before {
  width: 100%;
}

button {
  padding: 15px 25px;
  border: unset;
  color: #212121;
  z-index: 1;
  background: #e8e8e8;
  position: relative;
  font-family: var(--primary-font);
  font-weight: 400;
  font-size: 16px;
  -webkit-box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
  box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
  transition: all 250ms;
  overflow: hidden;
}

button::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 0;

  background-color: #212121;
  z-index: -1;
  -webkit-box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
  box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
  transition: all 250ms;
}

button:hover {
  color: #e8e8e8;
}

button:hover::before {
  width: 100%;
}

/* OUR PRODUCTS */
.prTitle h2{

  font-size: 45px;
  margin-bottom: 12px;
}

.sz-pr-img{

position: relative;
overflow: hidden;
line-height: 0;
margin: 5px;
}

.sz-pr-img img{

  width: 100%;
}

.sz-pr-img::after{
content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: linear-gradient(0deg, rgba(226, 48, 48, 0.315) 0%, rgba(255, 255, 255, 0) 101.83%);
  display: block;
  z-index: 22;
}

.sz-img-blk-pr{

  position: relative;
  overflow: hidden;
}

.sz-img-blk-pr img{

  width: 100%;
  height: 100%;
  position: absolute;
  object-fit: cover;
}

.sz-img-blk-pr::after{

    content: "";
    display: block;
    padding-top: 100%;
}
.sz-pr-img h4{

  position: absolute;
  bottom: 30px;
  left: 20px;
  width: 100%;
  color: #fff;
  z-index: 222;
  font-weight: 500;
  font-size: 18px;
}

.pr-slidearrow{

  margin-top: 20px;
}
/* ABOUT */

.sz-about {
  background: #f8f8f8;
  padding: 3.2em;
  position: relative;
  display: flex;
  align-items: center;
  max-height: 100%;
}
.sz-about .col-md-6:last-child{

  position: initial;
}

.sz-abtImg{

  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
}

.sz-about h2 {
  font-size: 45px;

  text-transform: capitalize;
  margin-bottom: 18px;
}

.sz-scTitle span {
  color: var(--primary-color);
  font-size: 16px;
  display: block;
  margin-bottom: 8px;
  text-transform: uppercase;
  font-weight: 500;
}

.sz-abtContent p {
  color: var(--text-color);
}

.sz-secoBtn {
  margin: 12px 0;
}

.sz-secoBtn a {
  padding: 14px 28px;
  display: inline-block;
  margin: 12px 0;
  padding: 15px 25px;
  border: unset;
  color: #fff;
  z-index: 1;
  background: var(--primary-color);
  position: relative;
  font-size: 16px;
  transition: all 250ms;
  overflow: hidden;
}

.sz-secoBtn a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 0;

  background-color: #fff;
  z-index: -1;
  -webkit-box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
  box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
  transition: all 250ms;
}

.sz-secoBtn a:hover {
  color: var(--primary-color);
}

.sz-secoBtn a:hover::before {
  width: 100%;
}





.sz-abtImg img {
  display: block;
  margin-left: auto;
  height: 100%;
}

/* NEW ARRIVALS */

.sz-productTitle{

  margin-top: 20px;
}
.secTitle {

    margin-bottom: 20px;
}
.secTitle h2 {
  font-size: 40px;
  position: relative;
  display: inline-block;

}

.secTitle h2::before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  width: 20%;
  height: 3px;
  background: var(--primary-color);
}

.sz-newArrivalBlk {
  background: rgba(217, 217, 217, 0.2);
  border-radius: 5px;
  padding: 20px;
  margin-right: 12px;
  height: 100%;
}

.sz-newArrivalImg{
    position: relative;
    overflow: hidden;
}

.sz-newArrivalImg img{

    width: 175px;
    height: 175px;
    max-height: 100%;
    max-width: 100%;
    display: block;
    margin: auto;
}

.sz-productBlkPrice{

    display: inline-flex;
    align-items: center;;
    margin-top: 20px;
    gap: 6px;
    font-weight: 400;
}

.sz-productBlkPrice span{


    background: var(--primary-color);
    color: #fff;
    padding: 6px;

}

.secTitleHd{

    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.sz-slideArrow{

    margin-left: auto;
    display: flex;
    gap: 15px;
}


.sz-slideArrow span{

    background: var(--primary-color);
    color: #fff;
    width: 40px;
    height: 40px;
    text-align: center;
    display: block;
    line-height: 40px;
}

.sz-slideArrow span {
    display: inline-block;
    border: unset;
    color: #fff;
    z-index: 1;
    background: var(--primary-color);
    position: relative;
    font-size: 16px;
    transition: all 250ms;
    overflow: hidden;
    cursor: pointer;
  }

  .sz-slideArrow span::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 0;

    background-color: #fff;
    z-index: -1;
    -webkit-box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
    box-shadow: 4px 8px 19px -3px rgba(0, 0, 0, 0.27);
    transition: all 250ms;
  }

  .sz-slideArrow span:hover {
    color: var(--primary-color);
  }

  .sz-slideArrow span:hover::before {
    width: 100%;
  }


  .item .sz-newArrivalSlider:last-child{

    margin-right: 0;
  }

  .sz-titleright{

    margin-left: auto;
  }

  /* GALLERY */

  .sz-gallery .col-md-4{

    margin-bottom: 24px;
  }

  .gal-img-blk{

    position: relative;
    overflow: hidden;
  }

  .gal-img-blk img{

    width: 100%;
    height: 100%;
    position: absolute;
    object-fit: cover;
  }

  .gal-img-blk::after{

    content: "";
    display: block;
    padding-top: 100%;
  }

  /* SIGNATURE */

  .sz-signature-bg{


    background: var(--primary-color);

  }

  .sz-row{

    padding: 100px;
    display: flex;
    color: #fff;
  }


.sz-signature-bg span{

    display: block;
    width: 40px;
    height: 50px;
}

/* BANNER */

.sz-banner{

  background-image: url(../assets/img/banner.jpg);
  position: relative;
  padding: 200px 0;
  height: 100%;
  background-size: cover;

}

.sz-bannerContent{

  color: #fff;
  width: 700px;
  max-width: 100%;
  position: relative;
  z-index: 22;
  margin-bottom: 50px;
}

.sz-bannerContent h5{

  font-size: 50px;
  text-transform: capitalize;
  font-weight: 500;
  margin-bottom: 12px;
}

.sz-bannerContent p{
  padding-right: 8em;
  color: #E7E7E7;
}

.sz-signature{

  position: relative;
  display: block;
  margin-top: -200px;
}

/* FOOTER */

footer{

  background: #161616;
  color: #fff;
  padding: 3.4em 0;
  padding-bottom: 0;
}

footer a{

  color: #fff;
}

.sz-ftrLogo img{

  width: 220px;
}
.sz-ftrContent ul {

  display: flex;
  gap: 35px;
  margin-top: 25px;
}

.sz-ftrContent ul li a{

  color: #fff;
}

.sz-ftrContent p{

  padding-right: 3em;
}

.sz-ftrLink h4,
.sz-ftrContact h4{

  font-size: 16px;
  font-weight: 500;
  margin-bottom: 18px;
  margin-top: 50px;
}

.sz-ftrLink ul li{

  margin: 20px 0;
}

.sz-ftrContact ul li {
  margin: 20px 0;
  position: relative;
  padding-left: 30px;
}

.sz-ftrContact ul li i{
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
}

.copyright{

  text-align: center;

  padding-top: 60px;
  padding-bottom: 30px;
}

/* INNER PAGE */

.pgTitle h2{

  font-size: 45px;
}

.pgTitle ul{

  display: flex;
  margin-top: 18px;
  position: relative;
}
.pgTitle ul::after{
  content: "";
  position: absolute;
  width: 15%;
  height: 2px;
  background: #dfdfdf;
  display: block;
  bottom: -10px;
  left: 0;
}

.pgTitle ul li{

  font-size: 14px;
}


.pgactive{

  color: var(--primary-color);
  font-weight: 500;
}

.pgTitle span{

  display: inline-block;
  padding: 0 6px;
  position: relative;
}
/* PRODUCT PAGE */
.productSubBlk{

  background: #fff2f2;
  padding: 12px 20px;
  position: sticky;
  position: -webkit-sticky;
  top: 20px;
}

.productSub-List ul li{

  margin: 18px 0;
}

.productSub-List ul li a{
color: #494949;
}

.productSubBlk h4{

  font-size: 22px;font-weight: 500;
}

.sz-productBlk{

  background: rgba(217, 217, 217, 0.2);
  border-radius: 5px;
  padding: 20px;
  margin-bottom: 20px;
}

.productSliderThumb img{

  width: 100px;
  cursor: pointer;
}

.productSliderMainImg img{
  width: 400px;
}

.productin-DetailsBlk{
margin-left: 6em;
}
.productdetail-Title h2{

  font-size: 35px;
  margin-bottom: 8px;
}

.productdetail-Title span{

  font-size: 20px;
  display: block;
  margin-bottom: 14px;
}

.productDesc-blk button{

  box-shadow: none;
text-align: left;
  margin-right: 10px;
  font-size: 16px;
  font-weight: 500;
  width: 200px;
  height: 50px;
  max-width: 100%;
  cursor: pointer;
  background: rgba(217, 217, 217, 0.2);
}

.productDesc-blk button:hover{

  background: var(--primary-color);
}

.productDesc-blk button::before{

  display: none;
}

.productDesc-tab .activeTab{

  background: var(--primary-color);
  color: #fff;
}

.productDesc-tab{

  display: flex;
}

.prodDesc-detailBlk{

  border: 1px solid #dfdfdf;
  padding: 15px;
  margin-top: 10px;
}

.productDescTab-content h3{

  margin: 13px 0;
}

.productDescTab-content p{

  margin-bottom: 20px;
}

.productDescTab-content ul li{

  margin: 14px 0;
  list-style: disc;
}


.productDescTab-content ul {

  padding-left: 18px;
}


.tech-img img{

  width: 250px;
  object-fit: cover;
  object-position: center;
}

.productDesc-blk h4{

  margin-bottom: 8px;
  color: #474646;
  font-size: 18px;
  font-weight: 500;
}

.doc-download{

  margin-bottom: 20px;
}

.doc-download a{

  color: var(--primary-color);
  font-weight: 500;
}

.pge-sec-title h3{

  font-size: 25px;
  font-weight: 500;
  margin-bottom: 20px;
}
.smlr-product{

  padding-top: 0;
}


/* ABOUT PAGE */

.about-content{
  padding-left: 4em;
}

.about-content h2{

  font-size: 30px;
  margin-bottom: 10px;
}

.about-content p{

  color: var(--text-color);
  margin-bottom: 10px;
}

.abt-signature{

  margin-top: 0;
}


/* GALLERY PAGE */

.gal-pg .col-md-4{
  margin-bottom: 24px;
}

.cntact-pg h3{

  font-size: 28px;
  text-align: center;
}

.cntact-pg span{

  text-align: center;
  display: block;
  margin-top: 4px;
  color: var(--text-color);
}

.cntct-info ul li{
  position: relative;
  padding-left: 28px;
  margin: 32px 0;
  font-size: 18px;
}

.cntct-info ul li i{

  position: absolute;
  top: 0;
  left: 0;
  font-size: 20px;
}

.cntct-title{

  margin-bottom: 40px;
}

.frmInput label{

  display: block;
  margin-bottom: 6px;
}

.frmInput input,
.frmInput textarea{

  display: block;
  width: 100%;
  padding: 12px 6px;
  margin-bottom: 12px;
  font-family: var(--primary-font);
  transition: all 0.3s;
  border: 1px solid #a8a8a8;
  font-size: 16px;
}

.frmInput textarea {

  height: 150px;
  resize: none;
}

.frmInput input:focus,
.frmInput textarea:focus{

  outline: none;
  border: 1px solid var(--primary-color);
}

.cntct-frm{

  margin-left: 6em;
  background: rgb(255, 231, 231);
  padding: 40px;
}

.social-cntct ul{

  display: flex;
  gap: 15px;
}

.social-cntct ul li a{

  color: #fff;
  background: var(--primary-color);
  height: 50px ;
  width: 50px;
  line-height: 50px;
  text-align: center;
  display: block;
  transition: all 0.3s;
}

.social-cntct ul li a:hover{

  color: var(--primary-color);
}

.social-cntct ul li a:hover{

background: transparent;
}

.no-products{

    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100px;
}