body {
    direction: rtl;
    color: #274a8a;
    background-color: #b0ddf4;

}
.section {
    position: relative;
    background-color: #b0ddf4;
    position: relative;
    min-height: 500px;
}
svg.ballon {
    position: fixed;
    top: 30%;
    left: 10%;
    z-index: 9999;
    /* animation: rotate 1s linear infinite;
    animation-delay: calc(var(--scroll) * -2s);
    animation-fill-mode: both; */
    transition: 2s;
    width: 100px;
    height: 100px;
}
@media screen and (max-width: 768px) {
    .content-sec1 {
        width: 60%;
    }
    header {
        font-size: 2em !important;
    }
}

.active svg.svg-2 {
    position: sticky;
    right: 30%;
    top: 30%;
}

.active svg.svg-3 {
    position: sticky;
    right: 50%;
    top: 30%;
}

.active svg {
    animation: rotate 1s linear infinite;
    animation-delay: calc(var(--scroll) * -2s);
    animation-fill-mode: both;
}

@keyframes rotate {
    0% {
        transform: translateX(0);
        opacity: 1;
    }

    50% {
        transform: translateX(5px);
        opacity: 1;
    }

    100% {
        transform: translateX(0);
        opacity: 1;
    }
}
h1 {
    margin: 0 0 25px;
    text-align: center;
    color: #e6332a;
}

.sub {
    margin: 0 0 20px;
    color: #e6332a;
}

.img-parent {
    max-width: 600px;
    margin: 20px auto;
}

.main-img {
    width: 100%;
}

header {
    font-size: 3em;
    font-weight: bold;
    padding: 0 20px 20px 0;
}

@media screen and (min-width:768px) {
    .title-parent {
        height: 300px;
    }
    svg.ballon {
        width: 150px;
        height: 150px;
    }
}

.title {
    font-size: 1.5em;
    font-weight: bold;
    background-image: url(cloud.svg);
    background-size: cover;
    width: 200px;
    align-items: center;
    height: 200px;
    display: flex;
    justify-content: center;
    z-index: 101;
}

.cloud_1 {
    height: calc(128px * 0.37);
    position: relative;
}

@media screen and (min-width: 588px) {
    .cloud_1 {
        height: calc(128px * 0.53);
    }
}
@media screen and (min-width: 768px) {
    .cloud_1 {
        height: calc(128px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_1 {
        height: 128px;
    }
}
.cloud_1::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_1.svg);
    width: 45%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -18%;
    left: 12%;
}
.sanjesh {
    position: absolute;
    top: 25%;
    right: 57%;
    z-index: 100;
    font-size: 8px;
}
.sanjesh span {
    display: block;
    font-size: 3em;
    font-weight: bold;
}

.cloud_2 {
    height: calc(132px * 0.37);
    position: relative;
    overflow: hidden;
}

@media screen and (min-width: 588px) {
    .cloud_2 {
        height: calc(132px * 0.53);
    }
}
@media screen and (min-width: 768px) {
    .cloud_2 {
        height: calc(132px * 0.67);
    }
    .sanjesh {
        font-size: 12px;
    }
}
@media screen and (min-width: 991px) {
    .cloud_2 {
        height: 132px;
    }
}
@media screen and (min-width: 1200px) {
    .sanjesh {
        font-size: unset;
        top: 40%;
    }
}

.cloud_2::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_2.svg);
    width: 45%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -23%;
    left: -5%;
}

.main_title {
    text-align: center;
    z-index: 10;
    display: flex;
}

@media screen and (min-width: 768px) {
    .main_title {
    justify-content: center;
}
}
.cloud_3 {
    height: calc(167px * 0.37);
    position: relative;
    display: flex;
    align-items: center;
}

@media screen and (min-width: 768px) {
    .cloud_3 {
        height: calc(167px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_3 {
        height: 167px;
    }
}
.cloud_3::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_3.svg);
    width: 72%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: right;
    top: -35%;
}

.cloud_3 svg.logo {
    position: absolute;
    right: 25%;
    top: 5%;
    width: 30%;
    z-index: 1;
}

@media (min-width:500px) and (max-width:588px) {
    .cloud_3 svg.logo {
        right: 23%;
    }
}

@media screen and (min-width:588px) {
    .cloud_3 svg.logo {
        right: 13%;
    }
}

@media screen and (min-width:768px) {
    .cloud_3 svg.logo {
        right: 25%;
    }
}

@media screen and (min-width:1200px) {
    .cloud_3 svg.logo {
        right: 13%;
    }
}


.cloud_4 {
    height: calc(95px * 0.37);
    position: relative;
}

@media screen and (min-width: 768px) {
    .cloud_4 {
        height: calc(95px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_4 {
        height: 95px;
    }
}
.cloud_4::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_4.svg);
    width: 31.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -35%;
    left: 25%;
}

.cloud_5 {
    height: calc(56px * 0.37);
    position: relative;
}

