﻿.maintitle {
    font-style: normal;
    font-weight: 700;
    line-height: 57px;
    color: #000000;
    font-size: 40px !important;
    position: relative;
    margin-bottom: 53px;
    max-width: 600px;
    font-family: 'grahapalat';
}
.home-title {
    font-size: 30px !important;
    line-height: 40px;
}
.jobsmall-title {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    text-align: center;
    color: rgba(255, 255, 255, 0.7);
    max-width: 460px;
    margin: auto;
}
.homdesection-back {
    background: #F6F9FF;
}
.mt-130 {
    margin-top: 130px;
}
.mt-100 {
    margin-top: 100px;
}
.maintitle::after {
    content: "";
    position: absolute;
    background: url(../homepage/textline.svg);
    width: 280px;
    height: 15px;
    background-repeat: no-repeat;
    left: 0;
    top: 55px;
    max-width:600px;
}
.smallLine {
    width: 119px;
    height: 1px;
    background: rgba(0, 0, 0, 0.2);
}
.text-homepage {
    font-style: italic;
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    color: rgba(3, 3, 3, 0.72);
    max-width: 625px;
}
.pb-50{
    padding-bottom: 50px;
}
.section-stars {
    display: flex;
    justify-content: end;
    width: 55%;
}
.animate-left {
    position: absolute;
    transform: translateY(-50%);
    animation: slide 60s linear infinite;
    left: 0;
}
.animate-right {
    position: absolute;
    transform: translateY(-50%);
    right: 0;
    animation: slide 70s linear infinite;
}
@keyframes slide {
    0% {
        transform: translateY(0%);
    }
    100% {
        transform: translateY(-50%);
    }
}
.h-130vh {
    height: 130vh;
}
.card-page {
    height: auto;
    border-radius: 8px;
    margin-bottom: 30px;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.05);
}
.card-page > img {
  border-radius: 8px;
}
.animate-left:hover,
.animate-right:hover {
    animation-play-state: paused;
}
.box-cards {
    background: rgba(0, 0, 0, 0.85);
    border-radius: 8px;
    padding: 15px 23px;
}
.apl-number {
    font-style: normal;
    font-weight: 400;
    font-size: 26px;
    line-height: 23px;
    color: white;
}
.box-cards > p {
    color: rgba(255, 255, 255, 0.4);
    font-style: normal;
    font-weight: 400;
    line-height: 23px;
    font-size: 12px;
}
.credits-boxcard {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 8px;
    padding: 16px 15px;
    border-radius: 8px;
    border: 0.1px solid #80808029;
}
.credits-boxcard > p {
        font-style: normal;
        font-weight: 700;
        font-size: 14px;
        line-height: 23px;
        color: rgba(0, 0, 0, 0.65);
}
.p-name {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 23px;
    color: #000000;
}
.p-caount {
    background: #E6E6E6;
    display: flex;
    color: #676767;
    padding: 0px 5px;
    justify-content: center;
    align-items: center;
    max-height: 22px;
    font-size: 12px;
}
.apl-cardbox {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 8px;
    padding: 9px 13px;
    text-align: center;
    border: 0.1px solid #80808029;
}
.apl-cardbox > p {
   font-style: normal;
   font-weight: 700;
   font-size: 14px;
   line-height: 23px;
   color: rgba(0, 0, 0, 0.65);
   text-align: left;
}
.light-bakcBlure {
    background: linear-gradient(180deg, #F6F9FF 0%, rgba(246, 249, 255, 0) 100%);
}
.divider-section{
    height: 40px;
}
.container-companyInfo {
    max-width: 1045px;
    margin: auto;
}
.main-img {
   top: 0;
    width: 360px;
}
.pt-100 {
  padding-top: 100px;
}
.s-title-1 {
    top: 141px;
    color: black;
    font-size: 7px;
    left: 53px;
}
.s-title-2 {
    top: 188px;
    color: black;
    font-size: 7px;
    left: 53px;
}
.s-title-3 {
    top: 141px;
    color: black;
    font-size: 7px;
    left: 236px;
}
.s-title-4 {
    top: 245px;
    color: black;
    font-size: 7px;
    left: 236px;
}
.s-title-5 {
    top: 278px;
    color: black;
    font-size: 9px;
    left: 120px;
    font-weight: bold;
}
.s-title-6 {
    top: 245px;
    color: black;
    font-size: 7px;
    left: 55px;
}
.cursor-img {
    top: 244px;
    left: 255px;
    filter: drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.08));
    animation: cursors 1.5s  linear forwards;
    animation-delay: 1s
}
    .cursor-img > img {
        animation: bounce .5s ease 1;
        animation-delay: .5s
    }
.map-img {
    top: 180px;
    left: 268px;
    filter: drop-shadow(0px 4px 20px rgba(0, 0, 0, 0.15));
    opacity: 0;
    animation: fadeIn 1s forwards;
    animation-delay: 1.5s
}
.benefits-img {
    top: 225px;
    left: -29px;
    filter: drop-shadow(0px 4px 20px rgba(0, 0, 0, 0.15));
    opacity: 0;
    animation: fadeIn 1.5s forwards;
    animation-delay: 2s
}
.s-title-7 {
    font-size: 9px;
    left: 10px;
    top: 10px;
}
.socials-img {
    top: 0;
    left: -40px;
}

