body {
    background-color: #ffffff;
    box-sizing: border-box;
    overflow-x: hidden;
    padding: 0;
    font-size: 16px;
    /*color: white;*/
    font-family: "Tajawal-Regular";
    direction: rtl;
    text-align: right;
    overflow-y: scroll;
}

@font-face {
    font-family: "Tajawal-Regular";
    src: url(../fonts/Tajawal-Regular.ttf);
}

@font-face {
    font-family: "Tajawal-Medium";
    src: url(../fonts/Tajawal-Medium.ttf);
}

@font-face {
    font-family: "Tajawal-bold";
    src: url(../fonts/Tajawal-Bold.ttf);
}

h1,
h2,
h3 {
    font-family: "Tajawal-bold";
    margin: 0
}

h4,
h5,
h6 {
    font-family: "Tajawal-Medium";
    margin: 0;
}

ul {
    padding: 0;
    margin: 0;
}

li {
    list-style-type: none;
}

a {
    color: inherit;
    transition: all .5s;
}

p {
    margin: 0;
    transition: all .5s;
}

a:hover {
    text-decoration: none;
}

.btn {
    display: flex;
    justify-content: center;
}


.btn.focus,
.btn:focus {
    outline: 0;
    box-shadow: none
}

.btn span {
    align-self: center;
}

header {
    padding: 20px 0;
    position: absolute;
    left: 0;
    width: 100%;
    background-color: transparent;
    height: 100px;
    z-index: 99999999999;
}

.reqBtn {
    font-size: 1em;
    color: #E21F3A;
    border: 1px solid #E21F3A;
    width: 117px;
    height: 48px;
    border-radius: 13px;
    font-family: "Tajawal-bold";

}

header .reqBtn {
    margin-right: auto;
}

.reqBtn:hover {
    background-color: #E21F3A;
    color: white
}

.navbar-expand-lg .navbar-nav .nav-link {
    font-size: 1em;
    font-family: "Tajawal-Medium";
    padding: 0;
    margin-left: 44px;

}

.nav-active {
    color: #E21F3A;
}

.nav-item {
    position: relative;
}

.nav-item .active {
    position: absolute;

    top: -10px;
    right: -6px;
    overflow: hidden;

}



.navbar-expand-lg .navbar-nav .nav-item.active .nav-link {
    font-family: "Tajawal-bold";
}

.navbar-expand-lg .navbar-nav .nav-item:last-child .nav-link {
    margin-left: 0
}

.navbar-expand-lg .navbar-nav .nav-item:hover .nav-link {
    color: #E21F3A
}

/**********************************************************/
.mobile-display{
    display:none ;
}
.web-display{
    display:inherit;
}
.hero {
    position: relative;
    width: 100%;
    height: 100%;
}

.hero:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: linear-gradient(0deg, rgba(21, 21, 21, 0.88) 0%, rgba(21, 21, 21, 0) 34%, rgba(21, 21, 21, 1) 100%);
}

.heroVideo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.heroContent {
    position: absolute;
    width: 100%;
    z-index: 5;
    padding-top: 400px;
    text-align: center;
}

.heroContent:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(../images/heroBg.png);
}

.heroContent span {
    display: block;
    font-size: .875em;
    margin-bottom: 15px;
}

.heroContent h1 {
    color: white;
    font-size: 2.5em;
    margin-bottom: 15px;
}

.heroContent p {
    font-size: 1.375em;
    line-height: 2;
    margin-top: 20px;
}

.heroContent .heroDetails {
    font-size: 1em;
    opacity: .7;
}

.showVideoBtn {
    background-color: #E21F3A;
    color: black;
    width: 191px;
    height: 56px;
    font-size: 1.125em;
    font-family: "Tajawal-bold";
    outline: 4px solid rgba(255, 255, 255, .2);
    border-radius: 28px;
    margin-top: 20px
}

.heroContent .btn span {
    margin: 0;
}

.btnContainer {
    width: 100%;
    display: flex;
}

.showVideoBtn i {
    align-self: center;
    color: white;
    font-size: 30px;
    margin-right: 14px;
}

.showVideoBtn:hover {
    background-color: rgba(255, 255, 255, .2);
    color: #E21F3A
}

.sectionTitle {
    text-align: center;
    margin-bottom: 10%;
}
.productsTitle{    
    margin-top: 10%;
}

/****************************************/
.samples {
    padding: 23px 0 75px
}

.samples .sectionTitle {
    margin-bottom: 80px;
}

.sectionTitle h4 {
    line-height: 2;
    font-size: 2em;
}

.sampleImg {
    width: 500px;
    height: 352px;
}

.sampleImg img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.sampleDetails h3 {
    font-family: 'Rubik', sans-serif;
    font-weight: 600;
}

.sampleDetails h6 {
    font-size: 1.5em;
    line-height: 1.2em;
    margin-bottom: 19px;
    max-width: 80%;
    margin-top: 2%;
}

