/* genral */
/* width */
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #EDF2F6;
    border-radius: 20px;
    /* padding: 80px; */

}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #082032;
    border-radius: 20px;

}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555;
}

::selection {
    color: #fff;
    background: #032F55;
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

.langmenu {
    transform: translate(-51px, 27px) !important;
    text-align: center;
}

hr {
    padding: 0;
    margin: 0;
}

li {
    list-style-type: none;
}

body {
    direction: rtl;
    font-family: 'Cairo', sans-serif;
    font-family: 'Cairo', sans-serif;
    background-color: #F8F8F9;
    overflow-x: hidden;
}

.clear {
    clear: both;
}

a {
    text-decoration: none !important;

}

/* top nav */
.topheaderul {
    padding: 0;
    margin: 0;
}

.topheaderul li {
    display: inline-block;
    padding: 10px 0;
    font-size: 12px !important;
    color: #707070 !important;

}

.topheaderul li a {
    color: #707070 !important;
}

.btn-secondary {
    color: #707070 !important;
    background: none !important;
    border: none !important;
    font-size: 12px !important;
    padding: 0 !important;
    margin: 0 !important;
}

.dropdown-toggle::after {
    display: none;
}

/* nav */
.homebackground {
    padding: 0;
    margin: 0;
}

.btns {
    display: flex;
}

.navbarbrand {
    padding: 0;
    margin: 0;
}

.logo {
    width: 100px;
    height: 100px;
    padding: 0;
    margin: 0;
}

.nav-link {
    font-size: 14px;
    color: #707070;
}

.navbar-nav .nav-item {
    padding: 5px;
}

.nav-link.active {
    font-size: 14px;
    color: #032F55 !important;
    font-weight: bold;
}

.servicebtn {
    border: none;
    background-color: #032F55;
    color: #fff;
    border-radius: 25px;
    width: 150px;
    height: 50px;
    font-weight: bold;
    /* margin: 25px; */
    transition: 0.5s;
    text-align: center;
    line-height: 3em;
    font-size: 14px;
    overflow: hidden;
}

.servicebtn:hover {
    background: none;
    color: #0F214B;
    /* border: 1px solid #032F55; */
    border: none;

}

.loginbtn {
    border: none;
    background: none;
    border-radius: 25px;
    width: 150px;
    height: 50px;
    color: #0F214B;
    font-weight: bold;
    /* border: 1px solid #032F55; */
    margin-left: 16px;
    transition: 0.5s;
    text-align: center;
    line-height: 3em;
    font-size: 14px;
}

.loginbtn:hover {
    background-color: #032F55;
    color: #fff;
    border: none;

}

.dropdown-toggle:focus .dropdown-menu {
    display: block;
}

.balokkai {
    font-size: 8px;

}

.srchicon {
    margin-left: 16px;
    cursor: pointer;
}

.dropdown-menuhome.show {
    width: 330px;
    border: none;
    border-radius: 10px;
    box-shadow: 0px 3px 15px #032F5508;
    padding: 10px;

}

.dropdown-menuhome {
    text-align: right;
    border-radius: 20px;
}

.notificationspan {

    display: block;
    position: absolute;
    top: 15px;
    right: -4px;
    border: 2px solid #fff;
    border-radius: 50px;
    width: 15px;
    height: 15px;
    background-color: #032f55;
    color: #fff;
    font-size: 8px;

}

.dropdown-menu2 {
    text-align: left;
}

.eye {
    background-color: #E1EBF5;
    padding: 8px;
    border-radius: 50%;
    margin-top: 3px;

}

.eyesecond {
    background-color: #E1EBF5;
    padding: 10px;
    border-radius: 50%;
    margin: 5px 5px 0 -2.5em;
    float: left;
}

.eyespan {
    display: inline-block;
    color: #032F55;
    font-size: 12px;
    font-weight: bold;
    margin-right: 10px;
}

.notificationh {
    display: block;
    color: #9E9A9A;
    font-size: 10px;
    margin: -10px 55px 0 10px
}

.notificationhome {
    /* margin-bottom: 15px; */
    padding: 0.5em 0;
}

.notificationgoals {
    margin-bottom: 10px;
}

.dropdown-menuhome .dropdown-item:hover {
    background-color: #F1F4F8 !important;
    border-radius: 100px;
    /* padding: 1px 15px; */
    transition: 0.5s;
}

.myfowl .owl-item {
    position: relative;
}

.myfowl .owl-item:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #032F55;
    border-radius: 10px;
    opacity: 0.7;

}

.myfowl:after {
    content: "";
    position: absolute;
    top: 0;
    left: -31px;
    background-color: #5595DC;
    border-radius: 50px;
    padding: 30px;

}

.myowl {
    position: relative;
    direction: rtl;
}

.homecontentt {
    direction: rtl;
}

.myfowl:before {
    content: "";
    position: absolute;
    top: 7px;
    left: -25px;
    background-color: transparent;
    border-radius: 50px;
    padding: 30px;
    z-index: 10;
    border: 1px solid #032F55;
    animation: myOrbit 4s linear infinite;
}

@keyframes myOrbit {
    from {
        transform: rotate(0deg) translateX(10px) rotate(0deg);
    }
    to {
        transform: rotate(360deg) translateX(10px) rotate(-360deg);
    }
}

@keyframes myOrbitt {
    0% {
        scale: 1.05;
    }
    100% {
        scale: 1;
    }
}

.homecontentt {
    position: relative;
}

.homecontent {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 100;
    padding: 80px;
}

.homespan {
    color: #fff;
    font-weight: bold;
    background-color: #529AE4;
    padding: 0px 30px;
    font-size: 12px;
    border-radius: 50px;
}

.homeh {
    color: #fff;
    font-weight: bold;
    font-size: 55px;
    position: relative;
    margin-top: 20px;
    text-align: right;
}

.homeh:after {
    content: "";
    position: absolute;
    top: 173px;
    right: 18px;
    background-color: #fff;
    width: 87px;
    height: 3px;
    color: #fff;
}

.homep {
    font-size: 18px;
    color: #F8F8F9;
    /* margin: 80px 0 50px 0; */
    line-height: 1.6;
    margin: 71px 0 50px 0;
}

.homebtn {
    border: 0;
    border-radius: 50px;
    color: #0F214B;
    font-size: 14px;
    background-color: #fff;
    font-weight: bold;
    padding: 10px 20px;
}

.homebtn:hover {
    background-color: #529AE4;
    color: #fff;
    transition: 0.5s;
}

.triangleup {
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-left: 20px solid #fff;
    border-bottom: 10px solid transparent;
    /* margin-right: 830px;
    margin-top: -185px; */
    /* position: absolute;
    top: 0.5em;
    left: 2.7em; */
}

.myowl .owl-dots {
    position: absolute;
    bottom: 0;
    direction: ltr;
    left: 0;
    z-index: 9999999999999999999999999999999999;
    width: 100%;
    height: 100px;
    display: inline-block !important;
}

.circle {
    /* right: 511px !important; */
    width: 100px;
    height: 100px;
    background: #F8F8F9;
    border-radius: 60px;
    border-radius: 60px;
    border-radius: 60px;
    position: absolute;
    bottom: -45px;
    z-index: 1;
    /* animation: bounce-down 1.5s infinite; */
    transform: translate(-32em, 10px);
}

@keyframes rotate {
    0%, 100% {
        transform: rotate(65deg);
    }
    50% {
        transform: rotate(20deg);
    }
}

.circle_border:after {
    position: absolute;
    content: "";
    width: 70px;
    height: 70px;
    top: 10px;
    right: 15px;
    border: 1px solid #529AE4;
    border-radius: 50%;
    border-bottom-color: #F8F8F9;
    border-right-color: #F8F8F9;
    transform: rotate(45deg);
    animation: rotate 4s .7s ease-in-out infinite;

}

.myowl .owl-dots .owl-dot span {
    background: transparent;
    border: 1px solid #fff;
    padding: 1px;
}

.myowl .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #fff;
    padding: 1px !important;
}

.myaboutowl .owl-dots .owl-dot span {
    background: transparent;
    border: 1px solid #529AE4;
    padding: 1px;
}

.myaboutowl .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #529AE4;
    padding: 1px !important;
}


.myfifthowl .owl-dots .owl-dot span {
    background: transparent;
    border: 1px solid #529AE4;
    padding: 1px;
}

.myfifthowl .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #529AE4;
    padding: 1px !important;
}

.circlei {
    margin: 40px 0 0 0;
}

.dropdown-menuhome {
    position: relative;
}

.dropdown-menuhome:before {
    content: '';
    position: absolute;
    top: 0;
    right: 8%;
    margin-left: -15px;
    margin-top: -15px;
    width: 0;
    z-index: 1;
    height: 0;
    border-bottom: solid 15px #FFF;
    border-left: solid 15px transparent;
    border-right: solid 15px transparent;
}

.balls:before {
    position: absolute;
    top: 26px;
    left: 57px;
    width: 115px;
    height: 115px;
    content: "";
    background-color: rgba(255, 255, 255, .8);
    opacity: .6;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
    animation: ball-2 2s infinite;
}

.balls {
    top: 50%;
    left: 8em;
    /* margin-right: 830px;
    margin-top: -185px; */
    /* display: inline-block; */
    position: absolute;
    z-index: 1;
    cursor: pointer;
}

.balls:after {
    position: absolute;
    top: 26px;
    left: 57px;
    width: 100px;
    height: 100px;
    content: "";
    background-color: rgba(255, 255, 255, .3);
    border-radius: 50%;
    transform: translate(-50%, -50%) scale(1);
    z-index: -1;
    animation: ball-1 5s infinite;
}

@keyframes ball-1 {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.5
    }
    50% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1
    }
    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.5
    }
    /*100%   {transform: translate(-50%,-50%) scale(1); opacity: 0 }*/
}

@keyframes ball-2 {
    0% {
        transform: translate(-50%, -50%) scale(1);
    }
    50% {
        transform: translate(-50%, -50%) scale(1.3);
    }
    100% {
        transform: translate(-50%, -50%) scale(1.4);
        opacity: 0
    }
    /*100%   {transform: translate(-50%,-50%) scale(1); opacity: 0 }*/
}

.big_div {
    background: rgba(255, 255, 255, 0.3);
    padding: 26px;
    position: absolute;
    top: -0.7em;
    left: 1.4em;
    border-radius: 50px;
}

.aftercontainer {
    position: absolute;
    top: 330px;
    right: 35px;
    transform: rotate(269deg);
    z-index: 1111111111;
    top: 180px;
    right: -60px;
}

.aftercontainerr {
    position: absolute;
    top: 465px;
    left: -47px;
    transform: rotate(271deg);
    z-index: 100000;
    top: 294px;
    left: -160px;
}

.yasspan {
    font-size: 50px;
    color: #E1EBF5;
    font-weight: bold;
    opacity: 0.3;
}

.linkedin {
    /* background-color: #032F55; */
    position: absolute;
    right: 255px;
    border-radius: 50px;
    padding: 5px 6px;
    border: 1px solid #032F55;
    transform: rotate(91deg);
    margin: 0 10px 0 10px;
    color: #032F55;
}

.facebook {
    /* background-color: #032F55; */
    position: absolute;
    right: 220px;
    border-radius: 50px;
    padding: 5px 5px;
    border: 1px solid #032F55;
    transform: rotate(91deg);
    color: #032F55;
}

.facebook:hover {
    background-color: #032F55;
    color: #fff;
    box-shadow: 4px 2px 40px 10px #888888;

}

.instagram:hover {
    background-color: #032F55;
    color: #fff;
    box-shadow: 4px 2px 40px 10px #888888;

}

.linkedin:hover {
    background-color: #032F55;
    color: #fff;
    box-shadow: 4px 2px 40px 10px #888888;

}

.whatsapp:hover {
    background-color: #032F55;
    color: #fff;
    box-shadow: 4px 2px 40px 10px #888888;

}

.circlei {
    animation: bounce-down 1.5s infinite;
}

@keyframes bounce-down {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-20px);
    }

    100% {
        transform: translateY(0);
    }
}

.socialspan {
    font-size: 14px;
    color: #0F214B;
    font-weight: bold;
    position: relative;
}

.socialspan:after {
    position: absolute;
    content: "";
    width: 112px;
    height: 3px;
    top: 14px;
    right: 80px;
    background-color: #529AE4;
    transform: rotate(91deg);
    animation: bounce-downn 1.5s infinite;

}

@keyframes bounce-downn {
    0% {
        transform: translatex(0);
    }

    50% {
        transform: translatex(-20px);
    }

    100% {
        transform: translatex(0);
    }
}

.whatsapp {
    position: absolute;
    right: 420px;
    transform: rotate(100deg);
    top: -7px;
    position: absolute;
    right: 416px;
    border-radius: 50px;
    padding: 5px 5px;
    border: 1px solid #032F55;
    font-size: 27px;
    background-color: #032F55;
    color: #fff;
}

.instagram {
    position: absolute;
    right: 290px;
    border: 1px solid #032F55;
    padding: 5px;
    border-radius: 50px;
    margin: 0 20px;
    color: #032F55;
    font-weight: bold;
}

html {
    scroll-behavior: smooth;
}

.myfourthowl .owl-nav.disabled {
    display: block;
}

.myfourthowl .owl-carousel .owl-nav button.owl-next,
.myfourthowl .owl-nav button.owl-prev,
.myfourthowl button.owl-dot {
    position: absolute;
    left: -19px;
    top: 186px;
}

.myfourthowl .owl-carousel .owl-nav button.owl-next,
.myfourthowl .owl-nav button.owl-prev,
.myfourthowl button.owl-dot {
    height: 41px;
    width: 43px;
    border-radius: 50px !important;
    border: 1px solid #032F55 !important;
    /* padding: 15em; */
    line-height: -0.5;
    line-height: 0;
    padding: 0.5em !important;
}

.myfourthowl .owl-nav button.owl-next,
.myfourthowl .owl-nav button.owl-prev,
.myfourthowl button.owl-dot {
}

.myfourthowl .owl-next {
    top: 186px;
    position: absolute;
    right: -37px;
    height: 41px;
    width: 43px;
    border-radius: 50px !important;
    border: 1px solid #032F55 !important;
    /* padding: 15em; */
    line-height: -0.5;
    line-height: 0;
    padding: 0.5em !important;
}

.owl-theme .owl-nav [class*=owl-]:hover {
    background-color: #C1D6EB !important;
    /* filter: brightness(0) invert(1); */
}

/* about */
.circle a {
    position: relative;
    z-index: 9999;
}

.aboutsection {
    margin-top: 60px;
}

.aboutsectionn {
    text-align: center;
    /* margin: 122px 0 60px 0; */
    margin: 90px 0 40px 0;
}

.aboutsectionnn {
    text-align: center;
    margin: 60px 0 50px 0;
}

.aboutdiv {
    margin-right: 60px;
}

.aboutimg {
    /* width: 555px; */
    position: relative;
}

.shapef {
    position: relative;
}

.myabout {
    right: -64px;
    top: 0;
    position: absolute;
}

.aboutimg img {
    width: 525px;
    /*height: 82%;*/
    object-fit: contain;
}

.srchimg {
    text-align: center;
    position: relative;
    background-color: #DCE7F2;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    margin: auto;
    margin-top: 15px;
}

.srchimg img {
    position: absolute;
    width: 18px;
    height: 18px;
    top: 12px;
    right: 11px;
}

.examine {
    color: #707070;
    font-size: 14px;
    font-weight: bold;
}

.yastdem {
    color: #032F55;
    font-weight: bold;
    font-size: 20px;
}