@media screen and (min-width: 768px) {
    .cloud_5 {
        height: calc(56px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_5 {
        height: 56px;
    }
}

.cloud_5::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_5.svg);
    width: 15.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -90%;
    left: 25%;
}

.cloud_6 {
    height: calc(105px * 0.37);
    position: relative;
}

@media screen and (min-width: 768px) {
    .cloud_6 {
        height: calc(105px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_6 {
        height: 105px;
    }
}

.cloud_6::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_6.svg);
    width: 30.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -75%;
    left: 5%;
}

.sanjesh_1 {
    height: calc(297px * 0.37);
    position: relative;
}

@media screen and (min-width: 768px) {
    .sanjesh_1 {
        height: calc(297px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .sanjesh_1 {
        height: 297px;
    }
}

.sanjesh_1::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/sanjesh_1.svg);
    width: 69.2%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    left: 44%;
    top: -45%;
    z-index: 1;
}

.cloud_7 {
    height: calc(304px * 0.37);
    position: relative;
}

@media screen and (min-width: 768px) {
    .cloud_7 {
        height: calc(304px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_7 {
        height: 304px;
    }
}

.cloud_7::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_7a.svg);
    width: 99%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 4%;
    right: 40%;
    z-index: 2;
}

.cloud_7::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_7b.svg);
    width: 99.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -9%;
    left: -50%;
    z-index: -1;
}

.cloud_8 {
    height: calc(287px * 0.37);
    position: relative;
}

@media screen and (min-width: 768px) {
    .cloud_8 {
        height: calc(287px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_8 {
        height: 287px;
    }
}

.cloud_8::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_8.svg);
    width: 99.3%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 0;
    right: -15%;
    z-index: -1;
}

.cloud_9 {
    height: calc(302px * 0.37);
    position: relative;
}

@media screen and (min-width: 768px) {
    .cloud_9 {
        height: calc(302px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_9 {
        height: 302px;
    }
}

.cloud_9::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_9.svg);
    width: 51.3%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -46%;
    left: 27%;
    z-index: 1;
}

.cloud_10a {
    height: calc(150px * 0.37);
    position: relative;
}

@media screen and (min-width: 768px) {
    .cloud_10a {
        height: calc(150px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_10a {
        height: 150px;
    }
}

.cloud_10a::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_10.svg);
    width: 67%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -294%;
    left: 10%;
}

.cloud_10b {
    height: calc(150px * 0.37);
    position: relative;
}

@media screen and (min-width: 768px) {
    .cloud_10b {
        height: calc(150px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_10b {
        height: 150px;
    }
}

.cloud_10b::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_10.svg);
    width: 67%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -335%;
    right: 12%;
}

.cloud_10 {
    height: calc(150px * 0.37);
    position: relative;
}

@media screen and (min-width: 768px) {
    .cloud_10 {
        height: calc(150px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_10 {
        height: 150px;
    }
}

.cloud_10::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_10.svg);
    width: 67%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 84%;
    right: -23%;
    z-index: 2;
}

.cloud_10::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_10.svg);
    width: 67%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 50%;
    left: 10%;
}

.cloud_11 {
    height: calc(260px * 0.37);
    position: relative;
}

@media screen and (min-width: 768px) {
    .cloud_11 {
        height: calc(260px * 0.67);
    }
}
@media screen and (min-width: 991px) {
    .cloud_11 {
        height: 260px;
    }
}

.cloud_11::before {
    content: "آزمون های گارنت";
    background-image: url(../../img/landings/garnet-path/cloud_11.svg);
    width: 94.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -40%;
    right: 0%;
    text-align: center;
    padding: 19% 0;
}

.cloud_12a, .cloud_12b, .cloud_12c {
    height: 100px;
    position: relative;
}

.cloud_12a::before, .cloud_12b::before, .cloud_12c::before {
    content: "هوش";
    background-image: url(../../img/landings/garnet-path/cloud_12a.svg);
    width: 80%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 0;
    line-height: 2.5;
    text-align: center;
    z-index: 1;
}

.cloud_12b::before {
    content: "علایق";
    background-image: url(../../img/landings/garnet-path/cloud_12b.svg);
    top: -30%;
}

.cloud_12c::before {
    content: "رفتار";
    background-image: url(../../img/landings/garnet-path/cloud_12c.svg);
}

@media screen and (min-width: 500px) {
    .cloud_12a::before, .cloud_12b::before, .cloud_12c::before {
        line-height: 3;
    }
}

@media screen and (min-width: 576px) {
    .cloud_12a::before, .cloud_12b::before, .cloud_12c::before {
        line-height: 4;
    }
}

@media screen and (min-width: 768px) {
    .cloud_12a::before, .cloud_12b::before, .cloud_12c::before {
        line-height: 5;
    }
}

