* {
    margin: 0;
    padding: 0;
}

body {
    /* overflow-x: hidden !important; */
    color: white;
    direction: rtl;
    background: #eeeff3;
    font-family: 'Assistant', sans-serif;
    overflow-x: hidden;
    /* display: flex; */
    /* flex-direction: column; */
}

/* .showcase {
    background-image: url('img/superCutoff3.svg'), url('mainImage2.jpg');
    background-size: cover;
    background-position: bottom left, center;
    height: 2500px;
} */

/* ====================== top menu ====================================== */

.theDesktopView .topLinkwrapper ul {
    list-style: none;
}

.theDesktopView .topLinkwrapper ul li a {
    color: white;
}

.theDesktopView nav .container {
    display: flex;
    flex-direction: row;
    width: 85%;
    margin: auto;
    flex-direction: row;
    /* justify-content: space-around; */
}

/* nav .container .logo {
    width: 496px;
    height: 150px; => in media query
    margin-top: 10px;
    outline: 1px solid red;
} */

.theDesktopView nav li a {
    color: white !important;
    font-size: 1.5rem !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    font-family: 'Assistant', sans-serif !important;
}

/* .theDesktopView nav li a:hover {
    color: white !important;
    padding-bottom: 8px !important;
    border-bottom: 3px solid orange !important;
} */

.theDesktopView nav .aboutLink a:hover,
.theDesktopView nav .servicesLink a:hover,
.theDesktopView nav .authorityLink a:hover,
.theDesktopView nav .phoneLink a:hover {
    color: white !important;
    padding-bottom: 8px !important;
    border-bottom: 3px solid orange !important;
}

.theDesktopView nav .contactUsLink a:hover {
    border-bottom: none !important;
}

/* nav {
    height: 100px;
    outline: 1px solid red;
} */


/*top link */



/* .topLinkwrapper {
    width: 70%;
    float: left; => to media query
    outline: 1px solid white;
} */


/* +++++++++++++++++++++++++++++++++++++++++++++ */

/* full HD resolution */

/* .theDesktopView nav .container .topLogoWrapper {
    width: 496px;
    width: 30%;
    min-height: 165px;
    outline: 1px solid blue;
    height: 100px; measures applied when scrolling
} */

.theDesktopView nav .container .logo {
    /* width: 496px; */
    /* min-height: 150px; */
    width: 100%;
    height: auto;
    margin-top: 10px;
    /* outline: 1px solid red; */
    /* width: 400px; measures applied when scrolling
    height: 100px; */
}

.theDesktopView .topLinkwrapper {
    width: 70%;
    /* width: 638.31px; */
    /* width: 56%; */
    /* min-height: 165px; */
    /* float: left; */
    /* outline: 1px solid white; => for testing */
    padding-right: 70px;
    /* for testing*/
}



.theDesktopView .phoneLink .phoneIcon {
    margin-right: 5px;
    color: white;
    transform: rotate(-30deg);
}

@media screen and (min-width: 1025px) and (max-width: 1439px) {

    .theDesktopView .topLinkwrapper ul {
        display: grid;
        grid-template-columns: 15% 15% 15% 30% 25%;
    }

    /* .theDesktopView nav .container .topLogoWrapper {
        width: 350px;
        height: 130px;
        outline: 1px solid blue;
    } */

    .theDesktopView .contactUsLink {
        background-color: #198742;
        border: none;
        color: white;
        /* padding: 0px 32px 10px; */
        text-align: center;
        text-decoration: none;
        /* display: inline-block; */
        /* font-size: 16px; */
        /* margin: 4px 2px; */
        cursor: pointer;
        /* width: 195px; */
        /* height: 50px; */
        /* font-size: 35px; */
        /* margin-top: 56px; */
    }

    .theDesktopView .contactUsLink a {
        /* padding: 0px 32px 10px; */
        display: inline-block;
        width: 100%;
        padding: 0px 0px 5px;
    }


    .theDesktopView nav .container .topLogoWrapper {
        width: 350px;
        /* width: 30%; */
        /* min-height: 165px; */
        /* outline: 1px solid blue; => for test */
        /* height: 100px; measures applied when scrolling */
    }

    .theDesktopView .topLinkwrapper ul li {
        /* float: right; */
        margin-top: 40px;
    }

    .theDesktopView .aboutLink {
        margin-right: 10%;
    }

    /* .theDesktopView nav .container .topLogoWrapper .shell {
        width: 300px;
    } */
}


@media screen and (min-width: 1400px) and (max-width: 1440px) {
    .theDesktopView .topLinkwrapper ul {
        display: grid;
        grid-template-columns: 15% 15% 20% 25% 25%;
    }

    .theDesktopView nav .container .topLogoWrapper {
        width: 496px;
        /* width: 30%; */
        /* min-height: 165px; */
        /* outline: 1px solid blue; */
        /* height: 100px; measures applied when scrolling */
    }

    .theDesktopView .topLinkwrapper ul li {
        /* float: right; */
        margin-top: 60px;
    }

    .theDesktopView .contactUsLink {
        background-color: #198742;
        border: none;
        color: white;
        /* padding: 0px 32px 10px; */
        text-align: center;
        text-decoration: none;
        /* display: inline-block; */
        /* font-size: 16px; */
        /* margin: 4px 2px; */
        cursor: pointer;
        /* width: 195px; */
        /* height: 50px; */
        /* font-size: 35px; */
        /* margin-top: 56px; */
    }

    .theDesktopView .contactUsLink a {
        /* padding: 0px 32px 10px; */
        display: inline-block;
        width: 100%;
        padding: 0px 0px 5px;
    }

    /* .theDesktopView .contactUsLink a {
        padding: 0px 0px 20px;
        display: inline-block;
        width: 100%;
    } */

    .theDesktopView .aboutLink {
        margin-right: 10%;
    }

    /* .theDesktopView .servicesLink {
        margin-left: 2%;
    }

    .theDesktopView .authorityLink {
        margin-left: 4%;
    }

    .theDesktopView .phoneLink {
        margin-left: 1%;
    } */
}


@media screen and (min-width: 1441px) and (max-width: 1920px) {
    .theDesktopView .topLinkwrapper ul {
        display: grid;
        /* grid-template-columns: 15% 15% 15% 30% 25%; */
        grid-template-columns: 15% 15% 15% 30% 25%;
    }

    .theDesktopView .contactUsLink {
        background-color: #198742;
        border: none;
        color: white;
        /* padding: 0px 32px 10px; */
        text-align: center;
        text-decoration: none;
        /* display: inline-block; */
        /* font-size: 16px; */
        /* margin: 4px 2px; */
        cursor: pointer;
        /* width: 195px; */
        /* height: 50px; */
        /* font-size: 35px; */
        /* margin-top: 56px; */
    }

    .theDesktopView .contactUsLink a {
        /* padding: 0px 32px 10px; */
        display: inline-block;
        width: 100%;
        padding: 0px 0px 5px;
    }

    .theDesktopView .topLinkwrapper ul li {
        /* float: right; */
        margin-top: 60px;
    }

    .theDesktopView nav li a {
        color: white !important;
        font-size: 2.0rem !important;
        font-weight: 500 !important;
        text-decoration: none !important;
        font-family: 'Assistant', sans-serif !important;
    }

    .theDesktopView .aboutLink {
        margin-right: 10%;
    }
}



