* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    scroll-behavior: smooth;
    font-family: 'Tajawal', sans-serif;
}

a {
    text-decoration: none;
}

:root {
    --main-color: #071F45;
    --second-color: #FF6600;
    --bgcolor: #fff;
    --second-bgcolor: #F8F8F8;
    --gray-color: #ccc;
}

.out-source {
    color: #FF6600;
}


.navbar {
    padding: 0;
    font-size: 18px;
    background-color: var(--main-color);
    color: var(--bgcolor);
    z-index: 100 !important;
}


.navbar .navbar-nav li {
    margin: 0 5px;
    padding: 0 5px;
}

.navbar .navbar-nav a {
    color: var(--bgcolor);
    font-size: 16px;
    margin: 0;
    padding: 8px 0 !important;
    position: relative;
}

.navbar .navbar-nav a:hover,
.navbar .navbar-nav a:active,
.navbar .navbar-nav a.active {
    color: var(--second-color);
}



.navbar .navbar-toggler {
    color: var(--bgcolor);
    font-size: 25px;
    border-color: var(--bgcolor)
}

.navbar .navbar-toggler:focus {
    box-shadow: none;
}

.navbar .navLeft a {
    color: var(--bgcolor);
    font-size: 16px;
    margin-left: 16px;
    padding: 0;
}

.navbar .navLeft a.try {
    border: 1px solid var(--second-color);
    border-radius: 5px;
    padding: 8px;

}


.navbar .navLeft a:hover {
    color: var(--second-color);
}

.navbar .navLeft a.try:hover {
    background-color: var(--bgcolor);
    border-color: var(--bgcolor);
}


.navbar .dropdown-center {
    position: relative;
}

.navbar .dropdown-center button {
    width: 55px;
    background-color: transparent;
    border: none;
    outline: none;
    box-shadow: none;
    cursor: pointer;
    margin-right: 5px;
    padding-right: 5px;
    color: var(--bgcolor);
    font-size: 18px;
}

.navbar .dropdown-center button:focus {
    outline: none;
    border: none;
    box-shadow: none;
}

.navbar .dropdown-center .dropdown-menu.show {
    right: 9px;
    width: 49px;
    min-width: 0px;
    top: 25px;
    padding: 0;
    background-color: transparent;
    box-shadow: none;
    border: none;
}

.navbar .dropdown-center .dropdown-menu.show li {
    display: flex;
}

.navbar .dropdown-center .dropdown-menu.show li a {
    width: 100%;
    height: 100%;
    font-size: 18px;
    margin: 0px;
    color: var(--bgcolor);
    padding: 0;
    padding-right: 5px;
}

.navbar .dropdown-center .dropdown-menu.show li a:hover {
    color: var(--second-color);
}

.navbar .dropdown-center .dropdown-item:hover {
    background-color: transparent;

}