.fb-item {
    top: -53px;
    left: 105px;
    opacity: 0;
    animation: bounceFadeIn 1.7s forwards;
    animation-delay: 2.4s;
}
.tl-item {
    top: -40px;
    left: 42px;
    opacity: 0;
    animation: bounceFadeIn 1.6s forwards;
    animation-delay: 2.3s;
}
.linkedin-item {
    top: 47px;
    left: 30px;
    opacity: 0;
    animation: bounceFadeIn 1.4s forwards;
    animation-delay: 2.2s;
}
.insta-item {
    top: 0px;
    left: 16px;
    opacity: 0;
    animation: bounceFadeIn 1.5s forwards;
    animation-delay: 2.1s;
}
.company-section {
    bottom: 35px;
}
.filterDrop {
    filter: drop-shadow(0px 4px 20px rgba(0, 0, 0, 0.15));
}
.secondBack-color {
    background: #FAF9F9;
}
@keyframes bounceFadeIn {
    0% {
        opacity: 0;
        transform: scale(0.5) translate(-50%, 50%);
    }

    50% {
        transform: scale(1.2) translate(-25%, -25%);
    }

    70% {
        transform: scale(0.9) translate(10%, -10%);
    }

    100% {
        opacity: 1;
        transform: scale(1) translate(0, 0);
    }
}
@keyframes cursors {
    0% {
        transform: translateX(0px);
    }
    100% {
        transform: translateX(-185px);
        opacity: 0;
    }
}
@keyframes bounce {
    70% {
        transform: translateY(0%);
    }

    80% {
        transform: translateY(-15%);
    }

    90% {
        transform: translateY(0%);
    }

    95% {
        transform: translateY(-7%);
    }

    97% {
        transform: translateY(0%);
    }

    99% {
        transform: translateY(-3%);
    }

    100% {
        transform: translateY(0);
    }
}
@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}
@keyframes fadeInhide {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}
@keyframes bounce-fade-out {
    70% {
        opacity: 1;
        transform: translateY(0%);
    }

    80% {
        transform: translateY(-15%);
    }

    90% {
        transform: translateY(0%);
    }

    95% {
        transform: translateY(-7%);
    }

    97% {
        transform: translateY(0%);
    }

    99% {
        transform: translateY(-3%);
    }

    100% {
        opacity: 0;
        transform: translateY(0);
    }
}
.listcreate {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    color: #000000;
    margin-bottom: 15px;
}
.listinfo-company{
    max-width: 519px;
}
.st-title1 {
    color: #333D49;
    text-transform: uppercase;
    font-size: 9px;
    top: 41px;
    font-weight: bold;
    left: 43px;
}
.st-title2 {
    color: #333D49;
    font-size: 9px;
    top: 90px;
    font-weight: bold;
    left: 43px;
}
.st-title3 {
    color: #333D49;
    font-size: 8px;
    top: 110px;
    font-weight: bold;
    left: 46px;
}
.st-title4 {
    color: #333D49;
    font-size: 9px;
    top: 135px;
    font-weight: bold;
    left: 41px;
}
.st-title5 {
    color: #333D49;
    font-size: 9px;
    top: 241px;
    font-weight: bold;
    left: 41px;
}
.st-title6 {
    color: #6C6C6C;
    top: 260px;
    font-weight: bold;
    left: 52px;
    font-size: 6px;
}
.st-title7 {
    color: #6C6C6C;
    top: 260px;
    font-weight: bold;
    left: 120px;
    font-size: 6px;
}
.st-title8 {
    color: #6C6C6C;
    top: 260px;
    font-weight: bold;
    left: 160px;
    font-size: 6px;
}
.nextbtn-icon {
    width: 300px;
    left: 32px;
    bottom: -8px;
    color: white;
    font-size: 9px;
    animation: fadeInhide .1s forwards;
    animation-delay: 1.1s
}
.nextbtn-icon2 {
    width: 280px;
    left: 0px;
    bottom: -15px;
    color: white;
    font-size: 9px;
    animation: fadeInhide .1s forwards;
    animation-delay: 2s
}
.nextText {
    top: 5px;
    right: 48%;
}
.nextText2 {
    top: 4px;
    right: 37%;
}
.cursor-img2 {
    top: 303px;
    right: 55%;
    animation: fadeInhide .1s forwards;
    animation-delay: 1.1s;
}
.cursor-3 {
    top: 0px;
    right: 30%;
}
.prcodeure-app {
    top: 88px;
    right: 60px;
    opacity: 0;
    animation: fadeIn .1s forwards;
    animation-delay: 1.5s
}
.procedure-img {
    width: 280px;
}
.st-title9 {
    color: #333D49;
    text-transform: uppercase;
    font-size: 9px;
    top: 13px;
    font-weight: bold;
    left: 11px;
}
.st-title10 {
    color: #333D49;
    font-size: 9px;
    top: 62px;
    font-weight: bold;
    left: 10px;
}
.st-title11 {
    color: #333D49;
    font-size: 9px;
    top: 84px;
    left: 10px;
}
.st-title12 {
    color: #333D49;
    font-size: 9px;
    top: 110px;
    left: 10px;
}
.st-title13 {
    color: #333D49;
    font-size: 9px;
    top: 133px;
    left: 10px;
}
.st-title14 {
    color: #333D49;
    font-size: 9px;
    top: 163px;
    font-weight: bold;
    left: 10px;
}
.st-title15 {
    color: #0E46A1;
    top: 181px;
    left: 10px;
    font-size: 9px;
}
.radio-img-1 {
    top: 84px;
    right: 20px;
}
.radio-img-2 {
    top: 109px;
    right: 20px;
}
.radio-img-3 {
    top: 132px;
    right: 20px;
}
.rd-text {
    font-size: 9px;
    color: #333D49;
}
.thirdImg {
    width: 260px;
}
.procedire-item {
    top: 145px;
    left: 90px;
    opacity: 0;
    animation: fadeIn .1s forwards;
    animation-delay: 2.3s
}
.title-prod-1 {
    color: #333D49;
    text-transform: uppercase;
    font-size: 9px;
    top: 16px;
    font-weight: bold;
    left: 94px;
}
.lineinfo-item {
    font-size: 7px;
    color: rgba(0, 0, 0, 0.7);
    margin-right: 12px;
}

.title-prod-2 {
    color: #000000;
    font-size: 9px;
    top: 91px;
    left: 28px;
}
.title-prod-3 {
    color: #000000;
    font-size: 9px;
    top: 141px;
    left: 28px;
}
.title-prod-4 {
    color: #000000;
    font-size: 9px;
    top: 190px;
    left: 28px;
}
.title-prod-5 {
    color: white;
    font-size: 9px;
    top: 255px;
    left: 120px;
}
.items-us-jobinfo {
    top: 52px;
    left: 120px;
}
.items-us-jobinfo-2 {
    top: 124px;
    left: 100px;
}
.items-us-jobinfo-3 {
    top: 197px;
    left: 120px;
}
.usn-1 {
    color: black;
    font-weight: bold;
    font-size: 12px;
}
.usn-2 {
    color: rgba(0, 0, 0, 0.8);
    font-size: 10px;
}
.cursor-img-4 {
    top: 70px;
    right: 46%;
    animation: bounce-fade-out .5s forwards;
    animation-delay: 1s
}
.third-seconImg {
    top: 87px;
    left: 148px;
}
.lastItem-sec {
    opacity: 0;
    animation: fadeIn 1.1s forwards;
    animation-delay: 1.2s
}
.mainthird-img {
    width: 250px;
}
.mb-60{
    margin-bottom: 60px;
}
.info-us-third {
    top: 104px;
    left: 212px;
}
.sp-name{
    font-size: 9px;
}
.th-usname{
    font-weight: bold;
    font-size: 11px;
}
.w-200 {
    width: 168px;
}
.rs-feedback {
    top: 181px;
    left: 170px;
}
.rs-fd
{
    font-size: 9px;
}
.rs-line {
    height: 1px;
    background: #0E46A1;
    width: 36px;
}
.rs-title-1 {
    font-size: 8px;
    font-weight: bold;
    top: 209px;
    left: 170px;
}
.rs-title-2 {
    font-size: 8px;
    font-weight: bold;
    top: 251px;
    left: 170px;
}
.rs-title-3 {
    font-size: 8px;
    font-weight: bold;
    top: 290px;
    left: 170px;
}
.rs-title-4 {
    font-size: 8px;
    font-weight: bold;
    top: 334px;
    left: 170px;
}
.pb-100 {
    padding-bottom: 100px;
}
.second-section {
   margin-top: 250px;
}
.third-section {
    margin-top: 200px;
    margin-bottom: 160px;
}
.images-leftcontent {
    position: sticky;
    top: 200px;
    height: 550px;

}
.schedule {
    padding: 0px 8px !important;
    background: #F0F9FF !important;
    border: 1px solid rgba(14, 70, 161, 0.5) !important;
    border-radius: 100px !important;
    color: rgba(0, 0, 0, 0.6);
    display: flex;
}
.schedules {
    top: 261px;
    left: 44px;
}
.lineinfo-Item {
    top: 35px;
    left: 50px;
}
.graycolor {
    color: #B1B2B4;
}

@media(max-width: 1100px){
    .ilustrationBox{
        padding: 0px !important   
    }
    .first-in {
        left: 33px;
    }
}
.features-section {
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 50px 0;
}

.feature {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    width: 25%;
    padding: 20px;
    box-sizing: border-box;
    border-radius: 10px;
    background-color: #f2f2f2;
    transition: all 0.3s ease-in-out;
}

 .feature:hover {
    transform: scale(1.05);
    box-shadow: 0px 0px 10px #ccc;
 }

 .feature img {
    width: 100px;
    height: 100px;
    margin-bottom: 20px;
}

 .feature h3 {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 10px;
 }

.feature p {
    font-size: 16px;
    line-height: 1.5;
}
.title-thirdsec {
    font-family: 'grahapalat';
    font-style: normal;
    font-weight: 700 !important;
    font-size: 24px !important;
    line-height: 34px;
    text-align: center;
    color: #000000 !important;
    position: relative;
    z-index: 99;
}
.content-texttird {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 23px;
    text-align: center;
    color: rgba(3, 3, 3, 0.72);
    max-width: 456px;
    margin: auto;
    position: relative;
    z-index: 99;
}
/*third section animation slider*/
.content-story-toggle--js .cs--graphics-area {
    display: grid;
}

 .cs--graphics-sequence {
        grid-column: 1;
        grid-row: 1;
      display:none;
        height: 500px;
        transition-property: all;
        transition-duration: 0.25s;
        transition-timing-function: ease;
        justify-content: center;
    }

.cs--graphics-sequence.is--active {
    display: flex;
}
.evt-cs--graphics-sequence.is--active {
        display: flex;
        height: 500px;
    }
.content-story-toggle--js .cs--content-area .cs--content-sequence {
    position: relative;
    padding: 0 0 0 20px;
    margin-top: 40px;
    margin-bottom: 45px;
}
.content-story-toggle--js .cs--content-area .cs--content-sequence .cs--content-progress-indicator--wrapper {
        position: absolute;
        display: inline-block;
        height: 100%;
        width: 2px;
        top: 0;
        left: 0;
        background-color: #dcdcdc;
        border-radius: 3px;
        will-change: max-height;
        overflow: hidden;

}
.cs-indicator--wrapper {
    width: 100%;
    height: 2px;
    top: 21px;
    background-color: #dcdcdc;
    border-radius: 3px;
    will-change: max-width;
    overflow: hidden;
    position: absolute;
    display: inline-block;
}
.cs--content-progress-indicator--bar {
    position: absolute;
    display: inline-block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: #0E46A1;
    scale: 1 0;
    transform-origin: top;
}
.cs-indicator-bar {
    position: absolute;
    display: inline-block;
    width: 100%;
    height: 100%;
    top: 0;
    background-color: #2563EB;
    scale: 0 0;
    transform-origin: left;
}