@media screen and (min-width: 1921px) {
    .theDesktopView .topLinkwrapper ul {
        display: grid;
        /* grid-template-columns: 15% 15% 15% 30% 25%; */
        grid-template-columns: 15% 15% 15% 30% 25%;
    }

    .theDesktopView .contactUsLink {
        background-color: #198742;
        border: none;
        color: white;
        /* padding: 0px 32px 10px; */
        text-align: center;
        text-decoration: none;
        /* display: inline-block; */
        /* font-size: 16px; */
        /* margin: 4px 2px; */
        cursor: pointer;
        /* width: 195px; */
        /* height: 50px; */
        /* font-size: 35px; */
        /* margin-top: 56px; */
    }

    .theDesktopView .contactUsLink a {
        /* padding: 0px 32px 10px; */
        display: inline-block;
        width: 100%;
        padding: 0px 0px 5px;
    }

    .theDesktopView .topLinkwrapper ul li {
        /* float: right; */
        margin-top: 60px;
    }

    .theDesktopView nav li a {
        color: white !important;
        font-size: 2.0rem !important;
        font-weight: 500 !important;
        text-decoration: none !important;
        font-family: 'Assistant', sans-serif !important;
    }

    .theDesktopView .aboutLink {
        margin-right: 10%;
    }
}




/* +++++++++++++++++++++++++++++++++++++++++++++ */



/* ====================== top menu ====================================== */


/* ================================ top featured text ===================================== */


/*quality assurance service*/

.theDesktopView .QAssuranceWrapper {
    display: flex;
    width: 100%;
    min-height: 280px;
}

.theDesktopView .QAssuranceService {
    display: flex;
    flex-direction: column;
    /* width: 85%; */
    /* margin: auto; */
    color: white;
    /* margin-top: 72px; */
    margin-right: 7.2%;
    margin-top: 50px;
}

.theDesktopView .QAssuranceService h1 {
    font-size: 72px;
}

.theDesktopView .QAssuranceService h2,
.theDesktopView .QAssuranceService h3 {
    font-size: 52px;
    font-weight: 500;
}

@media screen and (min-width: 1921px) {
    .theDesktopView .QAssuranceService h1 {
        font-size: 7.5rem;
    }

    .theDesktopView .QAssuranceService h2,
    .theDesktopView .QAssuranceService h3 {
        font-size: 5.5rem;
        font-weight: 500;
    }
}

@media screen and (min-width: 1441px) and (max-width: 1920px) {
    .theDesktopView .QAssuranceService h1 {
        font-size: 7rem;
    }
}

@media screen and (min-width: 1025px) and (max-width: 1440px) {
    .theDesktopView .QAssuranceService h1 {
        font-size: 5.5rem;
    }
}

/*quality assurance service*/

/* ================================ top featured text ===================================== */



/* ============================= top contact form ============================================== */

/*home contact form*/

#submitGroupTop {
    text-align: center;
}

.theDesktopView .showccaseForm {
    display: flex;
    flex-direction: column;
    /* width: 85%; */
    /* margin: auto; */
    color: white;
    width: 100%;
    min-height: 419px;
    margin-top: 69px;
}


/*@media screen and (min-width: 1025px) and (max-width:1920px) {
    .theDesktopView .showccaseForm form {
        display: flex;
        flex-direction: column;
        width: 620px;
        min-height: 419px;
        margin-top: 69px;==commented out
        background: rgba(0, 0, 0, 0.42);
        #00000070==>commented out
        opacity: 0.5;==>commented out
        border-radius: 10px;
        margin-right: 7.2%;
    }

    .theDesktopView .showccaseForm form input {
        width: 549px;
        border: none;
        height: 80px;
        margin-bottom: 31px;
        box-sizing: border-box;
        padding: 20px;
    }
}*/

@media screen and (min-width: 1025px) {

    .showccaseForm .wpcf7 {
        margin: 0;
        padding: 0;
        width: 820px !important;
        margin-right: 7.2% !important;
    }

    .showccaseForm .wpcf7-form{
        display: flex;
        flex-direction: column;
        width: 820px;
        min-height: 519px;
        /* margin-top: 69px; */
        background: rgba(0, 0, 0, 0.42);
        /*#00000070*/
        /* opacity: 0.5; */
        border-radius: 10px;
        margin-right: 7.2%;
        padding-right: 30px;
        padding-left: 30px;
    }
    /*.theDesktopView .showccaseForm form {
        display: flex;
        flex-direction: column;
        width: 820px;
        min-height: 519px;
         margin-top: 69px;== 
        background: rgba(0, 0, 0, 0.42);
        #00000070==
         opacity: 0.5;== 
        border-radius: 10px;
        margin-right: 7.2%;
    }*/

    .showccaseForm .wpcf7-submit{
        width: 100% !important;
        border: 0 !important;
        background-color: #f06631;
        border: none;
        color: white;
        padding: 15px 32px;
        text-align: center;
        text-decoration: none;
        /* display: inline-block; */
        /* font-size: 16px; */
        /* margin: 4px 2px; */
        cursor: pointer;
        /* width: 195px; */
        /* height: 50px; */
        font-size: 35px;
        /* margin-top: 56px; */
        width: 549px;
    }

    .theDesktopView .showccaseForm form input {
        /*width: 749px;*/
        width: 100%;
        border: none;
        height: 110px;
        margin-bottom: 31px;
        box-sizing: border-box;
        padding: 20px;
        direction: rtl;
    }
}

.theDesktopView .showccaseForm form input::placeholder {
    color: black;
    font-size: 22px;
    font-family: 'Assistant', sans-serif;
    font-weight: 700;
}

.theDesktopView .showccaseForm form input::-moz-placeholder {
    color: black;
    font-size: 22px;
    font-family: 'Assistant', sans-serif;
    font-weight: 700;
    opacity: 1;
}

.theDesktopView .showccaseForm form input::-webkit-input-placeholder {
    color: black;
    font-size: 22px;
    font-family: 'Assistant', sans-serif;
    font-weight: 700;
    opacity: 1;
}

.theDesktopView .showccaseForm form input,
.theDesktopView .showccaseForm form .sendForm {
    align-self: center;
}

.theDesktopView .showccaseForm form h2 {
    /* color: white; */
    font-size: 30px;
    text-align: center;
    margin-bottom: 31px;
    margin-top: 20px;
}