@media screen and (min-width: 991px) {
    .cloud_12a {
        height: 57px;
    }
    .cloud_12a::before {
        content: "هوش";
        background-image: url(../../img/landings/garnet-path/cloud_12a.svg);
        width: 30.5%;
        height: 100%;
        position: absolute;
        background-repeat: no-repeat;
        background-size: contain;
        top: 0;
        left: -8%;
        line-height: 2;
        text-align: center;
        z-index: 1;
    }
    .cloud_12b {
        height: 90px;
    }
    .cloud_12b::before {
        content: "علایق";
        background-image: url(../../img/landings/garnet-path/cloud_12b.svg);
        width: 49.6%;
        height: 100%;
        position: absolute;
        background-repeat: no-repeat;
        background-size: contain;
        top: 0;
        left: 0;
        line-height: 4;
        text-align: center;
        z-index: 1;
    }
    .cloud_12c {
        height: 61px;
    }
    .cloud_12c::before {
        content: "رفتار";
        background-image: url(../../img/landings/garnet-path/cloud_12c.svg);
        width: 33%;
        height: 100%;
        position: absolute;
        background-repeat: no-repeat;
        background-size: contain;
        top: 0;
        left: 42%;
        line-height: 2.5;
        text-align: center;
        z-index: 1;
    }
}

@media screen and (min-width: 1200px) {
    .cloud_12a::before {
        line-height: 3;
    }
    .cloud_12b::before {
        line-height: 5.5;
    }
    .cloud_12c::before {
        line-height: 3.5;
    }
}

.sanjesh_2 {
    /* height: 450px; */
    height: 166px;
    position: relative;
}

.sanjesh_2::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/s2_cloud.svg);
    width: 61.9%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: -37%;
    top: -26%;
}

.sanjesh_2::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/sanjesh_2.svg);
    width: 53.3%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: -32%;
    z-index: 10;
    top: -21%;
}
@media screen and (min-width: 450px) {
    .sanjesh_2::before {
        top: -29%
    }
    .sanjesh_2::after {
        top: -24%;
    }
}

@media screen and (min-width: 500px) {
    .sanjesh_2::after, .sanjesh_2::before {
        top: -25%;
    }
}
@media screen and (min-width: 500px) {
    .sanjesh_2::after, .sanjesh_2::before {
        top: -30%;
    }
}
@media screen and (min-width: 650px) {
    .sanjesh_2::after, .sanjesh_2::before {
        top: -40%;
    }
}
@media screen and (min-width: 768px) {
    .sanjesh_2::after, .sanjesh_2::before {
        top: -32%;
    }
}

@media screen and (min-width: 900px) {
    .sanjesh_2::after, .sanjesh_2::before {
        top: -36%;
    }
}
@media screen and (min-width: 1080px) {
    .sanjesh_2::after, .sanjesh_2::before {
        top: -23%;
    }
}
@media screen and (min-width: 1200px) {
    .sanjesh_2::after, .sanjesh_2::before {
        top: -25%;
    }
}
@media screen and (min-width: 1300px) {
    .sanjesh_2::after, .sanjesh_2::before {
        top: -30%;
    }
}
@media screen and (min-width: 1400px) {
    .sanjesh_2::after {
        top: -34%;
    }
    .sanjesh_2::before {
        top: -39%;
    }
}
.cloud_13 {
    height: 238px;
    position: relative;
}
@media screen and (min-width: 500px) {
    .cloud_13 {
        height: 300px;
    }
}
@media screen and (min-width: 600px) {
    .cloud_13 {
        height: 340px;
    }
}
@media screen and (min-width: 768px) {
    .cloud_13 {
        height: 620px;
    }
}
@media screen and (min-width: 1400px) {
    .cloud_13 {
        height: 645px;
    }
}
.cloud_13::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_13a.svg);
    width: 172%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 9%;
    left: 26.6%;
    z-index: 1;
}

.ul1, .ul2 {
    position: absolute;
    top: 19%;
    right: -75%;
    font-size: 8px;
    z-index: 10;
}
.ul2 {
    right: -50%;
}

.ul1 li:first-child {
    list-style: none;
    margin-right: -5px;
}

.ul2 li {
    list-style: none;
    margin-bottom: 10px !important;
}
@media screen and (min-width: 450px) {
    .ul1, .ul2 {
        top: 20%;
    }
}

@media screen and (min-width: 500px) {
    .ul1 {
        right: -71%;
        font-size: 9px;
    }
    .ul2 {
        right: -48%;
        font-size: 9px;
    }
}

@media screen and (min-width: 576px) {
    .ul1, .ul2 {
        top: 21%;
        font-size: 12px;
    }
    .ul2 {
        right: -45%;
    }
}
@media screen and (min-width: 768px) {
    .ul2 {
        right: -40%;
    }
    .ul2 li, .ul1 li {
        margin-bottom: 10px;
    }
}
@media screen and (min-width: 991px) {
    .cloud_13::before {
        width: 135%;
    }
    .ul1 {
        right: -40%;
        top: 21%;
        font-size: 14px;
    }
    .ul2 {
        right: -10%;
        top: 21%;
    }
}