.content-story-toggle--js .cs--content-area .cs--content-sequence .cs--content-headline {
   cursor: pointer;
}
    .content-story-toggle--js .cs--content-area .cs--content-sequence .cs--content-headline h3 {
        opacity: 0.6;
        transition-property: all;
        transition-duration: 0.25s;
        transition-timing-function: ease;
        font-weight: 700;
        color: #A1A1AA;
    }
.content-story-toggle--js .cs--content-area .cs--content-sequence .cs--content-headline h3:hover {
                opacity: 1;
}
.content-story-toggle--js .cs--content-area .cs--content-sequence .cs--content-desc {
        overflow: hidden;
        opacity: 0.6;
        display: -webkit-box;
        max-width: 519px;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;
}
.fillProgress2 {
    animation: fillProgress2 linear;
    animation-duration: var(--slideDuration, 8s);
}
.fillProgress {
    animation: fillProgress linear;
    animation-duration: var(--slideDuration, 8s);
}
.content-story-toggle--js .cs--content-area.is--active .cs--content-sequence .cs--content-progress-indicator--wrapper .cs--content-progress-indicator--bar.paused {
   animation: none;
}

.content-story-toggle--js .cs--content-area.is--active .cs--content-sequence .cs-indicator--wrapper .cs-indicator-bar.paused {
   animation: none;
}
.stoped {
    animation-play-state: paused;
}
.content-story-toggle--js .cs--content-area.is--active .cs--content-sequence .cs--content-headline h3 {
    color: #3c4043;
    opacity: 1;
}
.content-story-toggle--js .cs--content-area.is--active .cs--content-sequence .cs--content-headline .gstitle {
    color: #2563EB !important;
}
.content-story-toggle--js .cs--content-area.is--active .cs--content-sequence .cs--content-desc {
    height: auto;
}

@keyframes fillProgress {
    0% {
        scale: 1 0;
    }

    100% {
        scale: 1 1.025;
    }
}
@keyframes fillProgress2 {
    0% {
        scale: 0 1;
    }

    100% {
        scale: 1 1;
    }
}
.thirdSection{
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    max-width: 1280px;
   /* min-height: 100vh;*/
    margin: auto;
    padding: 0 40px;
    margin-bottom: 150px;
}
.thirdSection .row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.width--55 {
        background: rgba(204, 220, 252, 0.5);
        border-radius: 20px;
        height: 500px;
        width: 515px;
    }
.widtsquare-box {
    background: rgba(204, 220, 252, 0.5);
    border-radius: 20px;
    height: 477px;
    max-width: 515px;
}
.widtsquare {
    margin-bottom: 60px;
    height: 477px;
}
section .row .width--45 .content--wrapper {
    padding-bottom: 12px;
    margin-left: 20px;
}
.graf-first {
    width: 375px;
    position: relative;
    top: 65px;
}
.option-tl-first {
    top: 96px;
    width: 345px;
    left: 15px;
}
.cn-tl-1 {
    color: #333D48;
    font-weight: bold;
    font-size: 12px;
}
.cn-tl-fv {
    color: #000000;
    text-decoration: underline;
    font-size: 11px;
}
.pn-line {
    height: 1px;
    width: 100%;
    background: #0E46A1;
    display: block;
   
}
.pn-line-1 {
    position: relative;
    top: 10px;
}
.option-tl-two {
    top: 140px;
    left: 23px;
    font-size: 11px;
}
.option-tl-tree {
    top: 169px;
    font-size: 9px;
    font-weight: bold;
    left: 45px;
}
.option-tl-four {
    top: 211px;
    left: 47px;
}
.mt-n1 {
    margin-top: -1px;
}
.option-tl-five {
    top: 267px;
    left: 213px;
}
.option-tl-six {
    top: 396px;
    font-size: 8px;
    font-weight: bold;
    left: 164px;
}
.option-tl-seven {
    top: 450px;
    font-size: 8px;
    font-weight: bold;
    left: 164px;
}
.cursor-img-5 {
    top: 171px;
    right: 11px;
}