@media screen and (min-width: 1025px) and (max-width: 1920px) {
    .theDesktopView .showccaseForm form .sendForm {
        /**/
        background-color: #f06631;
        border: none;
        color: white;
        padding: 15px 32px;
        text-align: center;
        text-decoration: none;
        /* display: inline-block; */
        /* font-size: 16px; */
        /* margin: 4px 2px; */
        cursor: pointer;
        /* width: 195px; */
        /* height: 50px; */
        font-size: 35px;
        /* margin-top: 56px; */
        width: 549px;
    }
}

@media screen and (min-width: 1921px) {
    .theDesktopView .showccaseForm form .sendForm {
        /**/
        background-color: #f06631;
        border: none;
        color: white;
        padding: 15px 32px;
        text-align: center;
        text-decoration: none;
        /* display: inline-block; */
        /* font-size: 16px; */
        /* margin: 4px 2px; */
        cursor: pointer;
        /* width: 195px; */
        height: 110px;
        font-size: 35px;
        /* margin-top: 56px; */
        width: 749px;
    }
}


.theDesktopView .showccaseForm form .sendForm .fas {
    vertical-align: middle !important;
}

/*home contact form*/

/* ============================= top contact form ============================================== */




/* ============================================ featuring section =================================================  */

/*featuring area*/


@media screen and (min-width: 1921px) {
    .theDesktopView .features {
        width: 100%;
        display: flex;
        /* margin-top: 400px; */
        margin-top: 890px;
        /* flex-direction: column-reverse; */
    }
}



@media screen and (max-width: 1920px) {
    .theDesktopView .features {
        width: 100%;
        display: flex;
        /* margin-top: 400px; */
        margin-top: 350px;
        /* flex-direction: column-reverse; */
    }
}

.theDesktopView .features .brands {
    width: 80%;
    height: 138px;
    background: white;
    position: absolute;
    z-index: 10;
    margin-right: 8%;
    /* margin-left: 2%; */
    /* margin-right: 160px; */
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-evenly;
    align-items: center;
    box-shadow: 0px 1px 5px 2px rgba(0, 0, 0, 0.45);
    -webkit-box-shadow: 0px 1px 5px 2px rgba(0, 0, 0, 0.45);
    -moz-box-shadow: 0px 1px 5px 2px rgba(0, 0, 0, 0.45);
}


.theDesktopView .features .brands .lBrands {
    display: flex;
    justify-content: space-evenly;
    width: 40%;
}

@media screen and (min-width:1025px) and (max-width:1440px) {

    .theDesktopView .features .brands .lBrands img,
    .theDesktopView .features .brands .mBrands img,
    .theDesktopView .features .brands .rBrands img {
        width: 150px;
        height: 60px;
    }
}


@media screen and (min-width:1441px) and (max-width:1920px) {

    .theDesktopView .features .brands .lBrands img,
    .theDesktopView .features .brands .mBrands img,
    .theDesktopView .features .brands .rBrands img {
        width: 190px;
        height: 75px;
    }
}


.theDesktopView .features .brands .mBrands {
    display: flex;
    justify-content: space-evenly;
    width: 40%;
}

.theDesktopView .features .brands .rBrands {
    display: flex;
    justify-content: space-evenly;
    width: 40%;
}



/*targeting firefox*/
@-moz-document url-prefix() {
    .theDesktopView .features .brands {
        margin-right: 4%;
    }
}

/* .features .mainContainer {
    width: 92.5%;
    text-align: right;
    outline: 1px solid red;
    background: url("img/whatNow.svg") no-repeat;
    background-size: cover;
    background-position: center;
    display: flex;
    margin-top: 80px;
} */

.theDesktopView .features .sideContainer {
    width: 7.5%;
    /* outline: 1px solid yellow; => for testing */
}

.theDesktopView .featureMainContent {
    width: 92.5%;
    /* outline: 1px solid green; => for testing */
    display: flex;
}

.theDesktopView .featureMainContentRightSide {
    width: 7.5%;
    /* outline: 1px solid black; => for testing */
}

.theDesktopView .features .contentArea {
    width: 50%;
    /* outline: 1px solid blue; => for testing */
    margin-top: 140px;
}


/* .features .contentArea ul {
    width: 80%;
    margin-bottom: 100px;
    margin-right: 40px;
    list-style: none;
} */



.theDesktopView .features .featuredImage {
    width: 50%;
    /* outline: 1px solid white; => for testing */
    margin-top: 140px;
}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


/* featured content */



@media screen and (min-width: 1921px) {
    .theDesktopView .features .contentArea .bottomArea h2 {
        font-size: 50px;
        font-weight: 700;
        margin-right: 40px;
        margin-bottom: 15px;
    }
}


@media screen and (min-width: 1400px) and (max-width:1920px) {
    .theDesktopView .features .contentArea .bottomArea h2 {
        font-size: 30px;
        font-weight: 700;
        margin-right: 40px;
        margin-bottom: 15px;
    }
}

@media screen and (min-width: 1025px) and (max-width: 1399px) {
    .theDesktopView .features .contentArea .bottomArea h2 {
        font-size: 24px;
        font-weight: 700;
        margin-right: 40px;
        margin-bottom: 15px;
    }
}

.theDesktopView .features .contentArea .bottomArea {
    /* margin-bottom: 350px; */
    margin-bottom: 0px;
}


@media screen and (min-width: 1025px) and (max-width: 1399px) {
    .theDesktopView .features .contentArea ul {
        width: 100%;
        margin-bottom: 50px;
        /* margin-right: 40px; */
        list-style: none;
    }
}

@media screen and (min-width: 1400px) and (max-width: 1440px) {
    .theDesktopView .features .contentArea ul {
        width: 100%;
        margin-bottom: 100px;
        /* margin-right: 40px; */
        list-style: none;
    }
}

@media screen and (min-width: 1441px) and (max-width: 1920px) {
    .theDesktopView .features .contentArea ul {
        width: 100%;
        margin-bottom: 100px;
        /* margin-right: 40px; */
        list-style: none;
    }
}


@media screen and (min-width: 1921px) {
    .theDesktopView .features .contentArea ul {
        width: 100%;
        margin-bottom: 190px;
        /* margin-right: 40px; */
        list-style: none;
    }
}


.theDesktopView .features .featuredImage img {
    float: left;
    margin-left: 10.5%;
    /* -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 1% 80%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 1% 80%); */
    width: 80%;
}

/*targeting modern browsers*/
@supports (clip-path: circle()) {
    .theDesktopView .features .featuredImage img {
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 80%);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 80%);
        object-fit: cover;
        width: 80%;
    }
}


@media screen and (min-width: 1921px) {
    .theDesktopView .features .contentArea ul li {
        font-size: 36px;
        margin-bottom: 15px;
        font-weight: 400;
        display: inline-block;
    }
}