@media screen and (min-width: 1200px) {
    .ul2 {
        right: -8%;
    }
}
@media screen and (min-width: 1200px) {
.ul1 {
        top: 26%;
        right: -34%;
    }
    .ul2 {
        top: 26%;
        right: -8%;
    }
    .ul2 li, .ul1 li {
        margin-bottom: 15px;
    }
}
.cloud_13::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_13b.svg);
    width: 46%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 10%;
    left: 1%;
    z-index: 1;
}

.cloud_14 {
    height: 234px;
    position: relative;
}
@media screen and (min-width:650px) {
    .cloud_14 {
        height: 271px;
    }
}
@media screen and (min-width:768px) {
    .cloud_14 {
        height: 393px;
    }
}
@media screen and (min-width:1200px) {
    .cloud_14 {
        height: 634px;
    }
}
.cloud_14::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_14.svg);
    width: 212%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -45%;
    left: -71.4%;
}

.cloud_14::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/azmoon.svg);
    width: 61.3%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 15%;
    left: -5.4%;
    z-index: 10;
}

.ul3 {
    position: absolute;
    top: -22%;
    font-size: 8px;
}

.cloud_15 {
    height: 180px;
    position: relative;
}

.cloud_15::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_15a.svg);
    width: 139%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -10%;
    left: 24.6%;
    z-index: 1;
}

.cloud_15::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_15b.svg);
    width: 139%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 27%;
    left: 31%;
    z-index: 1;
}
.azmoon {
    position: absolute;
    top: 25%;
    z-index: 100;
    right: 10%;
    width: 65%;
    font-size: 8px;
}
.azmoon span {
    display: block;
    font-size: 2em;
    font-weight: bold;
}
@media screen and (min-width:500px) {
    .azmoon {
        width: 60%;
    }
}
@media screen and (min-width:578px) {
    .ul3 {
        top: -16%;
    }
    .cloud_14::before {
        left: -50%;
    }
    .cloud_14::after {
        left: 5%;
    }
    .cloud_15::before {
        left: 45%;
    }
    .cloud_15::after {
        left: 57%;
    }
    .azmoon {
        width: 55%;
        right: -4%;
        top: 35%;
    }
}
@media screen and (min-width:768px) {
    .cloud_15 {
        height: 300px;
    }
    .ul3 {
        font-size: 14px;
    }
    .azmoon {
        top: 28%;
        font-size: 12px;
    }
}
@media screen and (min-width:768px) {
    .azmoon {
        top: 18%;
        font-size: 14px;
    }
}
@media screen and (min-width:991px) {
    .azmoon {
        top: 30%;
    }
}

@media screen and (min-width:1200px) {
    .cloud_15 {
        height: 490px;
    }
    .ul3 li {
        margin-bottom: 20px;
    }
    .ul3 {
        position: absolute;
        top: -18%;
        right: 5%;
    }
    .cloud_14::after {
        top: 21%;
    }
    .cloud_15::before {
        top: -5%;
    }
    .cloud_15::after {
        top: 46%;
    }
    .azmoon {
        left: 45%;
        top: 40%;
        font-size: unset;
    }
}

.cloud_16a,.cloud_16b,.cloud_16c, .cloud_16d {
    height: 130px;
    position: relative;
}
.cloud_16d::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/arrow.svg);
    width: 148.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: -132%;
    top: -43.5%;
    z-index: 1;
}
.job-txt span {
    display: block;
    font-weight: bold;
}
.job-txt {
    font-size: 8px;
}

@media screen and (min-width:768px) {
    .cloud_16a,.cloud_16b,.cloud_16c {
        height: 234px;
    }
    .job-txt {
        font-size: unset;
    }
}
@media screen and (min-width:991px) {
    .cloud_16a,.cloud_16b,.cloud_16c {
        height: 280px;
    }
}

@media screen and (min-width:1200px) {
    .cloud_16a,.cloud_16b,.cloud_16c {
        height: 350px;
    }
}

.cloud_16a::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_16a.svg);
    width: 106.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 18%;
    right: 27%;
    z-index: 1;
}

.cloud_16a::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/c_16.svg);
    width: 67%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 40%;
    right: 55%;
    z-index: 1;
}

.cloud_16b::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_16b.svg);
    width: 106.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -19%;
    right: 10%;
    z-index: 1;
}

.cloud_16b::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/job.svg);
    width: 87%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -11%;
    right: 23%;
    z-index: 1;
}

.cloud_16c::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_16c.svg);
    width: 102%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -53%;
    left: 5%;
    z-index: 1;
}

.cloud_16c::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/job2.svg);
    width: 67%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -34%;
    left: 30%;
    z-index: 1;
}

.logo_mid, .zarebin, .arrow {
    height: 130px;
    position: relative;
}

.logo_mid::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/logo.svg);
    width: 52%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: -37%;
    bottom: -48%;
    z-index: 1;
}

.ul4 {
    width: 50%;
    position: absolute;
    right: 14%;
    font-size: 12px;
    direction: rtl;
    text-align: right;
}
.ul4 li {
    list-style-type: none;
}