.sampleDetails p {
    /*font-size: 1.125em;*/
    opacity: .8;
    margin-bottom: 19px;
}

.sampleDetails p:last-child {
    margin-bottom: 35px;
}

.detailsBtn {
    width: 197px;
    height: 54px;
    border-radius: 28px;
    background-color: rgba(255, 255, 255, .2);
    border: 2px solid #E21F3A;
    margin-top: 20px
}

.reportSample {
    margin-bottom: 150px;
}

.reportSample:last-child {
    margin-bottom: 0;
}

/******************************************/
.Gallery {
    padding-top: 45px;
    padding-bottom: 75px;
}


.Gallery .sectionTitle {
    margin-bottom: 60px;
}

.galleryItem {
    width: 100%;
    position: relative;
    opacity: .6;
}

.galleryCar.owl-carousel .owl-item.center .galleryItem {
    margin: auto;
    /*width: 1150px;*/
    opacity: 1;
}

.galleryCar.owl-carousel .owl-item.center .GalleryDetails {
    opacity: 1;
}

.galleryimg {
	width:90%;
    height: 400;
    overflow: hidden;
}
.galleryimg img{
    height: 100%;
}
/*.owl-item.center .galleryItem {
    transform: scale(1.1);
    transition: all .5s;
    ;
}*/

.Gallery .owl-dots {
    position: relative;
    width: 100%;
    margin: auto;
    margin-top: 200px;
    text-align: center;
}

.Gallery .owl-dots .owl-dot {
    width: 189px;
    height: 2px;
    background-color: rgba(245, 245, 245, .5);
    margin: 0
}

.Gallery .owl-dots .owl-dot.active {
    background-color: #E21F3A;
}

.galleryCar {
    position: relative;
    margin-right: 30px;
}

.galleryCar .owl-nav {
    position: absolute;
    top: -20%;
    width: 100%
}

.galleryCar.owl-carousel .owl-nav button.owl-next {
    left: 120px;
    position: absolute;
    margin: 0;
}

.galleryCar.owl-carousel .owl-nav button.owl-prev {
    left: 158px;
    position: absolute;
    margin: 0
}

/*.galleryCar.owl-carousel .owl-stage-outer {
    overflow: visible;
}*/

.galleryCar.owl-carousel .owl-item {
    opacity: .6;
}

.galleryCar.owl-carousel .owl-item.center {
    opacity: 1;
}

.GalleryDetails {
    text-align: center;
    margin-top: 27px;
    opacity: 0;
}

.GalleryDetails h3 {
    font-size: 1.5em;
    margin-bottom: 12px;
    ;
    color: white;
}

.GalleryDetails p {
    font-size: 1.125em;
    text-align: center;
    color: white
}

.galleryItem :hover .GalleryDetails h3 {
    color: #E21F3A
}

/*******************************************/


.featuresSlider .owl-nav {
    position: absolute;
    top: 42%;
    width: 100%;
}

.featuresSlider .owl-next {
    right: 530px;
    position: absolute;
    margin: 0;
}

.featuresSlider .owl-prev {
    left: 565px;
    position: absolute;
    margin: 0;
}

/********************************/
.ourClients {
    padding: 75px 0;

}

.yellowCircle {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: #E21F3A;
    position: relative;
    margin-bottom: 24px;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
}

.yellowCircle:before {
    position: absolute;
    content: "\f10d";
    left: -10px;
    top: -30px;
    color: black;
    font-size: 60px;
    z-index: 1;
}

.ourClients .sectionTitle {
    margin-bottom: 60px;
}

.ourClientItem h5 {
    font-size: 1.5em;
    margin-bottom: 16px;
    line-height: 2;
}

.ourClientItem p {
    font-size: 1em;
    margin-bottom: 35px;
    opacity: .8;
    max-width: 80%;
    line-height: 2;
}

.clientName {
    display: flex;
}

.clientImg {
    width: 56px;
    height: 56px;
    overflow: hidden;
    margin-left: 20px
}

.clientImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;

}

.clientNameDetails {
    align-self: center;
}

.clientNameDetails h3 {
    font-size: 1.125em;
    margin-bottom: 5px;
}

.clientNameDetails span {
    font-size: 1em;
    opacity: .8;
}

.ourClientItem:hover h3 {
    color: #E21F3A
}

.ourClientItem:hover h5 {
    color: #E21F3A
}

.ourClientCar {
    position: relative;
}

.ourClientCar.owl-carousel .owl-nav {
    position: absolute;
    left: 0;
    top: -105px
}

/*.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev {
    width: 48px;
    height: 48px;
    border-radius: 50px;
    border: 3px solid #E21F3A;
    margin-right: 35px;
    opacity: .4;
    color: #E21F3A;
}*/

/*.owl-carousel .owl-nav button.owl-next:hover,
.owl-carousel .owl-nav button.owl-prev:hover {
    opacity: 1;
}*/