.circlecontent {
    background-color: #fff;
    text-align: center;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    position: absolute;
    top: 9px;
    right: 10px;
}

.wcircle {
    text-align: center;
    background-color: transparent;
    position: absolute;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    position: absolute;
    top: 253px;
    right: 63px;
    /*border: 1px dashed #529AE4;*/

}

.borderr {
    border: 1px dashed #529AE4;

    border-radius: 50%;
    display: block;
    position: absolute;
    left: 0px;
    top: 0px;
    bottom: 0px;
    right: 0px;
    animation: spin 9s linear infinite;
}

@keyframes spin {
    100% {
        transform: rotateZ(360deg);
    }
}

.borderrr {

    opacity: 0;
    display: none;
    border: 1px dashed #529AE4;
    border-radius: 50%;
    position: absolute;
    left: 0px;
    top: 0px;
    bottom: 0px;
    right: 0px;
    animation: fill linear 1s forwards;
    animation-delay: 1s;
}

.center .borderrr {
    display: block;
    /*display: none;*/
}

@keyframes fill {
    0% {
        opacity: 1;
        clip-path: polygon(50% 0%, 50% 50%, 50% 0%, 50% 0%, 50% 0%, 50% 0%, 50% 0%);
    }
    12.5% {
        opacity: 1;
        clip-path: polygon(50% 0%, 50% 50%, 100% 0%, 100% 0%, 100% 0%, 100% 0%, 100% 0%);
    }
    37.5% {
        opacity: 1;
        clip-path: polygon(50% 0%, 50% 50%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 0%);
    }
    62.5% {
        opacity: 1;
        clip-path: polygon(50% 0%, 50% 50%, 0% 100%, 0% 100%, 0% 100%, 100% 100%, 100% 0%);
    }
    87.5% {
        opacity: 1;
        clip-path: polygon(50% 0%, 50% 50%, 0% 0%, 0% 0%, 0% 100%, 100% 100%, 100% 0%);
    }
    100% {
        opacity: 1;
        clip-path: polygon(50% 0%, 50% 50%, 50% 0%, 0% 0%, 0% 100%, 100% 100%, 100% 0%);
    }
}

@keyframes spins {
    0% {
        opacity: 0;
    }
    20% {
        opacity: 0;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        transform: rotateZ(360deg);
    }
}

.cnth2 {
    margin-top: 1em;
    margin-bottom: 0.5em;
    color: #032F55;
    font-size: 42px;
    font-weight: bold;
}

.abouthmain {
    position: relative;
    color: #032F55;
    font-weight: bold;
    margin: 20px 0;
}

.aboutfh {
    position: relative;
    color: #032F55;
    font-weight: bold;
    margin: 20px 0;
}

.aboutfhh {
    position: relative;
    color: #032F55;
    font-weight: bold;
    margin: 20px 0;
}

.abouthmain:after {
    content: "";
    position: absolute;
    top: 60px;
    right: 515px;
    background-color: #032F55;
    width: 84px;
    height: 3px;
    color: #fff;
}

.aboutfh:after {
    content: "";
    position: absolute;
    top: 60px;
    right: 3px;
    background-color: #032F55;
    width: 84px;
    height: 3px;
    color: #fff;
}

.aboutfhh:after {
    content: "";
    position: absolute;
    top: 60px;
    right: 3px;
    background-color: #032F55;
    width: 84px;
    height: 3px;
    color: #fff;
}

.aboutp {
    color: #707070;
    line-height: 1.6em;
    margin: 50px 0;
    font-size: 16px;
}

.abouticonprice {
    background-color: #E3EEF3;
    padding: 7px;
    border-radius: 50%;

}

.abouticonins {
    background-color: #E3EEF3;
    padding: 7px;
    border-radius: 50%;

}

.abouts {
    display: inline-block;
    color: #032F55;
    font-weight: bold;
    font-size: 20px;
    margin-right: 10px;
}

.pmin {
    color: #707070;
    line-height: 1.6em;
    margin: 20px 0;
    font-size: 16px;
}

.shapes {
    top: 318px;
    width: 20px !important;
    position: absolute;
    left: 95px;
}

.shapeth {
    top: 100%;
    width: 50px !important;
    position: absolute;
    left: 35px;
    transform: rotate(60deg);
    animation: shapeth 4s linear infinite;
    height: auto !important;
}

.shapeth00 {
    top: 35%;
    width: 50px !important;
    position: absolute;
    right: 4px;
    transform: rotate(60deg);
    animation: shapeth 4s linear infinite;
    height: auto !important;
}

.shapeth000 {
    top: 147%;
    width: 50px !important;
    position: absolute;
    right: 20%;
    transform: rotate(60deg);
    animation: shapeth 4s linear infinite;
    height: auto !important;
}

.shapeth0000 {
    top: 66%;
    width: 15px !important;
    position: absolute;
    right: 20%;
    transform: rotate(60deg);
    animation: shapeth 4s linear infinite;
    height: auto !important;
}

.shapee30000 {
    top: 43%;
    width: 27px !important;
    position: absolute;
    right: 21%;
    transform: rotate(60deg);
    animation: shapeth 4s linear infinite;
    height: auto !important;
}

.shapeth00000 {
    top: 176%;
    width: 50px !important;
    position: absolute;
    right: 1%;
    transform: rotate(60deg);
    animation: shapeth 4s linear infinite;
    height: auto !important;
}

.shapeth000000 {
    top: 213%;
    width: 50px !important;
    position: absolute;
    right: 20%;
    transform: rotate(60deg);
    animation: shapeth 4s linear infinite;
    height: auto !important;
}

.shapeth3 {
    top: 35%;
    width: 164px !important;
    position: absolute;
    right: -14em;
    transform: rotate(60deg);
    animation: shapeth 4s linear infinite;
    height: auto !important;
    overflow: hidden;
}

.shapee33 {
    bottom: -95em;
    width: 164px !important;
    position: absolute;
    right: -84px;
    transform: rotate(60deg);
    animation: shapeth 4s linear infinite;
    height: auto !important;
}

.joinusside .shapeth3 {
    width: -10px;
    /* bottom: -3690px; */
    width: 64px !important;
    position: absolute;
    left: 16px;
    transform: rotate(60deg);
    animation: shapeth 4s linear infinite;
    height: auto !important;
    top: 286px;
}

@keyframes shapeth {
    0% {
        -webkit-transform: rotate(0deg);
    }
    /*50% {width:24px;height:24px} */
    100% {
        -webkit-transform: rotate(360deg);
    }
}

/* examine items */
.shapefo {
    position: absolute;
    width: 292px;
    top: -165 !important;
    right: -200px;
    animation: shapeth 4s linear infinite;
}

.shapefour {
    position: absolute;
    width: 292px;
    top: -165 !important;
    right: -200px;
    animation: shapeth 4s linear infinite;
}

.shapefourr {
    position: absolute;
    width: 180px;
    top: -165 !important;
    left: 50px;
    animation: shapeth 4s linear infinite;
}

.shapeblog41 {
    position: absolute;
    width: 100px;
    top: -165;
    left: 3vw;
    animation: shapeth 4s linear infinite;
    top: 27em;
}

.shapefourth {
    position: absolute;
    width: 292px;
    top: 3500px;
    right: -200px;
    animation: shapeth 4s linear infinite;
}

.shapeblog44 {
    position: absolute;
    width: 292px;
    top: 80em;
    right: -200px;
    animation: shapeth 4s linear infinite;
}

.shapefourth4 {
    position: absolute;
    width: 130px;
    top: -4em;
    left: -7em;
    animation: shapeth 4s linear infinite;
    overflow: hidden;
}

.shapeee444 {
    position: absolute;
    width: 130px;
    top: -50px;
    left: 40px;
    animation: shapeth 4s linear infinite;
}

.shapeeecontact444 {
    position: absolute;
    width: 130px;
    top: 115em;
    left: 40px;
    animation: shapeth 4s linear infinite;
}

.myfourthowl .myaboutowl .owl-dots .owl-dot span {
    display: none !important;
}

.myfourthowl .owl-dots.disabled .owl-dot {
    display: none !important;
}

.myaboutowl .owl-stage {
    padding-bottom: 1.5em;
    padding-top: 1.5em;
}

.myaboutowl .item {
    text-align: center;
    margin-top: 3.3em;
}

.myaboutowl .center .item {
    position: relative;
    text-align: center;
    margin-top: auto;
    border-radius: 50%;
    background: #f8f8f9;
}

.myaboutowl .item .borderr {
    display: none !important;
}

.myaboutowl .center .item .borderr {
    display: block;
}

.build {
    width: 50px !important;
    display: inline-block !important;
}

.buildpic {
    width: 30px !important;
    display: inline-block !important;
    margin: 15px 0 5px 0;
}

.buildpicc {
    width: 20px !important;
}

.circle1 {
    position: absolute;
    height: 180px;
    height: 1;
    background-color: #fff;
    border-radius: 50%;
    width: 180px;
    height: 1;
    top: 18px;
    left: 18px;
}

.circleabout {

    /* height: 120px; */
    padding: 1em 1.7em;
    background-color: #fff;
    border-radius: 50%;
    /* width: 120px; */
    /* padding:1.5em; */
    /* top: 18px; */
    /* left: 50px; */
    display: inline-block;
    text-align: center;
}

.circleabout .gdranp {
    display: none;
}

.center .circleabout .gdranp {
    display: block;
}

.center .circleabout {
    position: relative;
    background-color: transparent;
    /* width: 220px; */
    /* height: 220px; */
    padding: 1em;
    background-color: #fff;
    margin: 1em;
    /* border-radius: 50%;
    border: 1px dashed #529AE4; */
}

.mincircle {
    text-align: center;
    position: absolute;
    text-align: center;
    background-color: #032F55;
    color: #fff;
    display: block;
    width: 25px;
    height: 25px;
    padding: 7px;
    border-radius: 50%;
    bottom: -17px;
    right: 55px;
    font-size: 11px;
    line-height: 10px;
}

.center .mincircle {
    width: 35px;
    height: 35px;
    bottom: 0px;
    right: 0px;
    font-size: 16px;
    line-height: inherit;
}

.mycircle {

}

.owl-item.center .mycircle {
    background: red;
}

.gdran {
    font-size: 20px;
    font-weight: bold;
    color: #032F55;
    /* display: block;
    margin: 5px 0; */
}

.gdranp {
    font-size: 10px;
    color: #707070;
    line-height: 1.6;
    margin: 10px 0;

}

.circlecontent1 {
    margin: 20px 0;
}

.mycarosel {
    /* margin: 100px 0; */
    /* margin: 100px 0 85px 0; */
}

.myaboutowl .owl-dots, .owl-theme .owl-nav {
    /* background-color: red;
    z-index: 10000000000; */
    /* position: absolute;
    top: 100px; */
}

.owl-dots.disabled {
    /* background-color: red; */
    display: block !important;
    margin-top: 162px;
}

.owl-dots.disabled .owl-dot {
    color: #529AE4 !important;
}

.mycarosel .owl-nav.disabled + .owl-dots {
    margin-top: 30px;
    /* background-color: black; */
    color: #529AE4 !important;
}

/* map */
.mapshapef {
    position: relative;
}

.mapshapes {
    position: relative;
}

.mapshape {
    position: absolute;
    right: 5px;
    top: 9px;
    animation: shapeth 4s linear infinite;
}

.joinusside .mapshapef {
    position: relative;
}

.joinusside .mapshapes {
    position: relative;
}

.joinusside .mapshape {
    position: absolute;
    right: 16px;
    top: 83px;
    width: 32px;
    animation: shapeth 4s linear infinite;
}

.mapdiv {
    position: relative;
    width: 100%;
    overflow: hidden;
    /*min-width: 100%;*/
    /*max-width: 100%;*/
    height: 450px;
    transform: translate(-222px, 0px);
}

.mapimg {
    width: 100%;
    position: relative;
    /* transform: translate(10%,0%); */
    overflow: hidden;
    border-radius: 20px !important;
    height: 100%;
    /*min-width: 100%;*/
    /*max-width: 100%;*/
}

.mapicon {
    width: 60px;
    right: 302px;
    position: absolute;
    bottom: 341px;
    animation: bounce-down 1.5s infinite;
    right: 40em;
    position: absolute;
    bottom: 17em;
    right: 58em;
    position: absolute;
    bottom: 15em;
}

.mapiconn {
    width: 60px;
    position: absolute;
    bottom: 170px;
    right: 600px;
    animation: bounce-down 1.5s infinite;
    bottom: 56px;
    right: 700px;
    bottom: 53px;
    right: 640px;
    bottom: 130px;
    right: 559px;
}

.mapiconnn {
    width: 60px;
    position: absolute;
    bottom: 238px;
    left: 357px;
    animation: bounce-down 1.5s infinite;
    bottom: 47px;
    left: 250px;

}

.mapiconfour {
    width: 60px;
    position: absolute;
    bottom: 90px;
    left: 207px;
    animation: bounce-down 1.5s infinite;
    bottom: 27px;
    left: 260px;
    right: 33em;
    position: absolute;
    bottom: 18em;
    right: 44em;
    position: absolute;
    bottom: 20em;
}

.mapside {
    width: 350px;
    height: 350px;
    background-color: #fff;
    border-radius: 20px;
    position: absolute;
    z-index: 1;
    /* top: 2022px; */
    /* top: 2057px; */
    top: 50%;
    transform: translate(50%, -50%);
    right: 20%;
    padding: 40px;
}

.sidemapp {
    font-size: 13px;
    color: #707070;
    line-height: 1.6;
    margin: 50px 0 30px 0;
}

.elryad {
    display: flex;
    justify-content: space-between;

}

.elryadspan {
    color: #707070;
    font-size: 14px;
}

/* clients sectio */
.clientimgtop {
    /* padding: 34px; */
}

.clientimgtop img {
    /* width: 420px !important; */
    /* margin: auto; */
}

.clientimg1 img {
    /* width: 160px !important; */
    /* margin: auto; */
    /* margin-top: 100px; */
    /* margin-right: 60px; */
    /* padding: 80px !important; */
}

.clientimg2 img {
    /* width: 160px !important; */
    /* margin: auto; */
    /* margin-top: 100px; */
    /* margin-left: 20px; */
    /* padding: 80px !important; */
}

.name1 {
    right: 100px;
    position: absolute;
    top: 155px;
    color: #032F55;
    font-size: 20px;
    font-weight: bold;
}

.name2 {
    position: absolute;
    top: 155px;
    right: 221px;
    color: #032F55;
    font-size: 20px;
    font-weight: bold;
}

.myclient1 img {
    position: absolute;
    width: 10% !important;
    top: 0;
    right: 57px;

}

.myclient2 img {
    position: absolute;
    width: 10% !important;
    top: 0;
    right: 235px;
}

.myclient22 {
    text-align: center;
}

.myfourthowl .owl-stage {
    padding: 5em 0;
}

.myfourthowl .item {
    background: url('../images/Group 1693.svg') center center no-repeat;
    background-size: contain;
    resize: both;
    /* padding: 2em; */
    /* padding: -11px 1em 4em 1em; */
    /*padding: 28px 70px;*/
}

.myowl44 .item {
    background: none;
}

.myfourthowl .center .item {
    background: url('../images/Group 1665.svg') center center no-repeat;
    background-size: contain;
    resize: both;
    /* padding: 2em; */
    /* padding: -11px 1em 4em 1em; */
    /*padding: 28px 70px;*/
    transform: scale(1.5);
    padding: 40px 80px;
    margin-top: 0;
    animation: myOrbitt 1s linear;
}

.myowl44 .center .item {
    background: none;
}