@media screen and (min-width: 1400px) and (max-width: 1920px) {
    .theDesktopView .features .contentArea ul li {
        font-size: 26px;
        margin-bottom: 15px;
        font-weight: 400;
        display: inline-block;
    }
}

@media screen and (min-width: 1025px) and (max-width: 1399px) {
    .theDesktopView .features .contentArea ul li {
        font-size: 18px;
        margin-bottom: 15px;
        font-weight: 400;
        display: inline-block;
    }
}


@media screen and (min-width: 1400px) and (max-width: 1440px) {
    .theDesktopView .features .contentArea ul li {
        font-size: 20px;
        margin-bottom: 15px;
        font-weight: 400;
        display: inline-block;
    }
}

.theDesktopView .features .contentArea ul li .fas {
    margin-left: 20px !important;
}

.theDesktopView .features .contentArea ul li .checkOne {
    vertical-align: 15px;
}

.theDesktopView .features .contentArea ul li .checkThree {
    vertical-align: 15px;
}

.theDesktopView .features .contentArea ul li .checkFour {
    vertical-align: 15px;
}

.theDesktopView .features .contentArea ul li .checkFive {
    vertical-align: 15px;
}

.theDesktopView .features .contentArea ul li .checkSix {
    vertical-align: 15px;
}

.theDesktopView .features .contentArea ul li .contListOne {
    display: inline-block;
    width: 90%;
}

/*.features .contentArea ul li .contListTwo,*/
.theDesktopView .features .contentArea ul li .contListThree {
    display: inline-block;
    width: 90%;
}

.theDesktopView .features .contentArea ul li .contListFour {
    display: inline-block;
    width: 90%;
}

.theDesktopView .features .contentArea ul li .contListFive {
    display: inline-block;
    width: 90%;
}

.theDesktopView .features .contentArea ul li .contListSix {
    display: inline-block;
    width: 90%;
}

/* .features .contentArea ul li .contListSeven
    {
    display: inline-block;
    width: 90%;
} */

/* featured content */


/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



/* ============================================ featuring section =================================================  */


/* ======================================= showcase two ============================================ */

/*showcase two*/

.theDesktopView .showCaseTwoWrapper {
    width: 100%;
    min-height: 100px;
    margin-top: 100px;
}

/* ======================================= showcase two ============================================ */



/* =============================================== certification area ========================================== */

.theDesktopView .showCaseTwo {
    width: 85%;
    margin: auto;
}

.theDesktopView .showCaseTwo .certStatement {
    display: flex;
    flex-direction: row;
    min-height: 100px;
    color: black;
    /* outline: 1px solid red; */
}

.theDesktopView .showCaseTwo .certStatement .left,
.theDesktopView .showCaseTwo .certStatement .right {
    width: 50%;
}

.theDesktopView .showCaseTwo .certStatement .left {
    box-sizing: border-box;
    padding-right: 40px;
}

.theDesktopView .showCaseTwo .certStatement ul li img {
    vertical-align: middle;
    margin-left: 40px;
    width: 72px;
    height: 60px;
}


/* +++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* cert statement */

.theDesktopView .showCaseTwo .certStatement ul li {
    list-style: none;
    font-size: 46px;
    font-weight: 600;
    margin-bottom: 60px;
    display: flex;
}

@media screen and (min-width: 1400px) and (max-width: 1440px) {
    .theDesktopView .showCaseTwo .certStatement ul li {
        display: flex;
    }
}

/* cert statement */

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


/* =============================================== certification area ========================================== */


/* ============================================== about section ============================================= */

/* bio section */

/* .preBioBg {
    background: url('../img/bioTopBG.png') no-repeat;
    background-size: cover;
    background-position: left top;
    height: 40vh;
} */

.theDesktopView .bioWrapper {
    margin-top: 150px;
    width: 100%;
}

.theDesktopView .actualBioSection {
    background: white;
    padding-top: 100px;
    padding-bottom: 100px;
}


.theDesktopView .actualBioSection .bioContent {
    width: 85%;
    margin: auto;
    color: black;
    display: flex;
    /* justify-content: space-between; */
    /* outline: 1px solid black; => for testing */
    margin-bottom: 50px;
}

@media screen and (min-width:1321px) {
    .theDesktopView .actualBioSection .bioContent .right {
        margin-right: 175px;
        margin-left: 75px;
        width: 50%;
    }
}

@media screen and (min-width:1025px) and (max-width:1320px) {
    .theDesktopView .actualBioSection .bioContent .right {
        /* margin-right: 175px; */
        margin-left: 75px;
        width: 80%;
    }
}

.theDesktopView .actualBioSection .bioContent img {
    margin-left: 175px;
    margin-right: 75px;
    width: 33.5%;
    /*33.5%*/
    height: 33.9%;
    /*33.9%*/
    object-fit: cover;
    /*not supported on IE*/
}

.theDesktopView .actualBioSection .bioContent h2 {
    font-size: 54px;
    color: #f06631;
}

.theDesktopView .actualBioSection .bioContent p {
    font-size: 26px;
    color: black;
}

.theDesktopView .actualBioSection .bioContent .third,
.theDesktopView .actualBioSection .bioContent .second {
    margin-bottom: 20px;
}

.theDesktopView .preBioBG_shell {
    background: black;
    position: absolute;
    width: 100%;
    height: 250px;
    z-index: -1;
    /* margin-top: 380px; */
}


/* +++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* bio content */

.theDesktopView .actualBioSection .bioContent img {
    margin-left: 8%;
    margin-right: 75px;
    width: 100%;
    /*33.5%*/
    height: auto;
    /*33.9%*/
    /* object-fit: cover; */
    /*not supported on IE*/
    margin-top: 10px;
    box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.21);
    -webkit-box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.21);
    -moz-box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.21);
    border-radius: 8px;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++ */



/* ============================================== about section ============================================= */



/* ================================================= main form section  =============================================== */


/* main contact form */

.wpcf7 input[type="url"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"]{
    direction: rtl !important;
}

#submitMainGroup {
    float: left;
    margin-top: 30px;
}

.theDesktopView .mainContactFormWrapper {
    width: 100%;
    height: 857px;
    display: flex;
    flex-direction: row;
}

.theDesktopView .mainContactFormWrapper .mainFormWhiteBG {
    position: absolute;
    background: white;
    width: 100%;
    height: 350px;
    z-index: -10;
}

.theDesktopView .mainContactFormWrapper .mainFormGreenBG {
    width: 93%;
    height: 857px;
    background: #198742;
    position: absolute;
    z-index: -5;
    margin-right: 7%;
}

@-moz-document url-prefix() {
    .theDesktopView .mainContactFormWrapper .mainFormGreenBG {
        width: 92.9%;
        height: 857px;
        background: #198742;
        position: absolute;
        z-index: -5;
        margin-right: 3.5%;
    }
}