.features {
    background: url(../images/black_background.png) no-repeat fixed 0 0/cover;
    padding: 45px;
    border-radius: 5%;
	background-size: 100% 100% !important;
}
/******************************************/
.ourLocation {
    padding: 45px 0 0
}
#ourProducts{
    /*background-image: url(../images/product.png);*/
}

.locationLabel {
    height: 60px;
    display: inline-flex;
    background-color: #2B2B2B;
    border-radius: 16px;
    color: black;
    padding: 0 10px;
    justify-content: center;
}

.locationLabel span {
    align-self: center;
    font-size: 1em;
    font-family: "Tajawal-Medium";
    margin: 0;
    color: white;
}

.locationLabel i {
    align-self: center;
    color: #E21F3A;
    margin-left: 11px;
    font-size: 1em;
}

.ourLocation .sectionTitle {
    margin-bottom: 65px;
}

.googlemap {
    filter: grayscale(100%);
}

/***********************************/
.contactUs {
    padding: 45px 0 75px;
    background-color: #00000014;
}
.contactUs::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
/*    background: rgba(8, 21, 40, 0.89) none repeat scroll 0 0;

    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;*/
    
}

.contactTitle h3 {
    text-align: center;
    margin-bottom: 7px;
    font-size: 2.125em;
    color: #E21F3A;
}

.contactTitle {
    color: black;
    text-align: center;
    margin-bottom: 62px;
}

.contactTitle p {
    font-family: 'Rubik', sans-serif;
    margin-bottom: 13px;
    font-size: 1.125em;
    font-weight: 400;
}

.contactTitle h4 {
    font-size: 1.125em;
}

.ContactList {
        margin: 3px 0;
    justify-content: space-around;
}

.ContactList li {
    opacity: .95;
    margin-bottom: 24px;
    display: flex;
    border-radius: 12px;
    box-shadow: 0 50px 50px rgba(0, 0, 0, .05);
    background-color: #ffffff;
    /*border: 1px solid #313236;*/
    height: 65px;
    padding: 0 28px;
    justify-content: end;
    font-family: "Tajawal-Medium";
}

.ContactList li a {
    color: black;
    align-self: center;
}

.ContactList li:hover {
    background-color: black;
}

.ContactList li:hover a {
    color: #ffffff
}

.ContactList li:hover svg path {
    fill: #ffffff
}

.contactListIcon {
    width: 25px;
    margin-right: 14px;
}

.contactForm {
        opacity: .95;
    box-shadow: 0 50px 50px rgba(0, 0, 0, .05);
    background-color: #ffffff;
    /*border: 1px solid #313236;*/
    padding: 26px 33px;
    border-radius: 22px;
}

.contactForm h6 {
    font-size: 1em;
    margin-bottom: 25px;

}

.contactForm .form-control {
    width: 100%;
    height: 56px;
    border-radius: 12px;
    box-shadow: 0 50px 50px rgba(0, 0, 0, .05);
    border: 1px solid #c3c3c3;
    background-color: transparent;
    color: black;
}

.contactForm .form-group {
    margin-bottom: 14px;
    width: 100%;
}

.contactForm .form-control::placeholder {
    font-size: 14px;
    opacity: .6;
    ;
}

.contactForm .form-control.textareaForm {
    resize: none;
    height: 126px;

}

.sendBtn {
    background-color: #E21F3A;
    margin-top: 15px;
    width: 112px;
    height: 56px;
    border-radius: 12px;
    color: #ffffff;
    font-family: "Tajawal-bold";
    border: 1px solid #E21F3A;
    margin-right: auto;
}

.sendBtn:hover {
    color: #E21F3A;
    background-color: #ffffff;
}

.contactForm .form-group.textareaGrpoup {
    margin-bottom: 15px;
}

footer {
    padding: 40px 0 10px;
    position: relative;
    z-index: 1;
    background-color: #2B2B2B;
        color: white;
    text-align: center;
}
/*footer:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(../images/bunnerBG.png);
}*/
.footerLogo {
    /* width: 124px;*/
    margin-bottom: 30px;
}

.footerDetails {
    margin-bottom: 14px;
    font-size: 1em;
}

.socialIcons li {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: inline-flex;
    justify-content: center;
    margin-left: 8px;
    font-size: 20px;
}

.socialIcons li a {
    align-self: center;
    color: white;
}
.socialIcons li:hover a {
    color: #e21f3a;
    transform: scale(1.1);
    display: block;
}

.footerList h3 {
    font-size: 1.125em;
    margin-bottom: 30px;
}

.footerList li:hover a {
    color: #E21F3A
}

.footerList li {
    margin-bottom: 25px;
    font-size: 1em;
}

.policy a {
    color: #e21f3a !important;
}

/**********************************************/
.basics {
    background-color: #222326;
    padding: 60 0 85px;

}

.basics h2 {
    font-size: 1.75em;
    margin-bottom: 54px;

}

.basicBox {
    display: flex;
    max-width: 80%;
}