@media (min-width: 992px) and (max-width: 1200px) {
    .navbar>.container {
        max-width: 100% !important;
        margin: 0 5px;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

@media (min-width: 991px) and (max-width: 1100px) {
    .navbar .collapse>.container {
        width: 98%;
    }

    .navbar .collapse .nav-item {
        padding: 0px;
    }

    .navbar .navLeft a {
        margin-left: 8px;
    }
}

@media (max-width: 991px) {
    .navbar .navbar-nav {
        width: 100%;
        text-align: center;
    }

    .resheader {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
}

/* ------------------------------------------------------------------------------ */
/* footer  */
footer {
    background-color: var(--main-color);
    color: var(--bgcolor);
}

footer p {
    font-size: 18px;
    font-weight: 700;
    color: var(--bgcolor);
}

footer ul {
    list-style: none;
    margin: 0;
    margin-top: 20px;
    padding: 0;

}


footer ul li {
    margin: 16px 5px;
}

footer ul li a {
    color: #B7B7B7
}

footer ul li a:hover {
    color: var(--second-color)
}

footer ul li a.phone svg {
    transform: rotate(270deg);
}

footer .social li {
    margin: 0px;
}

footer .social li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    margin: 8px;
    background-color: var(--bgcolor);
    color: var(--second-color);
}

footer .social li:hover a {
    color: var(--bgcolor);
    background-color: var(--second-color);
}

footer .copywrite p {
    font-size: 16px;
    font-weight: 500;
    margin: 0;
}

footer .copywrite a {
    color: var(--second-color);
    font-weight: 500;
}

/* ---------------------------------------------------------------------- */
/* hero_sec  */
.hero_sec .container {
    background-color: var(--second-bgcolor);
    border-radius: 25px;
}

.hero_sec h1 {
    font-size: 58px;
    font-weight: 700;
    color: #062045;
}

.hero_sec p {
    font-size: 21px;
    font-weight: 700;
    color: #4F5665;
    margin-bottom: 25px;
}

.hero_links a {
    border: 1px solid var(--second-color);
    padding: 10px 2px;
    border-radius: 5px;
    color: var(--second-color);
    text-align: center;
    margin-bottom: 16px;
}

.hero_links a:first-child {
    background-color: var(--second-color);
    color: var(--bgcolor);
}


/* ---------------------------------------------------------------------- */

/* users section  */
.users h2 {
    font-weight: 700;
    color: #071F45;
}

/* ---------------------------------------------------------------------- */

/* features section  */
.features {
    background-color: var(--second-bgcolor);
}

.features h1 {
    font-weight: 700;
    color: #071F45;
}

.features h5 {
    font-weight: 500;
    color: #4F5665;
}

.features .feature {
    display: flex;
    align-items: center;
    margin: 16px 0;
}

.features .feature .img-con {
    min-width: 85px;
    width: 85px;
    height: 85px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #F1F1F1;
    border-radius: 50%;
    margin-left: 10px;

}

.features .feature .img-con img {
    width: 47px;
    height: 49px;

}

.features .feature h6 {
    font-size: 17px;
    font-weight: 700;
    margin-bottom: 10px;
}

.features .feature p {
    font-size: 14px;
    color: #4F5665;
    font-weight: 400;
}

/* -------------------------------- */
/* messions_flow */

.messions_flow {
    padding: 60px 0px;
}

.messions_flow .flow_des_img {
    margin-left: 30px;
    width: 58px;
    height: 58px;
}

.messions_flow .center_mession {
    margin: 100px 0;
    z-index: 2;
}

.first_mession,
.second_mession,
.third_mession {
    position: relative;
}

.messions_flow h5 {
    color: rgba(7, 31, 69, 1);
    font-size: 18px;
    font-weight: 700;
}

.messions_flow p {
    color: rgba(79, 86, 101, 1);
}

.first_mession::after {
    content: ' ';
    border-bottom-right-radius: 50%;
    border-top-right-radius: 7px;
    width: 51%;
    height: 78%;
    position: absolute;
    border-bottom: 1px dashed #999999;
    border-right: 1px dashed #999999;
    right: 23px;
    top: 52px;
}

.second_mession::before {
    content: ' ';
    width: 54%;
    border-top: 1px dashed #999999;
    border-left: 1px dashed #999999;
    height: 147px;
    position: absolute;
    top: -148px;
    right: -47%;
    border-top-left-radius: 100px;
}

.second_mession::after {
    content: ' ';
    border-bottom-left-radius: 26%;
    border-top-left-radius: 0px;
    width: 51%;
    height: 100%;
    position: absolute;
    border-left: 1px dashed #999999;
    border-bottom: 1px dashed #999999;
    right: -44%;
    top: 57px;
    border-left-style: dashed;
    border-bottom-style: dashed;
    z-index: 0 !important;
}

.third_mession {
    margin-top: 50px;
}

.third_mession::before {
    content: ' ';
    width: 50%;
    border-top: 1px dashed #999999;
    border-right: 1px dashed #999999;
    height: 96px;
    position: absolute;
    top: -94px;
    right: 44px;
    border-top-right-radius: 148px;
    border-top-style: dashed;
    border-right-style: dashed;
}

@media (max-width:992px) {

    .first_mession::after,
    .second_mession::before,
    .second_mession::after,
    .third_mession::before {
        display: none;
    }
}

@media (min-width:992px) and (max-width:1200px) {
    .second_mession::before {
        width: 55%;
        height: 120px;
        top: -120px;
        right: -46%;
    }

    .second_mession::after {
        right: -42%;
    }
}

@media (min-width:1200px) and (max-width:1400px) {
    .second_mession::before {
        height: 131px;
        top: -133px;
        right: -46%;
    }

    .second_mession::after {
        right: -43%;
        top: 57px;
    }

    .third_mession::before {
        content: ' ';
        right: 42px;
    }
}


/* ------------------------------------------------------------ */
/* desktop section */
.desktop_sec {
    background-color: var(--main-color);
    padding: 50px 0;
    color: var(--bgcolor);
}

.desktop_sec h2 {
    font-size: 35px;
    font-weight: 700;
}

.desktop_sec p {
    font-weight: 400;
    font-size: 14px;
    color: #EAEFF8;
}

.desktop_sec a {
    padding: 12px;
    color: var(--second-color);
    background-color: var(--bgcolor);
    width: 250px;
    border-radius: 5px;
    margin: 20px 0;
}

.desktop_sec a:hover {
    background-color: var(--second-color);
    color: var(--bgcolor);
}

/* ---------------------------------------- */
.sec_title {
    font-weight: 700;
    font-size: 35px;
    color: #071F45;
    margin-bottom: 20px;
}

/* palns_sec */
.plans_sec {
    background-color: var(--second-bgcolor);
    padding: 50px 0;
}

.lines hr {
    border: 1px solid var(--second-color);
    opacity: 1;
    width: 33px;
    margin: 0;
}

.lines hr.mid {
    margin: 0 3px;
    width: 7px;
}

.plans_sec .nav-pills {
    max-width: 450px;
    margin: 20px auto;
    background-color: var(--bgcolor);
    padding: 20px 0;
    border-radius: 10px;
}

.plans_sec .nav-pills li {
    margin: 5px;
}

.plans_sec .nav-pills li button {
    color: var(--main-color);
    font-size: 18px;
}

.plans_sec .nav-pills li button:hover,
.plans_sec .nav-pills li button.active {
    background-color: #E7612C;
    color: var(--bgcolor);
}

.plans_sec .single_plan {
    background-color: #FFFFFF;
    border-radius: 20px;
    box-shadow: 0px 9px 16px -4px rgba(16, 24, 40, 0.08);
}

.plans_sec .single_plan .plan_title {
    font-weight: 600;
    font-size: 14px;
    color: var(--second-color);
    margin-bottom: 5px;
}

.plans_sec .single_plan .plan_price {
    font-weight: 700;
    font-size: 34px;
    margin-bottom: 10px;
}

.plans_sec .single_plan .price_way {
    font-weight: 500;
    font-size: 14px;
}

.plans_sec .single_plan .plan_options {
    margin: 0;
    padding: 0;
    list-style: none;
}

.plans_sec .single_plan .plan_options .option_item {
    display: flex;
    align-items: center;
    padding: 10px;
    font-weight: 500;
    font-size: 20px;
}

.plans_sec .single_plan .plan_options .option_item .check_con {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 10px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: rgba(57, 128, 237, 0.15);
    color: var(--second-color);
}

.plans_sec .single_plan a {
    padding: 12px;
    text-align: center;
    background-color: #E7612C;
    width: 90%;
    font-size: 18px;
    display: block;
    margin: 20px auto;
    border-radius: 10px;
    color: var(--bgcolor);
}

.plans_sec .plan_selected {
    position: relative;
    background-color: var(--second-color);
    background-color: #E7612C;
    box-shadow: 0px 0px 71px rgba(0, 0, 0, 0.15);
    color: var(--bgcolor);
    overflow: hidden;
}

.plans_sec .plan_selected .plan_title {
    color: var(--bgcolor);
}

.plans_sec .plan_selected .plan_options .option_item .check_con {
    color: var(--bgcolor);
    background-color: rgba(57, 128, 237, 0.15);
}

.plans_sec .plan_selected a {
    background-color: var(--bgcolor);
    color: #E7612C;
}

.plans_sec .plan_selected .familer {
    position: absolute;
    width: 245px;
    top: 34px;
    background-color: var(--bgcolor);
    color: var(--second-color);
    padding: 12px;
    transform: rotate(45deg);
    right: -57px;
    font-size: 16px;
    font-weight: 700;

}

@media (max-width: 992px) {
    .plans_sec .single_plan {
        min-width: 50%;
    }
}

/* -------------------------------------------------- */
/* opinions_sec  */
.opinions_sec .opinions_cont {
    width: 100%;
    position: relative;
    margin: 50px 0;
    overflow: hidden;
}

.opinions_sec .opinions_cont .slider_data {
    position: relative;
}

.opinions_sec .opinions_cont .arrows {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    cursor: pointer;
    font-size: 20px;
    border-radius: 50%;
    position: absolute;
    z-index: 10;
    bottom: 80px;
    background-color: #FFE0D7;
    border: none;
    color: #FE5E44;
}

.opinions_sec .opinions_cont #twocustomPrevBtn {
    left: 0px;
    margin-left: 5px;
}

.opinions_sec .opinions_cont #twocustomNextBtn {
    margin-right: 5px;
}