.theDesktopView .mainContactFormWrapper .detailFormWrapper {
    width: 30%;
    height: auto;
    /* outline: 1px solid red; => for testing */
}

.theDesktopView .mainContactFormWrapper .actualFormWrapper {
    width: 70%;
    height: auto;
    /* outline: 1px solid blue; => for testing */
}

.theDesktopView .actualFormWrapper form {
    width: 80%;
    margin: auto;
    direction: rtl;
}

.desktopFormTitle{
    font-size: 54px;
    font-family: 'Open Sans', sans-serif;
    margin: 50px 0 50px 0;
    font-weight: 500;
}

/*.theDesktopView .actualFormWrapper form h2 {
    font-size: 54px;
    font-family: 'Open Sans', sans-serif;
    margin: 50px 0 50px 0;
    font-weight: 500;
}*/

.theDesktopView .actualFormWrapper form input {
    width: 100%;
    background: transparent;
    border: 0;
    border-bottom: 2px solid white;
    height: 50px;
    color: rgb(227, 240, 116);
    font-size: 20px;
    margin-bottom: 7%;
    padding: 15px;
    box-sizing: border-box;
}

.theDesktopView .actualFormWrapper form textarea {
    width: 100%;
    height: 250px;
    background: transparent;
    border: 0;
    border-bottom: 2px solid white;
    box-sizing: border-box;
    resize: none;
    color: rgb(227, 240, 116);
    font-size: 20px;
    padding: 15px;
    font-weight: 600;
    box-sizing: border-box;
}

.wpcf7-submit{
    margin-top: 20px !important;
    /*background: gray !important;*/
    margin-right: 50%;
    width: 50% !important;
    border-bottom: 2px solid white !important;
    border-left: 2px solid white !important;
    border-right: 2px solid white !important;
    border-top: 2px solid white !important;
    padding: .5rem !important;
    color: white !important;
    padding: 10px !important;
    font-size: 40px !important;
    cursor: pointer !important;
    min-height: 70px !important;
}

/*.theDesktopView .actualFormWrapper form button {
    min-width: 15%;
    min-height: 40px;
    background: transparent;
    border: 0;
    border: 2px solid white;
    color: white;
    float: left;
    margin-top: 30px;
    padding: 5px;
    font-size: 40px;
    cursor: pointer;
}*/

.theDesktopView .actualFormWrapper form input::-webkit-input-placeholder {
    font-size: 22px;
    color: white;
    font-weight: 500;
    font-family: 'Assistant', sans-serif;
}

.theDesktopView .actualFormWrapper form input::-moz-placeholder {
    /* Firefox 19+ */
    font-size: 22px;
    color: white;
    font-weight: 500;
    opacity: 1;
    font-family: 'Assistant', sans-serif;
}

.theDesktopView .actualFormWrapper form input:-ms-input-placeholder {
    /* IE 10+ */
    font-size: 22px;
    color: white;
    font-weight: 500;
    font-family: 'Assistant', sans-serif;
}

.theDesktopView .actualFormWrapper form input:focus {
    /* outline: -webkit-focus-ring-color auto 5px; */
    outline: 0;
}

.theDesktopView .actualFormWrapper form textarea::-webkit-input-placeholder {
    font-size: 22px;
    color: white;
    font-family: 'Assistant', sans-serif;
}


.theDesktopView .actualFormWrapper form textarea::-moz-placeholder {
    /* Firefox 19+ */
    font-size: 22px;
    color: white;
    font-weight: 500;
    opacity: 1;
    font-family: 'Assistant', sans-serif;
}

.theDesktopView .actualFormWrapper form textarea:-ms-input-placeholder {
    /* IE 10+ */
    font-size: 22px;
    color: white;
    font-family: 'Assistant', sans-serif;
}

.theDesktopView .actualFormWrapper form textarea:focus {
    /* outline: -webkit-focus-ring-color auto 5px; */
    outline: 0;
}

.theDesktopView .mainContactFormWrapper ul {
    margin-right: 0;
    margin-top: 50px;
}

@media screen and (min-width: 1351px) {
    .theDesktopView .mainContactFormWrapper ul li {
        list-style: none;
        margin-bottom: 100px;
    }
}

@media screen and (min-width: 1025px) and (max-width:1350px) {
    .theDesktopView .mainContactFormWrapper ul li {
        list-style: none;
        margin-bottom: 50px;
    }
}


.theDesktopView .mainContactFormWrapper ul li.email .mailIcon {
    margin-left: 15px;
    width: 40px;
    vertical-align: middle;
    font-size: 33px
}

.theDesktopView .mainContactFormWrapper ul li.map .mapIcon {
    margin-left: 25px;
    width: 30px;
    vertical-align: middle;
    font-size: 33px
}

.theDesktopView .mainContactFormWrapper ul li.phone .phoneIcon {
    margin-left: 25px;
    width: 30px;
    vertical-align: middle;
    font-size: 33px
}

@media screen and (min-width:1301px) {
    .theDesktopView .mainContactFormWrapper ul .email a {
        font-size: 25px;
        text-decoration: none;
        color: black;
        font-weight: 600;
    }
}

@media screen and (min-width:1025px) and (max-width:1300px) {
    .theDesktopView .mainContactFormWrapper ul .email a {
        font-size: 18px;
        text-decoration: none;
        color: black;
        font-weight: 600;
    }
}

.theDesktopView .mainContactFormWrapper ul .map a {
    font-size: 25px;
    text-decoration: none;
    color: black;
    font-weight: 600;
}

.theDesktopView .mainContactFormWrapper ul .phone a {
    font-size: 25px;
    text-decoration: none;
    color: black;
    font-weight: 600;
}

.theDesktopView .mainContactFormWrapper ul .email a:hover,
.theDesktopView .mainContactFormWrapper ul .map a:hover,
.theDesktopView .mainContactFormWrapper ul .phone a:hover {
    color: #d28800;
    /* opacity: 0.6; */
}