.basicNum {
    font-size: 1.75em;
    margin-left: 25px;
    opacity: .6;
    font-weight: 500;
    font-family: 'Rubik', sans-serif;
}

.basicBox p {
    font-size: 1.125em
}

/********************************************/
.principles {
    padding: 150px 0
}

.principles .sectionTitle span {
    font-size: 1.125em;
    color: #151515;
    opacity: .8;

}

.principles .sectionTitle {
    margin-bottom: 80px;
    text-align: center;
}

.principlesImg {
    width: 64px;
    height: 64px;

    border-radius: 16px;
    margin: auto;
    display: flex;
    margin-bottom: 35px;
    justify-content: center;
}

.principlesImg svg {
    align-self: center;
}

.principlesBox h6 {
    font-size: 1.25em;
    margin-bottom: 5px;
}

.principlesBox {
    text-align: center;
}

.principlesBox p {
    font-size: 1em;
    opacity: .8;
}

/*.principlesBox:hover .principlesImg {
    background-color: #E21F3A;
}

.principlesBox:hover .principlesImg svg path {
    fill: white;
}

.principlesBox:hover h6 {
    color: #E21F3A
}*/

.principlesBox .principlesImg {
    background-color: #E21F3A !important;
}

.principlesBox .principlesImg svg path {
    fill: white !important;
}

.principlesBox h6 {
    color: #E21F3A !important
}

.ourExperiance {
    padding: 30px 0 65px
}

.experianceTitle h3 {
    font-size: 2em;
    margin-bottom: 25px;
}

.experianceTitle p {
    font-size: 1.125em;
    opacity: .8;
}

.experianceBox {
    display: flex;
    
    padding: 25px;
    border-radius: 16px;
    margin-bottom: 29px;
    width: 100%;
    height: 190px;
    overflow: hidden;
    transition: all .5s;
}

/*.experianceBox:hover svg path {
    fill: white
}*/

.experianceBox svg path {
    fill: white !important
}

.experianceBox p {
    opacity: 1 !important;
}

.experianceBox {
    background-image: url(../images/red_back.jpg);
	    background-size: 100%;
	background-repeat: no-repeat;

    transition: all .5s !important;
    color: white !important;
}


/*.experianceBox:hover p {
    opacity: 1;
}

.experianceBox:hover {
    background-color: #E21F3A;
    transition: all .5s;
    color: white;
}*/

.experianceIcon {
    align-self: flex-start;
    margin-left: 20px;

}

.experianceDetails h5 {
    font-size: 1.25em;
    margin-bottom: 10px;
}

.experianceDetails p {
    font-size: 1em;
    opacity: .7;
}

.ourTeam {
    padding: 40px 0 20px;
    position: relative;
}


.ourProductbg {
    position: absolute;
    width: 850px;
    left: -60%;
    top: -135px;
}
.ourProductbg2 {
    position: absolute;
    width: 850px;
    right: -300;
}
.ourProductbg3 {
    position: absolute;
    width: 850px;
    right: -300;
}
.ourProductsm {
    position: absolute;
    width: 850px;
    right: 457px;
    top: -8px;
}

.ourProductsm2 {
    position: absolute;
    width: 850px;
    right: 900;
    top: 940px;
}

.ourProductsm3 {
    position: absolute;
    width: 800;
    right: 0;
    top: 1059px;
}

.ourTeam .sectionTitle span {
    opacity: .7;
    font-size: 1.125em;
}

.ourTeam .sectionTitle {
    margin-bottom: 117px;
}

.ourTeam .sectionTitle h4 {
    font-size: 2.5em;
}

.memberBox {
    width: 100%;
    height: 195px;
    
    border-radius: 18px;
    padding: 37px 22px;
    text-align: center;
}

.memberBox h5 {
    font-size: 1.25em;
    margin-bottom: 12px;
    color: white;
}

.memberBox span {
    font-family: 'Rubik', sans-serif;
    color: #E21F3A
}

.memberImg {
    width: 140px;
    height: 140px;
    border-radius: 14px;
    overflow: hidden;
    margin: auto;
    margin-top: -100px;
    margin-bottom: 28px;
}

.memberImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all .5s;
    ;
}

.teamGroup {
    margin-bottom: 100px;
}

/*.memberBox:hover {
    background-color: #E21F3A;
}

.memberBox:hover span {
    color: white
}

.memberBox:hover .memberImg {
    transform: scale(1.1);
    transition: all .5s;
    ;
}
*/

.memberBox {
    background-image: url(../images/red_back.jpg);
	    background-size: cover;
/*	background-repeat: no-repeat;*/
}

.memberBox span {
    color: white !important;
}

.memberBox .memberImg {
    transform: scale(1.1) !important;
    transition: all .5s !important;
    ;
}

.aboutHero {
    padding-top: 212px;
    padding-bottom: 30px;
}


.aboutHero h1 {
    font-size: 2.375em;
    max-width: 60%;
}

