@charset "utf-8";
/* general Reset */
*, *::before, *::after { box-sizing: border-box;}
*:not(dialog) { margin: 0; }
body { line-height: 1.5; -webkit-font-smoothing: antialiased; }
img, picture, video, canvas, svg { display: block; max-width: 100%;}
input, button, textarea, select { font: inherit;}
p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }
p { text-wrap: pretty; }
h1, h2, h3, h4, h5, h6 { text-wrap: balance; }
#root, #__next { isolation: isolate; }
@media (prefers-reduced-motion: no-preference) {
  html { interpolate-size: allow-keywords; }
}

/* base styles */
html {
	font-size: 14px;
	font-weight: 400;
	line-height: 28px;
	height: 100%;
}

body {
	font-family: "Open Sans", sans-serif;
	font-weight: 400;
	font-size: 1rem;
	letter-spacing: 0.1px;
	line-height: 1.8;
	color: #051922;
	overflow-x: hidden;
}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    margin: 0 0 1.25rem 0;
    color: #051922;
}

h2, .h2 { font-size: 3rem; font-weight: 700; line-height: 3.25rem;}
h4, .h4 { font-size: 1.5rem; font-weight: 700; line-height: 1.75rem;}
a {
    cursor: pointer;
    text-decoration: none;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
	color: #fff;
    background-color: transparent;
}

p { margin: 0 0 1.25rem 0; }
p:last-child { margin: 0; }

svg {  overflow: hidden;  vertical-align: middle; display:inline;}

