:root{
	--primary-color:#4E4537;
	--grey-color:#707070;
    --primary-light-color:#221afbb0;
    --light-grey-color:#f3f3f3;
    --black-color:#000;
    --d-grey-color:#f5f3f1;
    --orange-color:#ffb700;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	/* font-size: 100%; */
	vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

/*****************************************SCROLL TRACK CSS******************************************/

::selection{color:#fff;background:#ffb700}
::-webkit-scrollbar{width:5px;height:8px}
::-webkit-scrollbar-track{box-shadow:inset 0 0 5px #d9d9d9;border-radius:0}
::-webkit-scrollbar-thumb{background:#ffb700;border-radius:0}
::-webkit-scrollbar-thumb:hover{background:#ffb700}

/*****************************************SCROLL TRACK CSS******************************************/

body {font-family: "STCregularfont", sans-serif;line-height: 1;font-size: 16px;font-weight: 400;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}

.position-relative{position: relative !important;}
.top-unset{top: unset !important;}

/*FONTS SIZES----------------------------------------------------------------------------------------------------------------------------------------------------------FONTS SIZES*/

h1,h2,h3,h4,h6 {font-family: "STCboldfont", sans-serif;}
h1 {font-size: 50px;}
h2 {font-size: 30px;}
h3 {font-size: 20px;}
h6 {font-size: 16px;}

.p-lg {font-size: 24px;}
.p-xs {font-size: 12px;}
.p-sm {font-size: 14px;}
.p-md {font-size: 20px;}
.p-lg {font-size: 26px;}
.p-xl {font-size: 32px;}

/*FONTS SIZES----------------------------------------------------------------------------------------------------------------------------------------------------------FONTS SIZES*/

/*SHADES----------------------------------------------------------------------------------------------------------------------------------------------------------SHADES*/

.text-primary{color: var(--primary-color) !important;}
.text-light-primary{color: var(--primary-light-color) !important;}
.text-grey{color: var(--grey-color) !important;}
.bg-primary{background-color: var(--primary-color) !important;}
.bg-grey{background-color: var(--light-grey-color) !important;}
.bg-black{background-color: var(--black-color) !important;}
.bg-d-grey{background-color: var(--d-grey-color) !important;}
.white-bg{background-color: #fff !important;}
.bg-mix{background: linear-gradient(90deg, #ffde89 0%, rgba(253,183,0,1) 100%) !important;}

/*SHADES----------------------------------------------------------------------------------------------------------------------------------------------------------SHADES*/


/*****************************************HEADER CSS******************************************/
.mainLogo {width: 130px;}
header#header .mainLogo {filter: brightness(0.5);transition: .5s;}
.header-shadow .mainLogo {filter: unset !important;}
header#header {position: fixed;width: 100%;background: transparent;z-index: 100;transition: .5s;top: 0;box-shadow: 0px 0px 10px 0px #00000029;}
.header-shadow {background:#fff !important ;}
header a{color: #000 !important;text-decoration: none;font-weight: 400;transition: opacity .5s !important;font-size:17px;}
header li.nav-item.active a {font-weight: 700;}
header ul.navbar-nav li.nav-item a {padding: 0.5rem 1rem !important;}
.sideNav {list-style: none;padding: 0;margin: 0;}
header .site-btn {background: transparent;color:#000 !important;border-color:#000 !important;padding: 8px 16px;min-width: 120px;}
header .site-btn:hover {background: #000;color: #fff !important ;}
.langDrop ul li a {color: #000 !important;}
.langDrop .dropdown-toggle{background-color: #000 !important;}
.langDrop ul li a.dropdown-item:active {background: #ffb700 !important;color: #fff !important;}
.navbar-toggler-icon{height: 1.5em !important; width: 1.5em !important;background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !important;}
/*****************************************HEADER CSS******************************************/

/*****************************************BUTTON CSS******************************************/
.site-btn {background: var(--black-color);border-radius: 13px;border: 1px solid var(--primary-color) !important;color: white;font-size: 16px;font-weight: 600;
    padding: 16px 25px;min-width: 190px;transition: ease-in-out 0.2s;text-align: center;border-radius: 99px; white-space: pre; text-transform: capitalize;}
.site-btn:hover{background-color: transparent; color: var(--primary-color);}
.transparent-btn{background:0 0 !important;padding:0 !important;border:0 !important;}
.transparent-btn:focus{box-shadow:none;}
.site-input-btn{background-color: #000 !important; color: #fff !important; border-color: #000 !important;}
.site-input-btn:hover{background-color: transparent !important; color: #000 !important; border-color: #000 !important;}
/*****************************************BUTTON CSS******************************************/

/*****************************************INPUT CSS******************************************/

.site-label{font-weight:600;margin-bottom:5px;color:var(--orange-color)}
.site-label-disabled{color:#36dc90}
.site-input{width:100%;border:1px solid rgb(206 206 206 / 30%);border-radius:5px;color:#333;background:#fff;padding:12px 17px;appearance:none;box-shadow:2px 2px 8px rgba(0,0,0,.16)}
.site-input::placeholder{color:#8e8e8e}
.site-input-shadow{box-shadow:0 0 10px rgb(0 0 0 / 9%);border-color:#70707038}
textarea.site-input{color:#8e8e8e}

/*****************************************INPUT CSS******************************************/

section.packages, section.aboutM5aznSec, section.contactUs, section.privacyPolicy, section.termsAndConditions{padding: 150px 0 40px;}

section.wmsIntro {padding-top: 100px;z-index: 10; position: relative;}
h1.wmsIntroHeading{font-family: "STCregularfont";font-weight: 400;}
.o_stripe {background-color: #F8F9FA;box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.05);position: absolute;top: 0;left: 0;right: 0;height:550px;}
.o_gradient, #o_partner_dashboard .o_partner_dashboard_box_header > h2, #o_partner_dashboard .o_partner_dashboard_box_header > .h2 {background: linear-gradient(150deg, #ffb700 20%, #fffbf1 80%) !important;}
section:first-of-type .o_skew_sm {transform: skewY(-6deg);}
.o_skew_sm {transform: skewY(-6deg) scaleY(0.75) translateY(15%);transform-origin: 0 50%;}

section.systemsPerks {background-image: url(../../images/front/shape-for-carousel-sec.png);background-size: cover;background-position: center center;background-repeat: no-repeat;align-items: center;padding: 380px 0 50px;}
h2.systemPerksHeading {font-size: 35px;margin-top: -200px;}
h4.systemPerksHeadings {font-size: 22px !important;margin-top: 1rem;}

h2.wmsFeaturesHeading {font-size: 35px;}
h3.featureDetailsHeadings {font-size: 30px;}
p.featureDetailsPara {font-size: 18px;line-height: 24px;}
.featureDetailsImg {max-width: 360px;margin: auto;}


.servicesCard {background-color: #fff;box-shadow: 0px 4px 10px -4px #00000059;padding: 1rem 1rem;min-height: 150px;display: flex;align-items: center; justify-content: center;transition: .5s !important;border-radius: 10px;}
.serivcesImg {width: 100%;max-width: 60px;height: 60px;object-fit: contain;}
.servicesCard:hover {transition: .5s !important;background-color: #ffb700;}
.servicesCard:hover .serivcesImg{filter: brightness(0) invert(1);}
.servicesCard:hover h6 {color:#fff}

h6.servicesSubHeading {font-size: 18px !important;}

.shippingImgs {max-width: 230px; margin: auto;}

ul.footerMenu li a {color: #fff;font-size: 16px;}
a#back-to-top {position: absolute;top: -20px !important;bottom: unset;max-width: 100px;left: 0;right: 0;}
.footerLogo {max-width: 240px;}
footer a:hover, footer a i:hover {color: #eda500 !important;}
footer a,footer a i {transition: .5s;}
.footer-heading{text-transform: uppercase;}

section.contactUs h2{font-size: 45px;}

.boxFeaturesMobImg {max-width: 60px;margin: auto;object-fit: cover;}

.boxFeaturesMob {background: #fdfdfd;max-width: 390px;margin: auto;padding: 2rem 3rem;border-radius: 10px;box-shadow: 0px 0px 10px 0px #00000029;min-height: 250px;display: flex;align-items: center;justify-content: center;flex-direction: column;}
#owl-feature .owl-stage-outer{padding: 1rem 0;}

@media (max-width: 992px) {
    section.contactUs{padding: 70px 0 40px;}
  }


  /*RESPONSIVE CSS----------------------------------------------------------------------------------------------------------------------------------------------------------RESPONSIVE CSS*/

@media screen and (max-width: 1399px) {
    h3 {font-size: 43px !important;}
}

@media (max-width: 1312px) {
}

@media screen and (max-width: 1199px) {
    h3 {font-size: 35px !important;}
    h4 {font-size: 30px !important;}
    .p-lg {font-size: 18px;}
    .p-md {font-size: 16px;}
}
@media (max-width: 1023px) {

}
@media screen and (max-width: 992px){
    .introImg {max-width: 390px;}
    section.systemsPerks{background: #f5f4f1; padding: 100px 0 50px;}
    section.wmsIntro {padding: 100px 0 50px;}
    .o_skew_sm {transform: unset !important;}
    h2.systemPerksHeading {font-size: 35px;margin-top: 0px;margin-bottom: 2rem;}
    .o_stripe {height: 610px ;}
}
@media (max-width: 908px) {

}
@media (max-width: 800px) {

}
@media screen and (max-width: 767px) {
    h1,
    h2 {font-size:30px !important;}
    h3 {font-size: 35px;}
    h4 {font-size: 26px !important;}
<<<<<<< HEAD

=======
   a#back-to-top {top: -10px !important;}

    
>>>>>>> frontend-changes
}
@media screen and (max-width: 575px) {
  h3 {font-size: 25px !important;}
  h1,
  h2 {font-size: 32px !important;}
  h4 {font-size: 23px !important;}
  .p-lg {font-size: 16px;}
  .p-md {font-size: 15px;}
  body {font-size: 14px !important;}

<<<<<<< HEAD
=======
  
>>>>>>> frontend-changes

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


}


/*RESPONSIVE CSS----------------------------------------------------------------------------------------------------------------------------------------------------------RESPONSIVE CSS*/