.aboutHero h6 {
    font-size: 1.375em;
    color: #E21F3A;
    margin-bottom: 30px;
    opacity: .7;
    margin-top: 15px
}

.aboutHero p {
    font-size: 1em;
    opacity: .7;

}
.ourTeambg {
    position: absolute;
    top: 124px;
    width: 850px;
    left: -42%;
}
.ourTeambg2 {
    position: absolute;
    right: -28%;
    top: 24%;
}

.navbar-brand {
    margin-right: 0;
}

.navbar {
    color: black;
    padding: 20px 0
}
.home .navbar {
    color: white;
}
/*********************************/
.OurProductHero {
    position: relative;
    padding: 170px 0;
    z-index: 22;
    padding-bottom: 200px;
}

.OurProductHero:before,.aboutHero:before ,.contactUsPage:before{
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../images/BG.png);
    padding-top: 160px;
    clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 68%);
}

.productHeroText {
    padding-top: 130px
}

.productHeroText h4 {
    font-weight: 500;
    margin-bottom: 20px;
    color: #E21F3A;
    font-family: 'Rubik', sans-serif;
    font-size: 2.625em;
}

.productHeroText p {
    color: black;
    font-size: 1.125em;
}

.productHeroImg {
    position: absolute;
    left: 0;
    top: 0;
    width: 550px;
    height: 400px;
    z-index: 2;
}

/*.reportFeatures {
    
}*/

.productHeroImg img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.overview {
    padding-top: 60px;
    position: relative;
    z-index: 0;
}

.overview h2 {
    font-size: 2.375em;
}

.overview p {
    font-size: 1.125em;
    opacity: .8;
}

.overviewVideoContainer {
    position: relative;
    width: 95%;
    height: 415px;
    margin-top: 52px;
/*    margin-bottom:10%;
*/}

.overViewVideo {
    width: 100%;
    overflow: hidden;
    border-radius: 32px;
    
    object-fit: contain;
    position: relative;
}
.showoverviewVideoBtn {
    position: absolute;
    width: 87px;
    height: 87px;
    border-radius: 50%;
    background: #ffffff;
    z-index: 8888;
    top: 43%;
    left: 48%;
    font-size: 29px;
    color: #E21F3A
}

.showoverviewVideoBtn:hover {
    color: black
}

.showoverviewVideoBtn:hover i {
    color: #E21F3A
}

.FeaturesBox .principlesImg {
}

.FeaturesBox {
    background-color: white;
    height: 249px;
    border-radius: 18px;
    overflow: hidden;
    padding: 30px;
    text-align: center;
    margin-bottom: 92px;
}

.reportFeatures {
    padding-top: 65px;
    padding-bottom: 105px;
}

.reportFeatures .sectionTitle {
    margin-bottom: 35px;
	 margin-top: 22%;
}

.anotherFeatures h5 {
    margin-bottom: 24px;
    font-size: 1.8em;
}

.anotherFeatures h6 {
    font-size: 1em;
    margin-bottom: 24px;
}

.anotherFeatures li {
    position: relative;
    margin-bottom: 16px;
    font-family: "Tajawal-Medium";

}

.anotherFeatures li:before {
    content: "\f00c";
    color: #E21F3A;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-left: 5px;
}

.featuresImg {
    width: 100%;
    height: 388px;
    border-radius: 18px;
    overflow: hidden;

}

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

.featuresLabel {
    width: 50%;
    display: flex !important;
    /*width: 100%;*/
    border-right: 4px solid #E21F3A;
    margin-top: 17px;
    border-radius: 8px;
    height: 60px;
    font-size: 1em;
/*    color: #5A7184;
*/    display: block;
    padding: 18px
}

.featuresLabel i {
    margin: 0;
    color: white
}

.featuresLabel p {
    font-family: 'Rubik', sans-serif;
    display: inline-block;
    margin-right: 10px;
}

.featuresLabel .iconcont {
    width: 24px;
    height: 24px;
    display: inline-flex;
    background-color: #E21F3A;
    border-radius: 50%;
    justify-content: center;
    color: #ffffff;
    margin-left: 25px
}

.showMoreBtn {
    margin-top: 25px;
    width: 145px;
    height: 46px;
    background-color: rgba(242, 223, 58, .06);
    border-radius: 23px;
    color: #E21F3A;
    font-size: 1em;
    display: inline-flex;
}

.showMoreBtn:hover {
    background-color: #E21F3A;
    color: white;
}

.ourProdBox {
    text-align: right;
    height: 340px;
    position: relative;
    margin-top: -85px;
    padding-top: 135px;
    padding-bottom: 38px;
    box-shadow: 0 19px 20px rgba(21, 21, 21, .06);
    clip-path: polygon(87% 0, 100% 15%, 100% 100%, 0 100%, 0 0);
    display: flex;
    flex-direction: column;
}