@keyframes wiggle {
    0% {
        transform: rotate(0deg);
    }

    80% {
        transform: rotate(0deg);
    }

    85% {
        transform: rotate(10deg);
    }

    95% {
        transform: rotate(-10deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

@keyframes wiggle2 {
    0% {
        transform: rotate(0deg);
    }

    80% {
        transform: rotate(0deg);
    }

    85% {
        transform: rotate(10deg);
    }

    95% {
        transform: rotate(-10deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

@keyframes wiggle3 {
    0% {
        transform: rotate(0deg);
    }

    80% {
        transform: rotate(0deg);
    }

    85% {
        transform: rotate(10deg);
    }

    95% {
        transform: rotate(-10deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

.theDesktopView .wiggle {
    /* display: inline-block; */
    animation: wiggle 2.5s infinite;
}

.theDesktopView .wiggle2 {
    /* display: inline-block; */
    animation: wiggle2 2.7s infinite;
}

.theDesktopView .wiggle3 {
    /* display: inline-block; */
    animation: wiggle3 2.9s infinite;
}



/* main contact form */

/* ================================================= main form section  =============================================== */


/* ============================== footer ========================================================= */

.theDesktopView .footerWrapper .footerHeader {
    width: 100%;
    height: 400px;
    /* outline: 1px solid red; */
    margin-top: 50px;
}


/* ============================== footer ========================================================= */
















/* ===========================================================  Mobile style ====================================================================== */

#home:focus {
    outline: none;
}

.mobileView {
    width: 100%;
    height: auto;
    display: block;
    background: #eeeff3;
    /* direction: rtl; */
    color: white;
}

/* .topArea img {
    max-width: 530px;
    height: auto;
    width: 100%;
} */
.mobileView .mainSiteImage {
    /* max-width: 530px; */
    height: auto;
    width: 100%;
    vertical-align: bottom;
}

/* .box {
    position: absolute;
    z-index: -50;
} */

.mobileView .mobileHeader {
    position: absolute;
    width: 100%;
    height: 60px;
    top: 0vw;
    /* outline: 1px solid red; */
}

.mobileView .mobileHeader .fas {
    position: absolute;
    color: white;
    right: 15px;
    top: 20px;
    font-size: 30px;
}

.mobileView .logoWrapper {
    /* width: 40%; */
    width: 100%;
    height: auto;
    /* margin: 5px auto; */
}

.mobileView .logoWrapper img {
    width: 100%;
    /* max-width: 400px; */
    height: auto;
}

.mobileView .logoContainer {
    width: 170px;
    margin: 5px auto;
}


/* ==================== feature section  ========================== */

.mobileView .brands {
    color: white;
    font-size: 5vw;
    position: absolute;
    width: 100%;
    top: 152vw;
    /* left: 10vw; */
    min-height: 50px;
    z-index: 1;
}

.mobileView .brands .innerBrands {
    width: 85%;
    height: auto;
    margin: auto;
    background: white;
    color: black;
    border-radius: 4px;
    box-shadow: 0px 1px 5px 2px rgba(0, 0, 0, 0.45);
    -webkit-box-shadow: 0px 1px 5px 2px rgba(0, 0, 0, 0.45);
    -moz-box-shadow: 0px 1px 5px 2px rgba(0, 0, 0, 0.45);
    padding-top: 5px;
    padding-bottom: 5px;
}

.mobileView .brands .innerBrands img {
    width: 80px;
    height: 38px;
}

.mobileView .brands .innerBrands .topBrands {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-evenly;
    margin-bottom: 15px;
}

.mobileView .brands .innerBrands .bottomBrands {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-evenly;
}

/* .featuredContent {
    background: #f06631;
    width: 100%;
    min-height: 600px;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 86%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 86%);
} */

.mobileView .featuredContent {
    background: #f06631;
    width: 100%;
    min-height: 570px;
}

@media screen and (min-width: 321px) and (max-width: 375px) {
    .mobileView .featuredContent {
        background: #f06631;
        width: 100%;
        min-height: 570px;
        padding-bottom: 30px;
    }
}

@media screen and (max-width: 320px) {
    .mobileView .featuredContent {
        background: #f06631;
        width: 100%;
        min-height: 570px;
        padding-bottom: 30px;
    }
}

@media screen and (min-width: 376px) and (max-width: 425px) {
    .mobileView .featuredContent {
        background: #f06631;
        width: 100%;
        min-height: 570px;
        padding-bottom: 30px;
    }
}

.mobileView .featuredImageWrapper {
    background: #f06631;
    width: 100%;
    min-height: 200px;
    padding-bottom: 30px;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 63%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 63%);
}

.mobileView .imgWrapper {
    width: 85%;
    min-height: 200px;
    margin: auto;
}

.mobileView .imgWrapper img {
    width: 100%;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 63%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 63%);
}

.mobileView .featuredContent .topContent {
    width: 85%;
    margin: auto;
    /* padding-top: 50px; */
}

.mobileView .featuredContent .topContent ul {
    padding-top: 100px;
    margin-bottom: 50px;
}


.mobileView .featuredContent ul {
    list-style: none;
}

.mobileView .featuredContent ul .item1,
.mobileView .featuredContent ul .item3,
.mobileView .featuredContent ul .item4,
.mobileView .featuredContent ul .item5,
.mobileView .featuredContent ul .item6 {
    margin-bottom: 5px;
    display: flex;
}

.mobileView .featuredContent ul .item2 {
    margin-bottom: 5px;
}


.mobileView .featuredContent li:before {
    content: "\f00c";
    /* FontAwesome Unicode */
    /* font-family: FontAwesome; */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    display: inline-block;
    margin-left: 0.7em;
    /* same as padding-left set on li */
    width: 1.3em;
    /* same as padding-left set on li */
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    padding-top: 10px;
}

.mobileView #featuredSection:focus {
    outline: none;
}

/* ==================== feature section  ========================== */



/* ========================= certification section ============================= */

.mobileView .certWrapper {
    width: 100%;
    min-height: 100px;
    margin: 40px 0px 40px;
}

.mobileView .certWrapper .certContent {
    width: 85%;
    margin: auto;
    min-height: 100px;
    color: black;
}

.mobileView .certWrapper .certContent ul {
    list-style: none;
    /* list-style-image: url(../img/CapIcon.png);
    list-style-position: outside; */
}

/* .certWrapper .certContent ul li::before {
    content: url(../img/CapIcon.png);
    width: 40px;
    margin-left: 2.5rem;
    display: inline-block;
    box-sizing: border-box;
    padding-top: 10px;
} */

.mobileView .certWrapper .certContent ul li {
    margin-bottom: 15px;
    font-weight: 900;
    font-size: 22px;
    display: flex;
    flex-direction: row;
}

.mobileView .certWrapper .certContent ul img {
    width: 40px;
    height: 38px;
    vertical-align: middle;
    margin-left: 0.7rem;
}

.mobileView #CertNumbers:focus {
    outline: none;
}

/* ========================= certification section ============================= */



/* ===================== about section ================ */

.mobileView .aboutWrapper {
    width: 100%;
    min-height: 200px;
}

.mobileView .aboutWrapper .topAbout {
    background: white;
    width: 100%;
    height: 200px;
    -webkit-clip-path: polygon(0 91%, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 91%, 100% 0, 100% 100%, 0 100%);
}

.mobileView #about:focus {
    outline: none;
}

.mobileView .aboutWrapper .aboutContent {
    background: white;
    width: 100%;
    min-height: 200px;
    color: black;
    padding-top: 50px;
}

.mobileView .aboutWrapper .aboutContent .imageWrapper {
    width: 85%;
    margin: auto;
}

.mobileView .aboutWrapper .aboutContent .imageWrapper img {
    width: 100%;
    box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.21);
    -webkit-box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.21);
    -moz-box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.21);
    border-radius: 8px;
}