.filterOpen > img{
    width: 139px;
}
.mainfilterOpen > img {
    width: 139px;
}
.fl-by {
    top: 10px;
    left: 13px;
    font-size: 11px;
    font-weight: bold;
}
.res-lastseen {
    font-size: 9px;
    position: absolute;
    top: 45px;
    left: 16px;
    color: rgba(51, 61, 72, 0.42);
}
.mainres-lastseen {
    top: 40px !important;
}
.res-last-2 {
    font-size: 9px;
    position: absolute;
    top: 73px;
    left: 16px;
    color: rgba(51, 61, 72, 0.42);
}
.mainres-last-2 {
    font-size: 9px;
    position: absolute;
    top: 70px;
    left: 16px;
    color: rgba(51, 61, 72, 0.42);
}
.res-last-3 {
    font-size: 9px;
    position: absolute;
    top: 102px;
    left: 16px;
    color: rgba(51, 61, 72, 0.42);
}
.mainres-last-3 {
    top: 100px;
}
.sc-city{
    opacity: 0;
    color: black !important;
}
.alertFilter {
    top: 136px;
    left: 8px;
    opacity: 0;
}
.alertTxt {
    font-size: 11px;
    font-weight: bold;
    left: 10px;
    top: 8px;
    color: #333D48;
}
.cursor-img-anim-5 {
    animation: bounce-fade-out 1s ease-in-out  forwards;
    animation-duration: 1s;
}
.filterOpen {
    top: 200px;
    right: -27px;
    opacity: 0;
}
.filterOpenanim {
    animation: fadeIn 1.1s ease-in-out forwards;
    animation-delay: 1.001s;
}
.mainfilterOpen {
    top: 128px;
    right: 10px;
    opacity: 0;
    animation: fadeIn 1s ease-in-out forwards;
    animation-delay: 3s;
}
.alert-cursor {
    position: absolute;
    top: 105px;
    left: 378px;
    opacity: 0;
    animation: bounce-fade-out 1s forwards;
    animation-delay: 1.1s
}
/*.res-last-2 {
    animation: bounce-fade-out 1.2s ease-in-out 1;
    animation-delay: 1.002s;
}*/
.ch-city {
    animation: fadeOut 1.25s ease-in-out forwards;
    animation-delay: 1.003s;
}
.sc-city {
    left: 2px;
    position: absolute;
   
}
.sc-city-anim {
    animation: fadeIn 1.5s ease-in-out forwards;
    animation-delay: 1.5s;
}
@keyframes bounce-fade-in {
    70% {
        transform: translate(0px, 0px);
        opacity: 1;
    }

    80% {
        transform: translate(-25px, -10px);
        opacity: 1;
    }

    90% {
        transform: translate(-55px, -20px);
        opacity: 1;
    }

    95% {
        transform: translate(-75px, -35px);
        opacity: 1;
    }

    97% {
        transform: translate(-95px, -45px);
        opacity: 1;
    }

    99% {
        transform: translate(-125px, -55px);
        opacity: 1;
    }

    100% {
        transform: translate(-145px, -67px);
        opacity: 0;
    }
}
.clickalertText {
    animation: bounce-fade-in 1s ease-in-out forwards;
    animation-delay: 1.9s;
}
.alertFilteranim {
    animation: fadeIn 1.1s ease-in-out forwards;
    animation-delay: 2.5s;
}
.invite-ilustration {
    width: 380px;
    top: 77px;
    right: -50px;
}
.invite-ilustration-main {
    width: 380px;
    top: 77px;
    left: -70px;
}
.cursor-invite {
    top: 135px;
    right: -30px;
    animation: bounce-fade-out .5s forwards;
    animation-delay: .5s
}
.cursor-invite-main {
    top: 135px;
    right: 220px;
   
}
.cursor-invite-anim {
    animation: bounce-fade-out .5s forwards;
    animation-delay: .5s
}
.inviteItem-text {
    background: #FFFFFF;
    padding: 19px 17px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: bold;
    height:167.5px;
}
.invite-itembox {
    top: 160px;
    left: 22px;
    position: absolute;
    width: 200px;
    opacity: 0;
    height: 210px;
    animation: fadeIn 1.2s forwards;
    animation-delay: 1.1s
}
.invite-itembox-main {
    top: 160px;
    left: 275px;
    position: absolute;
    width: 200px;
    opacity: 0;
    height: 210px;
   
}
.inv-itembox-main-anim {
    animation: fadeIn 1.2s forwards;
    animation-delay: 1.1s;
}
.sndInvitebtn {
    width: 100%;
    text-align: center;
    color: white;
    background: #0E46A1;
    font-size: 11px;
    border-radius: 8px;
    padding: 9px;
    margin-top: 8px;
}
.itemInviteusbox {
    padding: 13px 7px;
    background: white;
    width: 200px;
    font-size: 10px;
    border-radius: 8px;
}
.itemInviteus {
    top: 388px;
    left: 23px;
    opacity: 0;
    animation: fadeIn 1.4s forwards;
    animation-delay: 1.8s
}
.itemInviteus-main {
    top: 388px;
    left: 275px;
    opacity: 0;
    
}
.itemInviteus-main-anim {
    animation: fadeIn 1.4s forwards;
    animation-delay: 1.8s
}
.cvt-search {
    top: 96px;
    left: 17px;
}
.cvitem-1 {
    font-weight: bold;
    top: 160px;
    font-size: 10px;
    left: 28px;
}
.cvitem-2 {
    font-weight: bold;
    top: 215px;
    font-size: 10px;
    left: 28px;
}
.cvitem-3 {
    font-weight: bold;
    top: 271px;
    font-size: 10px;
    left: 28px;
}
.cvitem-4 {
    font-weight: bold;
    top: 325px;
    font-size: 10px;
    left: 28px;
}
.cvmainitem-4 {
    font-weight: bold;
    top: 330px;
    font-size: 10px;
    left: 28px;
}
.cvitem-5 {
    font-weight: bold;
    top: 381px;
    font-size: 10px;
    left: 28px;
}
.cvmainitem-5 {
    font-weight: bold;
    top: 387px;
    font-size: 10px;
    left: 28px;
}
.cvitem-6 {
    font-weight: bold;
    top: 436px;
    font-size: 10px;
    left: 28px;
}
.cvmainitem-6 {
    font-weight: bold;
    top: 444px;
    font-size: 10px;
    left: 28px;
}
.resonooff-sec {
    top: 170px;
    left: 150px;
}
.mainonooff-sec {
    top: 170px;
    left: 220px;
}
.resoff-1{
    width: 200px;
}
.resonooff-sec-2 {
    top: 225px;
    left: 150px;
}
.mainonooff-sec-2 {
    top: 225px;
    left: 220px;
}
.resonooff-sec-3 {
    top: 280px;
    left: 150px;
}
.mainonooff-sec-3 {
    top: 280px;
    left: 220px;
}
.resonooff-sec-4 {
    top: 335px;
    left: 150px;
}
.mainonooff-sec-4 {
    top: 335px;
    left: 220px;
}
.resonooff-sec-5 {
    top: 390px;
    left: 150px;
}
.mainonooff-sec-5 {
    top: 390px;
    left: 220px;
}
.resonooff-sec-6 {
    top: 447px;
    left: 150px;
}
.mainonooff-sec-6 {
    top: 447px;
    left: 220px;
}
.btn-toggle {
    margin: 0 4rem;
    padding: 0;
    position: relative;
    border: none;
    height: 1.5rem;
    width: 3rem;
    border-radius: 1.5rem;
    color: #6b7381;
    background: #bdc1c8;
}

    .btn-toggle:focus,
    .btn-toggle.focus,
    .btn-toggle:focus.active,
    .btn-toggle.focus.active {
        outline: none;
    }

    .btn-toggle:before,
    .btn-toggle:after {
        line-height: 1.5rem;
        width: 4rem;
        text-align: center;
        font-weight: 600;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 2px;
        position: absolute;
        bottom: 0;
        transition: opacity 0.25s;
    }

    .btn-toggle:before {
        content: 'Off';
        left: -4rem;
    }

    .btn-toggle:after {
        content: 'On';
        right: -4rem;
        opacity: 0.5;
    }

    .btn-toggle > .handle {
        position: absolute;
        top: 0.1875rem;
        left: 0.1875rem;
        width: 1.125rem;
        height: 1.125rem;
        border-radius: 1.125rem;
        background: #fff;
        transition: left 0.25s;
    }

    .btn-toggle.active {
        transition: background-color 0.25s;
    }

        .btn-toggle.active > .handle {
            left: 1.6875rem;
            transition: left 0.25s;
        }

        .btn-toggle.active:before {
            opacity: 0.5;
        }

        .btn-toggle.active:after {
            opacity: 1;
        }
    .btn-toggle.btn-xs:before,
    .btn-toggle.btn-xs:after {
        display: none;
    }

    .btn-toggle:before,
    .btn-toggle:after {
        color: #6b7381;
    }

    .btn-toggle.active {
        background-color: #29b5a8;
    }
        .btn-toggle.btn-lg.btn-xs:before,
        .btn-toggle.btn-lg.btn-xs:after {
            display: none;
        }     
        .btn-toggle.btn-sm.btn-xs:before,
        .btn-toggle.btn-sm.btn-xs:after {
            display: none;
        }
    .btn-toggle.btn-xs {
        margin: 0 0;
        padding: 0;
        position: relative;
        border: none;
        height: 1rem;
        width: 2rem;
        border-radius: 1rem;
    }

        .btn-toggle.btn-xs:focus,
        .btn-toggle.btn-xs.focus,
        .btn-toggle.btn-xs:focus.active,
        .btn-toggle.btn-xs.focus.active {
            outline: none;
        }

        .btn-toggle.btn-xs:before,
        .btn-toggle.btn-xs:after {
            line-height: 1rem;
            width: 0;
            text-align: center;
            font-weight: 600;
            font-size: 0.75rem;
            text-transform: uppercase;
            letter-spacing: 2px;
            position: absolute;
            bottom: 0;
            transition: opacity 0.25s;
        }

        .btn-toggle.btn-xs:before {
            content: 'Off';
            left: 0;
        }

        .btn-toggle.btn-xs:after {
            content: 'On';
            right: 0;
            opacity: 0.5;
        }

        .btn-toggle.btn-xs > .handle {
            position: absolute;
            top: 0.125rem;
            left: 0.125rem;
            width: 0.75rem;
            height: 0.75rem;
            border-radius: 0.75rem;
            background: #fff;
            transition: left 0.25s;
        }

        .btn-toggle.btn-xs.active {
            transition: background-color 0.25s;
        }

            .btn-toggle.btn-xs.active > .handle {
                left: 1.125rem;
                transition: left 0.25s;
            }

            .btn-toggle.btn-xs.active:before {
                opacity: 0.5;
            }

            .btn-toggle.btn-xs.active:after {
                opacity: 1;
            }

        .btn-toggle.btn-xs.btn-sm:before,
        .btn-toggle.btn-xs.btn-sm:after {
            line-height: -1rem;
            color: #fff;
            letter-spacing: 0.75px;
            left: 0.275rem;
            width: 1.55rem;
        }

        .btn-toggle.btn-xs.btn-sm:before {
            text-align: right;
        }

        .btn-toggle.btn-xs.btn-sm:after {
            text-align: left;
            opacity: 0;
        }
        .btn-toggle.btn-xs.btn-xs:before,
        .btn-toggle.btn-xs.btn-xs:after {
            display: none;
        }
.item-newresume {
    background: white;
    padding: 10px 15px;
    border-radius: 4px;
    border: 1px solid #80808017;
}
.addnewImg {
    left: -23px;
    top: 0px;
}
.newresume-position {
    position: absolute;
    top: 158px;
    right: -49px;
    opacity: 0;
    animation: fadeIn 1.5s forwards;
    animation-delay: 1.5s;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05);
}
.newresume-position-2 {
    position: absolute;
    top: 213px;
    right: -38px;
    opacity: 0;
    animation: fadeIn 1.7s forwards;
    animation-delay: 1.7s;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05);
}
.newresume-position-3 {
    position: absolute;
    top: 266px;
    right: -49px;
    opacity: 0;
    animation: fadeIn 1.9s forwards;
    animation-delay: 1.9s;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05);
}
.openapply-Box {
    padding: 13px;
    background: white;
    border-radius: 10px;
    max-width: 200px;
    font-size: 10px;
    font-weight: 500;
    line-height: 15px;
}