.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0;}
.img-fluid {max-width:100%; height:auto; display: block; }
.blue-bg { background-color: #162133;}

.mr-3 {margin-right:1rem}
.nav-top { width:100%; display:flex; justify-content: space-between;position: relative; padding: 5px 15px; z-index:1000}
.nav-top a { color: black; font-weight: 700;}
.nav-top .fas { background: red; height: 25px; width: 25px; line-height: 25px; text-align: center; border-radius: 20px; color:#fff;}
.nav-top a .fa-facebook-square { font-size: 27px; line-height: 26px;}


.top-header-area { position: absolute; z-index: 999; width: 100%; padding: 35px 15px 25px 15px; -webkit-transition: 0.3s; transition: 0.3s;}
.sticky-wrapper {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999 !important;
}
.sticky-wrapper.is-sticky .top-header-area {
  background-color: #051922;
  padding: 15px;
}


@media screen and (max-width: 450px) {
    .top-header-area {  padding: 57px 0 25px 0; }
}

/* Grid */
.outer-container { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto;}
.w1420 {max-width: 1420px !important}
.w1040 {max-width: 1040px !important}
.flex-container { width: 100%; display:flex; flex-wrap: wrap; position: relative;}
.c12 {position: relative;flex: 0 0 100%; max-width: 100%; padding-right: 15px; padding-left: 15px;}
.c4, .c4-s6, .c4-m6  {position: relative;flex: 0 0 33.33333%; max-width: 33.33333%; padding-right: 15px; padding-left: 15px;}
.c8  {position: relative;flex: 0 0 66.666667%; max-width: 66.666667%; padding-right: 15px; padding-left: 15px;}
.c6  {position: relative;flex: 0 0 50%; max-width: 50%; padding-right: 15px; padding-left: 15px;}

@media screen and (max-width: 768px) {
  .c4-m6  {flex: 0 0 50%; max-width: 50%;}
}

@media screen and (max-width: 576px) {
  .c4-s6  {flex: 0 0 50%; max-width: 50%;}
  .c4, .c6, .c8, .c4-m6 {flex: 0 0 100%; max-width: 100%;}
  .nomob {display:none;}
}

.site-logo { padding: 6px 0; float: left; max-width: 210px; }
.main-menu-wrap {flex: 0 0 100%; max-width: 100%;}
.main-menu { display:block; text-align: right;}
nav.main-menu ul {padding: 0; list-style: none;}
nav.main-menu ul>li { position: relative; display: inline-block;}
nav.main-menu ul li.current-list-item>a { color: white;}
nav.main-menu ul li.current-list-item>a { color: #fbcd01; }
nav.main-menu ul li a { color: #fff; font-weight: 700; display: block; padding: 35px 15px 15px 15px; text-transform: uppercase;}
nav.main-menu ul li .btn-red, .btn-red { background: #d33434; border-radius: 20px; padding: 10px 20px;}
nav.main-menu li:hover > a { color: #fbcd01; }
nav.main-menu ul li.current-list-item > a { color: white; }


#menu-button { display: none; }
nav.mobile {display: none;}
@media screen and (max-width: 800px) {
    #menu-button {
		padding-top: 35px;
		padding-right: 15px;
        display: inline-block;
        font-size: 24px;
        position: relative;
        line-height: 40px;
        z-index: 1000;
		color:#fff;
    }
	.main-menu ul {display:none}
	
	 nav.mobile {
        display: block;
        position: fixed;
        top: 0;
        left: -250px;
        width: 250px;
        height: 100%;
		color: #fff;
        background: #051921e6;
        z-index: 2000;
        overflow: auto;
        text-align: left;
    }
	
	nav.mobile .menu-toggle {
		position: absolute;
		right: 15px;
		top: 0;
		font-size: 24px;
	}
	nav.mobile .mobile-logo {
		margin-top: 15px;
		padding: 20px;
		/*opacity:0.6;*/
	}
	nav.mobile ul {padding: 0 20px; list-style: none;}
	nav.mobile ul>li { position: relative; display:block;border-bottom: 1px solid #fdcb3c;}
	nav.mobile ul li a { color: #fff; font-weight: 700; display: block; padding-left:8px; line-height:36px; text-transform: uppercase; }
	nav.mobile li:hover > a, nav.mobile li:active > a { color: #fbcd01; }

}


/*banner*/
.banner-home {
  height: 850px;
  background-image: url(/img/bg-home.jpg);
  background-size: cover;
  background-position: 50% 50%;
  background-color: #051922;
  box-shadow: rgb(0 0 0 / 30%) 0 0 0 1000000px inset;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-bottom-left-radius: 50px;
  border-bottom-right-radius: 50px;
}

.banner-text {width:100%; max-width:800px}
.banner-text h1 span {display:block;}
.banner-text h1, .banner-text h1 span { color:white; } 
.banner-text h1{ font-size: 46px; line-height: 60px; }
.banner-label{ font-size: 22px; font-weight: 600; opacity: 0.9;}

@media screen and (max-width: 550px) {
    .banner-home { height: 550px; }
    .banner-text h1 { font-size: 26px; line-height: 36px;}
    .banner-label{ font-size: 17px; }
	.banner-text h1 { font-size: 26px; line-height: 36px; }
}


/*page banners*/
.breadcrumb-section {
    padding: 150px 0;
    background-size: cover;
    background-position: center center;
    position: relative;
    z-index: 1;
    padding-top: 200px;
    background-image: url(/img/layout-header.jpg);
	background-color: #051922;
}
.breadcrumb-section::after {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  content: "";
  background-color: rgb(0 0 0 / 35%);
  z-index: -1;
}

.breadcrumb-text { text-align:center;}

.breadcrumb-text p {
  color: #fbcd01;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 7px;
}
.breadcrumb-text h1, .breadcrumb-text h2 {
  font-size: 50px;
  font-weight: 800;
  color: #fff;
  margin: 0;
  margin-top: 0px;
  margin-top: 20px;
}
@media only screen and (max-width: 767px) {
  .breadcrumb-text h1, .breadcrumb-text h2 {
    font-size: 30px;
  }
}

/*search*/
.home-search { padding: 75px 30px;}
.srchtitle-box, .srchform-box { flex: 0 0 50%;  max-width: 50%;}
.home-search-text h3 { font-size: 40px; line-height: 45px;}
.home-search-text {max-width: 320px;}
.home-search-form .flex-container {margin-right:-15px; margin-left:-15px}
.home-search-form .c4-m6 {margin-bottom: 15px}
.home-search-form input { width: 100%; border: 1px solid #e5e6e9; border-radius: 50px; height: 40px; padding-left: 18px; font-size: 13px; background: white; text-align: center !important;}
#srchgo { background: #d33434; border-radius: 20px;  padding: 10px 20px; color: white; border: none; font-weight: 600;}

@media screen and (max-width: 576px) {
  .srchtitle-box, .srchform-box {flex: 0 0 100%; max-width: 100%;}
}

/*category slider */
.home-categories {
  padding: 75px 30px;
  background: #E10005;
  border-top-left-radius: 50px;
}
.home-categories h3 {font-size: 40px; line-height: 45px;}
.home-categories p, .home-categories h3 { color: white;}
.home-categories .btn-black { background: black; padding: 10px 20px; border-radius: 50px; color: white; font-weight: 600;}
.home-categories-slider { margin-top: -110px;}
@media screen and (max-width: 767px) {
  .home-categories-slider { margin-top: 30px; }
}
.home-categories .item a { color: black; padding: 25px 20px; background: white; display: block; border-bottom-left-radius: 25px; border-bottom-right-radius: 25px; }
.home-categories .item a svg { color: red; margin-bottom: 3px;}

.owl-nav { height: auto; top: 100%; color: white; font-size: 25px; -webkit-transition: 0.3s; transition: 0.3s;}
.owl-prev { position: absolute; right: 60px;}
.owl-next { position: absolute; right: 30px;}

/*manufacturer section */
.home-manu {
  padding: 75px 30px;
  background-image: url(/img/bg-manu.jpg);
  background-size: cover;
  background-position: 50% 50%;
  background-color: #051922;
  box-shadow: rgb(0 0 0 / 60%) 0 0 0 1000000px inset;
}
.home-manu h3 { font-size: 40px; line-height: 45px; }
.home-manu h3 span { font-size: 1.5rem; font-weight: 700; line-height: 1.75rem; display: block; margin-bottom: 20px; }
.home-manu h3, .home-manu p, .home-manu .btn-red { color: white;}
.home-manu .item img { background: white; max-width: 250px; padding: 0 50px; border-radius: 50px;}
.manulogos {margin-top:25px}

/* about area */
.abt-section { background-color: #f5f5f5; padding: 120px 0;}
.abt-section .abt-text { padding: 50px; padding-left: 30px;}

/* page content */
.page-section {padding: 80px 0;}

.page-content {
	max-width:1030px;
	padding: 0 15px;
	margin-right:auto;
	margin-left:auto;
}
.page-content h4 {
	margin-top: 30px;
 	 margin-bottom: 10px;
}

.form-title h2 { font-size: 25px; }


.contact-form {margin-bottom: 20px;}
.contact-form input[type=text], .contact-form input[type=tel], .contact-form input[type=email], #CaptchaAnswer {
    width: 49%;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 3px;
    margin-top: 12px;
}

@media only screen and (max-width: 767px) {
  .contact-form input[type="text"], .contact-form input[type="tel"], .contact-form input[type="email"], CaptchaAnswer {
    width: 100%;
  }
}
.contact-form textarea {
  border: 1px solid #ddd;
  padding: 15px;
  height: 200px;
  border-radius: 3px;
  width: 100%;
  resize: none;
  margin-top: 12px;
}
.contact-form-box { padding-left: 40px; margin-bottom: 30px; }
.contact-form-box h3 { font-size: 20px; font-weight: 600; position: relative; margin-bottom: 10px;}
.contact-form-box h3 i { position: absolute; left: -35px; color: #fbcd01; top: 8px;}
.contact-form-box p a { line-height: 1.8; opacity: 0.8; color: #051922; }
.contact-form-box p a:hover { opacity:1; text-decoration: underline; }
button.cart-btn {
	margin-top:20px;
    font-family: 'Poppins', sans-serif;
    display: inline-block;
    background-color: #d33434;
    color: #fff;
    padding: 10px 20px;
    border: none;
	border-radius: 50px;
}

/*control the Captcha */
.CaptchaPanel {
margin:0 0 0 0 !important;
padding:0 0 0 0 !important;
text-align: left !important;
line-height:normal !important;
}

.CaptchaImagePanel {
margin:0 0 0 0;
padding: 5px 0 10px 0! important;
}

.CaptchaMessagePanel {
padding:0 0 0 0 !important;
margin:0 0 0 0 !important;
font-weight:normal !important;
font-size:12px;
line-height:14px;
}

.CaptchaAnswerPanel {
margin:0 0 0 0;
padding:2px 0px 2px 0px !important;
}

.CaptchaWhatsThisPanel {
	line-height:0;
	margin:0 0 0 0;
	padding:8px 0 8px 0 !important;
}
.CaptchaWhatsThisPanel a {color:#000;}
.CaptchaWhatsThisPanel a:hover {text-decoration:none;} 


.find-location p { text-align:center; color: #fff; font-size: 40px; margin: 0; font-weight: 600; padding: 95px 0;}
.find-location p i { margin-right: 10px; color: #fbcd01;}
@media only screen and (max-width: 767px) {
  .find-location p { font-size: 30px; }
}
.gallerypage { text-align:center; max-width: 1420px;}

.gallery-col { margin-bottom: 30px; }
.gallery-pic { overflow: hidden; cursor: pointer; }
.gallery-pic img {
  -webkit-box-shadow: 0 0 20px #e4e4e4;
  box-shadow: 0 0 20px #e4e4e4;
  border-radius: 5px;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.gallery-pic:hover img {
  -webkit-box-shadow: none;
  box-shadow: none;
  zoom: 1.5;
  -ms-zoom: 1.5;
  -moz-transform: scale(1.5);
  -o-transform: scale(1.5);
  -webkit-transform: scale(1.5);
  transform: scale(1.5);
}

/*contact page */

.contact-section {
	margin: 150px 0;
}
.contactform {
	max-width:1230px;
	padding: 0 15px;
	margin-right:auto;
	margin-left:auto;
}

/*footer */
.footer-area { background-color: #051922; color: #fff; padding: 80px 15px; width:100%;}
.footer-content {display: flex; justify-content: space-between; flex-wrap: wrap}

.footer-col {position: relative;-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; padding-right: 15px; padding-left: 15px;}

.footer-box p { color: #fff; opacity: 0.7; line-height: 1.8;}
.footer-box ul { margin: 0; padding: 0; list-style: none; }
.footer-box ul li {  opacity: 0.7; margin-bottom: 10px; line-height: 1.8;}
.footer-box.pages ul li { position: relative; padding-left: 20px; }
.footer-box ul li a { color: #fff;}
.footer-box.pages ul li a { transition: 0.3s; color: #fff; }
.footer-box.pages ul li::before { position: absolute; left: 0; top: 0; content: "\f105"; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #fbcd01;}
.footer-box.pages ul li:hover a { color: #fbcd01; }
h3.widget-title { font-size: 24px; font-weight: 500; position: relative; padding-bottom: 20px; color: #fff; line-height: 3.25rem;}
h3.widget-title::after { position: absolute; left: 0; bottom: 0; width: 20px; height: 2px; background-color: #fbcd01; content: "";}
.social-icons ul, .privacy-list ul { margin: 0; padding: 0; list-style: none;}
.social-icons ul li, .privacy-list ul li { display: inline-block;}
.social-icons ul li a, .privacy-list ul li a { -webkit-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; font-size: 16px; color: #fff; opacity: 0.7; padding: 16px 10px; display: block;}
.social-icons ul li:hover a { color: #fbcd01; }
.copyright { background-color: #051922; border-top: 1px solid #232a35;}
.copy-container {max-width: 1140px; margin-right:auto; margin-left:auto; display:flex; justify-content: space-between; flex-wrap: wrap; padding-right: 15px; padding-left: 15px;}
.copyright p { margin: 0; color: #fff; opacity: 0.7; padding: 16px 0; font-size: 15px;}
.copyright a {font-weight: 700;}

@media screen and (max-width: 450px) {
  .copy-col {text-align:center; width:100%}
	.copyright p {padding-bottom: 0;}
}
@media (min-width: 768px) {
    .footer-col {-ms-flex: 0 0 50%; flex: 0 0 50%;  max-width: 50%;}
}
@media (min-width: 992px) {
  .footer-col{  -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
}
@media (min-width: 1200px) {
	.footer-col.xl2 { -ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%;}
}