.opinions_sec .opinions_cont .opinon_slide {
    padding: 20px 50px;
}

.opinions_sec .opinions_cont .opinon_slide .opinon_img {
    border: 1px solid #C4C4C4;
    border-radius: 50%;
    width: 270px;
    height: 270px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 20px auto;

}

.opinions_sec .opinions_cont .opinon_slide .opinon_img img {
    width: 224px;
    height: 224px;
}

.opinions_sec .opinions_cont .opinon_slide h5 {
    font-size: 18px;
    font-weight: 500;
    color: #071F45;
}

.opinions_sec .opinions_cont .opinon_slide p {
    font-size: 14px;
    font-weight: 500;
    color: #071F45;
    padding: 16px;
}

.opinions_sec .opinions_cont .opinion_abs {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
}

.opinions_sec .opinions_cont .opinion_abs.first_abs {
    right: -50px;
    top: 60%;
    border: 1px solid #C4C4C4;
    border-radius: 50%;
    height: 100px;
    width: 110px;
    justify-content: end;
    padding: 20px;
    padding-left: 11px;
}

.opinions_sec .opinions_cont .opinion_abs.second_abs {
    right: 10%;
    top: 10%;
}

.opinions_sec .opinions_cont .opinion_abs.third_abs {
    right: 17%;
    top: 20%;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    border: 1px solid #C4C4C4;

}