.myfourthowl .item {
    /* background: url('../images/Group 1693.svg') center center no-repeat; */
    background-size: contain;
    resize: both;
    /*padding: 80px;*/
    margin-top: 3em;
}

.myfourthowl .item .clientcontent {
    /*display: none;*/
}

.myfourthowl .item .clientcontent h5 {
    color: #032F55;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 0;
    display: block;
    padding: 2em 1em 6em 1em;

}

.myfourthowl .item .clientcontent span {
    color: #032F55;
    font-weight: bold;
    font-size: 8px;
    display: none;
}

.myfourthowl .item .clientcontent p {
    font-size: 8px;
    line-height: 1.6em;
    color: #707070;
    padding: 1em 2em 6em 2em;
    display: none;
}

.myfourthowl .center .item .clientcontent h5 {
    color: #032F55;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 0;
    display: block;
    padding: 0;
    margin-top: 1em;
}

.myfourthowl .center .item .clientcontent span {
    color: #032F55;
    font-weight: bold;
    font-size: 8px;
    display: block;
    margin-top: 1em;
}

.myfourthowl .center .item .clientcontent p {
    font-size: 8px;
    line-height: 1.6em;
    color: #707070;
    padding: 1em 2em 6em 2em;
    display: block;
}

.myfourthowl .center .item .clientcontent {
    display: block;
}

.myclient22 img {
    width: 12% !important;
    display: inline-block !important;
}

.center .myclient22 img {
    width: 25% !important;
    display: inline-block !important;
}

.clientcontent {
    /* position: absolute; */
    text-align: center;
    /* bottom: 124px;
    width: 214px;
    right: 97px; */
}

.myiframemap {
    position: relative;
}

.myiframemap:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 88.5%;
    height: 100%;
    background-color: #022E55;
    opacity: 0.1;
    border-radius: 1em;
}

.bodyimg {
    top: -100px;
    width: 90px;
    position: absolute;
    right: -10px;
    animation: shapeth 4s linear infinite;
}

.joinusside .bodyimg {
    width: 30px;
    top: 242px;
    /* width: 90px; */
    position: absolute;
    /* right: 19px; */
    animation: shapeth 4s linear infinite;
    right: 60px;
}

/* blog */
.blogitem {
    border: 0.5px solid #c3d7eb;
    background-color: #fff;
    /* box-shadow: 0px 0px 20px #529ae433; */
    border-radius: 10px;
    width: 339px;
    /* height: 509px; */
    padding: 27px;
    margin-top: 1em;
    /*margin-right: 1em;*/
    margin-bottom: 1em;
}

.blogitemthird {
    border: 0.5px solid #c3d7eb;
    background-color: #fff;
    /* box-shadow: 0px 0px 20px #529ae433; */
    border-radius: 10px;
    width: 339px;
    /* height: 509px; */
    padding: 27px;
    margin-top: 1em;
    /*margin-right: -1em;*/
    margin-bottom: 1em;
}

.blogitem:hover {
    box-shadow: -1px -2px 25px 11px rgba(122, 195, 224, 0.20);
    -webkit-box-shadow: -1px -2px 25px 11px rgba(122, 195, 224, 0.20);
    -moz-box-shadow: -1px -2px 25px 11px rgba(122, 195, 224, 0.20);
}

.blogitemm:hover {
    box-shadow: -1px -2px 25px 11px rgba(122, 195, 224, 0.20);
    -webkit-box-shadow: -1px -2px 25px 11px rgba(122, 195, 224, 0.20);
    -moz-box-shadow: -1px -2px 25px 11px rgba(122, 195, 224, 0.20);
}

.blogitemthird:hover {
    box-shadow: -1px -2px 25px 11px rgba(122, 195, 224, 0.20);
    -webkit-box-shadow: -1px -2px 25px 11px rgba(122, 195, 224, 0.20);
    -moz-box-shadow: -1px -2px 25px 11px rgba(122, 195, 224, 0.20);
}

.blogitemm {
    border: 0.5px solid #c3d7eb;
    background-color: #fff;
    /* box-shadow: 0px 0px 20px #529ae433; */
    border-radius: 10px;
    width: 339px;
    /* height: 509px; */
    padding: 27px;
    margin-top: 1em;
    margin-bottom: 1em;
}

.singleblog {
    width: 100%;
}

.blogitemsingle {
    border: 0.5px solid #c3d7eb;
    background-color: #fff;
    /* box-shadow: 0px 0px 20px #529ae433; */
    border-radius: 10px;
    /*width: 339px;*/
    /* height: 509px; */
    padding: 27px;
    margin-top: 1em;
    margin-bottom: 1em;
    /*text-align: center;*/

}

.datediv {
    opacity: 0.7;
    display: flex;
    margin: 13px 0;
}

.blogimg {
    /* width: 300px !important; */

}

.clocki {
    font-size: 12px;
    color: #707070;
    margin-top: 4px;
    margin-left: 3px;
}

.clockdate {
    font-size: 12px;
    color: #707070;
    margin-left: 5px;
}

.clockyear {
    font-size: 12px;
    color: #707070;
}

.blogp {
    color: #707070;
    font-size: 14px;
    line-height: 1.6;
    margin-top: 12px;
}

.myfifthh {
    color: #032F55;
    font-weight: bold;
    font-size: 20px;
}

.morebtn1 {
    border: none;
    background: none;
}

.morebtn1:hover .morebtn {
    padding-right: 3px;
}

.morebtn {
    color: #032F55;
    font-weight: bold;
    font-size: 14px;
    transition: 0.5s;
}

.owl-carousel .owl-item img {
    /*  */
}

.moreimg {
    margin: 1px 10px 0 0;
    width: 7% !important;
}

.shapeblog {
    position: relative;
}

.shapeblogimg {
    position: absolute;
    top: -118px;
    left: -11px;
    z-index: 1;
    animation: shapeth 4s linear infinite;
}

.shapejoinimg {

    position: absolute;
    top: 320px;
    left: 63px;
    z-index: 1;
    animation: shapeth 4s linear infinite;
    width: 52px;
}

.shapejoinnimg {

    position: absolute;
    top: 50px;
    left: 369px;
    z-index: 1;
    animation: shapeth 4s linear infinite;
    width: 40px;
}

/* footer */
.myfooter {
    overflow-x: hidden;
    background-color: #032F55;
    position: relative;
    /* background: url('../images/footer.svg') center ; */
    /* padding: 50px 50px 5px 50px; */
    padding: 104px 137px 0px 137px;
}

.lastfooterimg {
    margin-top: -0.5em;
}

.inputdiv {
    position: relative;
}

.myinput {
    position: relative;
}

.inputicon {
    text-align: center;
    width: 40px;
    height: 40px;
    position: absolute;
    background-color: #529AE4;
    top: -1px;
    left: -3px;
    border-radius: 50px;
    border: 0;
    text-align: center;
    width: 50px;
    height: 50px;
    position: absolute;
    background-color: #529AE4;
    top: 1px;
    left: -63px;
    border-radius: 50px;
    border: 0;
}

.inputiconn {
    /* margin-top: 12px; */
}

.footerp {
    color: #F8F8F9;
    font-size: 14px;
    line-height: 1.6em;
    margin: 20px 0;
}

.visa {
    text-align: center;
    display: inline-block;
    border: none;
    background-color: #fff;
    width: 55px;
    height: 30px;
    border-radius: 15px;
    cursor: default !important;
}

.paypal {
    text-align: center;
    display: inline-block;
    border: none;
    background-color: #fff;
    width: 55px;
    height: 30px;
    border-radius: 15px;
    margin-right: 0.5em;
    cursor: default !important;
}

.visa:hover {

}

.paypal:hover {

}

.lastfooterp {
    color: #fff;
    font-size: 14px;
}

.lastfooter {
    display: flex;
    justify-content: space-between;
    margin-top: 60px;
    margin-bottom: 2em;
}

.footerhfive {
    color: #F8F8F9;
    font-weight: bold;
    font-size: 20px;
    margin-right: 45px;
}

.footerhfivefive {
    color: #F8F8F9;
    font-weight: bold;
    font-size: 20px;
    /* margin-right: 45px; */
    margin: 0 0 18px 0;
}

.footerful {
    margin-top: 25px;
}

.footerful li {
    color: #F8F8F9;
    font-size: 14px;
    padding: 10px;
}

.footerful li a {
    color: #F8F8F9;
    transition: 0.5s;
}

.footerful li a:hover {
    padding-right: 5px;
}

.footerful1 {
    color: #F8F8F9;
    font-size: 14px;
    padding: 15px;
    margin-right: -14px;
}

.myinput {
    border-radius: 25px;
    /* padding-right: 43px; */
    /* margin: 30px 0; */
    margin-top: -1em;
    /* font-size: 12px; */
    color: #b7b7b7;
    padding: 1em 5em;
    margin-bottom: 2em;
    width: 120%;
    border-radius: 25px;
    /* padding-right: 43px; */
    /* margin: 30px 0; */
    margin-top: -1em;
    font-size: 14px;
    color: #b7b7b7;
    /* padding: 1em 4em; */
    margin-bottom: 2em;
    color: #70707080;
}

.material {
    position: absolute;
    top: 13px;
    right: 17px;
    position: absolute;
    top: 17px;
    right: 30px;
    width: 20px;
}

.face {
    text-align: center;
    width: 40px;
    height: 40px;
    border: 1px solid #fff;
    border-radius: 50px;
    padding: 5px;
    /* width: 20px; */
    /* height: 14px; */
    display: inline-block;
}

.face:hover {
    background-color: #529AE4;
    transition: 0.5s;
}

.face2 {
    margin: 0 10px;
}

.faceimg {
    width: 13px;
    height: 13px;
}

.pages {
    margin-right: 50px;
}

.main_elements {
    position: relative;
}

.lines-1 {
    width: 100%;
    overflow: hidden;
    height: 20px;
    content: "";
    position: absolute;
    bottom: 34%;
    z-index: 0;
    left: 0;
    display: none;
}

.lines-1 .inside-it {
    top: 10px;
    width: 200%;
    height: 100%;
    border-top: 1px dashed #82b6ea;
    position: absolute;
    right: 100%;
    animation: mymove 10s linear forwards;
}

.lines-1 .inside-it img {
    height: 15px;
    position: absolute;
    top: -7px;

}

.mymclass {
    width: 50%;
}

@keyframes mymove {
    0% {
        right: 100%;
    }
    100% {
        right: 0%;
    }
}

@keyframes bounce-down {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-40px);
    }

    100% {
        transform: translateY(0);
    }
}

.mapiconn {
    display: block;
}

/* search popup */
.overlay {
    height: 100%;
    width: 100%;
    display: none;
    position: fixed;
    z-index: 999999999999;
    top: 0;
    left: 0;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.9);
}

.overlay-content {
    position: relative;
    top: 46%;
    width: 80%;
    text-align: center;
    margin-top: 30px;
    margin: auto;
}

.overlay-content form {
    border-radius: 50px;
    overflow: hidden;
}

.overlay .closebtn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px;
    cursor: pointer;
    color: white;
}

.overlay .closebtn:hover {
    color: #ccc;
}

.overlay input[type=search] {
    padding: 15px;
    font-size: 17px;
    border: none;
    float: right;
    width: 80%;
    background: white;
}

.overlay input[type=search]:hover {
    background: #f1f1f1;
}

.overlay button {
    float: right;
    width: 20%;
    padding: 15px;
    background: #5595DC;
    font-size: 17px;
    border: none;
    cursor: pointer;
    color: #ffff;
    transition: 0.5s;
}

.overlay button:hover {
    background: #233f5f;
}


/* search popup */
.overlayy {
    height: 100%;
    width: 100%;
    display: none;
    position: fixed;
    z-index: 999999999;
    top: 0;
    left: 0;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.9);
}

.overlayy-content {
    position: relative;
    top: 23%;
    width: 80%;
    text-align: center;
    margin-top: 30px;
    margin: auto;
}

.overlayy-content form {
    border-radius: 50px;
    overflow: hidden;
}

.overlayy .closebtnn {
    position: absolute;
    top: 20px;
    right: 45px;
    font-size: 60px;
    cursor: pointer;
    color: white;
}

.overlayy .closebtnn:hover {
    color: #ccc;
}

.overlayy input[type=search] {
    padding: 15px;
    font-size: 17px;
    border: none;
    float: right;
    width: 80%;
    background: white;
}

.overlayy input[type=search]:hover {
    background: #f1f1f1;
}

.overlayy button {
    float: right;
    width: 20%;
    padding: 15px;
    background: #5595DC;
    font-size: 17px;
    border: none;
    cursor: pointer;
    color: #ffff;
    transition: 0.5s;
}

.overlayy button:hover {
    background: #233f5f;
}


.myfourthowl .owl-dots {
    display: none;
}

.myfourthowl .owl-nav {
    display: none;
}

/* body {
  margin: 0;
  background-color: rgb(0,0,0);
} */
.load-bar {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: fixed;
    top: 0px;
    height: 5px;
    background-color: #0F214B;
    width: 100%;
    z-index: 99999999999;
}

.linear {
    position: absolute;
    height: 100%;
    /* background-image: linear-gradient(90deg, transparent, white, transparent); */
    width: 100%;
    max-width: 700px;
}

.load-bar {
    animation-name: width;
    animation-delay: 0s;
    animation-duration: 2s;
    /* animation-iteration-count:1; */
    animation-timing-function: ease-out;
    animation-direction: normal;
}

@keyframes width {
    0% {
        transform: translateX(-100%);
    }
    100% {
        /* transform: translateX(100%); */
    }
}

.mapsidediv {
    position: relative;
}

.overlay input[type=search] {
    transition: 0.5s;
}

/* @keyframes lines-1 {
  from {
      background-position: 2px 19px;
    }
    to {
      background-position: 500px 19px;
    }
  }

  @keyframes lines-1 {
  from {
      background-position: 2px 19px;
    }
    to {
      background-position: 500px 19px;
    }
  } */
/* .wave {
    width: 100%;
    height: 200px;
    position: relative;
}

.wave:after {
    content: '';
    width: 50%;
    position: absolute;
    height: 200px;
    display: block;
    border-bottom: 1px dashed black;
    top: 99.5%;
    border-radius: 50% 0;
    left: 50%;
    transform: rotateX(180deg);
}

.wave:before {
    content: '';
    width: 50%;
    position: absolute;
    height: 200px;
    display: block;
    border-bottom: 1px dashed black;
    border-radius:0 50% ;
}      */

/* joinus page */
.myrow {
    text-align: center;
    margin: auto;
    position: relative;
    border: 1px solid #EDF0F3;
    background-color: #EDF0F3;
    padding: 5px;
    border-radius: 50px;
    width: 300px;
    margin-top: 60px;
}

.myroww {
    text-align: center;
    margin: auto;
    position: relative;
    border: 1px solid #EDF0F3;
    background-color: #EDF0F3;
    padding: 5px;
    border-radius: 50px;
    width: 300px;
    margin-top: 80px;
}

.myrowww {
    text-align: center;
    margin: auto;
    position: relative;
    border: 1px solid #EDF0F3;
    background-color: #EDF0F3;
    padding: 5px;
    border-radius: 50px;
    width: 300px;
    margin-top: 80px;
}

.myrowwww {
    text-align: center;
    margin: auto;
    position: relative;
    border: 1px solid #EDF0F3;
    background-color: #EDF0F3;
    padding: 5px;
    border-radius: 50px;
    width: 300px;
    margin-top: 80px;
}

.myroww:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #4594E1;
    top: 0;
    right: 0;
    border-radius: 50px;
    width: 90px;
}