.arrow::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/arrow.svg);
    width: 148.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: 16%;
    top: -21.5%;
    z-index: 1;
}

.arrow::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_17.svg);
    width: 26.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: 5%;
    top: 42.5%;
}

.zarebin::before {
    z-index: 10;
    content: "";
    background-image: url(../../img/landings/garnet-path/certificate.png);
    width: 105.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: 59%;
    top: -22.5%;
}

.zarebin::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_18.svg);
    width: 66.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: 43%;
    top: 55.5%;
}
@media screen and (min-width:576px) {
    .ul4 {
        font-size: 12px;
    }
}
@media screen and (min-width:768px) {
    .logo_mid, .zarebin, .arrow {
        height: 234px;
    }
    .logo_mid::after {
        left: -9%;
    }
    .ul4 {
        font-size: unset;
    }
}
@media screen and (min-width:1200px) {
    .logo_mid, .zarebin, .arrow {
        height: 350px;
    }
    .logo_mid::after {
        left: 3%;
    }
}

.cloud_19, .cloud_20, .cloud_21, .cloud_22 {
    height: 120px;
    position: relative;
}

.cloud_19::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_19a.svg);
    width: 172%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: -8%;
    z-index: 2;
}

.cloud_19::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_19b.svg);
    width: 173%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: -27%;
    top: -18.5%;
}

.cloud_20::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_20.svg);
    width: 172%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -11%;
    left: 19%;
}

.ul5 {
    position: relative;
    top: 75%;
    text-align: center;
    z-index: 10;
}

.cloud_21::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_21.svg);
    width: 172%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -103%;
    left: -8%;
}

.cloud_22::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_22.svg);
    width: 53%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -91%;
    left: 36%;
    z-index: 2;
}

.parvaresh {
    position: absolute;
    top: 52%;
    z-index: 10;
    right: 23%;
    font-size: 3em;
    font-weight: bold;
}
.choose {
    text-align: center;
}
@media screen and (min-width:576px) {
    .ul5 {
        top: 7%;
        text-align: right;
    }
    .cloud_22::before {
        left: 69%;
    }
    .choose {
        position: absolute;
        top: -95px;
        width: 40%;
        left: 30%;
        z-index: 1;
    }
}
@media screen and (min-width:644px) {
    .cloud_21::before {
        top: -54%;
    }
    .cloud_22::before {
        top: -47%;
    }
}
@media screen and (min-width:768px) {
    .cloud_19, .cloud_20, .cloud_21, .cloud_22 {
        height: 218px;
    }
}

@media screen and (min-width:1200px) {
    .cloud_19, .cloud_20, .cloud_21, .cloud_22 {
        height: 326px;
    }
    .choose {
        top: -150px;
        width: 22%;
        left: 40%;
    }
}
.sec6 {
    position: relative;
}

.item_parent {
    position: relative;
    height: 130px;
    margin: 20px auto;
    text-align: center;
}
.item_parent_2 {
    position: relative;
    height: 440px;
    text-align: center;
}
.item_parent_2 ul {
    margin-top: 50px;
}
.item_1 {
    position: absolute;
    left: 0;
    z-index: 1;
}

.item_2 {
    position: absolute;
    right: 30%;
    bottom: 26%;
    z-index: 1;
}

.item_3 {
    position: absolute;
    right: 0;
    top: 10%;
    z-index: 1;
}

.item_4 {
    position: absolute;
    bottom: 0;
    z-index: 1;
}

.item_5 {
    bottom: 5%;
    position: absolute;
    left: 0;
    z-index: 1;
}

.item_6 {
    position: absolute;
    left: 21%;
    top: 0;
    z-index: 1;
}

.item_7 {
    position: absolute;
    right: 0;
    top: 15%;
    z-index: 1;
}

.item_8 {
    position: absolute;
    left: 10%;
    top: 15%;
    z-index: 1;
}

.item_9 {
    position: absolute;
    left: 15%;
    top: 35%;
    z-index: 1;
}

.item_10 {
    position: absolute;
    right: 22%;
    bottom: 50%;
    z-index: 1;
}

.item_11 {
    position: absolute;
    right: 50%;
    bottom: 40%;
    z-index: 1;
}

.item_12 {
    position: absolute;
    left: 10%;
    bottom: 37%;
    z-index: 1;
}

.item_13 {
    position: absolute;
    right: 16%;
    bottom: 35%;
    z-index: 1;
}

.item_14 {
    position: absolute;
    right: 0;
    bottom: 25%;
    z-index: 1;
}

.item_15 {
    position: absolute;
    left: 35%;
    bottom: 27%;
    z-index: 1;
}