.opinions_sec .opinions_cont .opinion_abs.four_abs {
    left: 17%;
    top: 10%;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    border: 1px solid #C4C4C4;

}

.opinions_sec .opinions_cont .opinion_abs.five_abs {
    left: 10%;
    top: 60%;
}

.opinions_sec .opinions_cont .opinion_abs.six_abs {
    left: -62px;
    top: 20%;
    border: 1px solid #C4C4C4;
    border-radius: 50%;
    height: 100px;
    width: 110px;
    justify-content: start;
    padding: 20px;
    padding-right: 11px;
}

/* --------------------------------------------------------- */
/* contact_sec */
.contact_sec {
    padding: 60px 0px;
    background-color: var(--second-bgcolor);
}

.contact_sec input {
    width: 90%;
    outline: none;
    font-size: 20px;
    height: 57px;
    border-radius: 30px;
    background-color: var(--bgcolor);
    border: 1px solid #0000101f;
    padding: 10px;
    text-align: end;
    margin: 30px 0;
    box-shadow: 0px 7.77px 11.21px 0px rgb(0 0 0 / 11%)
}

.contact_sec button {
    width: 90%;
    outline: none;
    font-size: 20px;
    height: 57px;
    border-radius: 30px;
    background-color: var(--second-color);
    color: var(--bgcolor);
    border: 1px solid #0000101f;
    padding: 10px;
    margin: 10px 0;
}

/* --------------------------------------------- */
/* plans page  */
.plans_hero h1 {
    font-size: 48px;
    font-weight: 700;
    color: rgba(6, 32, 69, 1);
    margin: 30px 0;
}

.plans_hero p {
    font-size: 21px;
    font-weight: 500;
    color: rgba(79, 86, 101, 1);
}

.plans_contact {
    background-color: var(--bgcolor);
}