.myrowww:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #4594E1;
    top: 0;
    right: 0;
    border-radius: 50px;
    width: 150px;
}

.myrowwww:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #4594E1;
    top: 0;
    right: 0;
    border-radius: 50px;
    width: 230px;
}

.mysrow {
    text-align: center;
    margin: auto;
    position: relative;
    border: 1px solid #EDF0F3;
    background-color: #EDF0F3;
    padding: 5px;
    border-radius: 50px;
    width: 300px;
    margin-top: 80px;
}

.mysrow:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: #4594E1;
    top: 0;
    right: 0;
    border-radius: 50px;
    width: 300px;
}

.joinus {
    /* padding-bottom: 10px !important; */
}

.joinus a {
    /* color: #4594E1;
    background-color: #EDF2F6;
    padding: 50px;
    border-radius: 50px; */
}

.joinus a:hover {
    /*color: #fff !important;*/
    /*background-color: #032F55;*/
    transition: all .5s;
}

.joinus a:hover img {
    /*filter: brightness(0) invert(1);*/

}

.joinusside {
    background-color: #032F55;
    padding: 0 50px;
    padding-top: 2em;
}

.myowl6 .owl-dots {
    display: block;
}

.mycol {
    padding: 0;
    margin: 0;

}

.back {
    margin-bottom: 45px;
    text-align: center;
    background-color: #032F55;
    color: #4594E1;
    /* padding: 10px; */
    display: block;
    width: 116px;
    height: 40px;
    border-radius: 50px;
    line-height: 2em;
    margin-top: -75px;
    /* margin-right: 163px; */
}

.back {
    margin-bottom: 45px;
    text-align: center;
    background-color: #EDF2F6;
    color: #4594E1;
    /* padding: 10px; */
    display: block;
    width: 116px;
    height: 40px;
    border-radius: 50px;
    line-height: 2em;
    margin-top: -63px;
    /* margin-right: 163px; */
}

.file {
    background-color: #EDF2F6;
    border-radius: 50%;
    padding: 6px 15px;
}

.info {
    display: inline-block;
    color: #032F55;
    font-size: 32px;
    font-weight: bold;
    margin: 5px 10px 0 0;
}

.mylabel {
    color: #707070;
    font-size: 14px;
    margin: 25px 0;
}

.finput {
    width: 88%;
    border-radius: 50px !important;
    background-color: #EDF2F6;
    position: relative;
    padding-right: 40px !important;
}

.finputdiv {
    position: relative;
    width: 40%;
}

.finputdivv {
    position: relative;

}

.finputimg {
    position: absolute;
    top: 53px;
    right: 20px;
}

.sinputimg {
    position: absolute;
    top: 57px;
    right: 20px;
}

.ssinputimg {
    position: absolute;
    top: 57px;
    right: 287px;
}

.myforminput:hover .sinputimg {
    filter: sepia(100%) hue-rotate(190deg) saturate(500%);
}

.myforminput {
    /*width: 115%;*/
    border-radius: 50px !important;
    background-color: #EDF2F6;
    position: relative;
    padding-right: 40px !important;
}

.logininput .myforminput {
    width: 88%;
}

.forgetinput {
    width: 40%;
    margin: auto !important;
    margin-bottom: 3em !important;
}

.joinusfside {
    background-color: #F8F8F9;
    border-radius: 40px 0 0 40px;
    padding: 110px 0 74px 0;
    /* height: 100%vh; */
}

.mycol {
    background-color: #032F55;
}

.joinusside h3 {
    font-size: 32px;
    font-weight: bold;
    color: #F8F8F9;
    margin: 30px 0;
}

.joinusside p {
    color: #529AE4;
    font-size: 12px;
    /* line-height: 1.6em; */
    /* margin:10px 0 60px 0; */
}

.infodiv {
    margin: 30px 0;
    /* margin-right: -40px; */
}

.sdivv {
    margin-right: 65px;
}

.checkgroup {
    margin: 15px 0 15px 0;
    /* margin-top: 2em; */
}

.mycheck {
    /*margin-top: 27px;*/
    margin-left: 5px
}

.myllabel {
    color: #529AE4;
}

.sendto {
    background-color: #032F55;
    border-radius: 50px;
    padding: 5px 20px;
    color: #fff;
    border: none;
}

.sendto:hover {
    background-color: #4594E1 !important;
}

.sendtov {
    background-color: #032F55 !important;
    border-radius: 50px;
    padding: 5px 20px;
    color: #fff !important;
    border: none !important;
    margin: 3em -3em -3em 0;
}

.sendtov:hover {
    background-color: #4594E1 !important;
}

.lastspan {
    /* margin-top:40px; */
    margin-top: 3em;
}

.eyeimg {
    position: absolute;
    top: 54px;
    left: -26px;
    color: #529AE4;
}

.eyeimgggg {
    position: absolute;
    top: 54px;
    left: -26px;
    color: #529AE4;
}

.joinuscarousel {
    /* margin-top: 120px; */
}

/* videopage */
.myvideoowl .owl-dots {
    display: none !important;
}

.myvideoowl {
    margin-right: -40px;
}

.infop {
    color: #707070;
    font-size: 16px;
    margin-top: 45px;
}

.myvideoballs .balls {
    top: 43%;
    left: 19em;
    /* display: inline-block; */
    position: absolute;
    z-index: 1;
    cursor: pointer;
}

.myvideoowl .item:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #032F55;
    border-radius: 10px;
    opacity: 0.4;
}

.videobtn {
    margin-right: -40px;

}

/* verfication page */
.verf {
    width: 60px;
    height: 60px;
    background-color: #E1EBF5;
}

.verfdiv {
    display: flex;
    justify-content: center;
    /* margin-left: 13em; */
    margin-bottom: 40px;
}

.verfdiv input {
    margin: 5px;
}

.verfcontent {
    transform: translate(90px, 30px);
    text-align: center;
    margin-top: -5em;
    margin-top: -20px;
}

.verfcontent h2 {
    color: #032F55;
    font-size: 32px;
    font-weight: bold;
    margin: 40px 0 20px 0;
}

.verfcontent p {
    color: #ACABAB;
    font-size: 14px;
    margin-bottom: -10px;
}

.verfspan {
    color: #032F55;
    font-size: 20px;
    font-weight: bold;
}

.sverfspan {
    color: #032F55;
    font-size: 14px;
    font-weight: bold;
    margin-top: 40px;
}

.lastspan span {
    color: #ACABAB;
}

.loginside {
    padding: 125px 0 178px 0;
}

.eyeimglog {
    left: 100px;
}

.forgetlabel {
    margin-left: 19em;
}

.backforget {
    margin-right: 235px;
}

.joinusffside {
    padding-bottom: 160px;
}

.fileUpload {
    /* background:#B8D3E9; */
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    color: #fff;
    font-size: 1em;
    font-weight: bold;
    /* margin: 1.25em auto;20px/16px 0 */
    overflow: hidden;
    /* padding: 0.875em;14px/16px */
    position: relative;
    text-align: center;
    width: 120px;
    cursor: pointer;
    margin: auto;
}

.fileUpload:hover, .fileUpload:active, .fileUpload:focus {
    background: #EDF2F6;
    cursor: pointer;
}

.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
    width: 148px;
    height: 46px;
    cursor: pointer;
}

/*input[type="file"] {*/
/*    position: fixed;*/
/*    right: 100%;*/
/*    bottom: 100%;*/
/*}*/

.custom-file-upload {
    border: 1px solid #ccc;
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer;
}

.myowl6 .item {
    text-align: center;
}

.myowl6 .item img {
    display: inline-block;
    width: 90%;
}

.infodivv {
    margin-right: -40px;
}

.backkk {
    margin-right: -40px;
}

.backkkk {
    margin-right: 10em;
}

.map_section {
    position: relative;
    margin-top: 4em;
}

.mapdiv {
    /*margin-top: 2em;*/
    position: relative;
    width: 75%;
    display: inline-block;
}

.mapiframe {
    position: relative;
}

.mapdiv:after {
    content: "";
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 15px;
    display: none;
}

.mapdivv:after {
    content: "";
    top: 0;
    left: 0;
    right: 0;
    width: 98%;
    height: 200px;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 15px;
}

.allow {
    background-color: #0F214B;
    display: block;
    border-radius: 50px;
    width: 90px;
    text-decoration: none;
    color: #fff !important;
    text-align: center;
    height: 30px;
}

.formdiv {
    position: relative;
}

.mapform {
    position: absolute;
}

.forminput {
    border-radius: 10px;
    /* width: 200%; */
}

.formdiv {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
}

.forminput {
    width: 60%;
    top: -124px;
    border-radius: 50px;
    font-size: 14px !important;
    right: 107px;
}

.allow {
    position: absolute;
    top: -122px;
    left: 167px;
}

#selector select option {
    color: #333;
    position: relative;
    top: 5px;
}

/*==================================================
remove the original arrow in select option dropdown
==================================================*/

#selector {
    /* margin: 5px 10%; */
    /* width: 15%; */
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    cursor: pointer !important;

}

select.input-lg {
    /* height: 50px !important; */
    /*width: 88%;*/
    border-radius: 50px !important;
    background-color: #EDF2F6;
    /* position: relative; */
    padding-right: 40px;
    cursor: pointer !important;

}

.myselect {
    background-color: #fff !important;
    width: 145% !important;
    padding-right: 4em !important;
    margin-right: 1em;
}

.formfff {
    display: flex;
}

select + i.fa {
    float: left;
    margin-top: -26px;
    /* margin-right: 9px; */
    pointer-events: none;
    background-color: transparent;
    /* padding-right: 5px; */
    margin-left: 104px;
    cursor: pointer !important;
}

.flag {
    /* float: left; */
    margin-top: -33px;
    /* margin-right: 9px; */
    pointer-events: none;
    background-color: transparent;
    /* padding-right: 5px; */
    /* margin-left: 104px; */
    cursor: pointer !important;
    margin-right: 15px;
    display: block;
    /* filter: sepia(100%) hue-rotate(190deg) saturate(500%); */

}

.selectorr:hover .flag {
    filter: sepia(100%) hue-rotate(190deg) saturate(500%);
}

.selectorr:hover .input-lg {
    background: #fff;
}

.avatar-upload {
    position: relative;
    max-width: 205px;
    /* margin: 15% 0  */
    /* margin: 0 10%; */
    margin: auto;
}

.avatar-edit {

    position: absolute;
    right: 100px;
    z-index: 1;
    top: 52px;
    background: #fff;
    border-radius: 50%;
    width: 2em;
    height: 2em;

}

.avatar-edit input {
    display: none;
    margin-right: 5%;
}

.avatar-edit input + label {

    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    /* border-radius: 100%; */
    background: url(../images/Iconmaterial-camera-alt.svg);
    background-repeat: no-repeat;
    /* border: 1px solid transparent; */
    /* box-shadow: 0px 2px 4px 0px rgb(0 0 0 / 12%); */
    cursor: pointer;
    font-weight: normal;
    transition: all .2s ease-in-out;
    margin-top: 8px;
    /* margin-left: -6px; */
    margin-right: -9px;
}

.avatar-preview {
    width: 150px;
    height: 150px;
    position: relative;
    border-radius: 2%;
    /* border: 6px solid #F8F8F8; */
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
    /* margin-right: 5%;
    margin-bottom: -44%;
    margin-top: -76px; */
}

.avatar-preview > div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.sama9:before {
    content: "";
    position: absolute;
    top: 230px;
    /* left: 3px; */
    right: 333px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: bottom;
    box-shadow: 50px -36px 0 #032f55;
    /* transform: rotate(173deg); */
}

.manageprofile h2 {
    color: #032F55;
    font-weight: bold;
    font-size: 32px;
}

.manageprofile span {
    color: #707070;
    font-size: 14px;
    display: block;
    margin: 20px 0 35px 0;
}

.accountdetails {
    border: 1px solid #D1E3F2;
    padding: 3em 3em 1em 3em;
    border-radius: 25px;
    margin: 40px 0;
}

.accountdetails h3 {
    font-weight: bold;
    color: #032F55;
    position: relative;
    font-size: 20px;
}

.navigation .nav-tabs {
    border-bottom: 0px solid #F8F8F9;

    margin-left: 17px;
    margin-right: 50px;
}

.navigation {
    position: relative;
    height: 80vh;
    width: 100%;
    overflow-x: hidden;
    transition: width 0.5s;
    margin-left: 32px;
    margin-right: 25px;
}

.accountdetails h3:after {
    position: absolute;
    content: "";
    top: 42px;
    right: 2px;
    background-color: #032F55;
    width: 79px;
    height: 4px;
}

.location h3 {
    font-weight: bold;
    color: #032F55;
    position: relative;
    font-size: 20px;
}

.location h3:after {
    position: absolute;
    content: "";
    top: 42px;
    right: 2px;
    background-color: #032F55;
    width: 79px;
    height: 4px;
}

.location {
    border: 1px solid #D1E3F2;
    border: 1px solid #D1E3F2;
    padding: 3em 3em 1em 3em;
    border-radius: 25px;
    margin: 40px 0;
}

.safety {
    border: 1px solid #D1E3F2;
    border: 1px solid #D1E3F2;
    padding: 3em 3em 1em 3em;
    border-radius: 25px;
    margin: 40px 0;
}

.accountform {
    margin: 2em 0;
}

.accountform button {
    margin-top: 2em;
}

/* .dropdown-menu2:before {
    content: '';
    position: absolute;
    top: 0;
    right: 8%;
    margin-left: -15px;
    margin-top: -15px;
    width: 0;
    z-index: 1;
    height: 0;
    border-bottom: solid 15px #FFF;
    border-left: solid 15px transparent;
    border-right: solid 15px transparent;
} */
.dropdown-menu2:before {
    content: '';
    position: absolute;
    top: -10px;
    right: 10%;
    margin-left: -15px;
    margin-top: -15px;
    width: 0;
    z-index: 1;
    height: 0;
    border-bottom: solid 25px #FFF;
    border-left: solid 15px transparent;
    border-right: solid 15px transparent;
}

.dropdown-menu[data-bs-popper] {
    top: 130%;
    right: 0;
    margin-top: 0.125rem;
    border-radius: 20px;
}

.dropdown-menu2 {
    min-width: 20rem !important;
    right: -33px !important;
    /* margin-top: 0.5rem !important; */
    text-align: right !important;
    /* padding: 2em !important; */
    min-width: 20rem !important;
    right: -35px !important;
    /* margin-top: 0.5rem !important; */
    text-align: right !important;
    /* padding: 0em !important;*/
    /* overflow-y: auto; */
    /* overflow-x: hidden; */
    direction: ltr;
    padding: 0 !important;
    margin-top: 1.5em;
}

.dropdownul {
    overflow-y: auto;
    max-height: 16rem;
    padding: 0;
    margin: 0;
    padding: 1em;
}

.notificationimg {

    background-color: #FEFFE1;
    border-radius: 50px;
    /* padding: 1em; */
    width: 30px;
    height: 30px;
    text-align: center;
    margin-left: 1em;
    /* margin-top: 1em; */
    margin: auto;

}

.notificationimgg {

    background-color: #FCEAE7;
    border-radius: 50px;
    /* padding: 1em; */
    width: 30px;
    height: 30px;
    text-align: center;
    margin-left: 1em;
    /* margin-top: 1em; */

}

.notificationimggg {

    background-color: #E9FCE7;
    border-radius: 50px;
    /* padding: 1em; */
    width: 30px;
    height: 30px;
    text-align: center;
    margin-left: 1em;
    /* margin-top: 1em; */

}