.mobileView .aboutWrapper .aboutContent .actualContent {
    width: 85%;
    margin: 35px auto 0px;
    min-height: 100px;
}

.mobileView .aboutWrapper .aboutContent .actualContent h2 {
    color: #f06631;
    font-size: 50px;
    margin-bottom: 20px;
}

.mobileView .aboutWrapper .aboutContent .actualContent p {
    font-size: 26px;
    margin-bottom: 15px;
}

.mobileView .aboutWrapper .aboutContent .buffer {
    width: 100%;
    min-height: 100px;
}

/* ===================== about section ================ */




/* =================== main form ========================= */

.mobileView .mainFormWrapper {
    width: 100%;
    min-height: 200px;
    background: #198742;
}

.mobileView .mainFormWrapper .actualFormContent {
    width: 85%;
    margin: auto;
    padding-top: 50px;
    padding-bottom: 0.08rem;
}

@media screen and (min-width:751px) {
    .mobileView .mainFormWrapper .actualFormContent h2 {
        font-size: 54px;
        margin-bottom: 30px;
    }
}

@media screen and (max-width:750px) {
    .mobileView .mainFormWrapper .actualFormContent h2 {
        font-size: 34px;
        margin-bottom: 30px;
    }
}

.mobileView .mainFormWrapper .actualFormContent form p {
    margin-bottom: 20px;
}

.mobileView .mainFormWrapper .actualFormContent form input {
    background: transparent;
    border: none;
    width: 100% !important;
    border-bottom: 2px solid white;
    height: 50px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    padding: 10px;
    font-size: 22px;
    color: white;
    direction: rtl;
}

.mobileView .mainFormWrapper .actualFormContent form input:focus {
    outline: none;
}

.mobileView .mainFormWrapper .actualFormContent form input::-moz-placeholder {
    color: white;
    opacity: 1;
    font-size: 22px;
    font-family: 'Assistant', sans-serif;
}

.mobileView .mainFormWrapper .actualFormContent form input::placeholder {
    color: white;
    font-size: 22px;
    font-family: 'Assistant', sans-serif;
}

.mobileView .mainFormWrapper .actualFormContent form input::-webkit-input-placeholder {
    color: white;
    font-size: 22px;
    font-family: 'Assistant', sans-serif;
}

.mobileView .mainFormWrapper .actualFormContent form textarea {
    background: transparent;
    border: none;
    width: 100%;
    height: 200px;
    border-bottom: 2px solid white;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    padding: 10px;
    font-size: 22px;
    color: white;
    direction: rtl;
}

.mobileView .mainFormWrapper .actualFormContent form textarea:focus {
    outline: none;
}


.mobileView .mainFormWrapper .actualFormContent form textarea::-moz-placeholder {
    color: white;
    opacity: 1;
    font-size: 22px;
    font-family: 'Assistant', sans-serif;
}

.mobileView .mainFormWrapper .actualFormContent form textarea::placeholder {
    color: white;
    font-size: 22px;
    font-family: 'Assistant', sans-serif;
}

.mobileView .mainFormWrapper .actualFormContent form textarea::-webkit-input-placeholder {
    color: white;
    font-size: 22px;
    font-family: 'Assistant', sans-serif;
}

@media screen and (min-width:751px) {
    .mobileView .mainFormWrapper .actualFormContent form button {
        background: transparent;
        border: none;
        width: 100%;
        min-height: 50px;
        border: 2px solid white;
        font-size: 55px;
        color: white;
    }
}

@media screen and (max-width:750px) {
    .mobileView .mainFormWrapper .actualFormContent form button {
        background: transparent;
        border: none;
        width: 100%;
        min-height: 50px;
        border: 2px solid white;
        font-size: 25px;
        color: white;
    }
}

.mobileView .mainFormWrapper .actualFormContent .mainFormInfoTop {
    background: #eeeff3;
    height: 100px;
    width: 100%;
    -webkit-clip-path: polygon(0 0, 100% 83%, 100% 100%, 0 100%);
    clip-path: polygon(0 0, 100% 83%, 100% 100%, 0 100%);
    margin-top: 80px;
}


.mobileView .mainFormWrapper .actualFormContent .mainFormInfo {
    background: #eeeff3;
    min-height: 100px;
    width: 100%;
    padding-bottom: 20px;
}

.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul {
    list-style: none;
    margin: auto;
    width: 85%;
}

.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .email a,
.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .map a,
.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .phone a {
    text-decoration: none;
    font-weight: 900;
    color: black;
}

.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .email a:hover,
.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .map a:hover,
.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .phone a:hover {
    color: orange;
}

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

    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .email a,
    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .map a,
    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .phone a {
        /* text-decoration: none; */
        /* color: black; */
        font-size: 18px;
        /* font-weight: 900; */
    }
}

@media screen and (min-width: 330px) and (max-width: 375px) {

    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .email a,
    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .map a,
    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .phone a {
        /* text-decoration: none; */
        /* color: black; */
        font-size: 20px;
        /* font-weight: 900; */
    }
}

@media screen and (min-width: 400px) and (max-width: 425px) {

    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .email a,
    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .map a,
    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .phone a {
        /* text-decoration: none; */
        /* color: black; */
        font-size: 28px;
        /* font-weight: 900; */
    }
}


@media screen and (min-width: 450px) and (max-width: 1024px) {

    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .email a,
    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .map a,
    .mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .phone a {
        /* text-decoration: none; */
        /* color: black; */
        font-size: 30px;
        /* font-weight: 900; */
    }
}

.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .email,
.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .map {
    margin-bottom: 20px;
}

.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .email:before {
    content: "\f0e0";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    display: inline-block;
    margin-left: 0.5em;
    width: 1.3em;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    padding-top: 10px;
    font-size: 28px;
    color: black;
}

.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .map:before {
    content: "\f3c5";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    display: inline-block;
    margin-left: 0.5em;
    width: 1.3em;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    padding-top: 10px;
    font-size: 28px;
    color: black;
}

.mobileView .mainFormWrapper .actualFormContent .mainFormInfo ul .phone:before {
    content: "\f095";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    display: inline-block;
    margin-left: 0.5em;
    width: 1.3em;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    padding-top: 10px;
    font-size: 28px;
    color: black;
}

/* =================== main form ========================= */


/* ================= footer ================== */
.mobileView footer {
    width: 100%;
    height: 200px;
    margin-top: 250px;
    color: black;
}

/* .mobileView footer .imgWrapper {
    width: 85%;
    margin: auto;
} */

.mobileView footer img {
    width: 100%;
    height: auto;
}