.item_16 {
    position: absolute;
    left: 0;
    bottom: 30%;
    z-index: 1;
}
@media screen and (min-width:576px) {
    .item_1 {
        left: 10%;
    }

    .item_2 {
        right: 20%;
        bottom: 26%;
    }

    .item_3 {
        right: 40%;
        top: 10%;
    }

    .item_4 {
        left: 35%;
        bottom: 0;
    }

    .item_5 {
        bottom: 5%;
        left: 20%;
    }
    .item_6 {
        left: 21%;
        top: 15%;
    }

    .item_7 {
        right: 7%;
        top: 25%;
    }

    .item_8 {
        left: 10%;
        top: 30%;
    }

    .item_9 {
        left: 15%;
        top: 50%;
    }

    .item_10 {
        right: 22%;
        bottom: 35%;
    }

    .item_11 {
        right: 50%;
        bottom: 25%;
    }

    .item_12 {
        left: 22%;
        bottom: 22%;
    }

    .item_13 {
        right: 10%;
        bottom: 18%;
    }

    .item_14 {
        right: 35%;
        bottom: 10%;
    }

    .item_15 {
        left: 35%;
        bottom: 12%;
    }

    .item_16 {
        left: 10%;
        bottom: 15%;
    }
}

.item_parent_2::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/logo.svg);
    width: 10%;
    height: 11%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -15%;
    left: 45%;
    z-index: 2;
    margin: 15px 0;
}

pre {
    direction: rtl;
    text-align: center;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 40px;
}

.arrow_right, .arrow_left {
    position: relative;
}

.arrow_right::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/arrow_right.svg);
    width: 54%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 2%;
    left: -29%;
    z-index: 3;
}

.cloud_23 {
    height: 197px;
    position: relative;
}

.cloud_23::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_23.svg);
    width: 118%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: -20%;
    z-index: 2;
}

.cloud_23::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/graduate.svg);
    width: 52.7%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: 15%;
    z-index: 2;
}

.new-exp {
    position: absolute;
    top: 28%;
    left: -136%;
    z-index: 10;
    font-weight: bold;
    font-size: 22px;
}
@media screen and (min-width:500px) {
    .new-exp {
        top: 35%;
        left: -115%;
    }
}
@media screen and (min-width:576px) {
    .cloud_23 {
        height: 270px;
    }
    .new-exp {
        top: 35%;
        left: -105%;
    }
}
@media screen and (min-width:768px) {
    .cloud_23 {
        height: 358px;
    }
    .experience_1, .experience_2 {
        margin: 0 auto;
        width: 50%;
        text-align: center;
    }
}
@media screen and (min-width:991px) {
    .cloud_23 {
        height: 420px;
    }
    .experience_2 {
        width: 32%;
    }
}

@media screen and (min-width:1200px) {
    .graduate {
        margin-top: 50px;
    }
    .cloud_23 {
        height: 535px;
    }
    .new-exp {
        top: 32%;
        left: -85%;
        font-size: 1.5em;
    }
}
@media screen and (min-width:1400px) {
    .new-exp {
        top: 42%;
    }
}

/* .arrow_left::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/arrow_left.svg);
    width: 55.8%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -7%;
    left: 0%;
    z-index: 2;
} */

.develope {
    border: 1px solid red;
    padding: 15px;
    border-radius: 80px;
    z-index: 1;
}

.develope>div {
    padding: 15px;
    border-radius: 80px;
    background: #9acce2;
}

.develope header {
    color: #b0dcf4;
    text-align: center;
}

.text_explain {
    text-align: center;
}
.text_explain b b{
    font-size:30px;
    font-family:auto;
    width:1px;
}
.text_explain ul {
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:0 10px;
}
.text_explain ul li {
    list-style-type: none;
    line-height: 2.5;
    list-style:disc;
}

.cloud_24, .cloud_25, .cloud_26, .cloud_27, .logo_miror  {
    height: 181px;
    position: relative;
}

.cloud_24::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_24.svg);
    width: 172%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    right: -18%;
    top: 10%;
}
.cloud_25::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_25a.svg);
    width: 147.5%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 5%;
    left: 25%;
    z-index: -1;
}

.cloud_25::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_25b.svg);
    width: 136%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: 7%;
    z-index: -1;
    left: 18%;
}

.cloud_26::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_26.svg);
    width: 258%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    right: -21%;
    top: -43%;
}

.logo_miror::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/logo_miror1.svg);
    width: 138%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    right: 26%;
    top: -6%;
    z-index: 1;
}

.logo_miror::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/logo_miror2.svg);
    width: 138%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    right: 26%;
    top: 18%;
    z-index: 1;
}
.cloud_27::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_27a.svg);
    width: 125%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -10%;
    z-index: -1;
    left: 7%;
}

.cloud_27::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_27b.svg);
    width: 125%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -10%;
    z-index: -1;
    left: 0;
}