.dropdown-menu2 .dropdown-item {
    padding: 0;
}

.dropdown-menu2 .dropdown-item:hover {
    border-radius: 10px;
}

.myselect {
    border-radius: 50px;
    position: relative;
    font-size: 14px;
    padding: 1em 4em;
}

.sama9:after {
    content: "";
    position: absolute;
    /*bottom: -1180px;*/
    /* left: 3px; */
    right: 328px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: bottom;
    box-shadow: 16px -25px 0 #032f55;
    transform: rotate(97deg);
}

.avatar-preview {
    right: 62px;
    width: 150px;
    height: 150px;
    position: relative;
    border-radius: 2%;
    /* border: 6px solid #F8F8F8; */
    box-shadow: 0px 2px 4px 0px rgb(0 0 0 / 10%);
    width: 75px;
    height: 75px;
}

.avatar-edit {
    position: absolute;
    right: 128px;
    z-index: 1;
    top: 122px;
    background: #fff;
    border-radius: 50%;
    width: 2em;
    height: 2em;
    position: absolute;
    right: 100px;
    z-index: 1;
    top: 52px;
    background: #fff;
    border-radius: 50%;
    width: 2em;
    height: 2em;
}

.notitem {
    background-color: #fff;
    position: relative;
    direction: rtl;
    margin-left: 6em;
    margin-right: -2.5em;
    padding: 1em;
    border-radius: 15px;
}

.notitem:hover {
    background-color: #EDF2F6;
    transition: 0.5s;
}

.notificationtab {
    max-height: 800px;
    overflow-y: auto;
    overflow-x: hidden;
    direction: ltr;
}

.notitem:before {
    content: '';
    position: absolute;
    top: 75px;
    right: -41px;
    margin-left: -15px;
    margin-top: -15px;
    width: 0;
    z-index: 1;
    height: 0;
    border-bottom: solid 32px #fff;
    border-left: solid 25px transparent;
    border-right: solid 25px transparent;
    transform: rotate(89deg);
}

.notitem:hover:before {
    content: '';
    position: absolute;
    top: 75px;
    right: -41px;
    margin-left: -15px;
    margin-top: -15px;
    width: 0;
    z-index: 1;
    height: 0;
    border-bottom: solid 32px #EDF2F6 !important;
    border-left: solid 25px transparent;
    border-right: solid 25px transparent;
    transform: rotate(89deg);
    transition: 0.5s;
}

.notitema {
    color: #032F55;
    font-size: 14px;
    font-weight: bold;
    background-color: #B8D3E9;
    padding: 0.5em 2em;
    border-radius: 50px;
}

.notitem:hover .notitema {
    background-color: #032f55;
    color: #fff;
    transition: 0.5s;
}

.runimg {
    width: 2em;
    margin: auto;
}

.rundiv {
    background-color: #FAFCC7;
    border-radius: 50%;
    /* padding: 1em; */
    width: 50px;
    height: 50px;
    /* line-height: 3em; */
    margin: auto;
}

.runbigdiv {

    text-align: center;
    background-color: #FEFFE1;
    border-radius: 50%;
    width: 70px;
    height: 70px;
    line-height: 3em;
    margin: auto;
    padding-top: 10px;
    margin-top: 2.3em;
}

.mycol {
    padding: 0;
    margin: 0;
}

.notiicon {
    font-size: 24px;
}

.icondiv {
    background-color: #EDF2F6;
    border-radius: 50%;
    padding: 1em;
    width: 55px;
    height: 55px;
}

.notifications h2 {
    color: #032F55;
    font-weight: bold;
    margin-right: 1em;
}

.itembigdiv {
    margin: 1em 0;
}

.mynavpills {
    margin-left: 6em;
    direction: ltr;
}

.mynavpills .nav-item .nav-link {
    background: 0 0;
    border: 0;
    border-radius: 0.25rem;
    color: #0F214B !important;
    font-weight: bold !important;
}

.mynavpills .nav-item .nav-link.active {
    background-color: #EDF2F6 !important;
    border-radius: 50px;
}

.tasklist {
    width: 95% !important;
}

.tasks {
    width: 92% !important;
}

.tasksaddr {
    display: flex;
}

.tasksaddr i {
    color: #022E55;
    font-size: 25px;
    background-color: #EDF2F6;
    border-radius: 50%;
    padding: 13px;
}

.tasksaddr h2 {
    color: #032F55;
    font-weight: bold;
    font-size: 32px;
    margin-right: 0.5em;
}

.tasksdate {
    text-align: center;
    margin: 1em 0;
}

.tasksdate span {
    color: #032F55;
    background-color: #EBF2F8;
    border-radius: 50px;
    padding: 0 2em;
    font-size: 20px;
}

.taskcontent h4 {
    color: #032F55;
    font-weight: bold;
    font-size: 20px;
    margin-right: 0.5em;
}

.taskicons {
    display: flex;
}

.taskicons i {
    color: #032F55;
    background-color: #EDF2F6;
    border-radius: 50%;
    padding: 5px;
}

.ii {
    margin: 0 0.5em;
}

.taskcontent p {
    color: #9E9A9A;
    line-height: 1.6;
    font-size: 12px;
}

.taskspans {
    display: flex;
}

.taskspans span {
    color: #DC4130;
}

.taskcontent button {
    color: #032F55;
    border: none;
    background-color: #B8D3E9;
    border-radius: 50px;
    padding: 0.3em 1.5em;
}

.taskcontent {
    background-color: #fff;
    border-radius: 15px;
    padding: 1em 2em;
    margin: 1em 0;
    direction: rtl;
}

.taskitems {
    max-height: 800px;
    overflow-y: auto;
    margin-right: 1em;
    overflow-x: hidden;
    direction: ltr;
    margin-top: 5em;
}

.taskcontent {
    background-color: #fff;
    border-radius: 15px;
    padding: 1em 4em;
    margin: 1em 0;
    direction: rtl;
    margin-right: 1em;
}

.messiondiv {
    display: flex;
    margin-right: -14px;
}

.tasklastdiv {
    display: flex;
    justify-content: space-between;
}

/* popup style */
#overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
    opacity: 0.7;
    z-index: 100;
    display: none;
}

.cnt223 a {
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #032F55;
    color: #032F55;
    border-radius: 50px;
    padding: 0.2em 1em;
}

.gahez {
    border: 1.5px solid #032F55;
    background: #032F55;
    padding: 0.2em 1.8em !important;
    border-radius: 50px;
    color: #fff;
}

.gahez:hover {
    background: #F8F8F9;
    transition: 0.5s;
}

.notgahez {
    padding: 0.2em 1em !important;
    border: 1px solid #032F55;
    background: #F8F8F9;
    border-radius: 50px;
    color: #032F55;
}

.notgahez:hover {
    background: #032F55;
    transition: 0.5s;
    color: #fff;
}

.cnt223 a:hover {
    background-color: #022E55;
    color: #fff;
    transition: 0.5s;
}

.popupdiv {
    background-color: rgba(0, 0, 0, 0.7);

}

.popup {
    width: 100%;
    margin: 0 auto;
    display: none;
    position: fixed;
    z-index: 101;
    overflow: hidden;
    background: radial-gradient(black, transparent);
    /* height: 100%; */
    height: 100vh;
}

.cnt223 {
    /* min-width: 600px; */
    width: 600px;
    /* min-height: 150px; */
    margin: auto;
    background: #fff;
    position: relative;
    z-index: 103;
    padding: 15px 35px;
    border-radius: 25px;
    box-shadow: 0 2px 5px #000;
    padding: 0;
    /* padding-bottom: 2em; */
    overflow: hidden;
    /* margin-top: 1em; */
    height: 100vh;
}

.cnt223 p {
    clear: both;
    /* color: #555555; */
    /* text-align: justify; */
    /* font-size: 20px; */
    /* font-family: sans-serif; */
}

.cnt223 p a {
    color: #d91900;
    font-weight: bold;
}

.cnt223 .x {
    float: right;
    height: 35px;
    left: 22px;
    position: relative;
    top: -25px;
    width: 34px;
    color: #032F55;
}

.cnt223 .x:hover {
    cursor: pointer;
}


.myowl44.owl-theme .owl-nav {
    position: absolute;
    /* margin-top: 10px; */
    top: -5px;
    left: 10px;
}

/* step wizard */
/* your CSS goes here*/

#regForm {
    /* background-color: #ffffff;
    margin: 0px auto;
    font-family: Raleway;
    padding: 40px;
    border-radius: 10px */
}

h1 {
    text-align: center
}

/* input {
    padding: 10px;
    width: 100%;
    font-size: 17px;
    font-family: Raleway;
    border: 1px solid #aaaaaa
} */

input.invalid {
    background-color: #ffdddd
}

/* button {
    background-color: #4CAF50;
    color: #ffffff;
    border: none;
    padding: 10px 20px;
    font-size: 17px;
    font-family: Raleway;
    cursor: pointer
} */

button:hover {
    /*opacity: 0.8*/
}

#prevBtn {
    /* background-color: #bbbbbb */
}

.step {
    height: 50px;
    width: 50px;
    margin: 0 2px;
    /*background-color: #bbbbbb;*/
    border: none;
    border-radius: 50%;
    display: inline-block;
    /*opacity: 0;*/
    /*display: none;*/
}

.step.active {
    opacity: 1
}

.step.finish {
    background-color: #4CAF50
}

.all-steps {
    text-align: center;
    /*margin-top: 30px;*/
    /*margin-bottom: 30px;*/
    /* display: none; */
    margin: 0 !important;
    padding: 0 !important;
    height: 1px;
}

.thanks-message {
    display: none
}

/*
.container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
} */

/* Hide the browser's default radio button */

/* .container input[type="radio"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
} */

/* Create a custom radio button */

.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
    border-radius: 50%;
}

/* On mouse-over, add a grey background color */

.container:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */

.container input:checked ~ .checkmark {
    background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */

.container input:checked ~ .checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */

.container .checkmark:after {
    top: 9px;
    left: 9px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}

thead {
    background-color: #032F55;
    color: #fff;
    font-size: 14px;
    text-align: center;
}

table.dataTable.display > tbody > tr.odd > * {
    box-shadow: none;
}


.modal-header {
    border-bottom: none !important;
}

.inputnumber {
    text-align: center;
    width: 4em;
    padding-left: 1.5em;
    border: 1px solid #DCEAF5;
}

#increase {
    background: #DCEAF5;
    border: 1px solid #DCEAF5;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
    padding: 1em;
}

#decrease {
    background: #DCEAF5;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    padding: 1em;
    border: 1px solid #DCEAF5;
}

.myowl44 .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background-color: #032F55;
    color: #fff !important;
    border-radius: 50px;
    padding: 0.5em 3em;
    font-weight: bold;
}

.myowl44 .nav-pills .nav-link {
    color: #022E55;
    border: 1px solid #022E55;
    border-radius: 50px;
    font-weight: bold;
}

/* .avatar-upload:before{
    position: absolute;
    content: "";
    top: -32px;
    /* right: 14px;
    width: 355px;
    height: 1px;
    background: #fff;
    z-index: 111111;
    right: -21px;
}*/
.currenttask h5 {
    color: #032F55;
    font-weight: bold;
    font-size: 20px;
    margin-right: 0.5em;
}

.currenttaskspan {
    color: #529AE4;
    font-size: 62px;
}

.currenttask p {
    color: #9E9A9A;
    font-size: 14px;
}

.currenttask a {
    color: #F8F8F9;
    font-weight: bold;
    font-size: 14px;
    background-color: #032F55;
    border-radius: 50px;
    padding: 0.5em 2em;
}

.currenttask img {
    object-fit: contain;
    background: #EDF2F6;
    border-radius: 50px;
    padding: 0.5em;
}

.lastspans {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1em;
}

.lastspans p {
    margin-right: 3.3em;
}

.scudsheldtasks img {
    object-fit: contain;
    background: #EDF2F6;
    border-radius: 50px;
    padding: 0.5em;
}

.taskcontent:hover {
    border: 1px solid #529AE4;
}

.blogitems {
    margin: 5em 0;
}

.blogimg {
    width: 100%;
    /* max-height: 18em; */
    /* position: relative; */
}

.myposition {
    position: relative;
}

.myposition:before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: #032F55;
    opacity: 0.7;
    position: absolute;
    /* z-index: 1; */
    top: 0;
    left: 0;
    display: block;
    border-radius: 10px;
}

.mypagination {
    text-align: center !important;
    margin-top: 2em;
}

.mypagination ul li a {
    border-radius: 50px !important;
    border: 1px solid #519AE4;
    background-color: transparent;
}

.mypagination ul li {
    padding: 0.5em;
}

.mypagination ul li a:hover {
    background-color: #519AE4;
    color: #fff;
    transition: 0.5s;
}

.myitem {
    margin-top: 1.5em;
}

.contactush3 {
    color: #032F55;
    font-weight: bold;
    font-size: 42px;
    position: relative;
    line-height: 2em;
}

.contactush3:after {
    content: "";
    position: absolute;
    background-color: #032F55;
    top: 3.9em;
    right: 0em;
    width: 3em;
    height: 0.1em;
}

.mapcontact {
    text-align: center;
    margin-top: 5em;
}

.contactinput {
    direction: rtl !important;
    border-radius: 50px;
    width: 85%;
    background-color: #EDF2F6;
    font-size: 14px;
    color: #707070;
    position: relative;
}

.contacttextarea {
    border-radius: 20px;
    width: 85%;
    background-color: #EDF2F6;
    font-size: 14px;
    color: #707070;
    min-height: 8em !important;
    padding-right: 3em;
}

.contactform label {
    color: #707070;
    font-size: 14px;
    margin-bottom: 1em;
}

.contactform i {
    color: #707070;
}

.contactform button {
    width: 85%;
    border-radius: 50px;
    border: none;
    background-color: #032F55;
    color: #fff;
    padding: 0.5em 0;
    margin-top: 1em;
}

.contenttt p {
    color: #707070;
    font-size: 18px;
    line-height: 1.6;
    margin-top: 1em;
}

.contenttt span {
    color: #707070;
    font-size: 14px;
}

.contactform i {
    position: absolute;
    top: 4em;
    right: 1em;
}

.contactform .form-group {
    position: relative;
}

.contactform input {
    /* padding-right: 3em; */
    padding: 0.8em 3em 0.8em 0;
}

.contactuss {
    margin: 5em 0;
}

.contentt {
    /*margin-right: 4em;*/
}

.blogitems img {
    width: 100%;
}

.datatableform {
    text-align: center;
}

.datatableform .toggle-box {
    /* hides the little default checkbox square */
}

.datatableform label {
    cursor: pointer; /* makes it clear that the text is clickable */
}

.datatableform .toggle-box + label + .hidden-input {
    display: none; /* sets the default style to be that the input box is hidden while the box is unchecked/text is unclicked. This changes when the user clicks the text. */
}

.datatableform .toggle-box:checked + label + .hidden-input {
    display: block; /* shows the input box when the use clicks the text, which makes the box checked. */
}

.mapdivv {
    margin-top: 2em;
    position: relative;
}

.mapdivv {
    position: relative;
    width: 100%;
    overflow: hidden;
    min-width: 100%;
    max-width: 100%;
}

.mapdivv:after {
    width: 82%;
}

.allow {
    position: absolute;
    top: -122px;
    left: 191px;
}


.forgetinput {
    width: 40%;
    padding: 0.5em;
}

.form-group .myforminput.forgetinput {
    width: 40%;
}

.borderimg {
    height: 100%;
    animation: fadeInAnimation ease 4s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    right: 100%;
    transform: rotate(20deg);
    width: 0;
}