/* --------------------------------------------- */
/* index2 page */
.hero_sec2 {
    background-image: url("../assets/secondhero.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: calc(100vh - 83px);
}

.hero_sec2 h1 {
    font-size: 60px;
    font-weight: 800;
    color: var(--bgcolor);
    margin-bottom: 20px;

}

.hero_sec2 form {
    background-color: rgba(196, 196, 196, 0.21);
    padding: 10px;
    border-radius: 5px;
    margin: 40px 0;
}

.hero_sec2 form .heroInput {
    padding: 10px;
    width: 24%;
    height: 45px;
    margin: 5px;
    background-color: #EDEDED;
    border-radius: 5px;
    border: none;
    outline: none;
    box-shadow: none;
}

.hero_sec2 form .passwordgroup input {
    width: 100%;
    height: 100%;
    border: none;
    background-color: transparent;
    outline: none;
}

.hero_sec2 form .passwordgroup span {
    background-color: transparent;
    border: none;
    cursor: pointer;
}

.hero_sec2 form button.heroInput {
    background-color: var(--second-color);
    color: var(--bgcolor);
}

@media (max-width: 992px) {
    .hero_sec2 form .heroInput {
        width: 100%;
        margin: 5px 0;
    }

    .hero_sec2 h1 {
        font-size: 30px;
    }
}

/* ----------------------------------- */
/* login_page */
/* loginpage page  */
.loginpage .formright {
    min-height: 100vh;
}

.loginpage .formright h5 {
    font-weight: 700;
}

.loginpage .formright h6 {
    font-size: 20px;
    font-weight: 500;
    color: rgba(47, 47, 47, 1);
}

.loginpage .formright .form-floating input {
    height: 50px;
    padding: 6px 12px;
    outline: none;
    box-shadow: none;
}

.loginpage .formright .form-floating label {
    padding: 6px;
    display: flex;
    align-items: center;
    opacity: 1;
    right: 10px;
}



.loginpage .formright .form-floating input:focus~label,
.loginpage .form-floating>.form-control:not(:placeholder-shown)~label {
    opacity: 1;
    top: -8px;
    height: 30px;
    background-color: var(--bgcolor);
}

.loginpage .formright .form-floating input:focus~label {
    color: var(--second-color);
}

.loginpage .formright .form-floating input:focus {
    border-color: var(--second-color);
}

.loginpage .formright .form-floating.floatpassword input {
    padding-left: 46px;
}

.loginpage .formright .form-floating.floatpassword .passwordspan {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    border: none;
    background: transparent;
    cursor: pointer;
}

.loginpage a {
    color: var(--second-color);
}

.goolge_login {
    position: relative;
    width: 100%;
    height: 60px;
    background-color: var(--bgcolor);
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.11);
    border-radius: 8px;
    border: none;
    font-size: 16px;
    color: rgba(79, 86, 101, 1);
    font-weight: 500;
    margin: 30px 0;

}

.goolge_login img {
    position: absolute;
    height: 35px;
    top: 12px;
    right: 15px;
    background-color: var(--bgcolor);
}

.or-line {
    border-bottom: 1px solid rgba(191, 191, 191, 1);
    position: relative;
    height: 30px;
    margin-bottom: 50px;
    display: flex;
    justify-content: center;
}

.or-line span {
    position: absolute;
    width: 70px;
    background-color: var(--bgcolor);
    text-align: center;
    left: 50%;
    transform: translateX(-35px);
    bottom: -10px;
}

.form-check-label {
    cursor: pointer;
    color: #ccc;
}

.form-check-input {
    cursor: pointer;
    outline: none;
    border-color: #eee;
    background-color: #eee;
    outline: none;
}

.form-check-input:focus {
    box-shadow: none;
    border-color: #eee;
}


.form-check-input[type=checkbox]:checked {
    background-color: var(--second-color);
    border-color: var(--second-color)
}

.form-check.approve label {
    font-weight: 300;
    font-size: 14px;
    color: #000;
}

.form-check.approve label a {
    text-decoration: underline;
}

.submit {
    width: 100%;
    height: 50px;
    background-color: var(--bgcolor);
    color: var(--second-color);
    border: 1px solid var(--second-color);
    font-size: 18px;
    border-radius: 5px;
    margin-bottom: 20px;
}

.submit:hover {
    background-color: var(--second-color);
    color: var(--bgcolor);
}


.loginpage .formleft {
    padding: 0;
    background-color: var(--second-bgcolor);
    min-height: 100vh;
}

.loginpage .formleft .topImag {
    position: relative;
}

.loginpage .formleft .logoImg {
    position: absolute;
    right: 30px;
    top: 20px;
}

.loginpage .formleft h2 {
    color: rgba(7, 31, 69, 1);
    font-weight: 700;
}


/* ------------------------------------------------------------ */