.openapplybox {
    top: 121px;
    right: -72px;
    z-index: 9;
    opacity: 0;
    animation: fadeIn 1.2s ease forwards;
    animation-delay: 1.2s;
}
.openapplybox-2 {
    top: 360px;
    right: 156px;
    opacity: 0;
    animation: fadeIn 1.7s ease forwards;
    animation-delay: 1.7s;
}

.plusapply {
    position: absolute;
    top: 2px;
    left: -13px;
    width: 25px;
    height: 25px;
    color: white;
    background: #0E46A1;
    border-radius: 50%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
}
.plusapply-2 {
    position: absolute;
    top: 57px;
    right: -14px;
    width: 25px;
    height: 25px;
    color: white;
    background: #0E46A1;
    border-radius: 50%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
}
.cursorapply {
    position: absolute;
    top: 96px;
    right: 109px;
    animation: bounce-fade-out 1s forwards;
    animation-delay: 1s
}
.cursorapply-2 {
    position: absolute;
    top: 430px;
    right: 109px;
    opacity: 0;
    animation: bounce-fade-out 1s forwards;
    animation-delay: 1.4s
}
.third-animsection {
   position: relative;
}
    .third-animsection::before {
        background: url(../homepage/fourdmain/wave.png);
        background-repeat: no-repeat;
        background-size: cover;
        position: absolute;
        content: "";
        width: 100%;
        height: 135%;
        top: -185px;
    }
.content-story-toggle--js .cs--content-area.is--active .cs--content-desc {
        opacity: 1;
        text-overflow: unset;
        display: unset;
        -webkit-line-clamp: unset;
        -webkit-box-orient: unset;
}
.cs--content-desc > p {
    max-width: 519px;
   
}
.tr-title-1 {
    left: -247px;
    top: 107px;
    z-index: 9;
}
.tr-title-main-1 {
    left: 15px;
    top: 107px;
    z-index: 9;
}
.tr-title-main-2 {
    left: 30px;
    top: 130px;
    z-index: 9;
}
.tr-title-main-3 {
    left: 35px;
    top: 145px;
    z-index: 9;
}
.tr-title-2 {
    left: -230px;
    top: 130px;
    z-index: 9;
}
.tr-title-3 {
    left: -228px;
    top: 145px;
    z-index: 9;
}
.forth-section {
    background: #FAFAFA;
    padding: 26px;
    padding-top: 80px;
}
.contentFirstText {
    max-width: 542px;
    color: #090B2B;
    font-style: normal;
    font-weight: 700;
    font-size: 24px !important;
    line-height: 34px !important;
    font-family: 'grahapalat';
    margin: auto;
    text-align: center;
}
.mediumcontent-size{
    max-width: 910px;
    margin:auto;
    margin-top: 120px;
    margin-bottom: 80px;

}
.puckages-item{
    max-width: 318px;
}
.pkg-item-text {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #677788;
}
.pkg-item-title {
    font-style: normal;
    font-weight: 700;
    font-size: 18px;
    line-height: 24px;
    color: #1E2022;
}

.us-vector-1 {
    top: 128px;
    left: -109px;
    position: absolute;
}
.us-vector-2 {
    top: -52px;
    left: 137px;
    position: absolute;
}
.tooltypeItem-1 {
    background: #FBD17F;
    border-radius: 3px;
    transform: matrix(1, 0.02, -0.02, 1, 0, 0);
    padding: 6px 12px;
    max-width: 164px;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #061C3D;
    text-align: center;
    position: absolute;
    top: 249px;
    left: -28px;
}
.tooltypeItem-2 {
    background: #BB9FF5;
    border-radius: 3px;
    transform: matrix(1, 0.02, -0.02, 1, 0, 0);
    padding: 6px 12px;
    max-width: 157px;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #061C3D;
    text-align: center;
    position: absolute;
    top: -70px;
    left: 90px;
    min-width: 146px;
}
    .tooltypeItem-2::before {
        right: -5px;
        content: "";
        width: 13px;
        height: 13px;
        position: absolute;
        background: #BB9FF5;
        top: 11px;
        transform: rotate(45deg);
    }
.tooltypeItem-1::before {
    content: "";
    width: 15px;
    height: 15px;
    position: absolute;
    background: #FBD17F;
    left: -6px;
    top: 10px;
    transform: rotate(45deg);
}

.statebtn {
    color: rgba(0, 0, 0, 0.7);
    font-weight: 400;
    min-height: 45px;
    display: flex;
    align-items: center;
}
.us-employee-2 {
    top: 88px;
    left: 27px;
}

.container-detailsSection {
    max-width: 1110px;
    margin: auto;
}
@media (max-width: 1200px) {
    .credits-boxcard {
        padding: 16px 8px;
    }

    .container-detailsSection {
        max-width: 925px;
    }

   .third-seconImg{
        top: 87px;
        left: 103px;
    }
    .info-us-third{
        left: 167px;
    }
    .rs-feedback, .rs-title-1, .rs-title-2, .rs-title-3, .rs-title-4 {
        left: 120px;
    }
}
@media (max-width: 1250px) {
    .firstcol-relative {
        left: 122px;
    }

    .lastcol-relative {
        left: -72px;
    }
}
@media (max-width:1100px) {
    .width--55 {
        width: 430px;
    }
}
    @media (max-width: 992px) {
        .p-name, .p-caount {
            font-size: 10px;
        }
        .sections-link {
            font-weight: bold;
            display: block;
        }
        .second-seclink{
            font-weight: bold;
        }
        .container-detailsSection {
            max-width: 765px;
            padding-left: 12px;
            padding-right: 14px;
        }

        .map-img {
            top: 224px;
            left: 165px;
        }

        .socials-img {
            top: 0;
            left: -24px;
        }

        .benefits-img {
            top: 232px;
            left: -1px;
        }

        .listinfo-company {
            max-width: 316px;
        }

        .width--55 {
            width: 455px;
        }
        .firstcol-relative {
            left: 65px;
        }
        .lastcol-relative {
            left: -63px;
        }
        .us-vector-2 {
            left: 77px;
        }
    }
.top-30{
    top: 30px;
}
.homdesection-mobile{
    display: none;
}
.homdesection-topcompanies {
    background: #F6F9FF;
}
.company-constructor{
    display: none;
}
.divider-section-mob{
    display: none;
}
.secondcompany-container{
    padding-top: 50px;
}