.cloud_24 .social-role {
    position: absolute;
    top: 20%;
    z-index: 10;
    font-size: 8px;
    padding-right:20px;

}
 .cloud_24 .social-role ul li {
    list-style: disc!important
}
.social-role header {
    font-size: 2em;
    text-align: center;
    padding: 0 0 20px;
}
.social-role ul {
    padding: 0;
}
.social-role ul li{
   list-style-type: none;
   line-height: 2;
}
@media screen and (min-width:500px) {
    .cloud_24 .social-role {
        top: 35%;
    }
}
@media screen and (min-width:576px) {
    .cloud_24, .cloud_25, .cloud_26, .cloud_27, .logo_miror  {
        height: 245px;
    }
    .cloud_24 .social-role {
        top: 40%;
        font-size: 10px;
    }
}
@media screen and (min-width:768px) {
    .cloud_24, .cloud_25, .cloud_26, .cloud_27, .logo_miror  {
        height: 320px;
    }
    .cloud_24 .social-role {
        font-size: 14px;
    }
}
@media screen and (min-width:991px) {
    .cloud_24, .cloud_25, .cloud_26, .cloud_27, .logo_miror  {
        height: 390px;
    }
    .cloud_24 .social-role {
        font-size: unset;
    }
}

@media screen and (min-width:1200px) {
    .cloud_24, .cloud_25, .cloud_26, .cloud_27, .logo_miror  {
        height: 490px;
    }
    .cloud_24 .social-role {
        top: 40%;
    }
}

.man1 {
    position: relative;
    height: calc(110px * 0.37);
}

.man1::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/man1.svg);
    width: 16%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 10;
    left: -34%;
}

.cloud_28 {
    position: relative;
    height: 76px;
}

.cloud_28::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_28.svg);
    width: 17%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 10;
    left: -34%;
    top: 65%;
}

.man2 {
    position: relative;
    height: calc(95px * 0.37);
}

.man2::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/man2.svg);
    width: 16%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 10;
    left: 10%;
    top: 130%;
}

.man3 {
    position: relative;
    height: calc(69px * 0.37);
}

.man3::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/man3.svg);
    width: 8%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: -24%;
    top: -223%;
}

.man4 {
    position: relative;
    height: calc(69px * 0.37);
}

.man4::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/man4.svg);
    width: 8%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    right: 32%;
    top: 130%;
}

.man5 {
    position: relative;
    height: calc(83px * 0.37);
}

.man5::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/man5.svg);
    width: 11%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: 22%;
    top: 32%;
}

.man6 {
    position: relative;
    height: calc(69px * 0.37);
}

.man6::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/man6.svg);
    width: 6%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: 13%;
    top: -100%;
}

@media screen and (min-width: 576px) {
    .man3::before {
        left: -22%;
    }
}
@media screen and (min-width: 768px) {
    .man3::before {
        left: -20%;
    }
}
@media screen and (min-width: 768px) {
    .man3::before {
        left: -17%;
    }
}

@media screen and (min-width: 768px) {
    .man1 {
        height: calc(110px * 0.62);
    }
    .man2 {
        height: calc(95px * 0.62);
    }
    .man3 {
        height: calc(69px * 0.62);
    }
    .man4 {
        height: calc(69px * 0.62);
    }
    .man5 {
        height: calc(83px * 0.62);
    }
    .man6 {
        height: calc(69px * 0.62);
    }
}
@media screen and (min-width: 1200px) {
    .man1 {
        height: 110px;
    }
    .man2 {
        height: 95px;
    }
    .man3 {
        height: 69px;
    }
    .man4 {
        height: 69px;
    }
    .man5 {
        height: 83px;
    }
    .man6 {
        height: 69px;
    }
}

.cloud_29, .cloud_30 {
    position: relative;
    height: 151px;
}

.cloud_29::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_31.svg);
    width: 97%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    top: -15%;
}
.cloud_29::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_31b.svg);
    width: 70%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    left: 0;
}
.cloud_30::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_32.svg);
    width: 97%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 10;
    left: 0;
    top: -15%;
}

.cloud_30::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_32b.svg);
    width: 60%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 10;
    left: 15%;
    top: -5%;
}
.talent_parent::before {
    content: "";
    background-image: url(../../img/landings/garnet-path/cloud_33.svg);
    width: 60%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    right: 5%;
    bottom: 64%;
    z-index: -1;
}
@media screen and (min-width: 530px) {
    .talent_parent::before {
        right: -7%;
        bottom: 61%;
    }
}
@media screen and (min-width: 576px) {
    .talent_parent::before {
        right: -59%;
        bottom: -44%;
    }
}
@media screen and (min-width: 991px) {
    .talent_parent::before {
        bottom: -58%;
    }
}
@media screen and (min-width: 1200px) {
    .cloud_30::before {
        left: 26%;
        width: 100%;
    }
    .cloud_30::after {
        left: 39%;
    }
    .cloud_29::before {
        width: 82%;
        left: 0;
    }
    .talent_parent::before {
        width: 60%;
        right: -55%;
        bottom: -26%;
    }
}
@media screen and (min-width: 1200px) {
    .talent_parent::before {
        bottom: -32%;
    }
}
.talent_parent {
    position: relative;
    order: 3;
    z-index: 1;
}
 .talent {
    width: 57%;
    margin: 0 auto;
    text-align: center;
    line-height: 2;
 }

 .motto {
     line-height: 2;
 }

 .withu {
    display: flex;
    justify-content: center;
    word-spacing: 20px;
    font-size: 18px;
    color: #e6332a;
}

 @media screen and (min-width:576px) {
     .talent_parent {
         order: 2;
     }
     .talent {
        width: 100%;
     }
     .cloud_30 {
         order: 3;
     }
 }

 @media screen and (min-width:768px) {
    .motto {
        width: 70%;
        margin: 0 auto;
        line-height: 3;
    }
 }

 @media screen and (min-width:1200px) {
    .cloud_29, .cloud_30 {
        position: relative;
        height: 410px;
    }
    .talent {
        width: 57%;
     }
    .withu {
        font-size: 2em;
    }
    .motto {
        width: 40%;
    }
}