@keyframes fadeInAnimation {
    0% {

        right: 90%;
        transform: rotate(20deg);
        width: 10%;
    }

    100% {

        right: 0%;
        transform: rotate(0deg);
        width: 100%;
    }
}

.car {
    position: absolute;
    z-index: 10;
    -moz-animation: myfirst 3s linear alternate;
    -webkit-animation: myfirst 3s linear alternate;
}

@-moz-keyframes myfirst {
    0% {
        left: -100%;
    }
    100% {
        left: 100%;
    }
}

@-webkit-keyframes myfirst {
    0% {
        left: -100%;
    }
    100% {
        left: 100%;
    }
}

@-moz-keyframes tyre-rotate {
    from {
        -moz-transform: rotate(-360deg);
    }
    to {
        -moz-transform: rotate(0deg);
    }

}

@-webkit-keyframes tyre-rotate {
    from {
        -webkit-transform: rotate(-360deg);
    }
    to {
        -webkit-transform: rotate(0deg);
    }
}

form.active {
    animation: fadeInRight 1s ease-in-out;
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(300px);
    }
    to {
        opacity: 1;
    }
}

form.unactive {
    animation: fadeOutRight 1s ease-in-out;
}

@keyframes fadeOutRight {
    from {
        opacity: 1;

    }
    to {
        opacity: 0;
        transform: translateX(0);
    }
}

.topheader {
    display: flex;
    justify-content: space-between;
}

.homeiframe {
    background-color: rgba(3, 3, 3, 0.5);
    z-index: 999999999999999;
}

.myhomeiframe {
    width: 100%;
    height: 80vh;
}

.borderr {
    width: 165px;
    height: 165px
}

.circlecontent {
    animation: tyre-rotate 2s alternate linear;
    top: 7px;
    right: 7px
}

.srchdiv {
    text-align: center;
}

.main_elements {
    overflow: hidden;
}

.borderdiv {
    position: relative;
}

.borderimg {
    position: absolute;
    top: -1em;
    left: 0em;
    width: 84em;
}

.builddiv {
    text-align: center;
}

.gdrandiv {
    text-align: center;
}

.circlebuild {
    text-align: center;
}

.circlegdran {
    text-align: center;
}

.buildpic {
    display: inline-block;
}

/*.elryaddiv {*/
/*    margin-right: -43px;*/
/*}*/

.bodyimgdiv {
    position: relative;
}

.morebtndiv {
    display: flex;
}

.footerlogo {
    margin-right: -10px;
}

.myfinput {
    width: 89% !important;
}

.formf {
    display: flex;
}

.mapiframee {

    width: 88%;
}

.cntp {
    margin-top: 1em;
    color: #707070;
    font-size: 18px;
    line-height: 1.6;
}

.popupadiv {
    text-align: center;
}

.mydown {
    position: absolute;
    color: #529AE4;
    top: 10px;
    left: -85px;
    background-color: #EDF2F6;
    border-radius: 50px;

    padding: 0.5em;
}

.mysrch {
    position: absolute;
    color: #707070;
    top: 38px;
    right: 25px;
    background-color: #EDF2F6;
    border-radius: 50px;
    padding: 0.5em;
    cursor: pointer;
}

.formff {
    display: flex;
    justify-content: space-between;
}

.navigation .drop-down-menu > .active {

}

.btn.btn-secondary.dropdown-toggle:focus {
    text-decoration: none !important;
    box-shadow: none !important;
    border: none !important;
}

.btn-check:focus + .btn, .btn:focus {
    box-shadow: none !important;
}

.btn-secondary:focus {
    box-shadow: none !important;
}

.btn:focus {
    box-shadow: none !important;
}

.btn-check:focus + .btn-secondary, .btn-secondary:focus {
    box-shadow: none !important;
}

.btn-check:focus + .btn, .btn:focus {
    box-shadow: none !important;
}

.btn-secondary:focus {
    box-shadow: none !important;
}

.list .nav-link {
    /* transition: none !important; */
}

.list {
    /* transition: none !important; */
}

.joinusfside {
    min-height: 150vh;
}

/*edits*/
.dropdownul {
    margin-top: 1em;
}

.langdropp {
    /*margin-top: -100px;*/
    /*margin-bottom:-50px;*/
    margin-bottom: -100px;
}

.footerlogo {
    margin-top: -1em;
}

.joinusside .shapeth3 {
    display: none;
}

.myforminput {
    /*width: 130%;*/
}

.sdivv {
    margin-right: 62px;
}

.finput {
    padding: 0.7em 0;
    text-align: right;
}

.myforminput {
    padding: 0.7em 0;
    text-align: right;
}

.finputimg {
    top: 88px;
}

.sinputimg {
    position: absolute;
    top: 63px;
    right: 20px;
}

.eyeimg {
    position: absolute;
    top: 90px;
    left: 30px;
}

.eyeimgggg {
    position: absolute;
    top: 90px;
    left: 130px;
}

select.input-lg {
    padding: 1em 50px;

}

select + i.fa {
    float: left;
    margin-top: -30px;
    /* margin-right: 9px; */
    pointer-events: none;
    background-color: transparent;
    /* padding-right: 5px; */
    margin-left: 104px;
    cursor: pointer !important;
}

.flag {
    /* float: left; */
    margin-top: -31px;
    /* margin-right: 9px; */
    pointer-events: none;
    background-color: transparent;
    /* padding-right: 5px; */
    /* margin-left: 104px; */
    cursor: pointer !important;
    margin-right: 15px;
    display: block;
    /* filter: sepia(100%) hue-rotate(190deg) saturate(500%); */
}

.sinputimg {
    position: absolute;
    top: 63px;
    right: 18em;
}

.notificationimg {
    /*margin-left: 1.5em;*/
    margin-left: -13.5em;
}

.notificationimgg {
    margin-left: 1.5em;

}

.notificationimggg {
    margin-left: 1.5em;

}

.dropdown-menu2 h5 {
    margin-right: -2em;
}

.dropdown-menu2 p {
    color: #9E9A9A;
    font-size: 10px;
    margin-left: 13px;
    /*margin-left: -4px;*/
}

.contacttextarea {
    padding: 0.8em 3em 0.8em 0;
}

.sinputimg {
    position: absolute;
    top: 59px;
    right: 1em;
}

.myinput {
    margin-top: 1em;
}

.avatar-edit {
    position: absolute;
    right: 128px;
    z-index: 1;
    top: 122px;
    background: #fff;
    border-radius: 50%;
    width: 2em;
    height: 2em;
    position: absolute;
    right: 69px;
    z-index: 1;
    top: 58px;
    background: #fff;
    border-radius: 50%;
    width: 2em;
    height: 2em;
}

.avatar-edit input + label {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    /* border-radius: 100%; */
    background: url(../images/Iconmaterial-camera-alt.svg);
    background-repeat: no-repeat;
    /* border: 1px solid transparent; */
    /* box-shadow: 0px 2px 4px 0px rgb(0 0 0 / 12%); */
    cursor: pointer;
    font-weight: normal;
    transition: all .2s ease-in-out;
    margin-top: 8px;
    /* margin-left: -6px; */
    margin-right: -18px;
}

.btn-primary {
    color: #707070;
    background: none;
    border: none;
}

.aboutpagediv {
    position: relative;
}

.aboutbigimg {
    position: relative;
    width: 100%;
    position: relative;
    width: 120%;
    transform: translate(19%, 10%);
}

.aboutbigimgg {
    position: relative;
    width: 100%;
    position: relative;
    width: 120%;
    transform: translate(0, 10%);
    margin: 1em 0;
}

.abouticonimg {
    position: absolute;
    transform: translate(76%, -181%);
}

.abouticonimgg {
    position: absolute;
    transform: translate(-676%, -197%);
}

.aboutpagep {
    position: absolute;
    color: #707070;
    line-height: 1.6em;
    font-size: 16px;
    transform: translate(-33%, -233%);
    width: 24.5em;

}

.aboutpagepp {
    position: absolute;
    color: #707070;
    line-height: 1.6em;
    font-size: 16px;
    transform: translate(-4%, -265%);

}

.aboutpage {
    margin: 7em 0;
}

.mycenter {
    text-align: center;
    margin-top: 3em;
}

.mycenter h2 {
    color: #529AE4;
    font-size: 80px;
}

.mycenter h3 {
    color: #032F55;
    font-size: 42px;
    font-weight: bold;
}

.policyff p {
    color: #707070;
    font-size: 14px;
    line-height: 1.6em;
}

.policycontent {
    margin-right: 3em;
}

.policycontent p {

}

.policyp {
    color: #707070;
    font-size: 16px;
    line-height: 1.6em;
}

.policyh3 {
    color: #052F52;
    font-size: 32px;
    line-height: 1.6em;
    font-weight: bold;
    margin-right: 0.5em;
    margin-bottom: 0.5em;
}

.policyspan {
    color: #959494;
    font-size: 14px;
    color: #959494;
    font-size: 14px;
    margin-right: 1em;
    margin-top: -1em;
    transform: translate(0px, 40%);
}

.fpolicy {
    margin-top: 5em;
}

.mycenterimg {
    width: 85%;
    margin-top: -3em;
}

.policyh2 {
    font-size: 42px;
}

.policyf {
    display: flex;
}

.policyf img {
    background: #EDF2F6;
    border-radius: 50px;
    /* padding: 1em; */
    object-fit: contain;
    /* width: 38px; */
    /* height: 50px; */
    padding: 1em;
}

.nspan {
    background: #EDF2F6;
    border-radius: 50px;
    /* padding: 1em; */
    object-fit: contain;
    /* width: 38px; */
    /* height: 50px; */
    padding: 1em;
    width: 48px;
    height: 48px;
    line-height: 0.5;
    color: #032F55;
    font-size: 20px;
    font-weight: bold;
}

.policyp {
    margin-top: 2em;
    margin-top: 3em;
    margin-bottom: 2em;
}

.policyhr {
    color: #E0ECF8;
    margin-top: 3em;
}

.policyspann {
    margin-right: 3em;
    margin-top: 1em;
    margin-bottom: 2em;
}

.ff {
    margin-top: 1.5em;
}

.policys {
    margin-right: 3em;
}

.policys i {
    color: #fff;
    background: #529AE4;
    border-radius: 50px;
    width: 20px;
    height: 20px;
    padding: 0.1em;
}

.policyf p {
    margin-right: 1em;
}

.policys .formfff {
    margin-right: 2.5em;
}

.formffff {
    margin: 1em 0;
}

.thpolicy {
    margin-bottom: 4em;
}

.policyfffff {
    margin: 1em 0;
}

.myspolicy {
    margin-top: 3em;
}

.sinputimg {
    position: absolute;
    top: 5.7em;
    right: 1em;
}

.sinputimgg {
    position: absolute;
    top: 92px;
    right: 14em;
}

.sinputiimgg {
    position: absolute;
    top: 90px;
    right: 1.3em;
}

.currenttaskspann {
    color: #032F55;
    font-size: 14px;
    font-weight: bold;
}

.currenttaskspannn {
    color: #979595;
    font-size: 14px;
    padding:0 4px;
}

.currenttaski {
    padding: 0.5em;
    color: #032F55;
    background-color: #D9E6F1;
    border-radius: 50px;
    width: 30px;
    height: 30px;
}

.tasksdivv {
    background-color: #EDF2F6;
    border-radius: 20px;
    padding: 3em;
    margin-top: 3em;
}

.mymtasks {
    margin-bottom: 1em;
}

.mymtaskss {
    margin: 1.5em 0;
}

.myycenter {
    text-align: center;
    margin-top: 3em;
}

/* .sama99:after {
    content: "";
    position: absolute;
    bottom: -1132px;

    right: 328px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: bottom;
    box-shadow: 16px -25px 0 #032f55;
    transform: rotate(97deg);
} */

table.dataTable tbody td {
    padding: 25px 10px;
}

.stepcenter {
    text-align: center;
    margin-top: 5em;
}

.stepcenter i {
    color: #707070;
    font-size: 13px;
}

.stepcenter span {
    color: #707070;
    font-size: 14px;
}

.stepcenter a {
    color: #529AE4;
}

.stepf {
    display: flex;
    justify-content: space-between;
}

.steph6 {
    color: #979595;
    margin-top: 3em;
    margin-bottom: 2em;
}

.fimg {
    border: 1px solid #D1E3F2;
    padding: 2em;
    border-radius: 1em;
}

.simg {
    border: 1px solid #032F55;
    padding: 2em;
    border-radius: 1em;
    background-color: #fff;
    margin: 1em 0;
}

.stepform input {
    background-color: #EDF2F699;
    position: relative;
    color: #707070;
    font-size: 14px;
    border: 1px solid #D0E3F2;
    border: none;
    padding: 1.2em;
    padding-right: 2em;

}

.fstepinput {
    position: relative;
}

.fimginput {
    position: absolute;
    top: 1em;
    right: 0.7em;
}

.fspaninput {
    position: absolute;
    left: 1em;
    top: 0.5em;
    color: #707070;
    font-size: 14px;
}

.stepformdiv {
    border: 1px solid #D0E3F2;
    border-radius: 1em;
    direction: ltr;
}

.tatbyq {
    direction: ltr;
}

.stepform hr {
    color: #bdd1e0;
    width: 96%;
    margin: auto;
}

.simg img {
    width: 100%;
}

.fimg img {
    width: 100%;
}

.modalicons {
    direction: ltr;
}

.modalicons i {
    color: #c9c3c3;
}


.modalicons i:hover,
.modalicons i:hover ~ i {
    color: #4594E1;
}

.locationimg {
    animation: bounce-down 1.5s infinite;
}

.sama9:after {
    content: "";
    position: absolute;
    /*bottom: -1384px;*/
    /* left: 3px; */
    top: 120.7em;
    right: 329px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: bottom;
    box-shadow: 16px -25px 0 #032f55;
    transform: rotate(97deg);
    margin-top: 14em;
}

.mysendto {
    margin-right: 29em;
}

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

form.active {
    animation: fadeInRight 1s ease-in-out;
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(300px);
    }
    to {
        opacity: 1;
    }
}

form.unactive {
    animation: fadeOutRight 1s ease-in-out;
}

@keyframes fadeOutRight {
    from {
        opacity: 1;

    }
    to {
        opacity: 0;
        transform: translateX(0);
    }
}

/* width */
::-webkit-scrollbar {
    width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #EDF2F6;
    border-radius: 20px;
    /* padding: 80px; */

}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #082032;
    border-radius: 20px;

}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.navigation {
    position: relative !important;
    height: 70vh !important;
    width: 98% !important;
    overflow-x: hidden !important;
    transition: width 0.5s !important;
    margin-top: 1em !important;
    min-height: 1000px !important;
}

.navigation > .nav-tabs {
    display: block !important;
    /* transition: width 0.5s; */
    /*border-radius: 20px;*/
    /*box-shadow: inset 5px 5px 10px rgba(0, 0, 0, 0.1),*/
    /*inset 5px 5px 20px rgba(255, 255, 255, 0.1),*/
    /*inset -5px -5px 15px rgba(0, 0, 0, 0.2);*/
    /* height: 100%; */
    /*padding-bottom:10em ;*/
    /* margin-left: 1em; */
    /*background-color: #032F55;*/
    border-bottom: 0px solid #F8F8F9 !important;
}

.navigation .nav-tabs {
    border-bottom: 0px solid #F8F8F9 !important;
}

.navigation .nav-tabs .nav-link:focus, .navigation .nav-tabs .nav-link:hover {
    border: none !important;
}