@media screen and (max-width: 320px) {
    .mobileView footer .footerImgWrapper {
        width: 260px;
        margin: auto;
    }
}

@media screen and (min-width: 321px) and (max-width: 425px) {
    .mobileView footer .footerImgWrapper {
        width: 85%;
        margin: auto;
    }
}

@media screen and (min-width: 426px) and (max-width: 1024px) {
    .mobileView footer .footerImgWrapper {
        width: 300px;
        margin: auto;
    }
}

/* =================== footer ========================= */


/* ===================== top text ================== */
/* .topText {
    position: absolute;
    width: 100%;
    top: 130px;
} */

.mobileView .topText h1,
.mobileView .topText h2,
.mobileView .topText h3 {
    /* width: 80%; */
    /* margin: auto; */
    /* font-size: 30px; */
    text-align: center;
}

@media screen and (min-width: 320px) {
    .mobileView .topText {
        position: absolute;
        width: 100%;
        top: 100px;
    }
}

@media screen and (min-width: 375px) and (max-width: 1024px) {
    .mobileView .topText {
        position: absolute;
        width: 100%;
        top: 150px;
    }
}

/* ===================== top text ================== */


/* ============ top form ============= */
/* .topForm {
    width: 100%;
    position: absolute;
    top: 290px;
} */

@media screen and (min-width: 320px) {
    .mobileView .topForm {
        width: 100%;
        position: absolute;
        top: 260px;
    }
}

@media screen and (min-width: 375px) and (max-width: 424px) {
    .mobileView .topForm {
        width: 100%;
        position: absolute;
        top: 290px;
    }
}

@media screen and (min-width: 425px) and (max-width: 470px) {
    .mobileView .topForm {
        width: 100%;
        position: absolute;
        top: 350px;
    }
}


@media screen and (min-width: 471px) and (max-width: 490px) {
    .mobileView .topForm {
        width: 100%;
        position: absolute;
        top: 400px;
    }
}

@media screen and (min-width: 491px) and (max-width: 550px) {
    .mobileView .topForm {
        width: 100%;
        position: absolute;
        top: 450px;
    }
}

@media screen and (min-width: 551px) and (max-width: 600px) {
    .mobileView .topForm {
        width: 100%;
        position: absolute;
        top: 500px;
    }
}

@media screen and (min-width: 601px) and (max-width: 650px) {
    .mobileView .topForm {
        width: 100%;
        position: absolute;
        top: 550px;
    }
}

@media screen and (min-width: 651px) and (max-width: 700px) {
    .mobileView .topForm {
        width: 100%;
        position: absolute;
        top: 600px;
    }
}


@media screen and (min-width: 701px) and (max-width: 768px) {
    .mobileView .topForm {
        width: 100%;
        position: absolute;
        top: 650px;
    }
}


@media screen and (min-width: 769px) and (max-width: 1024px) {
    .mobileView .topForm {
        width: 100%;
        position: absolute;
        top: 900px;
    }
}





@media screen and (max-width: 700px) {
    .mobileView .topForm .formWrapper {
        width: 85%;
        background: rgba(0, 0, 0, 0.58);
        min-height: 200px;
        border-radius: 8px;
        margin: auto;
        padding-top: 10px;
        padding-bottom: 10px;
    }
}


@media screen and (min-width: 701px) and (max-width: 768px) {
    .mobileView .topForm .formWrapper {
        width: 70%;
        background: rgba(0, 0, 0, 0.58);
        min-height: 200px;
        border-radius: 8px;
        margin: auto;
        padding-top: 10px;
        padding-bottom: 10px;
    }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
    .mobileView .topForm .formWrapper {
        width: 60%;
        background: rgba(0, 0, 0, 0.58);
        min-height: 200px;
        border-radius: 8px;
        margin: auto;
        padding-top: 10px;
        padding-bottom: 10px;
    }
}




.mobileView .topForm .formWrapper h2 {
    font-size: 18px;
    text-align: center;
    margin-bottom: 10px;
}

.mobileView .topForm .formWrapper form p {
    width: 85%;
    /**/
    margin: auto;
}

.mobileView .topForm .formWrapper form p input {
    width: 100% !important;
    border: none;
    height: 39px;
    margin-bottom: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 5%;
    direction: rtl;
}

.mobileView .topForm .formWrapper form p input.wpcf7-submit{
    border: none !important;
    margin-top: 0 !important;
    background: #f06631 !important;
    height: 39px !important;
    color: white !important;
    font-size: 25px !important;
}

.mobileView .topForm .formWrapper form p button {
    width: 100%;
    border: none;
    background: #f06631;
    height: 39px;
    color: white;
    font-size: 25px;
}

.mobileView .topForm .formWrapper form p button .fas {
    vertical-align: middle !important;
}

/* ============ top form ============= */


@media screen and (min-width: 1025px) {
    .mobileView {
        display: none;
    }
}


/* ======================== mobile menu ====================== */

.mobileView .mobileMenuRight {
    /* background: #eeeff3 url(../img/mobileMenuBG.svg) no-repeat; */
    background-size: cover;
    background-position: right bottom;
}

.mobileView .mobileMenuRight ul {
    list-style: none;
    /* margin-right: 50px; */
    margin-top: 50px;
    width: 100%;
}

.mobileView .mobileMenuRight ul li {
    /* text-align: left; */
    display: inline-block;
    width: 100%;
    margin-right: 10px;
}

.mobileView .mobileMenuRight ul li a {
    text-decoration: none;
    color: black;
    font-size: 22px;
    padding-left: 10px;
}

.mobileView .mobileMenuRight ul li a:hover {
    color: orange;
}

.mobileView .mobileMenuRight ul li {
    margin-bottom: 30px;
}

.mobileView .mobileMenuRight button {
    float: left;
    border: none;
    background: transparent;
    border: 2px solid black;
    font-size: 30px;
    -moz-box-shadow: inset 0px 39px 0px -24px #f06631;
    /*#e67a73*/
    -webkit-box-shadow: inset 0px 39px 0px -24px #f06631;
    /*#e67a73*/
    box-shadow: inset 0px 39px 0px -24px #f06631;
    /*#e67a73*/
    background-color: #f06631;
    /*#e4685d*/
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid #ffffff;
    /* display: inline-block; */
    cursor: pointer;
    color: #ffffff;
    font-family: Arial;
    font-size: 20px;
    padding: 6px 15px;
    text-decoration: none;
    text-shadow: 0px 1px 0px #b23e35;
    margin-left: 10px;
    margin-top: 50px;
}

/* ======================== mobile menu ====================== */



/* mobile style */


/* ===========================================================  Mobile style ====================================================================== */


/* google reCAPTCHA v3 */

/* https://brizzo.net/tips/hide-recaptcha-v3-badge */

.grecaptcha-badge{
	visibility: collapse !important;  
}

/* google reCAPTCHA v3 */