.corner {
    content: "";
    background-color: #E21F3A;
    width: 127px;
    height: 127px;
    border-radius: 18px;
    overflow: hidden;
    position: absolute;
    right: 22px;
    top: 91px;
    z-index: 0;
}

.ourProdBox h5 {
    font-family: 'Rubik', sans-serif;
    font-weight: 600;
    font-size: 1.75em;
    margin-bottom: 15px;
}

.ourProdBox span {
    color: #E21F3A;
    display: block;
    margin-top: auto;
}

.ourProdBox span a {
    width: 100%;
    color: #E21F3A;
}

.ourProdBox span a svg {
    float: left;
}

.productBoxImg {
    margin: 0 auto;
    position: relative;
    z-index: 222;
    width: 238px;
    height: 168px;
}

.ourProdBox:hover span a {
    color: white;
}

.productsText {
    font-size: 18em;
    font-weight: 600;
    color: #ffffff;
    position: absolute;

    text-shadow: -1px 0 #E21F3A, 0 1px #E21F3A, 1px 0 #E21F3A, 0 -1px #E21F3A;
    right: -68px;
    bottom: -163px;
    opacity: .42;

}

.oursamplesSec {
    padding-bottom: 100px;
}

.contactUsPage {
    padding-top: 140px;
    padding-bottom: 36px;
}

.contactPageTitle h2 {
    font-size: 1.5em;
    color: black;
    margin-bottom: 15px;
}

.contactPageTitle {
    margin-bottom: 45px;
    text-align: center;
}

.contactPageTitle p {
    font-size: 1em;
}

.reqForm {
    background-color: white;
    border-radius: 22px;
    border: 0;
}

.chooseType {
    font-family: 'Rubik', sans-serif;
    margin-bottom: 13px;

}

.chooseTypeContainer .form-group {
    margin: 0
}

.chooseType {
    display: block;
    position: relative;
    padding-right: 35px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

}

/* Hide the browser's default checkbox */
.chooseType input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;

}

/* Create a custom checkbox */
.chooseType .checkmark {
    position: absolute;
    top: 0;
    right: 0;
    height: 20px;
    width: 20px;
    
    border-radius: 4px;
    border: 1px solid #E21F3A
}