.navigation .nav-tabs .nav-link, .navigation .nav-tabs .nav-link {
    border: none !important;

}

.navigation > ul {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    padding-right: 5px !important;
    padding-top: 40px !important;
    padding-left: 0rem !important;
    padding-right: 0rem !important;
}

.list {
    position: relative !important;
    list-style: none !important;
    width: 92% !important;
    border-radius: 0 50px 50px 0 !important;
    margin-right: 10% !important;
    /* -webkit-transition: all 9s ease;
    -moz-transition: all 95s ease;
    -o-transition: all 9s ease;
    transition: all 9s ease; */
}

.list .nav-link {
    /* -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease; */
    border-radius: 0 50px 50px 0 !important;
}

.list.dropdown::after {
    font-family: "Font Awesome 5 Free" !important;
    content: "\f107" !important;
    display: inline-block !important;
    padding-right: 3px !important;
    vertical-align: middle !important;
    font-weight: 900 !important;
    color: #F8F8F9 !important;
    position: absolute !important;
    top: 1.5em !important;
    left: 2em !important;
    /* transition: 0.5s; */
}

.list.dropdown.active::after {
    color: black !important;
    transform: rotateX(180deg) !important;
}

.list.active::before {
    opacity: 0 !important;
    transform: translate(-50%, -50%) !important;
    width: 95% !important;
    left: 50% !important;
}

.list.active > a::before {
    content: "" !important;
    position: absolute !important;
    top: -49px !important;
    left: 0 !important;
    width: 51px !important;
    height: 51px !important;
    border-radius: 50% !important;
    box-shadow: -15px 19px 0px #F8F8F9 !important;
}

.list.active > a::after {
    content: "" !important;
    position: absolute !important;
    bottom: -50px !important;
    left: 0 !important;
    width: 51px !important;
    height: 51px !important;
    border-radius: 50% !important;
    box-shadow: -17px -19px 0px #F8F8F9 !important;
}

.list > a {
    position: relative !important;
    display: flex !important;
    text-decoration: none !important;
    width: 100% !important;
    color: white !important;
    border-radius: 0 50px 50px 0 !important;
    transition: 0.001s !important;
}

.list.active > a {
    position: relative !important;
    display: flex !important;
    text-decoration: none !important;
    width: 100% !important;
    color: #032F55 !important;
    border: none !important;
    background: #F8F8F9 !important;
}

.navigation .drop-down-menu > .active {
    position: relative !important;
    display: flex !important;
    text-decoration: none !important;
    width: 90% !important;
    color: #032F55 !important;
    border: none !important;
    background: #F8F8F9 !important;
    border-radius: 0 50px 50px 0 !important;
}

.navigation .drop-down-menu > .active::before {
    content: "" !important;
    position: absolute !important;
    top: -49px !important;
    left: 0 !important;
    width: 51px !important;
    height: 51px !important;
    border-radius: 50% !important;
    box-shadow: -15px 19px 0px #F8F8F9 !important;
}

.navigation .drop-down-menu > .active::after {
    content: "" !important;
    position: absolute !important;
    bottom: -50px !important;
    left: 0 !important;
    width: 51px !important;
    height: 51px !important;
    border-radius: 50% !important;
    box-shadow: -17px -19px 0px #F8F8F9 !important;
}

.navigation .icon {
    margin-right: 40px !important;
    position: relative !important;
    display: block !important;
    height: 60px !important;
    line-height: 65px !important;
    text-align: center !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.navigation i {
    position: relative !important;
    font-size: 1.2em !important;
    z-index: 1 !important;
    /* font-weight: 500; */
    /* color: #032F55; */
}

.navigation .title {
    position: relative !important;
    display: block !important;
    padding-right: 20px !important;
    height: 60px !important;
    line-height: 60px !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    font-weight: bold !important;
}


.navigation .list.dropdown .drop-down-menu li {
    color: #ffffff;
    display: flex !important;
}

.navigation .list.dropdown.active .drop-down-menu {
    display: block !important;
    margin-top: 0.1em !important;
    padding-bottom: 2em !important;
    padding-top: 1.9em !important;
}

.navigation .nav-tabs .nav-link.active {
    background: #F8F8F9 !important;
    color: #032F55 !important;

}

/* .aboutsection ,.blogitems,.contactuss ,.notifications .tab-pane{
    min-height: 100vh;
} */


header.border {
    /* border-bottom: 4px solid #032F55!important; */
    box-shadow: 0px 32px 57px -18px rgba(39, 42, 87, 0.20);
    -webkit-box-shadow: 0px 32px 57px -18px rgba(39, 42, 87, 0.20);
    -moz-box-shadow: 0px 32px 57px -18px rgba(39, 42, 87, 0.20);
    padding: 0;
}

header.border .logo {
    width: 70px;
    height: 70px;
}

header {
    /* margin-top: 3em; */
    background: #F8F8F9;
    z-index: 111111111111111111111111111;
    /* height: 50px; */
    position: fixed;
    top: 3em;
    transition: top 0.2s ease-in-out;
    width: 100%;
    text-align: center;
    /* overflow: hidden; */
    z-index: 2;
}

header li {
    list-style: none;
    display: inline-block;
}

header a {
    color: #222;
    text-decoration: none;
    padding: 0 15px;
    text-transform: uppercase;
    /* letter-spacing: 1px; */
}

.nav-up {
    top: -140px;
}

.mysoverlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s;
    z-index: 50;
    border-radius: 15px 15px 0 0;


}

.overlayinfo {
    position: absolute;
    text-align: center;
    margin: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
    width: 100%;
    display: inline-block;
}

.blogitemm:hover .mysoverlay {
    opacity: 1;
    visibility: visible;
    z-index: 50;

}

.blogitem:hover .mysoverlay {
    opacity: 1;
    visibility: visible;
    z-index: 50;

}

.blogitemthird:hover .mysoverlay {
    opacity: 1;
    visibility: visible;
    z-index: 50;

}

.blogsection {
    margin-bottom: 3em;
}

.imghight {
    max-height: 18em;
}

.blogitemmm {
    margin-right: 0;
}

.myfd {
    display: flex;
    margin-right: 4em;
}

.dropdown-menuhome .dropdown-item {
    padding-left: 4em;
    padding-right: 1.2em;
}



.tableicon {
    position: absolute;
    transform: translate(0px, -20px);
}

.verfimg {
    margin-top: 4em;
}

.myselectw {
    width: 165%;
}

.display {
    border-radius: 20px;
}

.recoverpass {
    margin-right: 29em;
}

.display tbody td {
    padding: 25px 10px;
}

.mappinputt {
    top: 0px;
    left: 0px;
    width: 90%;
}

.display {
    width: 100%;
}

.sinputttimgg {
    right: 1em;
}

.centersidea {
    margin-left: 1.6em;
    display: block;
    text-align: center;
    margin-top: 50em;
}

#searchInput {
    margin-top: 7em;
    top: 60px !important;
    left: 0px !important;

    width: 100% !important;
}

.contactusphone {
    text-align: center;
    margin-bottom: 3em;
}

/*.......................................................*/

@media only screen and (max-width: 1699px) and (min-width: 1400px) {
    /* .finput {*/
    /*     width: 83%;*/
    /*}      */
    .sinputimgg {
        right: 15em;
    }

    .sama9:before {
        right: 371px;
    }

    .sama9:after {
        /*bottom: -1314px;*/
        right: 367px;
    }
}


@media only screen and (max-width: 1809px) and (min-width: 1700px) {
    /*.finput {*/
    /*    width: 72%;*/
    /*}*/
    .sinputimgg {
        right: 17em;
    }

    .sama9:before {
        right: 419px;
    }

    .sama9:after {
        /*bottom: -1229px;*/
        right: 414px;
    }
}

@media only screen and (max-width: 2040px) and (min-width: 1810px) {
    /*.finput {*/
    /*    width: 67%;*/
    /*}*/
    .sinputimgg {
        right: 18em;
    }

    .sama9:before {
        top: 229px;
        right: 447px;
    }

    .sama9:after {
        /*bottom: -1176px;*/
        right: 443px;
    }
}

@media only screen and (max-width: 2731px) and (min-width: 2041px) {
    .finput {
        /*width: 60%;*/
        width: 86.3%;

    }

    .sinputimgg {
        right: 20em;
    }

    .eyeimgggg {
        display: none;
    }

    .sama9:before {
        right: 504px;
    }

    .sama9:after {
        right: 499px;
        /*bottom: -1073px;*/
    }
}


@media only screen and (max-width: 4097px) and (min-width: 2732px) {
    .finput {
        width: 84.5%;


    }

    .eyeimgggg {
        display: none;
    }

    .sinputimgg {
        right: 26.5em;
    }

    .sama9:before {
        right: 42em;
    }

    .sama9:after {
        /*bottom: -47.5em;*/
        right: 41.9em;
    }
}


@media only screen and (max-width: 5464px) and (min-width: 4098px) {
    .finput {
        width: 82.5%;


    }

    .eyeimgggg {
        display: none;
    }

    .sinputimgg {
        right: 39.5em;
    }

    .sama9:before {
        right: 63.5em;
    }

    .sama9:after {
        /*bottom: -8.3em;*/
        right: 63.3em;
    }
}


@media only screen and (max-width: 5464px) and (min-width: 4099px) {
    .finput {
        width: 82.5%;


    }

    .eyeimgggg {
        display: none;
    }

    .sinputimgg {
        right: 52.5em;
    }

    .sama9:before {
        right: 84.5em;;
    }

    .sama9:after {
        /*bottom: 16.5em;*/
        top: 134.7em;
        right: 84.5em;
    }
}

@media only screen and (max-width: 991px) and (min-width: 768px) {
    .centersidea {
        margin-right: 3em;
    }

    .list {
        margin-right: 18% !important;
    }
}

@media only screen and (max-width: 800px) and (min-width: 768px) {

    .sama9:before {
        top: 135px;
        right: 183px;
    }

    .sama9:after {
        /*bottom: -1733px;*/
        right: 181px;
    }
}

@media only screen and (max-width: 850px) and (min-width: 801px) {
    .sama9:before {
        top: 135px;
        right: 192px;
    }

    .sama9:after {
        /*bottom: -1734px;*/
        right: 188px;
        top: 114.7em;
    }
}

@media only screen and (max-width: 900px) and (min-width: 851px) {
    .sama9:before {
        top: 135px;
        right: 207px;
    }

    .sama9:after {
        /*bottom: -1734px;*/
        right: 202px;
        top: 114.7em;
    }
}

@media only screen and (max-width: 950px) and (min-width: 901px) {
    .sama9:before {
        top: 136px;
        right: 217px;
    }

    .sama9:after {
        /*bottom: -1734px;*/
        right: 213px;
        top: 114.7em;
    }
}

@media only screen and (max-width: 1000px) and (min-width: 951px) {
    .sama9:before {
        top: 135px;
        right: 230px;
    }

    .sama9:after {
        /*bottom: -1735px;*/
        right: 226px;
        top: 114.7em;
    }
}

@media only screen and (max-width: 1023px) and (min-width: 1001px) {
    .sama9:before {
        top: 136px;
        right: 242px;
    }

    .sama9:after {
        /* bottom: -1735px; */
        right: 238px;
        top: 114.7em;
    }
}

@media only screen and (max-width: 1050px) and (min-width: 1024px) {
    .sama9:before {
        top: 224px;
        right: 248px;
    }

    .sama9:after {
        /*bottom: -1735px;*/
        right: 244px;
        top: 120.3em;
    }
}

@media only screen and (max-width: 1100px) and (min-width: 1051px) {
    .sama9:before {
        top: 223px;
        right: 256px;
    }

    .sama9:after {
        /*bottom: -1735px;*/
        right: 252px;
        top: 120.2em;
    }
}

@media only screen and (max-width: 1150px) and (min-width: 1101px) {
    .sama9:before {
        top: 224px;
        right: 267px;
    }

    .sama9:after {
        /*bottom: -1736px;*/
        right: 264px;
        top: 120.2em;
    }
}

@media only screen and (max-width: 1200px) and (min-width: 1151px) {
    .sama9:before {
        top: 224px;
        right: 283px;
    }

    .sama9:after {
        /*bottom: -1736px;*/
        right: 277px;
        top: 120.2em;
    }
}

@media only screen and (max-width: 1250px) and (min-width: 1201px) {
    .sama9:before {
        top: 224px;
        right: 293px;
    }

    .sama9:after {
        /*bottom: -1736px;*/
        right: 290px;
        top: 120.2em;
    }
}

@media only screen and (max-width: 1300px) and (min-width: 1251px) {
    .sama9:before {
        top: 224px;
        right: 305px;
    }

    .sama9:after {
        /*bottom: -1736px;*/
        right: 302px;
        top: 120.2em;
    }
}

@media only screen and (max-width: 1350px) and (min-width: 1301px) {
    .sama9:before {
        top: 229px;
        right: 319px;
    }

    .sama9:after {
        /*bottom: -1515px;*/
        right: 315px;
    }
}

@media only screen and (max-width: 1365px) and (min-width: 1351px) {
    .sama9:before {
        /*top: 229px;*/
        /*    right: 319px;*/
    }

    .sama9:after {
        /*bottom: -1391px;*/
        /*right: 315px;*/
    }
}

@media only screen and (min-width: 768px) and (max-width: 800px) {
    .sama9:after {
        top: 114.7em;
        right: 182px;
    }
}

@media only screen and (min-width: 300px) and (max-width: 360px) {
    .aboutfhh:after {
        top: 45px;
    }

    .sideinsspan {
        color: #B8D3E9;
        font-weight: bold;
        margin-right: 14px;
    }

    .sideinsh3 {
        margin-right: 14px;
    }
}

@media only screen and (max-width: 1023px) and (min-width: 300px) {
    .footerlogo {
        margin: 0;
    }

    .homecontent {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(0%, -50%); /*nos lel4mal w nos lefo2*/
        text-align: right;
        /* height: 80vh; */
    }
}

.orderh4 {
    font-size: 32px;
    font-weight: bold;
    color: #032F55;
}

.sabqah2 {
    font-size: 32px;
    font-weight: bold;
    color: #032F55;
}

@media only screen and (min-width: 767px) and (max-width: 1023px) {
    .homeh {
        text-align: right;
        /* margin: 4em 0 1em 0; */
    }
}

@media only screen and (max-width: 400px) and (min-width: 300px) {
    .sama9:before {
        /*display: none;*/
        top: 135px;
        right: 84px;
    }

    .sama9:after {
        /*display: none;*/
        top: 114.7em;
        right: 79px;
    }
}