@media (max-width: 768px) {
    .content-texttird {
        font-size: 14px;
        color: rgba(3, 3, 3, 0.72);
    }
    .contentFirstText {
        line-height: 30px;
    }
    .const-item-1, .const-item-2, .const-item-3 {
        position: relative;
    }
        .const-item-1::after {
            left: 0;
            position: absolute;
            content: "";
            width: 100%;
            height: 40px;
            z-index: 9;
            background: linear-gradient(180deg, rgba(239, 250, 255, 0.9) 0%, rgba(239, 250, 255, 0.583333) 20.31%, #F0F8F5 48.44%, rgba(241, 247, 237, 0.8) 72.92%, #F1F7ED 100%);
        }
        .const-item-2::after {
            background: linear-gradient(180deg, rgba(241, 247, 237, 0.9) 10%, rgba(240, 242, 248, 0.745) 75.39%, rgba(240, 240, 251, 0.7) 94.37%, rgba(240, 240, 252, 0.705484) 112.3%, rgba(240, 240, 255, 0.72) 159.77%, rgba(239, 250, 255, 0) 212.5%, #F0F0FF 212.5%);
            height: 40px;
            left: 0;
            position: absolute;
            content: "";
            width: 100%;
            z-index: 9;
        }
    .company-constructor{
        position:relative;
    }
    .company-constructor::after {
        background: linear-gradient(180deg, rgba(240, 240, 251, 0.9) 0%, rgba(240, 240, 251, 0.9) 0%, rgba(240, 240, 251, 0.27) 24.55%, rgba(250, 249, 249, 0.583333) 48.71%, rgba(250, 249, 249, 0.79) 70.83%, rgba(239, 250, 255, 0) 100%, rgba(250, 249, 249, 0.9) 100%);
        height: 60px;
        width: 100%;
        position: absolute;
        content: "";
        z-index: 9;
    }
    .const-item-4-after {
        height: 60px;
        width: 100%;
        background: linear-gradient(180deg, rgba(217, 217, 217, 0.37) 0%, rgba(250, 249, 249, 15.37) 0.01%, rgba(255, 245, 238, 0.58) 56.25%, rgba(255, 245, 238, 0.7) 81.77%, #FFF5EE 100%);
    }
    .const-item-5-after {
        background: linear-gradient(180deg, rgba(217, 217, 217, 0.37) 0%, rgba(250, 249, 249, 0.37) 0.01%, rgba(255, 245, 238, 0.58) 56.25%, rgba(255, 245, 238, 0.7) 81.77%, #FFF5EE 100%);
        transform: rotate(-180deg);
        height: 60px;
    }
    .const-item-2 {
        background: #F1F7ED;
        padding: 0 15px;
        padding-bottom: 30px;
    }
    .const-item-3 {
        background: #F0F0FB;
        padding: 0 15px;
    }
    .second-section {
        margin-top: 0px;
    }
    .divider-section-mob {
        display: block;
        background: linear-gradient(180deg, rgba(239, 250, 255, 0.9) 0%, rgba(239, 250, 255, 0.583333) 41.67%, rgba(239, 250, 255, 0) 100%, rgba(241, 247, 237, 0.9) 100%);
        transform: rotate(-180deg);
        height: 60px;
        position: relative;
    }
    .company-constructor {
        display: block;
    }
    .homdesection-back{
        display: none;
    }
    .homdesection-topcompanies {
        background: #fff;
    }
    .homdesection-mobile {
        display: block;
        overflow: hidden;
    }
    .homdesection-mobile {
        background: url(../homepage/mobile/mid.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 100%;
        background-position: 130% -38px;
    }
    .employe-sections {
        max-width: 260px;
        margin-top: 15px;
        margin-bottom: 10px;
        display: none;
    }
    .maintitlesection {
        font-style: normal;
        font-weight: 700;
        font-size: 26px !important;
        line-height: 35px;
        text-align: center;
        color: #000000;
        max-width: 360px;
        margin: auto;
        margin-top: 75px;
    }
    .text-homepage {
        text-align: center;
        padding: 0 15px;
    }
    .const-item-img{
        max-width: 400px;
        margin: auto;
    }
    .secondcompany-container{
        display: none;
    }
    .listinfo-company{
        max-width: unset;
    }
    .const-item-1 {
        padding: 0 15px;
        padding-bottom: 30px;
        background: #EFFAFF;
    }
    .const-content {
        padding: 0 20px;
        margin-top: 20px;
        padding-bottom: 70px;
    }
    .divider-section{
        display:none;
    }
    .third-section {
        margin-top: 0px;
        margin-bottom: 0px;
    }
    .third-animsection, .us-vector-1, .tooltypeItem-1, .tooltypeItem-2, .us-vector-2 {
        display: none;
    }
    .us-employee-1 {
        left: -70px;
        top: -100px;
        width: 100px;
    }
    .us-employee-2 {
        top: 30px;
        left: unset;
        right: -70px;
        width: 100px;
    }
    .find-EmployeeBox-content{
        margin-top: 20px;
    }
    .mediumcontent-size {
        margin-top: 50px;
        margin-bottom: 10px;
    }
    .employebox-title{
        font-size: 28px !important;
        line-height: 36px !important;
    }
    .forth-section {
        padding-top: 50px;
    }

    .graf-first {
        height: 351px;
        position: relative;
        display: flex;
        margin: auto;
        top: 20px;
    }
    .sl-item {
        background: rgba(204, 220, 252, 0.5);
        width: 100%;
        overflow: hidden;
    }
    .graf-first > img {
        position: absolute;
    }
    .graf-search {
        top: 32px !important;
    }
    .graf-second {
        top: 22px !important;
        left: -35px;
        margin: unset;
        width: 410px !important;
    }
    .graf-second > img {
        position: absolute;
        left: -27px;
    }
    .collection-box {
        flex-direction: column;
        align-items: center !important;
    }
    .pkg-item-title{
        text-align:center;
    }
    .puckages-item{
        max-width: unset;
    }
    .pkg-item-text{
        text-align: center;
    }
    .contentFirstText{
        text-align: center;
        max-width: unset;
    }
    .collection-box > img {
        margin-right: unset !important;
        margin-bottom: 15px;
    }
    
    .find-EmployeeBox-content::before{
        content: unset ;
    }
    .forth-section{
        position: relative
    }
    .home-title {
        font-size: 24px !important;
        line-height: 37px;
    }
}
@media (max-width: 500px){
    .employe-sections{
        display: block;
    }
    .maintitlesection {
        margin-top: 0px;
    }
}
@media (max-width: 360px) {
    .graf-first {
        width: 340px;
    }
}
.progress {
    display: block;
    width: 100%;
    height: 2px;
    border-radius: 10px;
    overflow: hidden;
    background-color: rgba(138, 138, 138, 0.2);
    background-image: linear-gradient(to right, #0E46A1, #0E46A1);
    background-repeat: no-repeat;
    background-size: 0 100%;
    transition: background-size .4s ease-in-out;
    width: 92%;
    margin: auto;
}
.mob-animate-slider {
    width: 100%;
    overflow: hidden;
}
.btn-wr-arrow {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.1));
    display: flex;
    background: white;
    justify-content: center;
    align-items: center;
}
.graf-text {
    margin-top: 25px;
    padding: 0 15px;
}
.light-purple {
    background: #FAF9F9;
}
.forth-section{
    position:relative;
}

.forth-content {
    position: relative;
}
  
.inviteItem-text > p:nth-child(2){
    font-weight: 400 !important;
}

.border-radius-7 {
    border-radius: 7px;
}
.btn-homesearch {
    max-width: 124px;
    border-radius: 7px !important;
    max-height: 38px;
}
.inp-gr-btn{
    padding: 6px;
}
.w-75{
    width: 75% !important;
}
.form-homesearch{
    max-width: 800px;
    margin: auto;
}
.search-resultitem {
    background: rgba(255, 255, 255, 0.3);
    border-radius: 100px;
    padding: 6px 10px;
    color: rgba(255, 255, 255, 0.7) !important;
    text-decoration: none;
    margin-bottom: 10px;
}
.searcbox-itemcontent{
    padding-bottom: 75px;
    flex-wrap: wrap
}

.gsap-section {
    max-width: 1180px;
    margin: auto;
    margin-top: 70px;
}
.aquat-text {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 25px;
    color: rgba(0, 0, 0, 0.8);
}
.acquaintance-content {
    max-width: 442px;
    width: 100%;
}
.graf-firstmain {
    width: 394px;
    position: relative;
    top: 77px;
}
.tr-maintitle-1 {
    top: 106px;
    z-index: 9;
    left: 241px;
    font-size: 12px;
}
.tr-maintitle-2 {
    left: 252px;
    top: 123px;
    z-index: 9;
    font-size: 8px !important;
}
.tr-maintitle-3 {
    left: 255px;
    top: 135px;
    z-index: 9;
    font-size: 8px !important;
}
.fictivebtn {
    top: 190px;
    left: 193px;
}
.brd-btn {
    border: 0.5px solid #0E46A1;
}
.fict-container {
    justify-content: center;
    width: 225px;
}
.fictres-1 {
    width: 190px;
    top: 197px;
    left: 338px;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.15);
    opacity: 0;
    animation: fadeIn 1s forwards;
    animation-delay: 1.5s;
    z-index: 9;
}
.fictres-2 {
    width: 190px;
    top: 253px;
    left: 356px;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.15);
    opacity: 0;
    animation: fadeIn 1s forwards;
    animation-delay: 1.9s;
    z-index: 9;
}
.ficttoggle {
    top: 14px;
    left: 150px;
}
.cursor-invitemain-1 {
    top: 195px;
    left: 250px;
    z-index: 9;
    animation: bounce-fade-out 1s forwards;
    animation-delay: 1s;
}
.mynewalerts-text {
    position: absolute;
    top: 93px;
    width: 356px;
    left: 76px;
}
.tl-main-1 {
    font-weight: 700;
    font-size: 12px;
    line-height: 11px;
    display: flex;
    align-items: center;
    letter-spacing: 0.02em;
    color: #333D48;
    margin-bottom: 0;
}
.top-62{
    top: 62px !important;
}
.left-88 {
    left: 88px !important;
}
.top-270 {
    top: 274px;
}
.top-40 {
    top: 40px;
}
.mainres-last-4 {
    font-style: normal;
    font-weight: 700;
    font-size: 7px;
    line-height: 8px;
    text-align: center;
    color: #FFFFFF;
    position: absolute;
    top: 137px;
    left: 43px;
}
.diagonal-wallpaper{
    position:relative;
}
.diagonal-wallpaper::before {
  background: url(../homepage/fourdmain/wave.png);
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  content: "";
  width: 100%;
  height: 135%;
  top: -185px;
  z-index:9;
}
.pt-100 {
    padding-top: 100px;
}
@keyframes rotated-carousel-move-up {
    0% {
        transform: translateY(-50%) 
    }

    to {
        transform: translateY(0%)
    }
}

.container-mainresume {
    background: rgba(204, 220, 252, 0.5);
}
.res-onlinebuild {
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 10px;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    color: #1A1C6A;
    margin-bottom: 14px;
}
.small-greencircle {
    width: 6px;
    height: 6px;
    background: #339D5D;
    border-radius: 3px;
    border-radius: 50%;
}
.personal-res-section{
    max-width: 515px;
}
.personal-res-section > p {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #1E2532;
}
.outline-brnadbtn {
    background: rgba(255, 255, 255, 0.002);
    border: 1px solid #0E46A1;
    box-shadow: inset 0px 0px 0px 1px #D9DEEB;
    border-radius: 4px;
}
.outline-brnadbtn:hover {
   background: #0E46A1;
   color:white;
}
.adviceText {
    max-width: 515px;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    color: #1E2532;
}
.rotated-carousel-1 {
    position: absolute;
    transform: translateY(-50%);
    left: -5px;
    animation: rotated-carousel-move-up 100s linear infinite;
}
.rotated-carousel-2 {
    transform: translateY(-50%);
    position: absolute;
    left: 200px;
    animation: slide 90s linear infinite;
}
.rotated-carousel-3 {
    transform: translateY(-50%);
    position: absolute;
    left: 404px;
    animation: rotated-carousel-move-up 100s linear infinite;
}
.rotated-carousel-item {
    max-width: 183px;
    margin-bottom: 20px;
}
.rotated-carousel {
    position: relative;
    height: 536px;
    transform: rotate(-30deg);
    transform-origin: 0 0;
}
.pt-95{
    padding-top: 95px;
}
.rotated-carousel-section {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 50%;
}
.Zindex9999{
    z-index: 9999;
}
.text-blogdesc {
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    color: #637381;
}
.blog-logo-img {
    border-radius: 5px;
    width: 100%;
    object-fit: cover;
}
.blog-logo {
    height: 231px;
    overflow: hidden;
    display: flex;
}
.blogs-maincotainer {
    padding-top: 10px;
    background: #FFF5EB;
    position: relative;
}
.top-block {
    background: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.07);
    box-shadow: 0px 8px 24px rgba(149, 157, 165, 0.15);
    border-radius: 8px;
    max-width: 290px;
    min-height: 235px;
}
.blogs-maincotainer::before{
    position: absolute;
    content: "";
    background-image: url(../homepage/blog/up.png);
    width: 100%;
    height: 47px;
    background-size: cover;
    background-repeat: no-repeat;
    top: -47px;
}
.blogs-maincotainer::after {
    position: absolute;
    content: "";
    background-image: url(../homepage/blog/down.png);
    width: 100%;
    height: 47px;
    background-size: cover;
    background-repeat: no-repeat;
}
@media (max-width: 1200px) {
    .Topjobs {
        max-width: 1050px;
    }
    .gsap-section {
        max-width: 900px;
        margin: auto;
    }
}

@media (max-width: 768px) {
    .diagonal-wallpaper::before {
        content: unset !important;
    }
}

@media (max-width: 1200px) {
    .invite-itembox-main, .itemInviteus-main {
        left: 200px;
    }

    .fictres-1 {
        width: 190px;
        top: 199px;
        left: 256px;
    }

    .fictres-2 {
        width: 190px;
        top: 255px;
        left: 253px;
    }

    .fictivebtn {
        top: 190px;
        left: 144px;
    }

    .mynewalerts-text {
        left: 31px;
    }

    .left-88 {
        left: 44px !important;
    }

    .mainonooff-sec-4, .mainonooff-sec, .mainonooff-sec-2, .mainonooff-sec-3, .mainonooff-sec-5, .mainonooff-sec-6 {
        left: 175px;
    }

    .cursor-invite-main {
        right: 132px;
    }
}
@media (max-width: 992px) {
    .tooltypeItem-2 {
        top: -89px;
    }
    .mynewalerts-text {
        left: 45px;
        top: 87px;
        width: 317px;
    }
    .gsap-section {
        max-width: 738px;
    }
    .cursor-invite-main {
        right: 111px;
    }
    .graf-firstmain {
        width: 360px;
    }
    .left-88 {
        left: 50px !important;
    }
    .tr-maintitle-1 {
        top: 99px;
        left: 180px;
    }

    .tr-maintitle-2 {
        left: 199px;
        top: 118px;
    }

    .tr-maintitle-3 {
        left: 201px;
        top: 128px;
    }

    .fictivebtn {
        top: 175px;
        left: 134px;
    }

    .fictres-1 {
        top: 201px;
        left: 217px;
    }
    .fictres-2 {
        top: 257px;
        left: 227px;
    }
    .mainonooff-sec-4, .mainonooff-sec, .mainonooff-sec-2, .mainonooff-sec-3, .mainonooff-sec-5, .mainonooff-sec-6 {
        left: 153px;
    }
    .cvmainitem-1 {
        top: 150px;
    }
    .cvmainitem-2 {
        top: 204px;
    }
    .cvmainitem-3 {
        top: 256px !important;
    }
    .cvmainitem-4 {
        top: 307px;
    }
    .cvmainitem-5 {
        top: 360px;
    }
    .cvmainitem-6 {
        top: 412px;
    }
    .mainonooff-sec {
        top: 162px;
    }
    .mainonooff-sec-2 {
        top: 216px;
    }
    .mainonooff-sec-3 {
        top: 269px;
    }
    .mainonooff-sec-4 {
        top: 324px;
    }
    .mainonooff-sec-5 {
        top: 377px;
    }
    .mainonooff-sec-6 {
        top: 428px;
    }
}
.grayscale{
    opacity: 0.7
}

.small-textcontent {
    max-width: 640px;
    margin: auto;
    color: #515151;
    margin-bottom: 10px;
}
.small-contentgsap {
    max-width: 523px;
    margin: auto;
    color: #515151;
    margin-top: 5px;
}
.hd-slidetitle {
    margin-right: 80px;
}
.left-resinfo {
    padding-top: 100px;
    margin-left: 55px;
    margin-bottom: 100px;
}
.fontSize25{
    font-size: 25px !important;
}
.font-grahapalat {
    font-family: 'grahapalat';
}
.all-topsbtn{
    padding-bottom: 175px;
}
.acquaintance-content > h4{
    margin-bottom: 15px;
}
.ft-jobs {
    min-height: 465px;
}
.icon-infsize{
    width: 38px;
}
.container-mainresume::after {
    position: absolute;
    content: "";
    height: 133px;
    width: 100%;
    z-index: 9;
    background: linear-gradient(180deg, rgba(204, 220, 252, 0.4) 0%, rgba(204, 220, 252, 0.355) 25%, rgba(204, 220, 252, 0.12) 44.27%, rgba(250, 249, 249, 0.145) 64.58%, rgba(250, 249, 249, 0.425) 82.81%, rgba(250, 249, 249, 0.375) 100%);
}
.height-100{
    height: 100%;
}
.text-dt-title {
    max-width: 585px;
    margin: auto;
    margin-top: 75px;
}
.main-details-container{
    max-width: 1270px;
    margin: auto;
}
.blog-item {
    max-width: 370px;
    display: block;
    margin: auto;
    color: black !important;
}
.top-jobs-panel {
    border: 1px solid rgba(0, 0, 0, 0.07);
    box-shadow: 0px 8px 24px rgba(149, 157, 165, 0.15);
    border-radius: 8px !important;
}
.innerdetails-resume{
    padding-top: 100px;
}
.infojobs-descs {
    margin-top: 100px;
    padding-bottom: 115px;
}
.gsap-blog-section{
    padding-bottom:50px;
}
.pt-175 {
    padding-top: 175px;
}

.aqua-text-color {
    color: #515151 !important;
}

.us-employee-1 {
    position: relative;
}

.us-employee-2 {
    position: relative;
}

.acquaintance-content > p {
    margin-bottom: 22px !important;
}

.pb-88 {
    padding-bottom: 88px;
}

.min-height-385 {
    min-height: 385px;
}
.infojobs-descs-cotent{
    justify-content: center;
}
@media (max-width: 1300px) {
    .main-details-container{
        padding: 0 15px;
    }
}
@media (max-width: 768px) {
    .jobsmall-title {
        font-size: 14px;
        line-height: 26px;
    }
    .us-employee-1::after, .us-employee-2::after {
        width: 107px;
        height: 107px;
    }
    .gsap-blog-section {
        padding-bottom: 0px;
    }
    .infojobs-descs {
        margin-top: 58px;
    }

    .blogs-maincotainer {
        padding-right: 15px;
        padding-left: 15px;
    }

    .left-resinfo {
        margin-left: 15px;
        padding-top: 0px;
        margin-bottom: 0px;
    }

    .all-topsbtn {
        padding-bottom: 83px;
    }

    .innerdetails-resume {
        padding-top: 40px;
        position: relative;
    }

    .innerdetails-resume::before {
      position: absolute;
      content: "";
      width: 100%;
      height: 51px;
      background: linear-gradient(180deg, rgba(204, 220, 252, 0.4) 0%, rgba(204, 220, 252, 0.355) 25%, rgba(204, 220, 252, 0.12) 44.27%, rgba(250, 249, 249, 0.145) 64.58%, rgba(250, 249, 249, 0.425) 82.81%, rgba(250, 249, 249, 0.375) 100%);
      transform: rotate(180deg);
      top: -51px;
    }

    .diagonal-wallpaper {
        background: #FAF9F9;
    }

    .text-dt-title {
        margin-top: unset;
        padding-top: 111px;
    }
    .blogs-maincotainer::before {
        background-image: unset;
        width: 100%;
        left: 0;
        background: linear-gradient(180deg, rgba(217, 217, 217, 0.37) 0%, rgba(250, 249, 249, 0.37) 0.01%, rgba(255, 245, 235, 0.58) 56.25%, rgba(255, 245, 235, 0.7) 81.77%, #FFF5EB 100%);
    }
    .blogs-maincotainer::after {
        background-image: unset;
        width: 100%;
        left: 0;
        background: linear-gradient(180deg, rgba(217, 217, 217, 0.37) 0%, rgba(250, 249, 249, 0.37) 0.01%, rgba(255, 245, 235, 0.58) 56.25%, rgba(255, 245, 235, 0.7) 81.77%, #FFF5EB 100%);
        transform: rotate(-180deg);
    }
    .more-infojobs{
        display: none;
    }
}
@media (max-width: 576px){
    .left-resinfo {
        margin-left: 10px;
    }
    .infojobs-descs-cotent {
        justify-content: start;
    }
}
.maxwidthunset{
   max-width: unset;
}
.header-boxshadow {
    box-shadow: 0px 4px 40px rgba(0, 0, 0, 0.15);
}
.arrow-hover {
    transition: .3s;
}
.arrow-hover:hover .arrow-img {
   transform: translateX(5px);
   transition: .3s;
}
.linkget-company {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: #000000;
}
.featured-jobs-link a {
    font-style: normal;
    font-weight: 700;
    font-size: 16px !important;
    line-height: 20px;
    color: #000000;
}
.infojobmore::after {
    top: 7px !important;
}
.custom-prev-arrow {
    left: 25px;
    z-index: 9;
}
.custom-next-arrow {
    right: 25px;
}
.mainsearch-container{
    top: 50px;
}

.w-78 {
    width: 90%;
}
.inp-gr-btnsearch {
    align-items: center;
    max-width: 131px;
    width: 100%;
}
@media (max-width: 576px) {
    .btn-homesearch {
        max-width: 52px;
    }
    .inp-gr-btnsearch {
        max-width: 60px;
    }
}
.unanimate-flag{
    animation: unset;
    opacity: 1;
}
.cursor-flag {
    animation: unset;
    opacity: 0;
}
.no-unimate {
    animation: unset !important;
}
.title-mob-section{
    margin-bottom: 17px;
}
.m-0-25 {
    margin: 0 25px;
}

.lnh-34 {
    line-height: 34px;
}
.height-whitecand {
    height: 240px;
    background: #faf9f9;
}
@media (max-width: 768px){
    .height-whitecand {
        height: 150px;
        background: #faf9f9;
    }
    .res-sections::after {
        content: "";
        background-image: url(../homepage/mobile/resume.png);
        position: absolute;
        width: 57%;
        height: 100%;
        top: 0px;
        background-repeat: no-repeat;
        background-size: cover;
        right: 0px;
        background-position: right;
        opacity: 0.3;
    }
}
.Topjobs {
    min-height: 126px;
}
.topjobsfor-company {
    display: none;
}
.jobtag-text {
    overflow: hidden;
    white-space: nowrap;
    width: 95px;
}
.stripe-box-content {
    transform: translateX(-50%);
    animation: scrollAnimate 25s linear infinite;
}
.stripe-box {
    background: #000;
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    overflow: hidden;
    justify-content: center;
}
@keyframes scrollAnimate {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-50%);
    }
}
.stripe-img {
    margin-right: 35px;
    width: 315px;
}
.tal-employee {
    padding: 48px 20px;
    background: #F1F7ED;
    position: relative;
}
.maxtext-tal {
    max-width: 587px;
    margin: auto;
}
.tal-employee p {
    color: #515151;
    line-height: 23px;
}
.desc-talsection{
    margin-top: 64px;
}
.tal-employee::before {
    content: "";
    position: absolute;
    background: url(/Content/homepage/talent/up.png);
    height: 95px;
    width: 100%;
    left: 0;
    top: -48px;
    z-index: 99;
    background-repeat: no-repeat;
    background-size: cover;
}
.tal-employee::after {
    content: "";
    position: absolute;
    background: url(/Content/homepage/talent/down.png);
    height: 95px;
    width: 100%;
    left: 0;
    z-index: 9999;
    background-repeat: no-repeat;
    background-size: cover;
}
.flipper-container {
    position: relative;
    margin: 0px auto;
    height: 475px;
    width:100%;
    overflow: hidden;
}

.flip {
    animation: flip-templates-center 10s linear(0 .000001%,0 1.8%,.01 3.6%,.03 6.35%,.07 9.1%,.13 11.4%,.19 13.4%,.27 15%,.34 16.1%,.54 18.35%,.66 20.6%,.72 22.4%,.77 24.6%,.81 27.3%,.85 30.4%,.88 35.1%,.92 40.6%,.94 47.2%,.96 55%,.97 64%,.98 74.4%,.99 86.4%,1 100%) infinite both;
    transform-style: preserve-3d;
    transform: translateZ(0);
}

@keyframes flip-templates-center {
    0% {
        transform: translateX(0) rotateY(0);
        transform-origin: 50% 50%
    }

    50% {
        transform: translateX(0) rotateY(180deg);
        transform-origin: 50% 50%
    }

    to {
        transform: translateX(0) rotateY(1turn);
        transform-origin: 50% 50%
    }
}
.face {
    position: absolute;
    height: 100%;
    width: 100%;
    backface-visibility: hidden;
}

.face.back {
        display: block;
        transform: rotateY(180deg);
        box-sizing: border-box;
        color: #fff;
        text-align: center;
 }
@media (max-width: 992px){
    .flipper-container {
        height: 700px;
    }
}
@media (max-width: 768px) {
    .flipper-container {
        height: 600px;
    }

    .tooltypename-1, .tooltypename-2 {
        display: none
    }

    .sales-boximg-1 {
        position: absolute;
        bottom: 0;
        left: -80px;
    }
    .sales-boximg-2 {
        position: absolute;
        right: -85px;
    }
}
@media (max-width: 576px){
    .sales-boximg-1 {
        left: 0px;
    }

    .sales-boximg-2 {
        right: 0px;
    }
}
@media (max-width: 550px) {
    .flipper-container {
        height: 350px;
    }
    .tal-employee {
        padding-bottom: 0px;
    }
}

.topcompany-block{
    min-height: 141px;
}