/* When the checkbox is checked, add a blue background */
.chooseType input:checked~.checkmark {
    
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.chooseType input:checked~.checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.chooseType .checkmark:after {
    right: 3px;
    top: 3px;
    width: 12px;
    height: 12px;
    ;
    background-color: #E21F3A;
    border-radius: 4px;
}

.marginForm {
    margin-top: 34px;
    margin-bottom: 44px;
}

.navbar-toggler {
       width: 40px;
    height: 40px;
    position: relative;
    padding: 0;
    border: 2px solid #E21F3A;
}
.navbar-toggler-icon {
    display: inline-block;
    width: 1.2em !important;
    height: 1.5em;
    vertical-align: middle;
    content: "";
    background: no-repeat center center;
    background-size: 100% 100%;
    margin-top: 5px !important;
}
.navbar-toggler i {
    color: black;
    content: "";
    background-color: #E21F3A;
    display: block;
    /* margin-bottom: 1px; */
    width: 85%;
    margin-top: 4px;
    height: 3px;
    margin-right: 2px;
    border-radius: 5px;
}
.scrollNav .navbar-nav {
    color:black !important ;

}
.scrollNav {
    top: 0 !important;
    z-index: 555;
    animation-duration: .5s;
    background: #ffffff;
    position: fixed !important;
    box-shadow: rgba(0, 0, 0, 0.1) 2px 3px 20px 3px;
    transition: 1s all;
    left: 0;
    width: 100%;
    right: 0;
    padding: 10px 0;
    transition: all .5s;
    ;
    animation: sticky;
    width: 100%;
}

.close {
    display: none;
}

.contactPageCont {
    padding-top: 150px;
}

.anotherFeatures {
        color: white !important;
    }

@media (max-width: 850px) {
	#ourProducts{
		background-image: url(../images/product_back.png);
		background-size: contain;
	}
	.principles{
	    padding: 35px 0 !important;
	}
	.ourExperiance {
    padding: 31px 0 30px !important;
	}
    .featuresImg {
    
        margin: 0 10px;
        width: unset;

    }
	.featuresLabel {
    	width: 100%;
	}
    .featuresLabel .iconcont {
    width: 30px;
    /*margin-left: 2px;*/
}
    .aboutHero {
    padding-top: 139px;
    }
    .Gallery {
    padding-top: 0;
    }
    .contactUs {
    padding: 38px 0 75px;
    }
    .ourLocation .sectionTitle {
    margin-bottom: 25px;
}
    .ourLocation {
    padding: 30px 0 0;
}
    .productHeroText {
    padding-top: 20px;
}
    .reportSample {
        margin-bottom: 75px;
    }
    .center_text_mobile{
        text-align: center;
    }
    .mobile-display{
        display:block !important;
    }
    .web-display{
        display:none !important;
    }
    .map_padding {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    .navbar-collapse {
        background-color: #ffffff;
        width: 100%;
        position: absolute;
        top: 70px;
        left: 0;
        margin: 0;
        right: 0;
        padding: 20px;
		color:black
    }
.contactTitle h3{
	margin-bottom:0;
	}
	
	.ourProductbg {
		display:none;
    position: absolute;
    width: 100px;
    left: 47%;
     top: 0px; 
}
    .navbar-collapse .close {
        float: left;
        opacity: 1;
        color: white;
    }


    body {
        font-size: 14px;
    }

    header .reqBtn {
        width: 100%;
        margin: 0;
        margin-top: 30px;
        margin-bottom: 0;
    }

    .owl-stage-outer {
        overflow: hidden !important;
    }

    .chooseTypeContainer {
        margin-bottom: 20px;
    }

    .sendBtn {
        margin: 0;
        width: 100%;
    }
.galleryCar{
		margin-right: 0px;
	}
    .galleryCar.owl-carousel .owl-item.center .galleryItem {
        width: 100%;
    }
    .galleryCar.owl-carousel .owl-item {
        height: 215px;
    }
    .galleryimg {
		width:unset;
		    margin: 0 10%;
        height: 200px;
        object-fit: contain;

    }

    .heroContent {
        padding-top: 185px;
    }

    .hero {
        height: 530px;
        padding-top: 46px;


    }

    .sampleImg {
        width: 100%;
        height: auto;
        margin-bottom: 20px;
        margin-top: 25px;
    }

    .sampleImg img {
        height: auto;
        width: 100%;
    }

    .galleryCar .owl-nav {
        top: auto;
        bottom: 13px;
    }

    .featuresSlider .owl-nav {
        top: auto;
        bottom: -45px;
    }

    .GalleryDetails {
        margin-top: 80px
    }

    .Gallery .owl-dots {
        margin: 20px auto
    }

    .Gallery .owl-dots {
        width: 49%;
    }

    .ourClientCar.owl-carousel .owl-nav {
        top: -63px
    }

    .galleryItem {
        opacity: 0;
    }

    .ourTeambg {
        display: none;
    }

    .ourProductbg2,.ourProductsm,.ourProductsm2,.ourProductsm3{
        display: none;
    }

    .ourTeambg2 {
        display: none;
    }

    .memberBox {
        margin-bottom: 95px;
    }

    .teamGroup {
        margin-bottom: 0;
    }

    .experianceBox {
        margin-top: 30px
    }

    .principlesBox {
        margin-bottom: 20px;
		    height: 200px;

    }

    .productsText {
        display: none;
    }

    .anotherFeatures {
        color: white !important;
        margin-bottom: 20px;
    }

    .productHeroImg {
        position: relative;
        width: 100%;
        height: auto;
        left: auto;
        top: auto;
        margin: 20px auto
    }

    .OurProductHero {
        padding-bottom: 95px;
            padding: 115px 0 !important;

    }
    

    .OurProductHero:before,.contactUsPage:before {
        clip-path: polygon(0 0, 100% 0%, 100% 100%, 0 88%);
    }

    .productHeroImg img {
        height: auto;
    }

    .navbar-nav {
        margin-top: 30px
    }

    .nav-item {
        margin-bottom: 20px;
    }

    .overviewVideoContainer {
        height: auto;
    }

    .contactUsPage {
        padding-top: 145px
    }

    header {
        height: auto;
    }

    .aboutHero h1 {
        max-width: 100%;
        ;
        font-size: 2em;
    }

    .showoverviewVideoBtn {
        top: 31%;
        left: 36%;
        width: 60px;
        height: 60px;
    }

    .Gallery .owl-dots {
        position: relative;
        width: 100%;
        margin: auto;
        background-color: transparent;
        margin-top: 15px;
        text-align: center;
    }

    .Gallery .owl-dots .owl-dot {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        margin: 10px;
        background-color: #5A7184;

    }

    .Gallery .owl-dots .owl-dot.active {
        background-color: #E21F3A;
    }

    .reportFeatures {
        padding-bottom: 130px;
    }

    .oursamplesSec {
        padding-bottom: 50px;
    }

    .socialIcons {
      /*  margin-bottom: 30px;*/
    }

    .ourTeam {
        padding: 30px 0;
    }

    .contactPageCont {
        padding-top: 200px
    }

    .sampleImg {
        width: 100%;
    }

    .featuresSlider .owl-nav button.owl-next,
    .featuresSlider .owl-nav button.owl-prev {
        position: absolute;
        left: 15%;
        top: 0;
        margin: 0;
    }

    .featuresSlider .owl-nav button.owl-next {
        left: 10px;
        right: auto;
    }

    .featuresSlider .owl-nav {
        top: auto;
    bottom: 422px;
    left: 14px;
    width: 100%;
    }

    .galleryCar.owl-carousel .owl-nav button.owl-prev {
		 top: -240px;
        left: 20%
    }
    .galleryCar.owl-carousel .owl-nav button.owl-next {
		    top: -240px;
        right: auto;
        left:10%
    }
}
.featuresImgs {
    overflow: hidden;
    margin-right: -256px;
    margin-top: 29%;
    width: 37%;
}
@media(max-width:800px) {
    .navbar {
    color: black ;
}
}
@media(min-width:1180px) and (max-width:1180px) {
.featuresSlider .owl-prev {
    left: 480px !important;}
    .featuresSlider .owl-next {
    right: 445px !important;;
}
}

@media(max-width:1100px) {
    .features{
        width: 100% !important;
        margin: 0 22px 22px;
        border-radius: 20px;
    }
    .featuresImgs{
        overflow: unset;
        margin-right: unset;
        margin-top: 5%;
        width: 100% !important;
    }
}
@media(min-width:800px) and (max-width:1100px) {

    .galleryCar.owl-carousel .owl-item.center .galleryItem {
        width: 100% !important;
    }
    .navbar-expand-lg .navbar-collapse {
        display: -ms-flexbox !important;
        display: flex !important;
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        -ms-flex-direction: row;
        flex-direction: row;
        background-color: transparent;
        top: auto;
    }

    .sampleImg {
        width: 100%;
    }

    .navbar-toggler {
        display: none;
    }

    .navbar-nav {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .navbar-expand-lg .navbar-nav .nav-link {
        margin-left: 30px
    }

    header .reqBtn {
        width: 130px;
        margin-right: auto;
        z-index: 444444444;

    }

    .owl-stage-outer {
        overflow: hidden !important;
    }

    .ourClientCar.owl-carousel .owl-nav {
        top: 105px
    }

    .galleryCar.owl-carousel .owl-item {
        opacity: 0;
    }

    .ContactList li {
        font-size: .85em;
        padding: 0 5px
    }

    .ourTeambg,
    .ourTeambg2 {
        display: none;
    }

    .ourProductbg2,.ourProductsm,.ourProductsm2,.ourProductsm3{
        display: none;
    }
    .featuresSlider .owl-nav button.owl-next,
    .featuresSlider .owl-nav button.owl-prev {
        position: absolute;
        left: 0;
        right:70%;
        top: 0;
        margin: 0;
    }

    .featuresSlider .owl-nav button.owl-next {
        left: 0;
        right: auto;
    }

    .featuresSlider .owl-nav {
        top: auto;
        bottom: 422px;
        left: 0;
        width: 100%;
    }

}

.heroVideo {
    object-fit: cover !important
}

.policy {
    margin-top: 4%;
    margin-bottom: 3%;
    color: white;
}

.copyright {
    margin-top: 5%;
    font-size: 10px;
}
.cc-window.cc-floating{
    right:0;
    left:0;
    bottom:0;
    max-width: 100% !important;
}


.heading_overlay {
    display: inline-block;
    position: relative;
    height: 5px;
    border-radius: 30px;
    background-color: #E21F3A;
    width: 90px;
    margin-top: 5px;
    margin-bottom: 18px;
    overflow: hidden
}


.heading_overlay:after {
    content: '';
    position: absolute;
    left: 0;
    top: -1.1px;
    height: 7px;
    width: 8px;
    background-color: #ffffff;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-name: MOVE-BG;
    animation-name: MOVE-BG
}

.contact_heading_overlay:after {

    background-color: #E21F3A !important;
   
}

.contact_heading_overlay {

    background-color: #00000014 !important;
   
}

@-webkit-keyframes MOVE-BG {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    to {
        -webkit-transform: translateX(88px);
        transform: translateX(88px)
    }
}

@-webkit-keyframes MOVE-BG {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    to {
        -webkit-transform: translateX(88px);
        transform: translateX(88px)
    }
}

@keyframes MOVE-BG {
    from {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    to {
        -webkit-transform: translateX(88px);
        transform: translateX(88px)
    }
}


.animation-jump {
    position: relative;
    -webkit-animation: animation-jump 2s ease-in-out infinite;
    animation: animation-jump 2s ease-in-out infinite;
}

@keyframes animation-jump {
    0% {
        top: 10px;
    }
    50% {
        top: -10px;
    }
    100% {
        top: 10px;
    }
}

.contact_animation_title {
  animation: glow 2500ms linear infinite 2000ms;
}

.animation_title {
  animation: reveal 3000ms ease-in-out forwards 200ms,
             glow 2500ms linear infinite 2000ms;
}
  @keyframes reveal {
    80%{
      letter-spacing: 8px;
    }
    100% {
      background-size: 300% 300%;
    }
  }
  @keyframes glow {
    40% {
      text-shadow: 0 0 8px #fff;
    }
  }
}  

.ourProduct {
    position: absolute;
    top: 500;
    width: 850px;
    left: -37%;
}
.zf-errorMessage {
    font-size: 15px;
    color: #ff0000;
    padding: 0px 8px 20px 0;
}