.develope div.motto_box {
    background-color: #fff;
    text-align: center;
}

footer {
    height: 155px;
    position: relative;
    background: none;
}

@media screen and (min-width:576px) {
    footer {
        min-height: 420px;
    }
}
@media screen and (min-width:1200px) {
    footer {
        min-height: 500px;
    }
}

footer::after {
    content: "";
    background-image: url(../../img/landings/garnet-path/footer.svg);
    width: 100%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 10;
}
.yellow {
    color: #F9B233;
    font-weight: 900;
}

@media screen and (max-width:820px) {
    .sanjesh {
        width: 60%;
    }
}
.navbar {
    z-index: 9999 !important;
}
.register-area {
    width: 70%;
    height: 150px;
    border: 1px solid red;
    position: absolute;
    bottom: 150px;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
    border-radius: 40px;
    line-height: 150px;
    z-index: 999;
}
.azmoon-area {
    width: 80%;
    height: 230px;
    border: 1px solid red;
    position: absolute;
    bottom: 80%;
    right: 10%;
    margin: 0 auto;
    text-align: center;
    border-radius: 40px;
    line-height: 150px;
    z-index: 999;
    overflow: hidden;
}
.inside-register-area {
    width: 99%;
    height: 88%;
    margin: 10px auto;
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 50px;
    color: rgb(174, 152, 152);
    font-size: 20px;
}
.sanjesh-main {
    position: relative;
}
@media screen and (max-width: 1000px) {
    .register-area {
        bottom: 50px !important;
    }
}
@media screen and (max-width: 768px) {
    .register-area {
        bottom: 50px !important;
        height: 60px;
        line-height: 60px;
        border-radius: 15px;
    }
    .inside-register-area {
        font-size: 15px;
        border-radius: 15px;
        margin: 4px auto;
    }
    .cloud_11::before {
        font-size: 12px;
    }
    .azmoon-area {
        bottom: 37% !important;
        font-size: 15px;
    }
    .register-area-custom p {
        padding-top: 0 !important;
    }
}
@media screen and (max-width: 850px) {
    .register-area-custom p {
        font-size: 12px;
    }
}
@media screen and (max-width: 500px) {
    .inside-register-area {
        font-size: 10px;
    }
}
@media screen and (max-width: 1200px) {
    .azmoon-area {
        bottom: 58%;
    }
    .inside-register-area ul {
        margin-right: 10px !important;
    }
    .register-area-custom {
        bottom: -9px !important;
        margin-bottom: 30px !important;
    }
}
@media screen and (max-width: 910px) {
    .ul-3, .ul-4 {
        display: none;
    }
    .item_parent_2::before {
        width: 20% !important;
        left: 40% !important;
    }
}
@media screen and (max-width: 400px) {
    .inside-register-area ul li {
        margin: 0 !important;
        height: 20px !important;
    }
    .inside-register-area ul {
        margin-top: -71px !important;
    }
    .inside-register-area-custom {
        height: 100% !important;
    }
}
@media screen and (max-width: 650px) {
    .register-area-custom p {
        line-height: 18px !important;
        padding-top: 15px !important;
    }
    .item_parent_2::before {
        width: 30% !important;
        left: 36% !important;
    }
}
.azmoon-test-box {
    margin: 0 auto;
    width: 80%;
    text-align: center;
    height: 200px;
    position: relative;
}
.inside-register-area h3 {
    text-align: right;
    font-size: 18px;
    padding: 10px 20px;
}
.inside-register-area ul {
    height: 150px;
    display: inline-block;
    color: #000;
    margin-top: -55px;
    margin-right: 30px;
    font-size:15px;
    text-align: right;
}
.inside-register-area ul li {
    list-style: none;
    margin: 10px 0;
    padding: 0;
    height: 30px;
}
.inside-register-area-custom {
    background: rgba(255, 255, 255, 0.4) !important;
}
.register-area-custom {
    bottom: 0;
    min-height: 120px !important;
    text-align: center;
}
.register-area-custom p {
    width: 70%;
    line-height: 34px;
    color: #000;
    margin: 0 auto;
    padding-top: 15px;
}
.item_parent a, .item_parent_2 a {
    color: #274a8a;
}