@media only screen and (max-width: 767px) and (min-width: 300px) {
    .list {
        margin: 10px !important;
    }

    .centersidea {
        margin-right: 20px;
    }

    .previousservices {
        margin-top: 2em;
        margin-right: 1em;
    }

    .serviceorder {
        margin-top: 2em;
        margin-right: 1em;
    }

    .list {
        /*margin: -2px!important;*/
        margin: 9px !important;
    }

    .manageprofile {
        margin-right: 1em;
        /*margin-top: 2em;*/
    }

    .navigation i {
        margin-right: 1em;
    }

    .avatar-edit {
        right: 50px;
        top: 50px;
    }

    .avatar-upload {
        right: 0.5em;
    }

    .avatar-preview > div {
        width: 80%;
        height: 80%;
    }

    #myTabContent {
        margin-right: 1em;
        padding-top: 1em !important;
    }

    .sideinsh3 {
        color: #fff;
        font-weight: bold;
        margin-top: 2em;
        font-size: 12px;
    }

    .sideinsspan {
        color: #B8D3E9;
        font-weight: bold;
        font-size: 9px;
    }

    .list.dropdown::after {
        display: none !important;
    }

    .navigation {
        margin-right: 15px;
    }

    .navigationinsar {
        margin-right: 15px;
    }


    .orderh4 {
        font-size: 25px;
    }

    .sidebarh3 {
        font-size: 10px;
        margin-right: 1em;
    }

    .sidebarspan {
        font-size: 9px;
        margin-right: 1em;
    }

    .centersidea {
        /*margin-left: 3em;*/
    }

    .inputdiv {
        margin-right: -0.5em;
    }

    .footerful1 {
        margin-right: -0.5em !important;
    }

    .footerful li a {
        margin-right: -0.5em;
    }

    .footerlogo {
        margin: 0;
    }

    .mapdiv {
        width: 100%;
        transform: translate(0, 0);
    }

    .homeh {
        text-align: right;
        font-size: 18px;
    }

    .eyeimg {
        left: 80px;
    }

    .eyeimgggg {
        left: 60px;
    }

    .contactusphone {
        text-align: right;
        margin-bottom: -1.5em;
    }

    .circlecontent {
        left: -105px;
    }

    .center .mincircle {
        bottom: -6px;
        right: 40px;
    }

    .wcircle {
        margin-top: -6.5em;
        margin-right: 1em;
    }

    .back {
        margin-bottom: 3.5em;
    }

}

@media only screen and (max-width: 1300px) and (min-width: 300px) {
    .eyeimg {
        left: 80px;
        /*display: none;*/
    }

    .eyeimgggg {
        left: 60px;
    }

    .eyeimgggg {
        left: 80px;
    }
}

@media only screen and (min-width: 900px) {
    .dropdown:hover .dropdown-menu {
        display: block;
    }

}

.dropdown-menuhome li {
    width: 100%;
}

.dropdown-menuhome {
    min-width: 100% !important;
}

.containerr {
    position: relative;
    margin-top: 8em;
}

.containers {
    margin-top: 9em;
}

.policyyyh2 {
    font-size: 62px;
}


@media only screen and (max-width: 1023px) and (min-width: 300px) {
    .homecontent {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(0%, -50%); /*nos lel4mal w nos lefo2*/
        /*text-align: left;*/
        /* height: 80vh; */
    }

    .infodiv {
        margin-top: 3.5em !important;
    }

}


.stepar1 {
    position: absolute;
    line-height: 2.5;
    border-radius: 50px;
    border: 1px solid #032F55;
    background-color: #032F55;
    color: #fff;
    width: 40px;
    height: 40px;
    transform: translate(-47px, -23px);
}

.stepar2 {
    position: absolute;
    line-height: 2.5;
    border-radius: 50px;
    border: 1px solid #032F55;
    color: #032F55;
    width: 40px;
    height: 40px;
    transform: translate(23px, -24px);
}

.stepar3 {
    position: absolute;
    line-height: 2.5;
    border-radius: 50px;
    border: 1px solid #032F55;
    color: #032F55;
    width: 40px;
    height: 40px;
    transform: translate(93px, -25px);
}

.mypluss {
    margin-top: 0.5em;
    margin-left: 1em;
    font-size: 20px;
    color: #032F55;
}


.dropdown-item:focus, .dropdown-item:hover {
    background-color: transparent !important;
    color: #0a58ca;;
}


.form-control:focus {
    /*border-color: transparent !important;*/
    box-shadow: none !important;
}


@media only screen and (max-width: 400px) and (min-width: 300px) {
    .forgetimggg {
        right: 4em;
    }
}

@media only screen and (max-width: 450px) and (min-width: 401px) {
    .forgetimggg {
        right: 5em;
    }

    .sama9:before {
        top: 135px;
        right: 94px;
    }

    .sama9:after {
        top: 114.7em;
        right: 89px;
    }


}

@media only screen and (max-width: 500px) and (min-width: 451px) {
    .avatar-edit {
        right: 65px;
        top: 50px;
    }

    .avatar-preview {
        right: 35px !important;
    }

    .sama9:before {
        top: 135px;
        right: 106px;
    }

    .sama9:after {
        top: 114.7em;
        right: 102px;
    }


}

@media only screen and (max-width: 550px) and (min-width: 501px) {
    .avatar-edit {
        right: 75px;
        top: 50px;
    }

    .navigation i {
        margin-right: 2.5em;
    }

    .avatar-preview {
        right: 35px !important;
    }

    .sama9:before {
        top: 135px;
        right: 119px;
    }

    .sama9:after {
        top: 114.7em;
        right: 114px;
    }


}

@media only screen and (max-width: 600px) and (min-width: 551px) {
    .avatar-edit {
        right: 85px;
        top: 50px;
    }

    .avatar-preview {
        right: 45px !important;
    }

    .sama9:before {
        top: 135px;
        right: 132px;
    }

    .sama9:after {
        top: 114.7em;
        right: 127px;
    }


}

@media only screen and (max-width: 650px) and (min-width: 601px) {
    .avatar-edit {
        right: 85px;
        top: 50px;
    }

    .avatar-preview {
        right: 55px !important;
    }

    .sama9:before {
        top: 135px;
        right: 144px;
    }

    .sama9:after {
        top: 114.7em;
        right: 139px;
    }


}

@media only screen and (max-width: 700px) and (min-width: 651px) {
    .avatar-upload {
        right: 0em;
    }

    .avatar-edit {
        right: 95px;
        top: 50px;
    }

    .avatar-preview {
        right: 65px !important;
    }

    .sama9:before {
        top: 135px;
        right: 157px;
    }

    .sama9:after {
        top: 114.7em;
        right: 152px;
    }


}

@media only screen and (max-width: 740px) and (min-width: 701px) {
    .avatar-edit {
        right: 105px;
        top: 50px;
    }

    .avatar-preview {
        right: 64px !important;
    }

    .sama9:before {
        top: 135px;
        right: 169px;
    }

    .sama9:after {
        top: 114.7em;
        right: 164px;
    }


}

@media only screen and (max-width: 767px) and (min-width: 741px) {
    .avatar-edit {
        right: 110px;
        top: 50px;
    }

    .avatar-preview {
        right: 65px !important;
    }

    .sama9:before {
        top: 135px;
        right: 179px;
    }

    .sama9:after {
        top: 114.7em;
        right: 174px;
    }


}

@media only screen and (max-width: 600px) and (min-width: 501px) {
    .forgetimggg {
        right: 6em;
    }
}

@media only screen and (max-width: 767px) and (min-width: 601px) {
    .forgetimggg {
        right: 7em;
    }
}


@media only screen and (max-width: 800px) and (min-width: 768px) {
    .avatar-edit {
        right: 100px;
        top: 50px;
    }

    .forgetimggg {
        right: 4em;
    }
}

@media only screen and (max-width: 991px) and (min-width: 801px) {
    .avatar-edit {
        right: 100px;
        top: 50px;
    }
}

@media only screen and (max-width: 4400px) and (min-width: 992px) {
    .avatar-edit {
        right: 100px;
        top: 60px;
    }
}

@media only screen and (max-width: 1200px) and (min-width: 801px) {

    .forgetimggg {
        right: 5em;
    }

    .forgetinputtt {
        width: 75% !important;
    }
}

@media only screen and (max-width: 1360px) and (min-width: 1201px) {
    .forgetimggg {
        right: 6em;

    }

    .forgetinputtt {
        width: 75% !important;
    }
}


@media (max-width: 991.98px) {
    .content {
        margin-top: 4em !important;
    }

    .previousservices {
        margin-top: 1em;
        margin-right: 1em;
    }

    .serviceorder {
        margin-top: 1em;
        margin-right: 1em;
    }

    .list {
        /*margin: -2px!important;*/
    }

    .manageprofile {
        margin-right: 1em;
        /*margin-top: 2em;*/
    }

    .navigation i {
        margin-right: 1em;
    }

    .avatar-upload {
        right: 0.5em;
    }

    .avatar-preview > div {
        width: 80%;
        height: 80%;
    }

    /*#myTabContent{*/
    /*    margin-right: 1em;*/
    /*padding-top: 1em !important;*/
    /*}*/
    .sideinsh3 {
        color: #fff;
        font-weight: bold;
        margin-top: 2em;
        font-size: 12px;
    }

    .sideinsspan {
        color: #B8D3E9;
        font-weight: bold;
        font-size: 9px;
    }

    .list.dropdown::after {
        display: none !important;
    }

    .navigation {
        margin-right: 6px;
    }

    .navigationinsar {
        margin-right: 4px;
    }


    .orderh4 {
        font-size: 25px;
    }

    .sidebarh3 {
        font-size: 10px;
        margin-right: 1em;
    }

    .sidebarspan {
        font-size: 9px;
        margin-right: 1em;
    }

    .centersidea {
        /*margin-left: 3em;*/
    }

    .inputdiv {
        margin-right: -0.5em;
    }

    .footerful1 {
        margin-right: -0.5em !important;
    }

    .footerful li a {
        margin-right: -0.5em;
    }

    .footerlogo {
        margin: 0;
    }

    .mapdiv {
        width: 100%;
        transform: translate(0, 0);
    }

    .homeh {
        text-align: right;
        font-size: 18px;
    }

    .eyeimg {
        left: 80px;
    }

    .eyeimgggg {
        left: 60px;
    }

    .contactusphone {
        text-align: right;
        margin-bottom: -1.5em;
    }

    .circlecontent {
        left: 8px;
    }

    .center .mincircle {
        bottom: -6px;
        right: 40px;
    }

    .wcircle {
        margin-top: -6.5em;
        margin-right: 1em;
    }

    .back {
        margin-bottom: 3.5em;
    }


    .new_user .modal-header {
        padding: 0.5em;
    }

    .list_menu.open.navbar-collapse .nav-link {
        color: #fff !important;
    }

    .btns {
        align-items: baseline;
        /*display:block;*/
        flex-direction: column-reverse;
    }

    .loginbtn {
        display: block;
        color: #fff !important;
        background: #032F55 !important;
        margin-right: 0 !important;
        margin-bottom: 2em;
    }

    .servicebtn {
        display: block;
    }

    .nav-item {
        transform: translateX(200px);
        opacity: 0;
        transition: 0.1s;
        animation: animate_links 1.1s ease-in-out forwards;
    }

    .btns {
        transform: translateX(200px);
        opacity: 0;
        transition: 0.1s;
        animation: animate_links 1.1s ease-in-out forwards;
    }

    .nav-itemmain {
        animation-delay: 0.1s !important;
    }

    .nav-itemdrop {
        animation-delay: 0.1s !important;
    }

    .list_menu .nav-itemdropp {
        animation-delay: 0.2s !important;
    }

    .list_menu .nav-item4 {
        animation-delay: 0.2s !important;
    }

    .list_menu .nav-item5 {
        animation-delay: 0.3s !important;
    }

    .list_menu .nav-item6 {
        animation-delay: 0.3s !important;
    }

    .list_menu .nav-item7 {
        animation-delay: 0.4s !important;
    }

    .list_menu .nav-item8 {
        animation-delay: 0.4s !important;
    }

    .list_menu .loginbtn {
        animation-delay: 0.5s !important;
    }

    .list_menu .servicebtn {
        animation-delay: 0.5s !important;
    }

    .navbar .list_menu.open {
        transform: translateY(0%);
        opacity: 1;
    }


}

@keyframes animate_links {
    0% {
        transform: translateX(200px);
        opacity: 0;
    }
    100% {
        transform: translateX(0px);
        opacity: 1;
    }
}

.footerlogodiv {
    background: #fff;
    width: 6.5em;
}

.ourprojects {
    font-size: 62px;
    font-weight: bold;
    color: #fff;
}

.contactusp {
    margin-top: 1em;
    color: #707070;
    font-size: 18px;
    line-height: 1.6;
}


#searchInput {
    margin-top: 7em;
    top: 60px !important;
    left: 0px !important;
    width: 90% !important;
}


.finputdivres {
    width: 90%;
    margin-top: 2em;
    margin-bottom: -5em;
}

.srchiconn {
    display: none;
}

.myowl .owl-dots {
    direction: rtl;
}


.myfowl .owl-item.active .homeh {
    animation: fadeInLeftBig ease 1.3s !important;
}

.myfowl .owl-item.active p {
    animation: fadeInLeftBig ease 1.5s !important;
}

.myfowl .owl-item.active .homespandiv {
    animation: fadeInLeftBig ease 1s !important;
}


.myfowl .owl-item.active .homebtndiv {
    animation: fadeInLeftBig ease 1.7s !important;
}

.sidebarwhite {
    padding: 3em;
}

.sideinsh3 {
    color: #fff;
    font-weight: bold;
    margin-top: 2em;
}

.sideinsspan {
    color: #B8D3E9;
    font-weight: bold;
}


.new_user .modal {
    padding-right: 0 !important;
}

.btn-close {
    /*color:#fff !important;*/
    /*background:#032F55 !important;*/
    border-radius: 50px !important;
    opacity: 1 !important;
    /*opacity: 1 !important;*/
    filter: brightness(0) invert(1) !important;
}


.new_user .modal-header {
    /*padding: 0.5em;*/
    /* height: 10%; */
    border-radius: 50px;
    background: #032F55;
    border-bottom: none !important;
    width: 10%;
    /* padding: 0em !important; */
    /* padding-left: 1em; */
    padding-right: 0em;
}


.new_user .modal-body {
    padding: 1rem 0 !important;
}

.blogcontent1 {
    text-align: justify;
}

.blogcontent1 .myfifthh {
    font-size: 16px;
}


@media only screen and (max-width: 600px) and (min-width: 550px) {
    .navigation i {
        margin-right: 0em;
    }

    .navigation .title {
        font-size: 8px !important;
        display: block !important;
    }
}


@media only screen and (max-width: 550px) and (min-width: 501px) {
    .navigation i {
        margin-right: 2.5em;
    }
}


@media only screen and (max-width: 767px) and (min-width: 600px) {
    .wcircle {
        margin-top: 0.5em;
        margin-right: 8em;
    }
}

@media only screen and (max-width: 599px) and (min-width: 550px) {
    .wcircle {
        margin-top: -0.5em;
        margin-right: 7em;
    }
}

@media only screen and (max-width: 549px) and (min-width: 500px) {
    .wcircle {
        margin-top: -2.5em;
        margin-right: 5em;
    }
}

@media only screen and (max-width: 499px) and (min-width: 450px) {
    .wcircle {
        margin-top: -4.5em;
        margin-right: 3em;
    }
}

@media only screen and (max-width: 449px) and (min-width: 400px) {
    .wcircle {
        margin-top: -6.5em;
        margin-right: 1.5em;
    }
}


@media only screen and (max-width: 991px) and (min-width: 768px) {
    .myowl .owl-dots {
        transform: translate(0px, 57px);
    }

    .homecontent {
        transform: translate(-0%, -54%);
    }

    .homeh:after {
        right: 0;
        top: 53px;
    }

    .homeh {
        font-size: 25px;
    }

    .homep {
        margin-top: 1em;
    }
}


@media only screen and (max-width: 991px) and (min-width: 450px) {
    .new_user .modal-header {
        padding: 1em;
        /* padding-left: 1em; */
        padding-right: 0em;
    }
}


@media only screen and (max-width: 1199px) and (min-width: 400px) {
    .center .mincircle {
        bottom: 30px;
        right: 27px;
    }
}

.myinput {
    direction: rtl !important;
}

.content {
    margin-top: 7.8em;
}

.joinusside {
    margin: -80px 0;
}

.shape2 {
    display: none;
}

.shape3 {
    display: none;
}