/* --------------------------------------------------- */
/* contactus page  */
.contactus-hero {
    background-image: url('../assets/contactushero.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 500px;
    position: relative;
    display: flex;
    justify-content: center;
    margin-bottom: 200px;
}

.contactus-hero .contant_desc {
    background-color: var(--second-bgcolor);
    position: absolute;
    bottom: 0px;
    transform: translateY(50%);

}

.pagetitle {
    color: rgba(7, 31, 69, 1);
    font-weight: 700;
    font-size: 35px;
}

.pagetitle-line {
    border-bottom: 1px solid var(--second-color);
    width: 160px;
    margin: 30px auto;
    display: flex;
    justify-content: center;
    position: relative;
}

.pagetitle-line span {
    width: 50px;
    height: 6px;
    background-color: var(--second-color);
    position: absolute;
    bottom: 0;
    transform: translateY(50%);
    border-radius: 5px;
}

.contact-form h3 {
    font-weight: 700;
}

.contact-form .contactInfo {
    border-left: 1px solid #A7A6A6;
    padding-left: 50px;
}

.contact-form .contactInfo .infodetail {
    border-bottom: 1px solid #A7A6A6;
    margin: 20px 0px;
    padding-bottom: 5px;
}

.contact-form .contactInfo .infodetail>div {
    border-right: 4px solid var(--second-color);
    padding-right: 16px;
}

.contact-form .contactInfo .infodetail>div p {
    color: rgba(126, 126, 126, 1);
}

.contact-form .contactInfo .social-images a {
    width: 50px;
    height: 50px;
    margin: 5px;
}

.contact-form .contactmodel {
    padding-right: 50px;
}

.contact-form .contactmodel input {
    height: 50px;
    padding: 6px 12px;
    outline: none;
    box-shadow: none;
    width: 100%;
    margin: 10px 0;
    border: 1px solid rgba(112, 112, 112, 0.2);
    border-radius: 5px;
}

.contact-form .contactmodel textarea {
    height: 100px;
    padding: 6px 12px;
    outline: none;
    box-shadow: none;
    width: 100%;
    margin: 10px 0;
    border: 1px solid rgba(112, 112, 112, 0.2);
    border-radius: 5px;
    resize: none;
}

@media (max-width:992px) {
    .contact-form .contactInfo {
        border-left: none;
        padding-left: 12px;
        margin-bottom: 40px;
    }

    .contact-form .contactmodel {
        padding-right: 12px;
    }
}

/* ---------------------------------------------------- */
/* ploicy page */
.policy-hero {
    background-image: url('../assets/policehero.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 500px;
}

.policies_sec .policy_rules {
    background-color: var(--second-bgcolor);
    transform: translateY(-120px);
}

/* ------------------------------------ */
.aboutus-hero {
    background-image: url('../assets/policehero.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 500px;
}

.aboutus-sec .aboutus_desc {
    background-color: var(--second-bgcolor);
    transform: translateY(-120px);
    position: relative;
    margin-bottom: 250px;
}

.aboutus-sec .aboutus_desc .aboutus-video {
    width: 90%;
    height: 300px;

}

.aboutus-sec .aboutus_desc .aboutus-video img {
    height: 200%;
    width: 100%;
}

.ethics_sec {
    background-color: var(--second-bgcolor);
}
.ethics_sec h4{
    color: rgba(112, 112, 112, 1);
}
.ethics_sec .ethic {
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.141);
    background-color: var(--bgcolor);
    height: 100%;
}

.ethics_sec .ethic .ethicimg {
    display: flex;
    justify-content: center;
    position: relative;
    margin: 25px 0;
}

.ethics_sec .ethic .ethicimg .ecthicbg {
    position: absolute;
}

.ethics_sec .ethic h2 {
    color: rgba(7, 31, 69, 1);
    font-size: 35px;
    font-weight: 500;
    margin-top: 25px;
    margin-bottom: 20px;
}

.ethics_sec .ethic h5 {
    color: rgba(107, 105, 105, 1);
    font-size: 20px;
    font-weight: 400;
}


.success_sec {
    margin: 120px 0;
    padding: 120px 0;
    background-color: var(--second-color);
    background: radial-gradient(48.87% 51.22% at 50% 50%, #F68A37 0%, #F38335 28%, #ED7130 67%, #E65D2C 100%);
    position: relative;
    color: var(--bgcolor);
}
.success_sec .suc_img{
    position: absolute;
}
.success_sec .suc_img.first_img{
    top: -70px;
    right: 10%;
}
.success_sec .suc_img.second_img{
    top: -60px;
    right: 10%;
}
.success_sec .suc_img.third_img{
    top: -100px;
    left: 10%;
}
.success_sec .suc_img.four_img{
    bottom: -80px;
    left: 10%;
}
.success_sec .suc_img.five_img{
    bottom: 0px;
    left: 10%;
}

.success_sec .counterItem h1{
    font-size: 65px;
    font-weight: 700;
}
.success_sec .counterItem h5{
    color: rgba(255, 255, 255, 1);
    font-weight: 500;

}

.vision_sec{
    background-image: url('../assets/visionbg.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 50px 0;
}
.vision_sec .vision{
    background-color: var(--bgcolor);
    border-radius: 5px;
    padding: 20px;
}
@media (max-width:768px) {
    .aboutus-sec .aboutus_desc {
        margin-bottom: 200px;
    }

    .aboutus-sec .aboutus_desc .aboutus-video {
        width: 98%;
        height: 200px;

    }

}