/* Minification failed. Returning unminified contents.
(931,21): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1045,28): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1046,28): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1055,21): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1203,17): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1221,28): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1286,28): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1298,17): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1313,17): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1321,28): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1333,32): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1626,28): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1743,26): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1745,32): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1753,25): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1814,28): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1832,37): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1840,28): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1851,21): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(1980,17): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(2007,37): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(2018,37): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(2113,37): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(2129,38): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(2145,40): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(2161,39): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(2219,36): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(2278,25): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(2298,1): run-time error CSS1019: Unexpected token, found '@import'
(2298,9): run-time error CSS1019: Unexpected token, found 'url(/Content/styles/views/LandingPages/https:/fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap)'
(2647,28): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color-tint-1'
(2682,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(2683,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(2787,29): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(2843,28): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(3060,28): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color-tint-1'
(3134,29): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color-tint-1'
(3144,32): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color-tint-1'
(3152,36): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color-tint-1'
(3246,35): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color-tint-1'
(3596,22): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color-tint-1'
(4489,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(4490,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '30%'
(4503,1): run-time error CSS1019: Unexpected token, found '@-webkit-keyframes'
(4504,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '30%'
(5524,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(5525,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '30%'
(5538,1): run-time error CSS1019: Unexpected token, found '@-webkit-keyframes'
(5539,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '30%'
(6354,38): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
(6365,38): run-time error CSS1039: Token not allowed after unary operator: '-skilly-main-color'
 */
body {
    font-family: Helvetica, Arial, sans-serif;
}

.skilly-home-container {
    line-height: 1.5;
    font-size: 1em;
    background-color: #fff;
}

    .skilly-home-container.newHomePage {
        overflow-x: hidden;
    }

.referialLanding.container {
    width: 1100px;
    box-sizing: border-box;
}

.botAnswerBox,
.clientAnswerBox {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    width: auto;
    max-width: 100%;
    margin-bottom: 40px;
    z-index: 2;
    position: relative;
    opacity: 0.9;
}

.clientAnswerBox {
    justify-content: flex-end;
}

.botAnswerContent {
    background-color: #d4eded;
    border-radius: 5px;
    border-top-left-radius: 0px;
    color: #006666;
    padding: 5px 15px;
    font-weight: 500;
}

.smallText {
    font-size: 26px;
}

.botAnswerContentPadding {
    padding-right: 13% !important;
}

.botFace {
    height: 60px;
    width: auto !important;
}

.clientAnswerContent {
    background-color: #006666;
    border-radius: 5px;
    border-top-right-radius: 0px;
    color: #ffffff;
    padding: 5px 15px;
    width: auto !important;
}

.topLandingImg {
    position: absolute;
    z-index: 1;
    width: 43vw;
    top: -25vw;
    left: -5vw;
    max-width: 830px;
}

.clientAnswerBox + .botAnswerBox {
    z-index: 0;
}

.orangeBack {
    background-color: #f9b228;
    height: 100%;
}

    .orangeBack span,
    .freeForever span {
        display: block;
        max-width: 671px;
        color: #fff;
        font-weight: 500;
    }

.bigText {
    font-size: 54px;
}

.freeForever {
    position: relative;
}

    .freeForever .bigText {
        text-transform: uppercase;
    }


    .freeForever span.whiteBtn a,
    .btnFooter span.whiteBtn a {
        color: #006666;
        text-transform: uppercase;
        padding: 10px 40px;
        display: inline-block;
        width: auto !important;
        background-color: #fff;
        margin-top: 25px;
        transition: all 0.5s ease-in-out;
        cursor: pointer;
    }


    .freeForever span.whiteBtn:hover a,
    .btnFooter span.whiteBtn:hover a {
        background-color: #006666;
        color: #fff !important;
    }

.featuresImgBack + div {
    margin-bottom: 120px;
}

.orangeBox {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    flex-direction: row;
    margin: 80px 0px;
}

    .orangeBox.topBox {
        margin: 170px 0 80px 0;
    }

    .orangeBox.freeForever {
        margin-bottom: 0px;
    }

.orangeBack.col-md-10,
.freeForever .col-md-10 {
    padding: 25px 20px 25px 90px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.leftOrangePart {
    display: inline-block;
    width: calc((100vw - 1100px) / 2);
    height: 17vw;
    margin: 0px;
    height: 220px;
}

.noMargin {
    margin: 0px !important;
}

.referialLanding.container.noMargin {
    padding-left: 0px;
}

.featuresName {
    font-size: 47px;
    color: #006666;
    margin: 140px 0 80px 0;
    font-weight: 500;
}

.featuresHeading {
    text-align: center;
    margin: 30px 0 20px 0;
    min-height: 60px;
}

.mediumText {
    font-size: 22px;
}

.featuresImgBack {
    position: relative;
    margin-top: 100px;
    max-width: 720px;
    margin: auto;
    display: block;
    width: 48vw;
    margin-bottom: 5vw;
}


.features {
    margin-bottom: 100px;
}

.featuresBox {
    position: relative;
    background-image: url(/Content/images/landingpages/customerportal/vector_elements_1.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
}

.featuresHeading.green {
    color: #66cc99;
}

.featuresHeading.blue {
    color: #339999;
}

.featuresHeading.orange {
    color: #ff9933;
}

.featuresHeading.red {
    color: #cc6699;
}

.featuresContent {
    color: #666666;
    font-size: 16px;
    text-align: center;
}

.featuresImg {
    height: 60px;
    display: block;
}

.featuresBox > div {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
}

.chatBox {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.orangeBox.freeForever {
    width: 100%;
    background: url(/Content/images/landingpages/customerportal/free_forever_BG.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
}

    .orangeBox.freeForever .leftOrangePart {
        height: 371px;
    }

.laptopForever {
    position: absolute;
    top: -10vw;
    right: 0px;
    width: 32vw;
}
/*style tabs start*/

/* Android 2.3 :checked fix */
@keyframes fake {
    from {
        opacity: 1;
    }

    to {
        opactity: 1;
    }
}

body {
    animation: fake 1s infinite;
}

.radio-tabs .state {
    position: absolute;
    left: -10000px;
}



.tabs {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    margin-left: 60px;
}

.radio-tabs .tab .circle {
    width: 50px;
    height: 50px;
    vertical-align: top;
    background-color: #fff;
    border: 1px solid #006666;
    cursor: pointer;
    border-radius: 50%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin: auto;
}

.textLabel {
    font-size: 16px;
    color: #006666;
    margin-top: 15px;
    text-align: center;
    display: block;
    cursor: pointer;
}

.labelBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 220px;
    position: relative;
    padding: 0 17px;
}



    .labelBox .tab .circle:after {
        content: '';
        width: 165px;
        height: 1px;
        background-color: #006666;
        position: absolute;
        right: 62%;
        top: 25px;
        width: calc(100% - 50px);
    }

    .labelBox:first-child .tab .circle:after {
        display: none;
    }

.tabCircle {
    border-radius: 50%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    width: 40px;
    height: 40px;
    color: #006666;
    font-size: 23px;
    cursor: pointer;
}

.radio-tabs .tab .circle:hover {
    background-color: #fff;
}

.tab .circle:hover,
#tab1[aria-selected] ~ .tabs #tab1-tab .circle,
#tab1:checked ~ .tabs #tab1-tab .circle,
#tab2[aria-selected] ~ .tabs #tab2-tab .circle,
#tab2:checked ~ .tabs #tab2-tab .circle,
#tab3[aria-selected] ~ .tabs #tab3-tab .circle,
#tab3:checked ~ .tabs #tab3-tab .circle,
#tab4[aria-selected] ~ .tabs #tab4-tab .circle,
#tab4:checked ~ .tabs #tab4-tab .circle,
#tab5[aria-selected] ~ .tabs #tab5-tab .circle,
#tab5:checked ~ .tabs #tab5-tab .circle {
    background-color: #ffffff;
    border: 1px solid #f9b228;
    box-shadow: none;
    outline: none;
}

    .tab .circle:hover .tabCircle,
    #tab1[aria-selected] ~ .tabs #tab1-tab .circle .tabCircle,
    #tab1:checked ~ .tabs #tab1-tab .circle .tabCircle,
    #tab2[aria-selected] ~ .tabs #tab2-tab .circle .tabCircle,
    #tab2:checked ~ .tabs #tab2-tab .circle .tabCircle,
    #tab3[aria-selected] ~ .tabs #tab3-tab .circle .tabCircle,
    #tab3:checked ~ .tabs #tab3-tab .circle .tabCircle,
    #tab4[aria-selected] ~ .tabs #tab4-tab .circle .tabCircle,
    #tab4:checked ~ .tabs #tab4-tab .circle .tabCircle,
    #tab5[aria-selected] ~ .tabs #tab5-tab .circle .tabCircle,
    #tab5:checked ~ .tabs #tab5-tab .circle .tabCircle {
        background-color: #f9b228;
        color: #fff;
        box-shadow: none;
        outline: none;
    }

.radio-tabs .panels {
    background-color: #fff;
    margin-top: 90px;
}

.radio-tabs .panel {
    display: none;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
}

    .radio-tabs .panel img {
        width: 40%;
    }

.tabInfoBox {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    width: 60%;
    padding-left: 20px;
}

.tabHeading {
    color: #f9b228;
    border-bottom: 1px solid #f9b228;
    padding-bottom: 10px;
    width: 100%;
    margin-bottom: 25px;
}

    .tabHeading span {
        max-width: 370px;
        text-transform: uppercase;
        display: block;
        font-size: 25px;
        font-weight: 500;
    }

.radio-tabs ul {
    padding-left: 20px;
}

    .radio-tabs ul li {
        color: #666666;
        font-size: 16px;
    }

.tabBtnHolder span {
    text-transform: uppercase;
    color: #f9b228;
    font-size: 18px;
    border: 1px solid #f9b228;
    padding: 10px 40px;
    display: inline-block;
    width: auto !important;
    background-color: #fff;
    margin-top: 25px;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
}

.tabsectionBack {
    background-image: url(/Content/images/landingpages/customerportal/vector_elements_1.png);
    background-size: cover;
    background-position: bottom 0 left 0;
    background-repeat: no-repeat;
    margin-top: 80px;
    margin-bottom: 80px;
}

    .tabsectionBack .panel {
        border: 0px;
        box-shadow: none;
    }

.tabBtnHolder span:hover {
    background-color: #f9b228;
    color: #fff;
}

.tabBtnHolder span:first-child {
    margin-right: 20px;
}

.tabBtnHolder {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
}

#tab1[aria-selected] ~ .panels #tab1-panel,
#tab2[aria-selected] ~ .panels #tab2-panel,
#tab3[aria-selected] ~ .panels #tab3-panel,
#tab4[aria-selected] ~ .panels #tab4-panel,
#tab5[aria-selected] ~ .panels #tab5-panel,
#tab1:checked ~ .panels #tab1-panel,
#tab2:checked ~ .panels #tab2-panel,
#tab3:checked ~ .panels #tab3-panel,
#tab4:checked ~ .panels #tab4-panel,
#tab5:checked ~ .panels #tab5-panel {
    display: flex;
}

    #tab1[aria-selected] ~ .panels #tab1-panel .tabBtnHolder label:first-child,
    #tab1:checked ~ .panels #tab1-panel .tabBtnHolder label:first-child {
        display: none;
    }

    #tab5[aria-selected] ~ .panels #tab5-panel .tabBtnHolder label:last-child,
    #tab5:checked ~ .panels #tab5-panel .tabBtnHolder label:last-child {
        display: none;
    }


.tab.mobile {
    display: none;
    box-shadow: none;
    outline: none;
}

    .tab.mobile .tabCircle {
        background-color: #f9b228;
        color: #fff;
        box-shadow: none;
        outline: none;
    }




/*style tabs end*/

.orangeBox.btnFooter {
    width: 100%;
    background: url(/Content/images/landingpages/customerportal/buttons_BG.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: contain;
    background-size: cover;
    height: 130px;
    margin-bottom: 50px;
}

.btnFooter .col-md-12.col-s-12 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    height: 130px;
}

.btnFooter .leftOrangePart {
    height: 130px;
}

.btnFooter .col-md-12.col-s-12 span:first-child {
    margin-right: 15%;
}

.btnFooter .col-md-12.col-s-12 span,
.btnFooter .col-md-12.col-s-12 span a {
    min-width: 378px;
    text-align: center;
    display: block;
    margin: 0px;
}


@media only screen and (max-width: 1200px) {
    .topLandingImg,
    .laptopForever {
        display: none;
    }

    .referialLanding.container {
        width: 100%;
    }

    .featuresBox > div {
        margin-bottom: 40px;
    }

    .featuresHeading {
        margin: 10px 0 10px 0;
        min-height: auto;
    }

    .featuresName {
        margin: 40px 0 30px 0;
    }
}



@media only screen and (max-width: 1000px) {
    .tab.mobile {
        display: flex;
    }

    .tabs,
    .panels img {
        display: none;
    }

    .tabHeading span {
        width: 100%;
        max-width: 100%;
    }

    .tabInfoBox {
        padding-left: 0px;
    }

    .radio-tabs .panel {
        flex-direction: column;
        align-items: center;
    }

    .tabBtnHolder {
        justify-content: center;
    }

    .btnFooter .col-md-12.col-s-12 {
        flex-direction: column;
        height: 200px;
        justify-content: space-around;
    }

    .btnFooter .leftOrangePart,
    .orangeBox.btnFooter {
        height: 200px;
    }

    .btnFooter .col-md-12.col-s-12 span:first-child {
        margin-right: 0px;
    }

    .radio-tabs ul li {
        font-size: 16px;
    }
}

@media only screen and (max-width: 640px) {
    .tabInfoBox {
        width: 100%;
    }
}



/*new style home page*/
#particle-canvas {
    width: 100%;
    height: 100%;
}

.meetSkilliPart {
    position: relative;
    width: 100vw;
    height: 100vh;
    height: auto;
}

    .meetSkilliPart .pathSection {
        padding: 80px 80px 40px 80px;
        clip-path: polygon(0 0, 100% 0%, 100% 85%, 0% 100%);
        background-image: url(/Content/images/Header_Image.png);
        position: relative;
        box-sizing: border-box;
        background-size: cover;
        background-repeat: no-repeat;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
    }

.meetSkilliHeading {
    font-size: 70px;
    color: #fff;
    line-height: 70px;
    text-align: left;
    max-width: 700px;
    width: 100%;
    font-weight: bold;
}

    .meetSkilliHeading.small {
        font-size: 29px;
        line-height: 29px;
    }

.css-typing {
    width: 600px;
    margin-right: 30px;
}

.meetSkilliInfo {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    margin-top: 100px;
}

.meetSkilliBotHolder {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    box-sizing: border-box;
    position: relative;
    padding-left: 50px;
}

.skilly_home_header {
    width: 324px;
    height: auto;
    left: 145px;
    bottom: -50px;
    position: absolute;
    z-index: 9;
}

.meetSkilliInfoLeftPart {
    position: relative;
}

.textMessage {
    color: #333333;
    font-size: 16px;
    padding: 10px 20px;
    background-color: #fff;
    box-sizing: border-box;
    border-radius: 0px 4px 4px 4px;
    margin-bottom: 5px;
}

.choseAnOption {
    color: #fff;
    margin: 20px 0px;
    font-size: 16px;
    cursor: pointer;
}

    .choseAnOption:hover {
        text-decoration: underline;
    }

.skilly-home-container .skillsBoxHolder {
    width: 100%;
    margin: 0px;
    justify-content: flex-start;
    margin-top: 20px;
    margin-bottom: 80px;
}

.skilly-home-container .skillBox {
    margin-right: 20px;
    margin-left: 0px;
}

.skilly-home-container .skillBox {
    background: #fff;
}

.skilly_icon {
    width: 40px;
    height: auto;
    position: absolute;
    left: 0px;
    top: 0px;
}

/*type it animation*/
.css-typing h1 {
    border-right: .15em solid orange;
    white-space: nowrap;
    overflow: hidden;
}

    .css-typing h1:nth-child(1) {
        -webkit-animation: type 2s steps(40, end);
        animation: type 2s steps(40, end);
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    .css-typing h1:nth-child(2) {
        opacity: 0;
        -webkit-animation: type2 2s steps(40, end);
        animation: type2 2s steps(40, end);
        -webkit-animation-delay: 2s;
        animation-delay: 2s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }



@keyframes type {
    0% {
        width: 0;
    }

    99.9% {
        border-right: .15em solid orange;
    }

    100% {
        border: none;
    }
}

@-webkit-keyframes type {
    0% {
        width: 0;
    }

    99.9% {
        border-right: .15em solid orange;
    }

    100% {
        border: none;
    }
}

@keyframes type2 {
    0% {
        width: 0;
    }

    1% {
        opacity: 1;
    }

    99.9% {
        border-right: .15em solid orange;
    }

    100% {
        opacity: 1;
        border: none;
    }
}

@-webkit-keyframes type2 {
    0% {
        width: 0;
    }

    1% {
        opacity: 1;
    }

    99.9% {
        border-right: .15em solid orange;
    }

    100% {
        opacity: 1;
        border: none;
    }
}


@-webkit-keyframes blink {
    50% {
        border-color: tranparent;
    }
}












.skillyRegularHeading {
    font-size: 30px;
    color: #333;
    line-height: 30px;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
}

.skillySmallHeading {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

    .skillySmallHeading .boldText {
        color: #333333;
        font-size: 26px;
        font-weight: bold;
        text-align: left;
        text-transform: uppercase;
    }

    .skillySmallHeading .colorText.red {
        color: #FF5367;
        font-size: 40px;
        font-weight: bold;
        text-align: left;
        text-transform: uppercase;
    }

    .skillySmallHeading .colorText.blue {
        color: var(--skilly-main-color);
        font-size: 40px;
        font-weight: bold;
        text-align: left;
        text-transform: uppercase;
    }

.skillyLearningPart {
    padding-top: 60px;
}

.skillyBook {
    width: 180px;
}

.skillyArrow {
    position: absolute;
    top: 151px
}

.skillyQuestion {
    width: 190px;
}

.learningImageBox {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 40px;
    flex-direction: row;
    position: relative;
}

    .learningImageBox .skillyBox:first-child {
        margin-right: 200px;
    }

.skillyBox {
    padding-bottom: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

    .skillyBox .skillySmallHeading {
        margin-top: 25px;
    }
/*how it works section*/
.circleHolder {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    margin-top: 60px;
}

.circleBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}

.circleWhiteLine {
    position: absolute;
    right: calc(50% - 215px);
    top: 25px;
    width: calc(100% - 50px);
    height: 1px;
    background-color: #fff;
}

.circle {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 1px solid #fff;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.circleText {
    font-size: 18px;
    text-transform: uppercase;
    color: #fff;
    font-weight: bold;
    line-height: 20px;
    margin-top: 40px;
    max-width: 240px;
    text-align: center;
}

.skillyRegularHeading.white {
    color: #fff;
}

.numberCircle {
    font-size: 26px;
    color: #fff;
}

.btnTryIt {
    color: #fff;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: bold;
    padding: 10px 65px;
    border: 1px solid var(--skilly-main-color);
    background-color: var(--skilly-main-color);
    transition: all 0.3s ease-in-out;
    cursor: pointer;
    margin-bottom: 20px;
    border-radius: 7px;
    margin-top: 60px;
}

    .btnTryIt:hover {
        color: var(--skilly-main-color);
        background-color: #fff;
    }

.descriptionBtn {
    text-align: center;
    font-size: 14px;
    color: #fff;
}

.howItWorksPart {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    clip-path: polygon(0 0, 100% 0%, 100% 75%, 0% 100%);
    background-image: url(/Content/images/How_It_Works_Section_Image.png);
    box-sizing: border-box;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 145px 0px;
}
/*Strategy part*/

.circleStrategyHolder {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-top: 60px;
    margin-bottom: 80px;
}

.circleStrategyBox {
    position: relative;
    border-radius: 50%;
    margin-right: 31px;
    box-sizing: border-box;
}

.circleBackground {
    border-radius: 50%;
}

.circleStrategyBox:last-child {
    margin-right: 0px;
}

.strategyInfro {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    width: 93%;
    height: 93%;
    border-radius: 50%;
    left: 10px;
    top: 9px;
    background: #fff;
}

.circleBackground {
}

.rotateAnimation {
    transition: all 0.3s ease-in-out;
}

.circleStrategyBox:hover > .rotateAnimation {
    transform: rotate(180deg);
}

.half-circle-solid {
    width: 260px;
    height: 130px;
    border-top-left-radius: 160px;
    border-top-right-radius: 160px;
    border: 2px solid #000;
    border-bottom: 0;
}

.half-circle-dot {
    width: 260px;
    height: 130px;
    border-bottom-left-radius: 160px;
    border-bottom-right-radius: 160px;
    border: 2px dashed #000;
    border-top: 0;
}

.arrowHolder {
    position: absolute;
    right: -50px;
    top: calc(50% - 10px);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
    z-index: 2;
    width: 52px;
}

.arrowLine {
    width: 30px;
    height: 2px;
    background: #000;
}

.arrow {
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 20px solid #000;
    z-index: 5;
}

.arrowBorder {
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left: 22px solid #fff;
    z-index: 4;
    position: absolute;
    left: 31px;
}

.strategyHeading {
    font-size: 20px;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 20px;
    max-width: 155px;
    text-align: center;
}

.strategyDescription {
    font-size: 16px;
    text-align: center;
    width: 211px;
}

.circleStrategyBox.white .strategyHeading,
.circleStrategyBox.white .strategyDescription {
    color: var(--skilly-main-color);
}

.circleStrategyBox.blue .strategyHeading,
.circleStrategyBox.blue .strategyDescription {
    color: #FFFFFF;
}

.circleStrategyBox.red .strategyHeading,
.circleStrategyBox.red .strategyDescription {
    color: #FFFFFF;
}

.circleStrategyBox.red .strategyInfro {
    background-color: #FF5367;
}

.circleStrategyBox.blue .strategyInfro {
    background-color: var(--skilly-main-color);
}

.hrStrategyPart {
    position: relative;
    clip-path: polygon(0 21%, 100% 0%, 100% 71%, 0% 100%);
    padding: 187px 0px;
    box-sizing: border-box;
    background: #F8F8F8;
    margin-top: -175px;
}
/*price part*/


.pricingBoxHolder {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: center;
    padding-top: 60px;
}

.descriptionPrice {
    min-height: 111px;
}

.pricingBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px 30px;
    -webkit-box-shadow: 1px -2px 10px 0px rgba(173,171,173,1);
    -moz-box-shadow: 1px -2px 10px 0px rgba(173,171,173,1);
    box-shadow: 1px -2px 10px 0px rgba(173,171,173,1);
    margin-right: 30px;
}

    .pricingBox:last-child {
        margin-right: 0px;
    }

    .pricingBox:hover {
        background-color: #E9FAF9;
    }

.iconPrice {
    width: 60px;
}

.iconBorderHover {
    width: 80px;
    height: 80px;
    box-sizing: border-box;
    padding: 10px;
    border: 1px solid transparent;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.pricingBox:hover .iconBorderHover {
    border: 1px solid var(--skilly-main-color);
}

.namePrice {
    font-size: 24px;
    text-transform: uppercase;
    color: #333333;
}

.textPrice {
    font-size: 55px;
    font-weight: bold;
    color: var(--skilly-main-color);
    text-align: center;
    text-transform: uppercase;
}

.descriptionPrice p {
    color: #000;
    font-size: 16px;
    text-align: center;
    margin-bottom: 5px;
    max-width: 200px;
}


.buttonPrice {
    color: var(--skilly-main-color);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: bold;
    padding: 10px 40px;
    border: 1px solid var(--skilly-main-color);
    background-color: #fff;
    transition: all .3s ease-in-out;
    cursor: pointer;
    margin-bottom: 20px;
    border-radius: 7px;
    margin-top: 40px;
    text-transform: uppercase;
}

    .buttonPrice:hover {
        color: #fff;
        background-color: var(--skilly-main-color);
    }

/*product abilitics*/
.skillyRegularSubHeading {
    color: #000000;
    font-size: 20px;
    text-transform: uppercase;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 60px;
}

.abiliticsProduct {
    padding: 100px 0px 60px 0px;
}

.abiliticsProductLogo {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.logoBox {
    width: 230px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

    .logoBox.left {
        justify-content: flex-start;
        margin-right: 30px;
    }

    .logoBox.center {
        justify-content: center;
        margin-right: 30px;
    }

    .logoBox.right {
        justify-content: flex-end;
    }

.abiliticsProductLogo img {
    height: auto;
    width: auto;
}

    .abiliticsProductLogo img.customHeight {
        height: 35px;
    }

/*sing up part*/
.singUpPart {
    position: relative;
}

.singUpBox {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    position: relative;
    clip-path: polygon(0 21%,100% 0%,100% 71%,0% 100%);
    padding: 187px 0;
    box-sizing: border-box;
    background-color: #f8f8f8;
    background-image: url(/Content/images/Sign_UP_Background.png);
    background-position: bottom;
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: -60px;
    padding-top: 300px;
}

.singUpLeft {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.singUpHeading {
    font-size: 40px;
    font-weight: bold;
    color: #000000;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.singUpSubHeading {
    font-size: 30px;
    color: #000000;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.singUpSubSubHeading {
    font-size: 24px;
    font-weight: bold;
    color: #000000;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.singUpLeft .btnTryIt {
    padding: 10px 30px;
    margin-top: 20px;
}

.singUpLeft .leftArrow {
    position: absolute;
    top: 36px;
    left: -101px;
}

.singUpRight {
    position: relative;
    width: 350px;
}

    .singUpRight .rightArrow {
        position: absolute;
        top: -75px;
        left: -57px;
    }

.singUpBot {
    width: 325px;
    height: auto;
    position: absolute;
    bottom: 90px;
    z-index: 2;
    right: 0px;
    right: calc((100% - 800px)/2);
}
/*boostYourSkills*/
.boostYourSkills {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    clip-path: polygon(0 18%,100% 0%,100% 87%,0% 100%);
    background-image: url(/Content/images/Boost_Your_Skills_Image.png);
    box-sizing: border-box;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 145px 0;
    margin-top: -256px;
    padding-bottom: 60px;
}



.flip-card {
    background-color: transparent;
    width: 300px;
    height: 300px;
    perspective: 1000px;
}

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.6s;
    transform-style: preserve-3d;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    border-radius: 7px;
}

.flip-card-front {
    background-color: #fff;
    color: black;
}

.flip-card-back {
    background-color: #2980b9;
    color: white;
    transform: rotateY(180deg);
    padding: 20px 30px;
}

.skillsCardHolder {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
}


.skillHeading {
    margin: 20px 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.flip-card {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-right: 30px;
    border-radius: 7px;
}

    .flip-card:last-child {
        margin-right: 0px;
    }

.skillBtn {
    color: #333;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: bold;
    padding: 10px 40px;
    border: 1px solid #333;
    background-color: #fff;
    transition: all .3s ease-in-out;
    cursor: pointer;
    margin-bottom: 20px;
    border-radius: 7px;
    margin-top: 40px;
    text-transform: uppercase;
}

    .skillBtn:hover {
        color: #fff;
        background-color: #333;
    }

.flip-card.orange .skillBtn {
    margin-top: 10px;
}

.borderTop {
    width: 100%;
    height: 15px;
    margin-bottom: 40px;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}


.flip-card.yellow .borderTop,
.flip-card.yellow .flip-card-back {
    background-color: #ffde00;
}

.flip-card.purple .borderTop,
.flip-card.purple .flip-card-back {
    background-color: #780096;
}

.flip-card.orange .borderTop,
.flip-card.orange .flip-card-back {
    background-color: #ffa000;
}

.flip-card.blue .borderTop,
.flip-card.blue .flip-card-back {
    background-color: #50b7ea;
}

.flip-card.red .borderTop,
.flip-card.red .flip-card-back {
    background-color: #ff5367;
}

.flip-card.green .borderTop,
.flip-card.green .flip-card-back {
    background-color: var(--skilly-main-color);
}

.skillIcon {
    width: 65px;
}

.skillHeading {
    color: #333333;
    font-size: 30px;
    font-weight: bold;
}

.backSkillHeading {
    color: #fff;
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 10px;
    line-height: 24px;
}

.skillDescription p {
    color: #fff;
    font-size: 18px;
}

.boostYourSkills .skillyRegularHeading {
    margin-bottom: 60px;
    margin-top: 90px;
}

.skillsCardHolder.mb {
    margin-bottom: 180px;
}

/*contact part*/
.contactInfo {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    margin-top: 60px;
    margin-bottom: 80px;
}

.contactInfoLeft {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.contactDescription {
    font-size: 18px;
    line-height: 18px;
    color: #333333;
    text-align: left;
    margin-bottom: 20px;
    width: 380px;
    font-weight: bold;
}

.contactPerson {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.contactPersonImg {
    width: 140px;
    margin-right: 15px;
}

.personDetails p {
    font-size: 16px;
    line-height: 18px;
    color: #333333;
    text-align: left;
    max-width: 125px;
    margin: 0px;
}

.contactInfoRight {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
}

    .contactInfoRight input::placeholder,
    .contactInfoRight textarea::placeholder {
        color: #D3D3D3;
    }

    .contactInfoRight input,
    .contactInfoRight textarea {
        border: 1px solid #D3D3D3;
        outline: none;
        border-radius: 7px;
        box-sizing: border-box;
        padding: 10px 20px;
        color: #333;
        font-size: 16px;
        height: 40px;
        width: 400px;
        margin-bottom: 10px;
    }

    .contactInfoRight textarea {
        resize: none;
        height: 90px;
    }

    .contactInfoRight input[type='submit'] {
        width: 190px;
        display: inline-block;
        background: var(--skilly-main-color);
        float: right;
        border: 1px solid var(--skilly-main-color);
        color: #fff;
        text-transform: uppercase;
        font-size: 16px;
        transition: all 0.3s ease-in-out;
    }

        .contactInfoRight input[type='submit']:hover {
            color: var(--skilly-main-color);
            background: #fff;
        }




/*newLandingPageBox landing page*/
.newLandingPageBox .borderTop {
    margin-bottom: 55px;
}

.newLandingPageBox .flip-card-back,
.newLandingPageBox .skillHeading {
    padding: 20px 20px;
}

.newLandingPageBox .skillDescription p {
    font-size: 16px;
    text-align: left;
    width: 100%;
}

.newLandingPageBox .flip-card:last-child .skillDescription p {
    font-size: 14px;
}

.newLandingPageBox .flip-card:last-child .skillBtn {
    margin-top: 0px;
}


.newLandingPageBox .meetSkilliPart .firstSection {
    height: 100vh;
    padding: 190px 80px 40px 80px;
    background-image: url(/Content/images/newLandingImages/Header-img.jpg);
    position: relative;
    box-sizing: border-box;
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.newLandingPageBox .skillySay {
    width: 324px;
    height: auto;
    left: 82px;
    top: 195px;
    position: absolute;
    z-index: 9;
}

.newLandingPageBox .skilly_icon {
    width: 99px;
    position: relative;
}

.newLandingPageBox .skillySayText {
    background-color: var(--skilly-main-color);
    padding: 8px 20px;
    color: #fff;
    font-size: 20px;
    border-radius: 10px;
    position: relative;
    display: inline-block;
    position: absolute;
    top: -15px;
}

    .newLandingPageBox .skillySayText:after {
        content: '';
        display: inline-block;
        width: 0;
        height: 0;
        border-left: 0px solid transparent;
        border-right: 12px solid transparent;
        border-top: 20px solid var(--skilly-main-color);
        position: absolute;
        left: 30px;
        bottom: -19px;
    }

.newLandingPageBox .buttonSolution {
    margin-top: 40px;
    background-color: var(--skilly-main-color);
    padding: 8px 20px;
    color: #fff;
    font-size: 16px;
    border-radius: 10px;
    position: relative;
    display: inline-block;
    cursor: pointer;
}

    .newLandingPageBox .buttonSolution:hover {
        color: var(--skilly-main-color);
        background-color: #fff;
    }

.newLandingPageBox .meetSkilliHeading {
    font-size: 44px;
    color: #fff;
    line-height: 45px;
    text-align: left;
    max-width: 478px;
    width: 100%;
    font-weight: bold;
    white-space: normal !important;
}

    .newLandingPageBox .meetSkilliHeading.small {
        font-size: 24px;
        line-height: 28px;
        font-weight: 300;
        text-transform: uppercase;
        max-width: 454px;
    }

.newLandingPageBox .css-typing h1:nth-child(1),
.newLandingPageBox .css-typing h1:nth-child(2) {
    animation: none;
    opacity: 1;
}

.newLandingPageBox .css-typing h1 {
    border-right: 0px;
}

.newLandingPageBox .skillyRegularHeading .red {
    color: #FD5367;
}

.newLandingPageBox .hrStrategyPart {
    position: relative;
    clip-path: none;
    padding: 90px 0px;
    box-sizing: border-box;
    background: #f8f8f8;
    margin-top: 0px;
}

.newLandingPageBox .half-circle-solid {
    border: 2px solid #FD5367;
    border-bottom: 0px;
}

.newLandingPageBox .arrowLine {
    background: #FD5367;
    width: 33px;
}

.newLandingPageBox .arrowHolder {
    right: -42px;
    top: calc(50% - 2px);
}

    .newLandingPageBox .arrowHolder .arrow,
    .newLandingPageBox .arrowHolder .arrowBorder {
        display: none;
    }

.newLandingPageBox .strategyHeading {
    margin-bottom: 10px;
    margin-top: 26px;
}

.newLandingPageBox .circleStrategyBox .strategyHeading {
    color: #FD5367;
}

.newLandingPageBox .circleStrategyBox .strategyDescription {
    line-height: 18px;
    width: 178px;
    color: #3A3A3A;
}

.newLandingPageBox .informedIcon.smallIcon {
    margin-top: 10px;
}

.newLandingPageBox .strategyInfro {
    justify-content: flex-start;
    padding-top: 30px;
}

.uniqueSolutionBoxHolder {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    margin-top: 60px;
}

.uniqueSolutionBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    position: relative;
}

.uniqueSolutionHead {
    text-align: center;
    font-size: 26px;
    line-height: 28px;
    color: #3a3a3a;
    text-transform: uppercase;
    margin-bottom: 15px;
    font-weight: 600;
}

.uniqueSolutionBox span {
    display: inline-block;
    text-align: center;
    font-size: 20px;
    line-height: 22px;
    color: #3A3A3A;
}

.uniqueSolution {
    padding: 90px 0px;
}

.skillyRegularHeading .blue {
    color: var(--skilly-main-color);
}

.uniqueSolution .skillyRegularHeading {
    margin-bottom: 20px;
}

.uniqueSolution .skillyRegularSubHeading {
    margin-bottom: 0px;
    color: #3A3A3A;
    margin-top: 0px;
    font-weight: 500;
}

.uniqueSolutionIcon {
    margin: 0 130px 0px 70px;
    position: relative;
}

.uniqueSolution .imageContainer {
    position: relative;
}

    .uniqueSolution .imageContainer::after {
        content: '';
        width: 132px;
        height: 1px;
        border-top: 2px dotted var(--skilly-main-color);
        left: -80px;
        top: 15px;
        display: inline-block;
        position: absolute;
    }

    .uniqueSolution .imageContainer::before {
        content: '';
        width: 132px;
        height: 1px;
        border-top: 2px dotted var(--skilly-main-color);
        right: -15px;
        top: 15px;
        display: inline-block;
        position: absolute;
    }

.skillyRegularSubHeading.white {
    color: #fff;
}

.assistance {
    padding: 50px 0px;
    background-image: url(/Content/images/newLandingImages/Test-background.jpg);
    position: relative;
    box-sizing: border-box;
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

    .assistance .skillyRegularSubHeading {
        margin-bottom: 0px;
    }

.buttonSolutionHolder {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 310px;
}

.newLandingPageBox .boostYourSkills {
    clip-path: none;
    padding: 90px 0px;
    margin-top: 0px;
    background-image: none;
}

.boostYourSkills .skillyRegularHeading,
.featuresPlatform .skillyRegularHeading {
    margin: 0px;
}

.featuresPlatformBoxHolder {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    margin-top: 40px;
}

.featuresPlatformBox {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    margin: 0px 10px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,.2);
    position: relative;
    width: 335px;
    height: 304px;
    padding: 30px 20px;
    box-sizing: border-box;
}

    .featuresPlatformBox .topBorder {
        position: absolute;
        top: 0px;
        left: 0px;
        display: block;
        width: 100%;
        height: 100%;
    }

    .featuresPlatformBox .bottomBorder {
        position: absolute;
        bottom: 0px;
        right: 0px;
        display: block;
        width: 100%;
        height: 100%;
    }

    .featuresPlatformBox .topBorder:after {
        content: '';
        width: 140px;
        height: 3px;
        position: absolute;
        left: 0px;
        top: 0px;
        border-top: 2px dotted var(--skilly-main-color);
        transition: all 0.3s ease-in-out;
    }

    .featuresPlatformBox:hover .topBorder:after {
        right: 0px;
        left: auto;
    }

    .featuresPlatformBox .topBorder:before {
        content: '';
        width: 3px;
        height: 140px;
        position: absolute;
        left: 0px;
        top: 0px;
        border-left: 2px dotted var(--skilly-main-color);
        transition: all 0.3s ease-in-out;
    }

    .featuresPlatformBox:hover .topBorder:before {
        top: auto;
        bottom: 0px;
    }

    .featuresPlatformBox .bottomBorder:after {
        content: '';
        width: 140px;
        height: 3px;
        position: absolute;
        right: 0px;
        bottom: 0px;
        border-bottom: 2px dotted var(--skilly-main-color);
        transition: all 0.3s ease-in-out;
    }

    .featuresPlatformBox:hover .bottomBorder:after {
        left: 0px;
        right: auto;
    }

    .featuresPlatformBox .bottomBorder:before {
        content: '';
        width: 3px;
        height: 140px;
        position: absolute;
        right: 0px;
        bottom: 0px;
        border-right: 2px dotted var(--skilly-main-color);
        transition: all 0.3s ease-in-out;
    }

    .featuresPlatformBox:hover .bottomBorder:before {
        top: 0px;
        bottom: auto;
    }

.featuresPlatformHead {
    text-align: center;
    text-transform: uppercase;
    color: #3A3A3A;
    font-size: 20px;
    line-height: 24px;
    min-height: 50px;
    width: 100%;
    font-weight: 600;
}

.featuresPlatformDesc {
    color: #3A3A3A;
    font-size: 18px;
    line-height: 22px;
    margin-top: 15px;
    text-align: center;
}

.pricing {
    padding: 90px 0px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.tablePricing {
    border: 1px solid #D6D6D6;
    margin-top: 50px;
}

    .tablePricing th {
        height: 92px;
        font-size: 24px;
        line-height: 28px;
        font-weight: 600;
        text-transform: uppercase;
    }

        .tablePricing th.component {
            text-align: left;
            color: #3A3A3A;
            background-color: #E4E4E4;
        }

        .tablePricing th.starterPack {
            text-align: center;
            color: #fff;
            background-color: var(--skilly-main-color);
        }

        .tablePricing th.professional {
            text-align: center;
            color: #fff;
            background-color: #FD5367;
        }

    .tablePricing .bigRow {
        height: 96px;
    }

    .tablePricing .smallRow {
        height: 57px;
    }

    .tablePricing .gray {
        background-color: #F2F2F2;
    }

        .tablePricing .gray b {
            color: #3A3A3A;
            font-size: 20px;
            text-transform: uppercase;
        }

        .tablePricing .gray p {
            color: #3A3A3A;
            font-size: 16px;
        }

    .tablePricing .white {
        background-color: #fff;
    }

        .tablePricing .white span {
            display: inline-block;
            width: 100%;
            text-align: center;
        }

        .tablePricing .white span,
        .tablePricing .white.smallText span b {
            font-size: 16px;
            color: #3A3A3A;
            text-transform: uppercase;
            font-weight: 600;
        }

        .tablePricing .white.smallText span {
            text-transform: none;
            font-weight: 300;
        }

        .tablePricing .white.blueText span,
        .tablePricing .white.blueText span a {
            text-transform: uppercase;
            font-weight: 600;
            color: var(--skilly-main-color);
            text-decoration: none;
            cursor: pointer;
        }

    .tablePricing th,
    .tablePricing td {
        box-sizing: border-box;
        padding: 20px;
        border: 1px solid #d6d6d6;
    }

.newLandingPageBox .abiliticsProductLogo img {
    width: 200px;
}

.pricing.mobile {
    display: none;
}
/*remote work landing page start*/
@import url(/Content/styles/views/LandingPages/https:/fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);

.remoteWorkPage,
.remoteWorkPage div,
.remoteWorkPage p,
.remoteWorkPage a,
.remoteWorkPage h1,
.remoteWorkPage h2,
.remoteWorkPage li,
.remoteWorkPage span {
    font-family: 'Montserrat', sans-serif !important;
}


.remoteWorkPart1 {
    background-image: url(/Content/images/newLandingImages/remoteWorkLanding/bgr-part1.svg);
    position: relative;
    box-sizing: border-box;
    background-size: 100%;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 150px 0px 192px 0px;
    background-position: top center;
}

.fixedWidthContainerBig {
    max-width: 1100px;
    margin: auto;
    width: 100%;
}

.remoteWorkPart1 .title {
    font-size: 70px;
    line-height: 75px;
    font-weight: 900;
    color: #0A3F5F;
}

.scrollmg {
    position: absolute;
    bottom: 10px;
    width: 85px;
    left: calc(50% - 52px);
}

.remoteWorkPart5 .subTitle {
    font-size: 40px;
    line-height: 45px;
    font-weight: normal;
    color: #22526F;
    margin-bottom: 20px;
}

.remoteWorkPart1 .subTitle {
    font-size: 50px;
    line-height: 50px;
    font-weight: normal;
    color: #22526F;
    margin-bottom: 20px;
}

.remoteWorkPart1 .description {
    font-size: 25px;
    line-height: 30px;
    font-weight: normal;
    color: #22526F;
    max-width: 500px;
    padding-left: 5px;
    max-width: 500px;
}

.remoteWorkPart1 .imgPart1 {
    max-width: 845px;
    position: relative;
    margin-right: 0px;
    margin-left: auto;
    display: block;
    z-index: 2;
    margin-top: -100px;
}

.remoteWorkPage .nameSection {
    font-size: 40px;
    line-height: 45px;
}

.nameSection {
    font-size: 40px;
    line-height: 45px;
    font-weight: 900;
    color: #22526F;
}

.subNameSection {
    font-size: 20px;
    line-height: 25px;
    font-weight: normal;
    color: #22526F;
}


.remoteWorkPart2 {
    background-image: url(/Content/images/newLandingImages/remoteWorkLanding/bgr_part2.svg);
    position: relative;
    box-sizing: border-box;
    background-size: 100%;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 375px 0px 325px 0px;
    margin-top: -280px;
}


.remoteWorkChallengesBox > img {
    width: 50%;
    z-index: 3;
    position: relative;
}

    .remoteWorkChallengesBox > img.aboutImg {
        position: absolute;
        left: 0;
        top: -90px;
        width: 740px;
        width: 570px;
    }

.remoteWorkChallengesBox {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin-top: 50px;
    z-index: 3;
}

    .remoteWorkChallengesBox.first {
        margin-top: 0px;
    }

.remoteWorkChallengesBox {
    margin-top: 30px;
}

    .remoteWorkChallengesBox.second .challengesConentHolder {
        margin-right: 100px;
    }

    .remoteWorkChallengesBox.third .challengesConentHolder {
        margin-left: 80px;
    }
    /*.remoteWorkChallengesBox.second {
        margin-top: 31px;
    }
    .remoteWorkChallengesBox.third {
        margin-top: -33px;
    }*/
    .remoteWorkChallengesBox.first .heading,
    .remoteWorkChallengesBox.first .description {
        max-width: 362px;
    }

    .remoteWorkChallengesBox.second .heading,
    .remoteWorkChallengesBox.second .description {
        max-width: 362px;
    }

    .remoteWorkChallengesBox.third .heading,
    .remoteWorkChallengesBox.third .description {
        max-width: 428px;
    }

    .remoteWorkChallengesBox:nth-child(odd) {
        flex-direction: row-reverse;
    }

.aboutSection .remoteWorkChallengesBox:nth-child(odd) {
    flex-direction: row;
    align-items: flex-start;
    position: relative;
    height: auto;
    justify-content: flex-end;
}

.aboutSection .absoluteText {
    position: absolute;
    top: -259px;
    right: 0px;
}

.remoteWorkChallengesBox .quotesClose {
    position: absolute;
    right: -55px;
    bottom: -18px;
    max-width: 60px;
    transform: rotate(180deg);
    z-index: 3;
}

.remoteWorkChallengesBox .quotesOpen {
    position: absolute;
    left: -30px;
    top: -34px;
    max-width: 60px;
}

.remoteWorkChallengesBox.first .quotesClose {
    right: -35px;
}

.remoteWorkChallengesBox.first .quotesOpen {
    left: -60px;
}

.remoteWorkChallengesBox .heading {
    color: #0A3F5F;
    font-size: 25px;
    line-height: 30px;
    font-weight: bold;
    text-align: center;
}

.remoteWorkChallengesBox .description,
.remoteWorkHomePage .description,
.skillyAboutRowBox .description div {
    color: #0A3F5F;
    font-size: 20px;
    line-height: 25px;
    font-weight: normal;
    max-width: 500px;
    text-align: center;
    margin-top: 10px;
}

.remoteWorkHomePage .remoteWorkChallengesBox .description,
.remoteWorkHomePage .description,
.remoteWorkHomePage .skillyAboutRowBox .description div {
    color: #0A3F5F;
    font-size: 25px;
    line-height: 30px;
    font-weight: normal;
    max-width: 500px;
    text-align: center;
    margin-top: 10px;
}

.remoteWorkHomePage .aboutSection .description.bigTextDesc {
    font-size: 40px;
    line-height: 45px;
    /*max-width: 662px;*/
    max-width: 405px;
    text-align: left;
}

.aboutSection .challengesConentHolder {
    max-width: 405px;
}

.remoteWorkPart2 .challengesConentHolder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    max-width: 500px;
}

.remoteWorkPart3 {
    background-image: url(/Content/images/newLandingImages/remoteWorkLanding/bgr_orange.svg);
    position: relative;
    box-sizing: border-box;
    background-size: 100%;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    /*padding: 100px 50px;*/
    padding: 210px 0px;
    /*padding-top: 0px;*/
    z-index: 2;
    position: relative;
    overflow: visible;
    margin-top: -400px;
    padding-top: 360px;
    padding-bottom: 260px;
}

    .remoteWorkPart3 .subNameSection {
        max-width: 470px;
        text-align: center;
    }

[class*="remoteWorkPar"] .chatBox {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    margin-top: 100px;
    max-width: 1000px;
    position: relative;
}

.skillyChat {
    z-index: 2;
    margin-bottom: 30px;
}

    .skillyChat.first,
    .skillyChat.fourth {
        margin-left: 100px;
    }

.remoteWorkImg3 {
    position: absolute;
    max-width: 1100px;
    top: -180px;
    right: 0px;
}

.chatRow {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.chatImg {
    width: 90px;
    margin-right: 20px;
}

.chatText {
    color: #0A3F5F;
    font-size: 20px;
    line-height: 25px;
    font-weight: normal;
    max-width: 500px;
    text-align: left;
    background-color: var(--skilly-main-color-tint-1);
    box-sizing: border-box;
    padding: 10px 20px;
    border-radius: 60px;
}

.skillyChat.third .chatText {
    max-width: 360px;
}

.chatText.whiteDots .dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #fff;
    margin-right: 10px;
    animation: wave 1.3s linear infinite;
}

.chatText.whiteDots {
    position: relative;
    min-width: 100px;
}



    .chatText.whiteDots .dot:nth-child(2) {
        animation-delay: -1.1s;
    }

    .chatText.whiteDots .dot:nth-child(3) {
        animation-delay: -0.9s;
    }

@keyframes wave {
    0%, 60%, 100% {
        transform: initial;
    }

    30% {
        transform: translateY(-15px);
    }
}

.remoteWorkPart4 {
    position: relative;
    box-sizing: border-box;
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: space-between;
    max-width: 1000px;
    margin: 150px auto;
    padding: 0px;
    margin-top: 0px;
}

.remoteWorkColumnBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    position: relative;
}

.remoteWorkColumnBoxText {
    color: #0A3F5F;
    font-size: 20px;
    line-height: 25px;
    font-weight: 900;
    max-width: 500px;
    text-align: center;
    max-width: 340px;
    height: 40px;
}

.remoteWorkColumnBoxImg {
    max-width: 140px;
    max-height: 90px;
    margin-top: 115px;
}

.remoteWorkColumnBoxArrow {
    position: absolute;
}

.remoteWorkPart5 .whiteBox {
    box-sizing: border-box;
    background: rgba(255,255,255,0.7);
    padding: 50px;
}

.remoteWorkColumnBoxArrow.long {
    top: -48px;
    left: 160px;
    width: 625px;
}
/*arrow animation start*/
/*.remoteWorkPart4.mouseOver:after {
    height: 270px;
    width: 0px;
    transition: 3s all ease-in-out;
    content: '';
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    background: #fff;
}
.remoteWorkPart4.mouseOver:after {
    width: 1200px;
}*/
/*arrow animation end*/
.remoteWorkColumnBoxArrow.short {
    right: 183px;
    top: -20px;
    width: 320px;
}

.remoteWorkPart5 {
    background-image: url(/Content/images/newLandingImages/remoteWorkLanding/bgr-part4.svg);
    position: relative;
    box-sizing: border-box;
    background-size: 100%;
    background-repeat: no-repeat;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 100px 50px;
    padding: 95px 0px 150px 0px;
    padding-bottom: 20px;
}

.tetsBoxHolder {
    box-sizing: border-box;
    padding: 50px;
    border: 2px dotted var(--skilly-main-color);
    background-color: #fff;
    max-width: 820px;
    padding-left: 135px;
    position: relative;
}

    .tetsBoxHolder a {
        max-width: 200px;
        margin-left: auto;
        margin-right: auto;
        border-radius: 60px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .tetsBoxHolder .subNameSection {
        max-width: 275px;
        text-align: center;
        margin: 30px auto 0px auto;
    }

.testBotImg {
    position: absolute;
    left: -160px;
    top: -125px;
    max-width: 304px;
}

.contactDescription.subTitle,
.remoteWorkPage .personDetails {
    font-size: 60px;
    line-height: 73px;
    font-weight: normal;
    color: #22526F;
    font-size: 3.7vw;
    line-height: 4vw;
    margin-bottom: 50px;
}

.remoteWorkPage .nameSection {
    text-align: center;
    color: #22526F;
}

.remoteWorkPage .contactDescription,
.remoteWorkPage .personDetails p {
    font-size: 20px;
    line-height: 25px;
    font-weight: normal;
    color: #22526F;
}

.remoteWorkPage .contactInfoRight input,
.remoteWorkPage .contactInfoRight textarea {
    border-radius: 60px;
    border: 1px solid var(--skilly-main-color);
}

.remoteWorkPage .contactInfoRight textarea {
    border-radius: 30px;
}

.remoteWorkPage .contactDescription {
    max-width: 430px;
    width: 100%;
    margin-right: 105px;
}

.remoteWorkPage .personDetails p {
    max-width: 220px;
}


.remoteWorkPage .contactDescription.subTitle,
.remoteWorkPage .personDetails {
    font-size: 20px;
    line-height: 25px;
    margin-bottom: 0px;
}

.remoteWorkPage [type="submit"] {
    margin: 20px auto 0px auto;
}

.remoteWorkPage .contactPart {
    margin-top: 200px;
}
/*remoteWorkHomePage style*/
.remoteWorkPage.remoteWorkHomePage .contactPart {
    margin-top: 210px;
}

.remoteWorkPage.remoteWorkHomePage .chatImg {
    width: 140px;
}

.remoteWorkHomePage .remoteWorkPart1 {
    background-image: url(/Content/images/newLandingImages/remoteWorkNewHome/bgr_part1.svg);
    padding: 210px 0px 260px 0px;
    background-position: top center;
    background-size: 100%;
    padding-top: 16vh;
    padding-top: 24vh;
}

.remoteWorkHomePage .remoteWorkPart2 {
    background-image: url(/Content/images/newLandingImages/remoteWorkNewHome/bgr_part2-29.svg);
    padding: 200px 0px 650px 0px;
    margin-top: -295px;
    background-position: top center;
}


.remoteWorkHomePage .remoteWorkPart3 {
    margin-top: -675px;
    padding-bottom: 450px !important;
    background-position: top center;
    background-image: url(/Content/images/newLandingImages/remoteWorkNewHome/bgr_part35home.svg);
}

.remoteWorkHomePage .remoteWorkPart4 {
    background-image: url(/Content/images/newLandingImages/remoteWorkNewHome/bgr_part4.svg);
    padding: 200px 0px 340px 0px;
    flex-direction: column;
    margin-top: -455px;
    z-index: 2;
    max-width: 100%;
    background-position: top center;
}

.remoteWorkPart3.remoteWorkPart6 {
    margin-top: -700px;
    padding-bottom: 670px !important;
    padding-top: 450px;
}

.remoteWorkHomePage .remoteWorkPart5 {
    z-index: 2;
    margin-top: -525px;
    background-image: url(/Content/images/newLandingImages/remoteWorkNewHome/bgrpart6home.svg);
}

.remoteWorkHomePage .remoteWorkPart3.remoteWorkPart6 .subNameSection {
    margin-top: 10px;
}

    .remoteWorkHomePage .remoteWorkPart3.remoteWorkPart6 .subNameSection.bottomSubName {
        margin-top: 60px;
        max-width: 100%;
        width: 100%;
    }

.remoteWorkHomePage .remoteWorkPart3 .nameSection {
    max-width: 720px;
    margin: auto;
}

.remoteWorkHomePage .nameSection .bigFont {
    font-size: 60px;
    line-height: 65px;
}

.skillyAboutMain {
    margin-top: -170px;
    width: 100%;
}

    .skillyAboutMain .nameSection {
        margin-bottom: 125px !important;
    }

.leftSpace {
    margin-left: 110px;
    margin-top: 38px;
}

    .leftSpace .chatText {
        text-align: center;
        max-width: 378px;
    }

.remoteWorkHomePage .remoteWorkPart1 .chatText {
    font-size: 40px;
    line-height: 45px;
}

.remoteWorkHomePage .remoteWorkPart1 .title {
    font-size: 70px;
    line-height: 75px;
    text-align: center;
    max-width: 875px;
    z-index: 2;
    position: relative;
}

.remoteWorkHomePage .fixedWidthContainerBig {
    max-width: 1400px;
    margin: auto;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.remoteWorkHomePage .remoteWorkPart1 .chatBox {
    margin-top: 95px;
    margin-left: 0px;
}

.remoteWorkHomePage .remoteWorkPart1 .imgPart1 {
    max-width: 730px;
    bottom: auto;
    top: 160px;
    right: 0px;
    position: absolute;
    z-index: 1;
}

.aboutSection {
    width: 100%;
    margin-top: 530px;
    box-sizing: border-box;
    padding-top: 0px;
    z-index: 3;
}

    .aboutSection .remoteWorkChallengesBox {
        margin-top: 0px;
        max-width: 1000px;
        margin: auto;
    }

    .aboutSection .challengesConentHolder {
        z-index: 3;
    }

.remoteWorkHomePage .remoteWorkPart1 .aboutSection .imgPart1 {
    position: relative;
    max-width: 737px;
    width: 100%;
}

.remoteWorkHomePage strong {
    font-weight: 900;
}

.bigFont {
    font-size: 80px;
    line-height: 85px;
}

.nameSection {
    font-size: 60px;
    line-height: 65px;
}

img.chatting {
    width: 100%;
    margin-left: 0px;
}

.chattingHolder {
    position: relative;
    width: 100%;
    max-width: 1200px;
    padding-top: 110px;
    margin-left: auto;
    margin-right: auto;
}


.chattigBox {
    border: 2px solid var(--skilly-main-color-tint-1);
    background-color: rgba(255,255,255,0.7);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 110px;
    padding: 20px 40px;
    position: absolute;
}

.remoteWorkHomePage .remoteWorkPart2 .nameSection {
    max-width: 810px;
    margin-bottom: 90px;
}

.remoteWorkHomePage .subNameSection {
    font-size: 25px;
    line-height: 30px;
    max-width: 580px;
}

.chattigBox.first {
    right: 375px;
    top: 10px;
    width: 337px;
    height: 252px;
}

.chattigBox .description {
    font-size: 30px;
    line-height: 35px;
}

.chattigBox.second {
    right: 0px;
    top: 10px;
    width: 308px;
    height: 252px;
}

.chattingInner {
    max-height: 120px;
}

.chattigBox.third {
    right: 92px;
    width: 308px;
    height: 252px;
    top: 312px;
}

.skillyAboutRow {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.remoteWorkPart3 .skillyAboutRow {
    justify-content: space-between;
}

.skillyAboutRowBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 2px dashed var(--skilly-main-color-tint-1);
    border-radius: 60px;
    background-color: rgba(255,255,255,0.9);
    padding-top: 20px;
    cursor: pointer;
    width: 350px;
}

    .skillyAboutRowBox .description {
        background-color: #C7F9F2;
        border: 2px solid var(--skilly-main-color-tint-1);
        border-radius: 60px;
        padding: 20px 40px;
        width: calc(100% + 4px);
        margin-bottom: -2px;
    }

        .skillyAboutRowBox .description:hover {
            background-color: var(--skilly-main-color-tint-1);
        }

    .skillyAboutRowBox img {
        max-width: 163px;
        margin-bottom: -20px;
        z-index: 2;
    }

.chatSkillyImg {
    display: block;
    max-width: 985px;
    width: 100%;
}

.chatSkillyHolder {
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 1200px;
    margin: auto;
    position: relative;
    padding-top: 220px;
    align-items: flex-start;
}

.chatSkillyDesc.leftDesc {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    max-width: 206px;
    margin-top: -60px;
}

.chatSkillyDesc.rightDesc {
    position: absolute;
    right: 110px;
    top: 120px;
    max-width: 324px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.chatSkillyDesc.leftDesc img.questionSamll {
    max-width: 75px;
    margin-top: 30px;
}

.chatSkillyDesc.rightDesc img {
    position: relative;
    display: block;
    width: 377px;
    margin-left: -180px;
}

.remoteWorkHomePage .description {
    max-width: 500px;
}

.remoteWorkHomePage .remoteWorkPart4 .nameSection {
    max-width: 695px;
    display: block;
    margin: auto;
}

.remoteWorkPart3.remoteWorkPart6 .skillyAboutRowBox {
    border-radius: 0px;
    border: none;
    background: transparent;
    position: relative;
    cursor: pointer;
    margin-left: 20px;
    width: 33%;
}

    .remoteWorkPart3.remoteWorkPart6 .skillyAboutRowBox:first-child {
        margin-left: 0px;
    }


.remoteWorkPart3.remoteWorkPart6 .description {
    border-radius: 0px;
    border: none;
    background: transparent;
}

.remoteWorkPart3.remoteWorkPart6 .skillyAboutRowBox.rightBorderDotted::after {
    content: '';
    display: block;
    height: 100%;
    width: 1px;
    border-right: 2px dashed var(--skilly-main-color-tint-1);
    position: absolute;
    top: 0px;
    right: -10px;
    transition: all 0.3s ease-in-out;
}

.remoteWorkPart3.remoteWorkPart6 .skillyAboutRowBox.rightBorderDotted:hover::after {
    right: 20px;
}

.onlyMobile {
    display: none;
}

.numberBox {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

    .numberBox .description {
        text-align: left !important;
    }

    .numberBox.marginBox {
        margin-bottom: 40px !important;
    }

        .numberBox.marginBox img {
            margin-right: 20px;
        }

.numberImg {
    margin-right: 20px;
    width: 65px;
    display: block;
}
/* teams page style */
.teamPart1 {
    background-image: url(/Content/images/newLandingImages/teamsPage/bgr-05.svg);
    background-color: #E3FAFC;
    position: relative;
    box-sizing: border-box;
    background-size: 100%;
    background-repeat: no-repeat;
    /*padding-top: 240px;*/
    padding-top: 180px;
}

.teamBigWidth {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    max-width: 1040px;
    width: 100%;
    margin: auto;
    padding: 0 20px;
    box-sizing: border-box;
}

.textBox {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.imgBox {
    position: relative;
    /*max-width: 980px;*/
    max-width: 656px;
    width: 100%;
    margin-left: -60px;
    /*margin-top: -39px;*/
    margin-top: 15px;
}

.teamBigHeading,
.teamBigDescription,
.teamHeading,
.teamDescription,
.teamSmallText,
.teamSmallHeading {
    color: #22526F;
}

.teamBigDescription {
    font-size: 30px;
    line-height: 35px;
    max-width: 495px;
}

.teamBigHeading {
    font-size: 60px;
    line-height: 65px;
    font-weight: 900;
    max-width: 375px;
    margin-bottom: 40px;
    margin-top: 25px;
}

.imgBox {
    position: relative;
}

.womanCover {
    display: block;
    width: 100%;
}

.callIcon {
    position: absolute;
    /*width: 275px;
    left: -315px;
    bottom: 60px;*/
    width: 140px;
    left: -195px;
    bottom: 42px;
}

.videoIcon {
    position: absolute;
    /*width: 225px;*/
    left: 15px;
    /*top: -100px;*/
    width: 130px;
    top: -48px;
}

.teamWidth {
    /*max-width: 1240px;*/
    max-width: 940px;
    width: 100%;
    margin: auto;
    padding: 0 20px;
    box-sizing: border-box;
}

.teamPart2 {
    background-image: url(/Content/images/newLandingImages/teamsPage/pattern-06.svg);
    position: relative;
    box-sizing: border-box;
    background-size: cover;
    background-repeat: no-repeat;
    padding-bottom: 30px;
}

    .teamPart2 .teamWidth {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
    }

.purple {
    background-color: #D0D6FE;
    width: 100%;
    height: 55px;
    margin-bottom: 55px;
    margin-top: -10px;
}



.teamEnjoySectionImgHolder {
    /*max-width: 515px;*/
    max-width: 399px;
    width: 100%;
    margin-top: -25px;
    display: block;
    margin-right: -50px;
}

.teamHeading {
    font-size: 35px;
    line-height: 40px;
    font-weight: bold;
    text-align: center;
    max-width: 670px;
}

.teamDescription {
    font-size: 20px;
    line-height: 25px;
    text-align: center;
}

.teamSmallText {
    font-size: 20px;
    line-height: 25px;
    text-align: center;
}

.teamSmallHeading {
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    font-weight: 900;
}

.purpleBox {
    background-image: url(/Content/images/newLandingImages/teamsPage/box_bgr-08.svg);
    background-color: transparent;
    position: relative;
    box-sizing: border-box;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    height: 180px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 50px;
}

.reasonsHolder {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    margin-top: 70px;
}


.reasonBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    /*max-width: 340px;*/
    max-width: 277px;
}

    .reasonBox .teamSmallHeading {
        margin-top: 20px;
        margin-bottom: 20px;
    }

.teamPart4 {
    background-color: #E9EBFF;
    position: relative;
    box-sizing: border-box;
    background-size: 100%;
    background-repeat: no-repeat;
}

.teamEnjoySectionHolder .teamSmallText {
    max-width: 555px;
    text-align: center;
    margin-top: 50px;
}

.teamEnjoySectionImgSmall {
    /*width: 205px;*/
    width: 154px;
    /*margin-left: 55px;*/
    margin-left: 35px;
}

    .teamEnjoySectionImgSmall:first-child {
        margin-left: 0px;
    }

.teamEnjoySection {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
}

.teamEnjoySectionHolder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
}

.imgHolderEnjoySection {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
}

.reasonImg {
    /*width: 130px;*/
    width: 87px;
}

.teamPart3 > .teamHeading {
    margin: 100px auto 30px auto;
}

.teamPart4 {
    background-color: #E9EBFF;
    position: relative;
    padding-top: 200px;
    padding-bottom: 100px;
}

.teamsBoxHolder {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
}

.teamBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    /*width: 525px;*/
    background: #fff;
    border-radius: 50%;
    /*height: 520px;*/
    cursor: pointer;
    height: 406px;
    width: 406px;
}

    .teamBox:hover {
        background: #7179BF;
    }

.teamBoxImg {
    /*width: 400px;*/
    margin-top: -105px;
    /*margin-bottom: 60px;*/
    margin-left: -80px;
    width: 362px;
    margin-bottom: 45px;
}

.teamBox:hover .teamHeading {
    color: #fff;
}

.teamPart4 .teamHeading {
    max-width: 260px;
}

.teamBtn {
    padding: 15px 50px;
    background: var(--skilly-main-color-tint-1);
    border-radius: 30px;
    cursor: pointer;
    color: #fff;
    /*margin-top: 55px;*/
    margin-top: 25px;
}



/*NewHomePage Style start*/
.newHomePageWidth {
    max-width: 1040px;
    padding: 0 20px;
    margin: auto;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
}

.newHomePart5 .newHomePageWidth {
    max-width: 1176px;
}

.newHomePageWidth.newHomeColumn {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.newHomePart1 {
    background-image: url(/Content/images/newLandingImages/newHomePage/header.svg);
    position: relative;
    box-sizing: border-box;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding-top: 140px;
    padding-bottom: 30px;
}

.newHomeHeaderImg {
    max-width: 440px;
    width: 100%;
    display: inline-block;
    margin-top: -35px;
}

.newHomeHeaderLeftPart {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.newHomeHeading {
    color: #333333;
    font-size: 35px;
    /*font-size: 33px;*/
    /*max-width: 478px;*/
    max-width: 490px;
}

.newHomeBigText {
    font-size: 60px;
    /*font-size: 58px;*/
}

.newHomeChatText {
    color: #333333;
    font-size: 20px;
    margin-bottom: 10px;
    margin-right: 20px;
}

.newHomeChatImg {
    width: 40px;
    position: absolute;
    left: -18px;
    top: -13px;
    border: 2px solid #C6DDD9;
    border-radius: 50%;
}

.newHomeChatRow {
    position: relative;
    margin-bottom: 34px;
}

.newHomeChatSextion {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-start;
    margin-top: 40px
}

.newHomeChatTextBox {
    background: url(/Content/images/newLandingImages/newHomePage/chatBuble.svg);
    box-sizing: border-box;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    height: 66px;
    padding-left: 45px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

    .newHomeChatTextBox.bigBuble {
        background: url(/Content/images/newLandingImages/newHomePage/chatBubleBig.svg);
        width: 375px;
    }

.newHomeHeadingCenter {
    color: #333333;
    font-size: 35px;
    font-weight: 600;
    text-align: center;
    margin-top: 80px;
    margin-bottom: 115px;
    width: 100%;
}

.newHomeCompaniesUseImg {
    max-width: 517px;
    width: 100%;
    display: inline-block;
    margin-top: -45px;
}

.doYouSection {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.doYouSectionRow {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.doYouSectionImg {
    width: 20px;
    margin-right: 20px;
    display: inline-block;
}

.doYouSectiontext {
    color: #333333;
    font-size: 20px;
}

.problemTextBox {
    position: relative;
}

.problemArrow {
    display: inline-block;
    height: 155px;
    width: 30px;
    position: absolute;
    left: 14px;
    top: 37px;
}

.problemText {
    color: #333333;
    font-size: 20px;
    padding-left: 40px;
    margin-top: 30px;
    margin-bottom: 115px;
}

.problemBigText {
    position: relative;
    font-weight: 600;
    font-size: 35px;
    z-index: 1;
}

.problemRedDot {
    width: 57px;
    height: 57px;
    border-radius: 50%;
    background-color: #FF5C75;
    position: absolute;
    left: -16px;
    top: -11px;
    z-index: -1;
}

.newHomeCompaniesUse {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
}

.newHomeCompaniesUseRight {
    max-width: 414px;
}

.problemSmallcenterHeading {
    color: #333333;
    font-size: 20px;
    margin-top: 35px;
    margin-bottom: 30px;
    width: 100%;
    text-align: center;
}

.bigTextSmallHeading {
    color: #333333;
    font-size: 25px;
    font-weight: 600;
}

.newHomePart3 {
    position: relative;
}

.figures3dSectionImg {
    position: absolute;
    left: 0px;
    top: 20px;
    width: 198px;
    height: 310px;
}

.figures3dSectionBack {
    position: absolute;
    right: 0px;
    top: 69px;
    width: 69%;
    height: auto;
}

.smallTextWith {
    color: #333333;
    font-size: 25px;
    text-align: center;
    z-index: 2;
    margin-top: 30px;
    width: 100%;
}

.bigTextReadyToUse {
    color: #333333;
    font-size: 45px;
    font-weight: 600;
    position: relative;
    z-index: 1;
    max-width: 390px;
    margin: auto;
    margin-bottom: 125px;
}

.greenBigDot {
    z-index: -1;
    width: 88px;
    height: 88px;
    border-radius: 50%;
    background-color: #37DDC9;
    position: absolute;
    left: -23px;
    top: -15px;
}

.newHomeHelpSection {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
}

.newHomeHelpBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    max-width: 280px;
}

.newHomeHelpImg {
    width: 170px;
    height: 137px;
    margin-bottom: 44px;
}

.newHomeHelpHeading {
    font-size: 20px;
    color: #333;
}

.newHomeHelpDesc,
.newHomeHelpBtn {
    font-size: 14px;
    color: #333;
}

.newHomeHelpBtn {
    box-sizing: border-box;
    border-bottom: 2px solid #37DDC9;
    margin-top: 17px;
    cursor: pointer;
}

    .newHomeHelpBtn:hover {
        transform: scale(1.3);
        transition: all .2s ease-in-out;
    }

.newHomePart4 .newHomeHeadingCenter {
    margin-bottom: 67px;
    margin-top: -36px;
}

.newHomePart4 {
    margin-bottom: 80px;
}

.newHomePart5 {
    background: url(/Content/images/newLandingImages/newHomePage/seccessStories.svg);
    box-sizing: border-box;
    background-size: 100% !important;
    background-repeat: no-repeat !important;
    padding-top: 95px;
}

    .newHomePart5 .newHomeHeadingCenter {
        margin: 0px auto;
    }

    .newHomePart5 .newHomeHelpBtn {
        margin-left: auto;
        margin-right: 40px;
        margin-bottom: 45px;
        margin-top: 55px;
    }

.successStoryHolder {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
}

.successStoryBox {
    position: relative;
}

    .successStoryBox .successStoryInfoBox {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        position: relative;
        width: 360px;
        height: 296px;
        padding: 25px 25px;
        box-sizing: border-box;
        background-color: #fff;
        border-radius: 15px;
        z-index: 1;
    }

    .successStoryBox.successStorySmall .successStoryInfoBox {
        width: 275px;
        height: 226px;
        padding: 35px 13px;
    }

.successStoryShadow {
    width: 325px;
    height: 260px;
    background-color: #DCEBE9;
    border-radius: 10px;
    position: absolute;
    right: -10px;
    bottom: -10px;
    z-index: 0;
}

.successStoryBox.successStorySmall .successStoryShadow {
    width: 248px;
    height: 199px;
}

.successStoryLogo {
    margin-bottom: 30px;
    width: 100px;
}

.hotel_ELA .successStoryLogo {
    width: 120px;
    margin-bottom: 0px;
}

.successStoryBox.successStorySmall.hotel_ELA .successStoryLogo {
    width: 80px;
    margin-bottom: 0px;
}

.business_effect .successStoryLogo {
    width: 160px;
    margin-bottom: 0px;
}

.successStoryBox.successStorySmall.business_effect .successStoryLogo {
    width: 120px;
    margin-bottom: 0px;
}

.sofia_city .successStoryLogo {
    width: 80px;
    margin-bottom: 10px;
}

.microsoft .successStoryLogo {
    width: 200px;
}

.successStoryBox.successStorySmall.microsoft .successStoryLogo {
    margin-bottom: 30px;
    width: 150px;
}

.bnp .successStoryLogo {
    width: 180px;
}

.successStoryBox.successStorySmall.bnp .successStoryLogo {
    width: 150px;
}

.Abilitics .successStoryLogo {
    width: 200px;
}

.successStoryBox.successStorySmall.Abilitics .successStoryLogo {
    margin-bottom: 30px;
    width: 100px;
}

.successStoryName {
    font-size: 24px;
    color: #333;
    font-weight: 600;
    text-align: center;
}

.successStoryBox.successStorySmall .successStoryName {
    font-size: 19px;
}

.successStoryDesc {
    font-size: 19px;
    color: #333;
    text-align: center;
}

.successStoryBox.successStorySmall .successStoryDesc {
    font-size: 15px;
}

.sliderBox.mobile {
    display: none;
}

.sliderBox {
    width: 100%;
    margin-top: 40px;
}

.newHomePart6 {
    padding-top: 110px;
    position: relative;
}

.engineText {
    font-size: 20px;
}

.engineBackImg {
    position: absolute;
    left: -105px;
    top: -110px;
    max-width: 560px;
    width: 100%;
    z-index: 0;
}

.newHomePart6 .newHomePageWidth.newHomeColumn {
    position: relative;
}

.engineGreenDot {
    display: inline-block;
    width: 57px;
    height: 57px;
    position: absolute;
    left: -15px;
    top: -10px;
    background-color: #37DDC9;
    border-radius: 50%;
    z-index: -1;
}

.engineHeading {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    position: relative;
    width: 100%;
    margin-bottom: 55px;
}

    .engineHeading .newHomeHeadingCenter {
        text-align: left;
        width: auto;
        margin: 0px;
        z-index: 2;
        position: relative;
    }

.engineGreenBtn {
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    background-color: #37DDC9;
    border-radius: 20px;
    border: 1px solid #37DDC9;
    cursor: pointer;
    padding: 10px 20px;
    box-sizing: border-box;
}

    .engineGreenBtn.mobile {
        display: none;
        max-width: 263px;
        margin: 65px auto 0px auto;
    }

    .engineGreenBtn:hover {
        color: #37DDC9;
        background-color: #fff;
    }

.engineBoxHolder {
    width: 100%;
    z-index: 1;
    margin-bottom: 130px;
}

.engineBoxRow {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-bottom: 40px;
}

.engineBox {
    border: 1px solid #C6DDD9;
    border-radius: 15px;
    padding: 20px;
    box-sizing: border-box;
    width: 320px;
    height: 85px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}

    .engineBox img {
        margin-right: 5px;
        height: 48px;
        width: 48px;
    }

.newHomePart7 {
    background-color: #F3F9F8;
}

    .newHomePart7 .newHomeHeadingCenter {
        margin-top: 65px;
        margin-bottom: 40px;
    }

.statisticsBox {
    width: 286px;
    height: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    border: 1px solid #C6DDD9;
    border-radius: 10px;
    padding: 27px 20px;
    box-sizing: border-box;
    background: #fff;
}

.statisticsImg {
    margin-top: 40px;
    height: 56px;
    width: auto;
    display: block;
}

.statisticsText {
    font-size: 20px;
    color: #999999;
    min-height: 45px;
    text-align: center;
}

.statisticsNumber {
    font-size: 40px;
    color: #333333;
    font-weight: 600;
    margin-top: 35px;
}

.statsticsline {
    width: 60px;
    height: 2px;
    background-color: #37DDC9;
}

.statisticsEndText {
    font-size: 20px;
    color: #333333;
    max-width: 642px;
    margin: 0px auto 30px auto;
    text-align: center;
}

.statisticsEndTextBigText {
    font-weight: bold;
    font-size: 25px;
    color: #37DDC9;
}

.addSkillyMessage .addSkillyQuestion,
.addSkillyMessage .newHomeHelpBtn {
    font-size: 25px;
}

.newHomePart8 {
    padding-top: 135px;
}

    .newHomePart8 .newHomeHeadingCenter {
        max-width: 628px;
        text-align: center;
        margin: auto;
    }

.grayDotHolder {
    position: relative;
    z-index: 1;
}

.grayDot {
    background-color: #DCEBE9;
    width: 57px;
    height: 57px;
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    z-index: -1;
    left: 15px;
    top: -2px;
}

.copyPasteImg {
    width: 100%;
}

.addSkillyImg {
    max-width: 449px;
    width: 100%;
}

.addSkillyImgHolder {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    margin: auto;
    margin-bottom: 95px;
}

.addSkillyMessage {
    background: url(/Content/images/newLandingImages/newHomePage/largeBuble.svg);
    box-sizing: border-box;
    background-size: 100% !important;
    background-repeat: no-repeat !important;
    width: 260px;
    height: 165px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 25px;
    margin-top: 28px;
    margin-left: 25px;
}

.newHomePart9 {
    background-color: #F3F9F8;
    padding-top: 50px;
    background: url(/Content/images/newLandingImages/newHomePage/footer.svg);
    box-sizing: border-box;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    min-height: 550px;
    padding-bottom: 90px;
}

.greenDotFreeTest {
    background-color: #37DDC9;
    width: 57px;
    height: 57px;
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    z-index: -1;
    left: 2px;
    top: -2px;
}

.newHomePart9 .newHomeHeadingCenter {
    margin: auto;
    z-index: 1;
    position: relative;
    width: auto;
    font-size: 45px;
}

.subTitleNewHome {
    width: 100%;
    text-align: center;
    font-size: 35px;
    color: #333333;
    margin-bottom: 60px;
}

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

.buttonTestBox {
    width: 307px;
    height: 106px;
    background-color: #37DDC9;
    border: 2px solid #37DDC9;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-sizing: border-box;
    border-radius: 70px;
    position: relative;
}

    .buttonTestBox:hover,
    .buttonTestBox.active {
        background-color: #fff;
    }

        .buttonTestBox:hover .imgBtnHolder {
            right: -9px;
            bottom: -17px;
        }

        .buttonTestBox.active:hover {
            background-color: #37DDC9;
        }

.buttonTest {
    font-size: 25px;
    color: #333333;
    font-weight: 600;
    max-width: 184px;
    line-height: 25px;
    cursor: pointer;
}

.buttonTestBox.active .buttonTest {
    font-weight: normal;
}

.buttonTestBox.active:hover .buttonTest {
    color: #fff;
}

.imgBtnHolder {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    background-color: #1eb9a7;
    position: absolute;
    right: -12px;
    bottom: -22px;
    transition: all 0.5s ease-in-out;
}

.testBtnImg {
    position: absolute;
    left: 23px;
    top: 19px;
    width: 30px;
}

.imgDotsHolder {
    position: relative;
}

.dotsFree {
    position: absolute;
    left: -131px;
    bottom: -66px;
    width: 151px;
    height: 105px;
}

.newHomePart9 {
    position: relative;
}

    .newHomePart9 .newHomeHelpBtn {
        font-size: 25px;
        margin: 0px;
    }

        .newHomePart9 .newHomeHelpBtn:hover {
            transform: scale(1);
        }

.absoluteBtn {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.arrowHolderBtn {
    width: 53px;
    height: 53px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    background-color: #37DDC9;
    border-radius: 50%;
    margin-left: 30px;
}

.arrowHolderBtnImg {
    width: 27px;
    transition: all 0.3s ease-in-out;
}

.absoluteBtn:hover .arrowHolderBtnImg {
    -webkit-animation: move 1s infinite;
    animation: move 1s infinite;
}

@keyframes move {
    30% {
        transform: translateX(3px);
    }

    60% {
        transform: translateX(0px);
    }

    60% {
        transform: translateX(-3px);
    }
}

@-webkit-keyframes move {
    30% {
        transform: translateX(3px);
    }

    60% {
        transform: translateX(0px);
    }

    60% {
        transform: translateX(-3px);
    }
}








/*slider CSS*/
.carousel-wrapper {
    height: 300px;
    position: relative;
    width: 100%;
    margin: 0 auto;
}

.carousel-item {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 25px 50px;
    opacity: 0;
    transition: all 0.5s ease-in-out;
}

.arrow {
    border: solid black;
    border-width: 0;
    display: inline-block;
    padding: 0px;
    position: relative;
    background-image: url(/Content/images/newLandingImages/newHomePage/arrowSlider.svg);
    box-sizing: border-box;
    background-size: 25%;
    background-repeat: no-repeat !important;
    background-position: center center;
    width: 50px;
    height: 50px;
    background-color: rgba(255,255,255, 0.8);
    border: 1px solid rgba(255,255,255, 0.8);
    border-radius: 50%;
}

    .arrow:hover {
        background-color: rgba(255,255,255, 1);
        border: 1px solid #37DDC9;
    }


.arrow-prev {
    left: -30px;
    position: absolute;
    top: calc(50% - 25px);
    transform: translateY(-50%) rotate(0deg);
    top: 50px;
}

.arrow-next {
    right: -30px;
    position: absolute;
    top: calc(50% - 25px);
    transform: translateY(-50%) rotate(180deg);
    top: 50px;
}

.light {
    color: white;
}

@media (max-width: 480px) {
    .arrow, .light .arrow {
        background-size: 10px;
        background-position: 10px 50%;
    }
}



/*Select every element*/
[id^="item"] {
    display: none;
}

.item-1,
.item-11 {
    z-index: 2;
    opacity: 1;
}

*:target ~ .item-1,
*:target ~ .item-11 {
    opacity: 0;
}

#item-1:target ~ .item-1,
#item-11:target ~ .item-11 {
    opacity: 1;
}

#item-2:target ~ .item-2,
#item-3:target ~ .item-3,
#item-4:target ~ .item-4,
#item-5:target ~ .item-5,
#item-6:target ~ .item-6,
#item-11:target ~ .item-11,
#item-22:target ~ .item-22,
#item-33:target ~ .item-33,
#item-44:target ~ .item-44,
#item-55:target ~ .item-55,
#item-66:target ~ .item-66,
#item-77:target ~ .item-77 {
    /*z-index: 3;*/
    opacity: 1;
}






/*NewHomePage Style end*/


/*Tourism page style start*/
.languegeDropDown {
    position: relative;
    margin-bottom: 50px;
}
.languegeArr {
    width: 10px;
    margin-left: 10px;
}
.languegeDropDown:hover .languegeArr {
    transform: rotate(180deg);
}
.selectedLanguege,
.choseLanguage span {
    color: #333;
    font-size: 20px;
    line-height: 22px;
    background: #fff;
}
.choseLanguage span {
    width: 100%;
    height: 30px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0 15px;
    cursor: pointer;
}
.selectedLanguege {
    width: 230px;
    height: 40px;
    border-radius: 20px;
    border: 1px solid #C6DDD9;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-sizing: border-box;
}
    .choseLanguage span:hover {
        background: #C6DDD9;
    }
.choseLanguage {
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position: absolute;
    width: 230px;
}
.languegeDropDown:hover .choseLanguage{
    display: flex;
}
.tourismPart1 {
    background-image: url(/Content/images/newLandingImages/tourism/bgr_Header.svg);
    position: relative;
    box-sizing: border-box;
    background-size: 2000px;
    background-position: top 52px center;
    background-repeat: no-repeat;
    padding-top: 140px;
    padding-bottom: 110px;
}
    .tourismPart1.empty-navigation {
        background-position: top 0 center;
    }
    .tourismBigText {
        font-size: 60px;
        line-height: 65px;
    }
.tourismBg .tourismBigText {
    font-size: 48px;
    line-height: 55px;
}
.tourismHeaderImg{
    width: 460px;
}
.tourismPart1 .problemHeading {
    font-size: 35px;
    font-weight: 600;
    color: #333333;
}
.tourismPart1 .problemText {
    font-size: 20px;
    color: #333333;
    margin: 0px;
    padding: 0px;
}
.tourismPart1 .problemBox {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    max-width: 548px;
    width: 100%;
    padding-top: 145px;
    box-sizing: border-box;
    position: relative;
    margin-right: auto;
    margin-left: 0px;
  
}
.tourismPart1  .problemContent {
    text-align: center;
}
.tourismPart1 .problemContent.first {
    max-width: 276px;
}
.tourismPart1 .problemContent.second {
    max-width: 231px;
}
    .problemTextImg {
        position: absolute;
        max-width: 458px;
        left: 0px;
        top: 45px;
    }
.problemPointImg{
    position: absolute;
    top: 70px;
    left: 223px;
    max-width: 124px;
}
.solutionHeading {
    font-size: 25px;
    color: #333;
    max-width: 855px;
    text-align: center;
    margin: auto;
    max-width: 855px;
    z-index: 1;
    position: relative;
}
    .solutionHeading .greenText {
        font-size: 35px;
        color: #37DDC9;
    }
.solutionBox {
    /*background-image: url(/Content/images/newLandingImages/tourism/solution_bgr_text.svg);
    position: relative;
    box-sizing: border-box;
    background-size: 37%;
    background-position: top 215px center;
    background-position: top 960px left calc(100% - 610px);
    background-repeat: no-repeat;
    background-attachment: fixed;*/
    width: 100%;
    margin: 0px auto;
    /*background-size: 630px;*/
    position: relative;
}
.solution_bgr_textImg {
    width: 630px;
    position: absolute;
    top: 68px;
    left: 190px;
}

.solutionBotImg {
    display: block;
    margin: 90px auto 60px auto;
    max-width: 600px;
    z-index: 1;
    position: relative;
    width: 100%;
}
.solutionContentHolder{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
}
.solutionContent {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}
.solutionContentHeading {
    position: relative;
    margin-bottom: 44px;
}
    .solutionContentHeading span {
        color: #B0C6C2;
        font-size: 60px;
        font-weight: 900;
        z-index: 1;
        position: relative;
    }
    .solutionHeadingImg {
        position: absolute;
        width: 480px;
        left: -44px;
        bottom: -20px;
    }
.solutionContentTextHolder {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    max-width: 350px;
    margin: auto;
}
.solutionContentTextBox {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    cursor: pointer;
    width: 410px;
    margin-bottom: 44px;
   
}
    .solutionContentTextBox:hover{
        transform: scale(1.1);
    }
.solutionTextNumber {
    border: 1px solid #C6DDD9;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    color: #333333;
    font-weight: 900;
    font-size: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    margin-right: 15px;
    cursor: pointer;
}
.solutionContentTextBox:hover .solutionTextNumber {
    border: 1px solid #37DDC9;
    background-color: #37DDC9;
}
.solutionContentText {
    color: #333333;
    font-size: 20px;
    text-align: left;
    width: 300px;
    cursor: pointer;
}
.answerSkillyHeading{
    font-size: 35px;
    font-weight: 600;
    color: #333;
    margin: 113px auto 40px auto;
}
   .tourismBg .answerSkillyHeading{
        width: 100%;
        text-align: center;
    }
    .answerBoxHolder {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between;
        width: 100%;
    }
.answerBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}
.answerBoxImg {
    height: 180px;
    display: block;
    margin-bottom: 30px;
}
.answerBoxText {
    font-size: 20px;
    line-height: 25px;
    color: #333;
    text-align: center;
    width: 224px;
}
    .answerBoxText.bigWidth{
        width: 292px;
    }
    .answerBoxText.smallWidth {
        width: 184px;
    }
.tourismPart3 .newHomePageWidth,
.tourismPart7 .newHomePageWidth {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.videoBtn {
    width: 88px;
    height: 88px;
    background-image: url(/Content/images/newLandingImages/tourism/video_button.svg);
    box-sizing: border-box;
    background-position: center center;
    background-size: 100%;
    border: 0px;
    outline: none;
    border-radius: 50%;
    background-color: transparent;
    position: absolute;
    left: 2px;
    top: calc(50% - 38px);
}
    .videoBtn.pause {
        background-image: url(/Content/images/newLandingImages/tourism/video_buttonPause.svg);
    }
.videoBackground {
    background-image: url(/Content/images/newLandingImages/tourism/videobgr.svg);
    position: relative;
    box-sizing: border-box;
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    width: 968px;
    height: 530px;
    margin: auto;
    margin-top: 95px;
}

.videoBackground video {
    margin-left: 85px;
    margin-top: 55px;
}
.cactusImg {
    position: absolute;
    right: -25px;
    bottom: 12px;
    width: 178px;
}
.tourismPart4{
    margin-bottom: 90px;
}
.tourismPart7 {
    padding-top: 60px;
    padding-bottom: 68px;
}
.exploreHeading {
    font-size: 35px;
    font-weight: 600;
    color: #333333;
    text-align: center;
    width: 100%;
    margin-bottom: 30px;
}
.exploreSubHeading {
    font-size: 20px;
    line-height: 25px;
    color: #333;
    text-align: center;
    width: 100%;
    margin-bottom: 20px;
}
.exploreBoxHolder{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
}
.exploreBox {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    height: 407px;
    width: 320px;
}
.exploreBox.exploreSweden {
    width: 185px;
}
        .mapBulgaria,
        .mapBulgariaActive,
        .mapIndia,
        .mapIndiaActive {
            width: 320px;
            cursor: pointer;
        }
.mapSweden,
.mapSwedenActive{
    width: 185px;
    cursor: pointer;
}
.exploreBox .mapSwedenActive,
.exploreBox .mapIndiaActive,
.exploreBox .mapBulgariaActive {
    display: none;
}
.exploreBox:hover .mapSwedenActive,
.exploreBox:hover .mapIndiaActive,
.exploreBox:hover .mapBulgariaActive {
    display: block;
    transform: scale(1.2)
}
.exploreBox:hover .mapSweden,
.exploreBox:hover .mapIndia,
.exploreBox:hover .mapBulgaria {
    display: none;
}
.exploreTextholder{
    position: absolute;
    left: 0px;
    top: 0px;
}
.exploreIndia .exploreTextholder{
    top: 55px;
}
.exploreSweden .exploreTextholder {
    top: 99px;
    left: -21px;
}
.exploreText {
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    color: #333;
    width: 73px;
    display: block;
    position: absolute;
    left: 80px;
    top: 40px;
}
.newHomePart9.tourismPart8 .newHomeHeadingCenter {
    font-size: 35px;
    margin-top: 15px;
    margin-bottom: 100px;
}
.newHomePart9.tourismPart8 {
    background-image: url(/Content/images/newLandingImages/tourism/bgr_footer.svg);
}
    .newHomePart9.tourismPart8 .buttonTestBox.active {
        width: 224px;
        height: 70px;
        border: 1px solid #C6DDD9;
        overflow: visible;
    }
        .newHomePart9.tourismPart8 .buttonTestBox.active .buttonTest {
            font-size: 20px;
            text-align: center;
            max-width: 164px;
        }

.tourismBg .newHomePart9.tourismPart8 .buttonTestBox.active .buttonTest {
    max-width: 230px;
}
.tourismBg .newHomePart9.tourismPart8 .buttonTestBox.active {
    width: 277px;
}
.newHomePart9.tourismPart8 .buttonTestBox.active .testBtnImg {
    width: 50px;
    top: 0px;
    left: -25px;
}
    .newHomePart9.tourismPart8 .newHomeHelpBtn {
        font-size: 20px;
    }

    .newHomePart9.tourismPart8 .arrowHolderBtn {
        margin-left: 10px;
    }
    .newHomePart9.tourismPart8 .absoluteBtn {
        margin: 60px auto 300px auto;
    }
.tourismBg .newHomePart9.tourismPart8 .absoluteBtn{
    margin: 0px;
}
.bottomButtonTourismBg {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin: 60px auto 300px auto;
    max-width: 770px;
    width: 100%;
    padding: 0 64px 0 22px;
}
.tourismBg .buttonsTestHolder {
    max-width: 770px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}
/*Tourism page style end*/
/*princing page start*/
.pricingPart1 {
    width: 100%;
    background-image: url(/Content/images/newLandingImages/pricing/bgrcover.svg);
    position: relative;
    box-sizing: border-box;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding-top: 140px;
    padding-bottom: 110px;
}

.pricingPart1 .newHomePageWidth{
    flex-direction: column;
    align-items: flex-start;
}
.pricingPart3 .newHomePageWidth {
    flex-direction: column;
    align-items: center;
}
.pricingHeading {
    font-size: 60px;
    color: #333;
    line-height: 65px;
    font-weight: 600;
    margin-right: 40px;
}
.pricingHeadingBox{
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 80px;
}
.pricingSubHeading {
    max-width: 571px;
    font-size: 25px;
    line-height: 25px;
    color: #333333;
}
.pricingBoxHolderNew {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 80px;
}
.pricingBoxMain {
    position: relative;
    max-width: 350px;
    width: 100%;
}
.hoverGreenBack {
    display: none;
    z-index: 1;
    width: 350px;
    height: 456px;
    background-color: #87F0E4;
    border-radius: 40px;
    position: absolute;
    top: 0px;
    left: -25px;
    opacity: 0.4;
}
.premiumBox .hoverGreenBack {
    height: 501px;
}
.pricingBoxMain:hover  .hoverGreenBack {
    display: block;
}
.pricingBoxNew {
    width: 300px;
    height: 411px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
    background-color: #fff;
    border: 2px solid #87F0E4;
    border-radius: 40px;
}
.premiumBox .pricingBoxNew {
    height: 456px;
}
.pricingGreenBack {
    width: 296px;
    height: 217px;
    border-radius: 37px;
    background-color: #37DDC9;
    margin-bottom: 27px;
}
.pricingCategory {
    width: 263px;
    height: 45px;
    font-size: 25px;
    color: #333;
    line-height: 25px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 30px;
    margin-bottom: 24px;
    background-color: #fff;
}
.starterBox .pricingCategory {
    border-top-left-radius: 34px;
    border-bottom-left-radius: 34px;
    padding-left: 75px;
    margin-left: auto;
    margin-right: 0px;
}
.enterpriseBox .pricingCategory {
    border-top-right-radius: 34px;
    border-bottom-right-radius: 34px;
    padding-right: 75px;
    margin-right: auto;
    margin-left: 0px;
    justify-content: flex-end;
}
.premiumBox .pricingCategory {
    width: 240px;
    border-top-right-radius: 34px;
    border-bottom-right-radius: 34px;
    border-top-left-radius: 34px;
    border-bottom-left-radius: 34px;
    justify-content: center;
    margin-right: auto;
    margin-left: auto;
}
.pricingDescription {
    max-width: 278px;
    height: 100px;
    font-size: 20px;
    color: #333;
    line-height: 25px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.pricingNumberBox {
    margin: 0px auto 0px auto;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}


.starterBox .pricingNumberBox {
    width: 44px;
}

.enterpriseBox .pricingNumberBox {
    width: 190px;
}

.premiumBox .pricingNumberBox {
    width: 140px;
}


.pricingNumber {
    font-weight: 600;
    font-size: 35px;
    line-height: 35px;
    color: #333333;
    text-align: center;
}
.pricingNumberBorder {
    border-bottom: 2px solid #37DDC9;
    margin-top: 5px;
    margin-bottom: 20px;
    width: 100%;
}
.pricingBoxImg {
    height: 70px;
    display: block;
    margin: 0px auto auto;
    transition:all 0.3s ease-in;
}
.pricingBoxBtn {
    position: absolute;
    bottom: -22px;
    left: calc(50% - 65px);
    font-weight: 600;
    font-size: 20px;
    line-height: 25px;
    color: #333333;
    width: 130px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: 35px;
    background-color: #37DDC9;
    border: 1px solid #37DDC9;
}
    .pricingBoxBtn.bigWidth {
        width: 180px;
        left: calc(50% - 90px);
    }
    .pricingBoxBtn:hover {
        background-color: #fff;
        transform: scale(1.2);
    }
.tablePricingNew {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    margin-bottom: 235px;
}
.pricingRow{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    min-height: 52px;
    border-radius: 37px;
    background-color: #fff;
    margin: 3px 0px;
    padding: 20px 40px;
    box-sizing: border-box;
    width: 100%;
}
    .pricingRow.darkRow {
        background-color: #F3F9F8;
    }
    .pricingRow.headingRow{
        margin-bottom: 13px;
    }
.pricingFeatures{
    min-width: 295px;
    margin-right: 90px;
}
.pricingPlan {
    min-width: 170px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
}
    .pricingPlan.columnView{
        flex-direction: column;
    }
    .pricingRow > div span,
    .pricingRow > div {
        color: #333333;
        font-size: 20px;
        line-height: 25px;
    }
.pricingPlan span {
    text-align: center;
}
.headingRow .pricingFeatures {
    color: #333333;
    font-size: 35px;
    font-weight: 600;
}
.headingRow .pricingPlan span {
    border-bottom: 2px solid #37DDC9;
}
.planNoImg,
.planYesImg {
    width: 35px;
    margin: auto;
    display: block;
}
.FAQheading{
    font-size: 35px;
    font-weight: 600;
    color: #333;
    margin-bottom: 25px;
}
.FAQBoxHolder {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    padding-top: 65px;
    box-sizing: border-box;
    background-image: url(/Content/images/newLandingImages/pricing/frequentlyaskedquestions.svg);
    background-size: 500px;
    background-position: top 190px center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    position: relative;
}

.FAQContent {
    margin-bottom: 40px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}
.FAQHead {
    font-size: 25px;
    font-weight: 600;
    color: #333;
    margin-bottom: 20px;
}
.FAQBox.leftBox {
    max-width: 445px;
}
.FAQBox.rightBox {
    max-width: 468px;
    width: 100%;
}

.FAQBox .FAQHead.columnView {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start
}
.FAQText {
    font-size: 20px;
    line-height: 25px;
    color: #333;
}
.FAQTextRow{
    display: block;
    width: 100%;
    position: relative;
    margin-bottom: 30px;
}
.FAQTextRow strong{
    display: inline-block;
}

.FAQgreenText {
    color: #37DDC9;
    font-weight: 600;
}
.faqImg {
    max-width: 468px;
    width: 100%;
}
.pricingPart4 {
    background-image: url(/Content/images/newLandingImages/pricing/bgrfooter.svg);
    position: relative;
    box-sizing: border-box;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding-top: 75px;
    margin-top: 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.footerHeading {
    font-size: 35px;
    color: #333;
    font-weight: 600;
    width: 100%;
    text-align: center;
    margin-bottom: 50px;
}
.footerSubHeading {
    font-size: 20px;
    line-height: 25px;
    color: #333;
    margin: auto;
    text-align: center;
    max-width: 620px;
    padding: 0 20px;
}
.pricingPart4 .newHomeHelpBtn {
    display: inline-block;
    margin-top: 60px;
    margin-bottom: 170px;
    margin-left: auto;
    margin-right: auto;
}


.pricingBoxNew:hover .pricingBoxImg {
    -webkit-animation: moveUp 1s infinite;
    animation: moveUp 1s infinite;
}

@keyframes moveUp {
    30% {
        transform: translateY(3px);
    }

    60% {
        transform: translateY(0px);
    }

    60% {
        transform: translateY(-3px);
    }
}

@-webkit-keyframes moveUp {
    30% {
        transform: translateY(3px);
    }

    60% {
        transform: translateY(0px);
    }

    60% {
        transform: translateY(-3px);
    }
}

.pricingPart2.mobile {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
}
.mobilePlanBox{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 95px;
}
.mobilePlanHeading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 36px;
    position: relative;
    width: 320px;
}
.mobileBackPlanImg {
    position: absolute;
    left: 0px;
    bottom: -16px;
    z-index: 0;
    width: 320px;
}
.mobilePlanHeading span {
    font-size: 35px;
    font-weight: 600;
    color: #333;
    line-height: 40px;
    position: relative;
    z-index: 2;
}
    .mobilePlanHeading span.greenText {
        color: #37DDC9;
    }
.mobilePlanRow {
    border-bottom: 1px solid #B0C6C2;
    width: 100%;
    font-size: 20px;
    color: #333;
    line-height: 25px;
    text-align: left;
    box-sizing: border-box;
    padding: 10px 0px;
}
/*princing page end*/
/*features page style start*/
.featuresPart1 {
    width: 100%;
    background-image: url(/Content/images/newLandingImages/featuresPage/bgrcover.svg);
    position: relative;
    box-sizing: border-box;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding-top: 140px;
    padding-bottom: 20px;
}
.featuresHeaderLeft{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}
.featuresPart2 .newHomePageWidth{
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}
.featuresBoxNew {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    margin-top: 90px;
}
    .featuresBoxNew:nth-child(even) {
        flex-direction: row-reverse;
    }
.featureHeaderHeading {
    color: #333;
    font-size: 60px;
    line-height: 65px;
    font-weight: 600;
    margin-bottom: 45px;
    margin-top: 45px;
}
.featureHeaderSubHeading {
    color: #333;
    font-size: 25px;
    line-height: 25px;
    max-width: 490px;
}
.featuresHeaderImg{
    max-width: 530px;
    width: 100%;
}
.featuresBoxHeadingHolder {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-start;
}
.featuresBoxHeadingImg {
    position: absolute;
    left: 0px;
    bottom: -9px;
    width: 200px;
}
.iconFeature{
    display: inline-block;
    width: 53px;
    margin-left: 10px;
}
.numberFeature {
    color: #B0C6C2;
    font-size: 80px;
    font-weight: 600;
    position: relative;
    line-height: 80px;
    margin-right: 10px;
}
.headingFeature {
    color: #333333;
    font-size: 35px;
    line-height: 35px;
    font-weight: 600;
    max-width: 325px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}
    .headingFeature span {
        color: #333333;
        font-size: 35px;
        line-height: 35px;
        font-weight: 600;
    }
.featureCenterHeadingContent{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}
.featureBoxDesc {
    font-size: 20px;
    color: #333;
    line-height: 25px;
    margin-top: 25px;
}

.featureBoxTextNew {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    max-width: 460px;
}
.bigIconFeature{
    max-width: 363px;
    width: 100%;
}
.featuresPart3.newHomePart9 .newHomeHeadingCenter {
    font-size: 35px;
    margin-top: 65px;
    margin-bottom: 70px;
}
.featuresPart3.newHomePart9 .buttonTestBox.active {
    width: 415px;
}
.featuresPart3 .buttonTest {
    text-align: center;
}
.featuresPart3.newHomePart9 .buttonTestBox.active .buttonTest {
    max-width: 257px;
}
.featuresPart3.newHomePart9 .buttonsTestHolder {
    max-width: 810px;
    margin: auto;
}
.featuresPart3 {
    width: 100%;
    background-image: url(/Content/images/newLandingImages/featuresPage/bgrlastpart.svg);
    position: relative;
    box-sizing: border-box;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    margin-top: 120px;
}

/*features page style end*/

/*new tourism bg style start*/
.AIiconImg {
    width: 170px;
    height: auto;
    max-width: 170px;
    left: 0px;
    top: 0px;
    position: absolute;
}
.tourismBGNew .tourismPart1 .problemContent.first {
    max-width: 430px !important;
}
.tourismBGNew .newHomePageWidth {
    position: relative;
}
.tourismBGNew .problemTextImg {
    width: 100%;
    max-width: 100%;
    top: 185px;
}
.pinsbgr {
    position: absolute;
    top: -165px;
}
.tourismBGNew .tourismPart7 .exploreHeading {
    max-width: 600px;
}
.tourismBGNew .exploreBoxHolder,
.botHolderMap {
    position: relative;
}
    .tourismBGNew .mapBulgaria,
    .botHolderMap,
    .botHolderMap .botMap img{
        width: 100%;
    }
        .botHolderMap .botMap img {
            z-index: 5;
        }
        .botHolderMap .botMap {
            position: absolute;
            width: 135px;
            height: 220px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }
            .botHolderMap .botMap span {
                color: #333333;
                font-size: 18px;
                line-height: 19px;
                text-align: center;
                position: relative;
                z-index: 2;
            }
        .botHolderMap .botMap:hover span{
            font-weight: 600;
        }
            .botHolderMap .botMap span:after {
                content: "";
                display: inline-block;
                width: 300px;
                height: 300px;
                max-width: 300px;
                max-height: 300px;
                border-radius: 50%;
                border: 1px solid rgba(112, 112, 112, 0.6);
                position: absolute;
                top: -175px;
                left: -113px;
                z-index: -2;
            }
            .botHolderMap .botMap:hover span:after {
                background-color: rgba( 55, 221, 201, 0.6);
                border: 1px solid rgba( 55, 221, 201, 0.6);
            }
        .botHolderMap{
            position: absolute;
        }
.Schernomorie {
    right: 95px;
    top: 275px;
}
.salzata {
    top: 350px;
    left: 199px;
}
.romeo {
    top: 200px;
    left: 100px;
}
.Nchernomorie {
    right: 60px;
    top: 70px;
}
.hadzhiyata {
    right: 320px;
    top: 200px;
}
.botHolderMap .botMap.romeo span:after {
    top: -229px;
    left: -129px;
}
.botHolderMap .botMap.salzata span:after {
    top: -220px;
    left: -99px;
}
.botHolderMap .botMap.hadzhiyata span:after {
    top: -210px;
    left: -113px;
}
.botHolderMap .botMap.Nchernomorie span:after {
    top: -200px;
    left: -84px;
}
.botHolderMap .botMap.Schernomorie span:after {
    top: -206px;
    left: -84px;
}
.tourismBGNew .tourismPart2 .greenText {
    font-weight: 600;
}

.tourismBGNew .solutionBotImg {
    margin: 60px auto 60px auto;
}
/*new tourism bg style end*/
@media only screen and (max-width: 1622px) {
    .remoteWorkHomePage .fixedWidthContainerBig {
        padding: 0px 40px;
    }
}

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

    .remoteWorkPart3.remoteWorkPart6 {
        margin-top: -720px;
    }

    .remoteWorkChallengesBox > img.aboutImg {
        width: 570px;
    }

    .remoteWorkPage.remoteWorkHomePage .chatImg {
        width: 115px;
    }

    .remoteWorkHomePage .remoteWorkPart1 {
        padding-top: 20vh;
    }

        .remoteWorkHomePage .remoteWorkPart1 .chatBox {
            margin-top: 55px;
        }

        .remoteWorkHomePage .remoteWorkPart1 .title {
            font-size: 60px;
            line-height: 65px;
            max-width: 720px;
        }

        .remoteWorkHomePage .remoteWorkPart1 .chatText {
            font-size: 30px;
            line-height: 35px;
        }

        .remoteWorkHomePage .remoteWorkPart1 .imgPart1 {
            max-width: 575px;
            top: 200px;
        }

        .remoteWorkHomePage .remoteWorkPart1 .skillyChat {
            margin-bottom: 0px;
        }

    .remoteWorkHomePage .fixedWidthContainerBig {
        max-width: 1200px;
    }

    .chattingHolder,
    .remoteWorkHomePage .skillyAboutRow,
    .remoteWorkHomePage .chatSkillyHolder,
    .remoteWorkHomePage .aboutSection {
        max-width: 1000px;
    }

    .remoteWorkHomePage .aboutSection {
        margin-left: auto;
        margin-right: auto;
    }
  
    .remoteWorkHomePage .skillyAboutRowBox {
        width: 290px;
    }

        .remoteWorkHomePage .skillyAboutRowBox .description div {
            font-size: 20px;
            line-height: 20px;
        }

    .skillyAboutRowBox img {
        max-width: 120px;
    }

    .chattingInner {
        max-height: 95px;
    }

    .chattigBox.first {
        width: 285px;
        height: 210px;
    }

    .chattigBox.second {
        width: 270px;
        height: 210px;
    }

    .chattigBox.third {
        right: 92px;
        width: 260px;
        height: 210px;
        top: 240px;
    }

    .chatSkillyImg {
        max-width: 860px;
    }
    /* teams page */

}

@media only screen and (max-width: 1350px) {
    .callIcon {
        position: absolute;
        width: 224px;
        left: -202px;
        bottom: 19px;
    }

    .teamBigDescription {
        z-index: 2;
    }
}

@media only screen and (max-width: 1300px) {
    .fixedWidthContainerBig {
        padding: 0px 40px;
    }

        .fixedWidthContainerBig .title,
        .fixedWidthContainerBig .subTitle,
        .fixedWidthContainerBig .description {
            z-index: 3;
            position: relative;
        }

    .scrollmg {
        display: none;
    }

    .remoteWorkColumnBoxArrow.long {
        top: -85px;
        left: 112px;
        width: 70%;
    }

    .remoteWorkChallengesBox.third .challengesConentHolder {
        margin-left: 45px;
    }

    .remoteWorkChallengesBox > img {
        width: 45%;
    }

    .remoteWorkHomePage .remoteWorkPart1 .imgPart1 {
        top: 0px;
        width: 100%;
        max-width: 1050px;
        position: absolute;
        margin-top: -900px;
    }

    .remoteWorkHomePage .remoteWorkChallengesBox > img.aboutImg {
        position: relative;
        top: 0px;
        width: 100%;
    }

    .remoteWorkHomePage .aboutSection .remoteWorkChallengesBox:nth-child(odd) {
        flex-direction: column;
        align-items: center;
        position: relative;
        height: auto;
        justify-content: center;
    }

    .remoteWorkHomePage .remoteWorkPart1 {
        padding-top: 920px;
    }

    .aboutSection .challengesConentHolder {
        margin-top: 0px;
    }

    .remoteWorkHomePage .remoteWorkPart1 .title {
        margin-right: auto;
        margin-left: auto;
    }

    .remoteWorkHomePage .remoteWorkPart1 .chatBox {
        max-width: 875px;
        margin-left: auto;
        margin-right: auto;
    }
}

@media only screen and (max-width: 1200px) {
    .callIcon {
        display: none;
    }

    .chatSkillyHolder,
    .skillyAboutRow,
    .skillyAboutRow,
    .chattingHolder {
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }

    .remoteWorkPart1 {
        padding-top: 100px
    }

        .remoteWorkPart1 .fixedWidthContainerBig .imgPart1 {
            margin-top: 15px;
        }

    .remoteWorkHomePage .remoteWorkPart1 .imgPart1 {
        margin-top: -900px;
    }
    /*new home page*/
    .sliderBox.desctop {
        display: none;
    }

    .sliderBox.mobile {
        display: block;
        max-width: 460px;
        margin-left: auto;
        margin-right: auto;
        width: 90%;
    }
}

@media only screen and (max-width: 1130px) {
    .remoteWorkColumnBoxArrow.short {
        width: 410px;
    }
}

@media only screen and (max-width: 1000px) {
    html{
        overflow-x: hidden;
    }
    .css-typing {
        width: 100%;
        max-width: 100%;
    }

    .meetSkilliInfo {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
    }

    .meetSkilliPart .pathSection,
    .aboutPart,
    .singUpLeft,
    .contactPart {
        height: auto;
        padding: 30px 20px;
    }

    .meetSkilliHeading {
        font-size: 31px;
        line-height: 31px;
        margin: 0px;
    }

    .css-typing h1:nth-child(1),
    .css-typing h1:nth-child(2) {
        display: block;
        width: 100%;
    }

    .skilly_home_header {
        display: none;
    }

    .meetSkilliBotHolder {
        margin-top: 50px;
    }

        .meetSkilliBotHolder .skillBox {
            width: 100%;
            height: 55px;
            margin-right: 0px;
            margin-left: 0px;
        }

    .meetSkilliBotHolder {
        padding: 0px;
    }

    .textMessage {
        margin-left: 60px;
    }

    .meetSkilliInfoLeftPart,
    .meetSkilliInfo,
    .meetSkilliPart {
        width: 100%;
        box-sizing: border-box;
    }

    .aboutPartBox {
        width: 80%;
        margin-left: auto;
        margin-right: auto;
        min-width: 80%;
        margin-bottom: 65px;
    }

    .learningImageBox,
    .circleHolder,
    .circleStrategyHolder,
    .pricingBoxHolder,
    .abiliticsProductLogo,
    .skillsCardHolder,
    .singUpLeft {
        flex-direction: column;
    }

        .learningImageBox .skillyBox:first-child {
            margin-right: 0px;
        }

        .learningImageBox .skillyArrow {
            display: none;
        }

    .skillyBox {
        padding-bottom: 0px;
    }

    .howItWorksPart {
        padding: 227px 0;
        padding-top: 230px;
    }

    .hrStrategyPart {
        margin-top: -342px;
        padding-top: 70px;
        padding-bottom: 3px;
        margin-bottom: 40px;
        clip-path: polygon(0 0%,100% 0%,100% 100%,0% 100%);
    }

    .circleStrategyBox,
    .flip-card {
        margin-right: 0px;
        margin-bottom: 20px;
    }

    .hrStrategyPart .arrowHolder,
    .singUpBot,
    .singUpRight,
    .rightArrow, .circleWhiteLine {
        display: none;
    }

    .pricingBox,
    .pricingBox:last-child {
        width: 300px;
        margin: auto;
        margin-bottom: 20px;
    }

    .circleText {
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .logoBox.left,
    .logoBox.center,
    .logoBox.right {
        justify-content: center;
        margin-right: 0px;
        margin-bottom: 20px;
    }

    .singUpBox {
        padding-top: 40px;
        clip-path: polygon(0 0%,100% 0%,100% 100%,0% 100%);
        margin-top: 0px;
    }

    .singUpLeft {
        align-items: center;
    }

    .contactInfo {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin-bottom: 30px;
    }

    .contactInfoLeft {
        margin-bottom: 40px;
        align-items: center;
    }

    .remoteWorkPage .contactDescription {
        margin-right: 0px;
        text-align: center;
    }

    .boostYourSkills {
        padding-top: 0px;
        margin-top: 0px;
        padding-bottom: 0px;
        clip-path: none;
        height: auto;
        padding: 0px;
        background-color: #6474a3;
    }

    .singUpHeading,
    .singUpSubHeading,
    .singUpSubSubHeading {
        text-align: center;
    }

    body, div, p, span {
        box-sizing: border-box;
    }

    .contactInfoRight input,
    .contactInfoRight textarea,
    .contactDescription,
    .contactInfoRight {
        width: 100%;
    }

    .abiliticsProduct {
        padding: 100px 20px 60px;
    }

    .contactInfoRight input[type='submit'] {
        margin-top: 30px;
    }

    /*newLandingPageBox landing page*/
    .newLandingPageBox .circleStrategyHolder {
        margin-bottom: 0px;
    }

    .newLandingPageBox .meetSkilliPart .firstSection {
        padding: 190px 20px 40px 20px;
        height: auto;
    }

    .newLandingPageBox .meetSkilliHeading {
        width: 100%;
    }

    .uniqueSolutionBoxHolder {
        flex-direction: column;
        align-items: center;
    }

    .uniqueSolutionBox {
        margin-bottom: 70px;
    }

    .uniqueSolutionIcon {
        margin: 0px;
    }

    .uniqueSolution .imageContainer::before {
        content: '';
        width: 1px;
        height: 55px;
        border-left: 2px dotted var(--skilly-main-color);
        right: 97px;
        top: -66px;
        display: inline-block;
        position: absolute;
    }

    .uniqueSolution .imageContainer::after {
        content: '';
        width: 1px;
        height: 67px;
        border-left: 2px dotted var(--skilly-main-color);
        left: 97px;
        top: 33px;
        display: inline-block;
        position: absolute;
    }

    .newLandingPageBox .boostYourSkills {
        background-color: #fff;
    }

    .newLandingPageBox .skillsCardHolder.mb {
        margin-bottom: 90px;
    }

    .featuresPlatformBoxHolder {
        flex-direction: column;
        align-items: center;
    }

    .featuresPlatformBox {
        margin-bottom: 70px;
    }

    .pricing.mobile {
        display: block;
    }

    .pricing.desctop {
        display: none;
    }

    .pricing.mobile .tablePricing {
        text-align: center;
        margin: 50px auto 0px auto;
    }

    .newLandingPageBox .skillySay {
        left: 20px;
    }

    .pricing.mobile .tablePricing .gray {
        background-color: #fff;
        text-align: left;
    }

    .pricing.mobile .tablePricing .white span,
    .pricing.mobile .tablePricing .white.smallText span b {
        text-align: left;
    }

    .newLandingPageBox .abiliticsProduct {
        padding: 0px 20px 60px;
    }

    .remoteWorkChallengesBox.first .heading,
    .remoteWorkChallengesBox.first .description,
    .remoteWorkChallengesBox.second .heading,
    .remoteWorkChallengesBox.second .description,
    .remoteWorkChallengesBox.third .heading,
    .remoteWorkChallengesBox.third .description,
    .remoteWorkColumnBoxText {
        max-width: 265px;
    }

    .skillyChat.third .chatText,
    .skillyChat.second .chatText {
        max-width: 220px;
    }

    .remoteWorkPart3 .subNameSection {
        max-width: 250px;
    }
    /*remote landing page style*/
    .fixedWidthContainerBig {
        padding: 0px 20px;
    }

    .remoteWorkPart1 .description,
    .remoteWorkChallengesBox.second .challengesConentHolder,
    .remoteWorkChallengesBox.third .challengesConentHolder {
        margin: auto;
    }

    .remoteWorkPart1 .title,
    .remoteWorkHomePage .remoteWorkPart1 .title {
        font-size: 40px;
        line-height: 45px;
        text-align: center;
        width: 100%;
    }

    .remoteWorkPart1 .subTitle,
    .remoteWorkPart1 .description {
        text-align: center;
        width: 100%;
    }

    .remoteWorkPart1 .imgPart1 {
        max-width: 100%;
        margin-top: 10px;
    }

    .remoteWorkChallengesBox.first {
        margin-top: 0px;
    }

    .remoteWorkPart1 .subTitle,
    .remoteWorkPart5 .subTitle,
    .nameSection {
        font-size: 30px;
        line-height: 35px;
        margin-bottom: 20px;
    }

    .remoteWorkPart1 .description,
    .remoteWorkChallengesBox .heading,
    .remoteWorkChallengesBox .description,
    .subNameSection,
    .chatText,
    .remoteWorkPage .contactDescription,
    .remoteWorkPage .personDetails p,
    .remoteWorkColumnBoxText,
    .remoteWorkHomePage .description,
    .remoteWorkHomePage .description div {
        font-size: 20px;
        line-height: 25px;
        padding-left: 0px;
    }

    .remoteWorkChallengesBox,
    .remoteWorkChallengesBox:nth-child(2n+1) {
        flex-direction: column;
        padding-left: 15px;
        padding-right: 15px;
    }

    .remoteWorkPart3 {
        padding-top: 0px;
        margin-top: 0px;
    }

    .remoteWorkPart2 {
        padding-bottom: 50px;
    }

    .testBotImg {
        max-width: 200px;
        top: auto;
        left: calc(50% - 100px);
        bottom: -340px;
    }

    .tetsBoxHolder {
        width: 100%;
        padding: 15px;
    }

    .remoteWorkPart3.remoteWorkPart6 .skillyAboutRowBox.rightBorderDotted::after {
        display: none;
    }

    .remoteWorkHomePage .remoteWorkPart3 .subNameSection {
        max-width: 225px;
        text-align: center;
    }

    .remoteWorkPage .contactPart,
    .remoteWorkPage.remoteWorkHomePage .contactPart {
        margin-top: 400px;
    }

    .remoteWorkHomePage .remoteWorkPart1 {
        padding: 210px 0px 140px 0px;
        background-image: url(/Content/images/newLandingImages/remoteWorkNewHome/bgr_mobile-08.svg);
    }

    .remoteWorkChallengesBox .quotesOpen {
        top: 0px;
        max-width: 30px;
        left: 0px;
    }

    .remoteWorkChallengesBox.first .quotesClose {
        right: -15px;
    }

    .remoteWorkChallengesBox.first .quotesOpen {
        left: -15px;
    }

    .remoteWorkChallengesBox .quotesClose {
        right: 0px;
        bottom: auto;
        max-width: 30px;
    }

    .remoteWorkChallengesBox > img {
        width: 80%;
        margin-top: 0px;
        margin-bottom: 30px;
        max-width: 300px;
    }

    .remoteWorkPage.remoteWorkHomePage .remoteWorkChallengesBox > img {
        max-width: 500px;
    }

    .remoteWorkPart2 .challengesConentHolder {
        max-width: 400px;
    }

    .remoteWorkPart1 {
        padding-top: 135px;
    }

    .remoteWorkPart2 {
        padding-top: 150px;
    }

    .remoteWorkPart4 {
        margin-bottom: 80px;
    }

    .remoteWorkPart5 {
        padding-top: 50px;
    }

    .subNameSection {
        text-align: center;
    }

    .remoteWorkColumnBoxArrow {
        display: none;
    }

    .remoteWorkPart4 {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        padding-top: 0px;
        padding-bottom: 0px;
        margin-top: -60px;
        z-index: 2;
    }

    .remoteWorkColumnBox {
        margin-bottom: 30px;
    }

    .chatImg {
        width: 70px;
    }

    .skillyChat {
        margin-bottom: 20px;
    }

    .remoteWorkPage .chatText {
        padding: 10px 20px;
        border-radius: 30px;
    }

    .remoteWorkPage .chatBox {
        margin-top: 50px;
    }

    [class*="remoteWorkPar"] .chatBox {
        justify-content: center;
    }

    .skillyChat.first, .skillyChat.fourth {
        margin-left: 0px;
    }

    [class*="remoteWorkPart3"] .chatBox {
        max-width: 400px;
    }

    .remoteWorkImg3 {
        display: none;
    }

    .remoteWorkPart3 {
        padding-bottom: 100px;
        margin-top: 15px;
        padding-left: 15px;
        padding-right: 15px;
    }

    .remoteWorkPart5 .whiteBox {
        padding: 0px;
        background-color: transparent;
    }

    .remoteWorkColumnBoxImg {
        margin-top: 0px;
    }

    .remoteWorkChallengesBox .heading {
        text-align: center;
    }
    /* remote work home page*/
    .leftSpace {
        margin-left: 0px;
    }

    .skillyAboutRow,
    .chatSkillyHolder {
        flex-direction: column;
    }

    .skillyAboutRowBox,
    .remoteWorkHomePage .remoteWorkPart1 .imgPart1,
    .remoteWorkHomePage .remoteWorkPart1 .aboutSection .imgPart1,
    .chattingHolder > img.chatting {
        width: 100%;
    }

    .remoteWorkHomePage .remoteWorkPart1 .aboutSection .imgPart1 {
        max-width: 100%;
    }



    .remoteWorkHomePage .remoteWorkPart2,
    .remoteWorkHomePage .remoteWorkPart3,
    .remoteWorkHomePage .remoteWorkPart4,
    .remoteWorkPart3.remoteWorkPart6,
    .remoteWorkHomePage .remoteWorkPart5 {
        padding-top: 0px;
        padding-bottom: 0px;
        margin-top: 0px;
    }

    .skillyAboutMain,
    .aboutSection {
        margin-top: 0px;
    }

    .aboutSection {
        padding: 0px;
        margin-top: 100px;
    }

    .chattigBox,
    .chattigBox.first,
    .chattigBox.second,
    .chattigBox.third,
    .chatSkillyDesc.rightDesc,
    .chatSkillyDesc.rightDesc img {
        position: relative;
        top: auto;
        left: auto;
        bottom: auto;
        right: auto;
        margin-top: 20px;
    }

    .skillyAboutMain {
        margin-top: 50px;
    }



    .skillyAboutRowBox {
        margin-top: 20px;
        width: 90%;
        max-width: 400px;
    }

    .onlyDestop {
        display: none;
    }

    .onlyMobile {
        display: block;
    }

    .remoteWorkHomePage .remoteWorkPart3 {
        padding-bottom: 90px !important;
    }

    .skillyAboutRow {
        margin-bottom: 0px;
    }

    .chatSkillyDesc.leftDesc img.questionSamll {
        display: none;
    }

    .chatSkillyHolder {
        padding-top: 90px;
        align-items: center;
        padding-bottom: 70px;
    }

    .remoteWorkHomePage .remoteWorkPart3.remoteWorkPart6 .subNameSection.bottomSubName {
        padding: 0 40px;
    }

    .chatSkillyDesc.rightDesc img {
        margin-top: 30px;
        width: 200px;
        margin-left: 0px;
    }

    .remoteWorkHomePage .rightDesc.chatSkillyDesc .description {
        max-width: 227px;
    }

    .chatSkillyDesc.leftDesc img.questionSamll {
        display: none;
    }

    .chattingHolder,
    .chatSkillyDesc.rightDesc {
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .remoteWorkHomePage .remoteWorkPart3 {
        background-size: cover;
    }

    .aboutSection .challengesConentHolder {
        margin: 0px;
        margin-top: 85px;
    }

    .remoteWorkHomePage .remoteWorkPart2 .nameSection {
        margin-top: 50px;
        margin-bottom: 20px;
        font-size: 30px;
        width: 90%;
    }

        .remoteWorkHomePage .remoteWorkPart2 .nameSection .bigFont,
        .remoteWorkHomePage .aboutSection .description {
            font-size: 16px;
            line-height: 20px;
        }

    .numberImg {
        width: 40px;
    }

    .challengesConentHolder {
        margin-top: 20px;
        margin-bottom: 0px;
        width: 100%;
        padding: 0 20px;
    }

    .remoteWorkHomePage .remoteWorkPart4 {
        margin-top: 50px;
        margin-bottom: 50px;
    }

    .chatSkillyHolder,
    .remoteWorkHomePage .remoteWorkPart3.remoteWorkPart6 .subNameSection {
        margin-top: 20px;
    }

    .skillyAboutRowBox .description {
        padding: 20px 0px;
    }

    .remoteWorkHomePage .remoteWorkPart5 {
        margin-top: 50px;
    }

    .chattingInner {
        max-height: 70px;
    }

    img.chatting {
        margin-left: 0px;
    }

    .remoteWorkHomePage .remoteWorkPart1 {
        background-size: cover;
        padding-top: 1020px;
        background-position: right 0px top 0px;
    }

    .remoteWorkPage.remoteWorkHomePage .chatImg {
        width: 90px;
    }

    .skillyAboutRow:last-child {
        margin-top: 0px;
    }

    .remoteWorkPart3.remoteWorkPart6 .skillyAboutRowBox {
        width: 90%;
    }

    .aboutSection .absoluteText {
        position: relative;
        top: auto;
        text-align: center;
    }

    .remoteWorkHomePage .aboutSection .description.bigTextDesc {
        font-size: 20px;
        line-height: 25px;
        margin-bottom: 30px;
        text-align: center;
    }
    /*teams page*/
    .videoIcon {
        display: none;
    }

    .teamBigWidth {
        flex-direction: column;
    }

    .teamPart1 .imgBox {
        margin: auto;
    }

    .teamPart1 .textBox {
        align-items: center;
        justify-content: center;
        width: 100%;
        margin-bottom: 40px;
    }

    .teamEnjoySectionImg,
    .teamEnjoySectionImgHolder {
        display: none;
    }

    .imgHolderEnjoySection {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin-top: 40px;
    }

    .teamEnjoySectionImgSmall {
        margin-left: 0px;
        margin-bottom: 30px;
    }

    .reasonsHolder {
        flex-direction: column;
        align-items: center;
    }

    .reasonBox {
        margin-bottom: 50px;
    }

    .engineGreenBtn.mobile {
        display: block;
    }

    .engineGreenBtn.desctop {
        display: none;
    }

    .teamsBoxHolder {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .dashedLine {
        display: none;
    }

    .teamBox {
        margin-bottom: 150px;
    }

    .teamPart1 {
        padding-top: 115px;
    }

    .teamHeading,
    .teamBigDescription {
        font-size: 30px;
        line-height: 35px;
    }

    .teamBigHeading {
        font-size: 55px;
        line-height: 60px;
    }
    /*new home page- gray*/
    .newHomeHeaderLeftPart {
        margin-left: auto;
        margin-right: auto;
        justify-content: center;
        align-items: center;
    }

    .newHomePageWidth {
        flex-direction: column-reverse;
        align-items: center;
    }

    .newHomeCompaniesUse,
    .newHomeHelpSection,
    .engineHeading,
    .engineBoxRow,
    .buttonsTestHolder {
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
    }

        .newHomeCompaniesUseImg,
        .newHomeHelpBox,
        .engineHeading .newHomeHeadingCenter,
        .engineBox,
        .statisticsBox,
        .imgDotsHolder,
        .buttonTestBox {
            margin-bottom: 30px;
        }

    .engineBoxRow {
        margin-bottom: 0px;
    }

    .copyPasteImg {
        max-width: 500px;
        margin: auto;
    }

    .addSkillyImgHolder {
        flex-direction: column-reverse;
        align-items: center;
        justify-content: center;
    }
    /*tourism page*/
    .bottomButtonTourismBg{
        flex-direction: column;
        align-items: center;
    }
    .solutionContentHolder,
    .answerBoxHolder,
    .exploreBoxHolder {
        flex-direction: column;
        align-items: center;
    }
    .answerBox {
        margin-bottom: 60px;
    }
    .videoBtn {
        top: -70px;
        left: calc(50% - 44px);
    }
    .videoBackground video {
        margin-left: 0px;
        margin-top: 55px;
        width: 100% !important;
    }
    .videoBackground{
        width: 100%;
    }
    .solution_bgr_textImg {
        max-width: 630px;
        position: absolute;
        top: 68px;
        width: 600px;
        left: calc(50% - 300px);
    }
    .tourismHeading {
        margin-top: 40px;
        text-align: center;
    }
    .tourismPart1 .problemBox{
        margin: auto;
    }
    .problemTextImg {
        left: calc(50% - 217px);
    }
    /*pricing page start*/
    .pricingPart2.mobile {
        display: flex;
    }
    .pricingPart2.desctop {
        display: none;
    }
    .pricingHeadingBox {
        flex-direction: column;
    }
    .pricingHeading {
        margin-right: 0px;
        margin-bottom: 30px;
    }
    .pricingBoxHolderNew {
        flex-direction: column;
        align-items: center;
    }
    .pricingBoxMain {
        margin-bottom: 80px;
    }
        .pricingBoxMain:last-child{
            margin-bottom: 0px;
        }
    .hoverGreenBack{
        display: none !important;
    }
    .pricingBoxMain {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        flex-direction: row;
    }
    .pricingSubHeading{
        text-align: center;
    }
    .pricingBoxHolderNew {
        margin-bottom: 95px;
    }
    .pricingPart1 {
        padding-bottom: 0px;
    }
    .pricingPart1 .newHomePageWidth,
    .pricingPart3 .newHomePageWidth {
        flex-direction: column;
        align-items: center;
    }
    .pricingPart3 .newHomePageWidth {
        flex-direction: column;
        align-items: center;
    }
        .FAQBoxHolder {
            flex-direction: column;
            align-items: center;
        }
        /*features page style*/
    .featuresBoxNew,
    .featuresBoxNew:nth-child(even) {
        flex-direction: column;
        align-items: center;
    }
    .bigIconFeature{
        margin-top: 30px;
    }
    /*new tourism bg style start*/
    .tourismBGNew .mapBulgaria {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
        width: 100%;
        display: none;
    }
   
    .botHolderMap {
        position: relative;
        width: auto;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
    }

        .botHolderMap .botMap {
            position: relative;
        }

            .botHolderMap .botMap span:after {
                display: none;
            }

        .botHolderMap .botMap {
            top: auto;
            left: auto;
            right: auto;
            bottom: auto;
            flex-direction: row;
            width: auto;
            height: 160px;
        }

            .botHolderMap .botMap img {
                width: 140px;
                display: inline-block;
                height: auto;
            }
}
@media only screen and (max-width: 840px) {
    /*tourism page*/
    .tourismPart4{
        display: none;
    }
}
@media only screen and (max-width: 768px) {
    /*tourism new bg start*/
    .tourismBGNew .problemTextImg {
        left: 6%;
        width: 75%;
    }
 
}
    @media only screen and (max-width: 600px) {

        .teamBoxImg {
            width: 100%;
            max-width: 400px;
            margin-left: 0px;
        }

        .teamBox {
            width: 100%;
            border-radius: 0px;
            height: auto;
            padding-bottom: 40px;
        }

        .remoteWorkChallengesBox.first .quotesClose {
            right: 0px;
        }

        .remoteWorkChallengesBox.first .quotesOpen {
            left: 0px;
        }

        .remoteWorkHomePage .remoteWorkPart1 {
            padding-top: 800px;
        }

        .remoteWorkHomePage .remoteWorkPart1 {
            padding: 210px 0px 0px 0px;
        }
        /*new home page - gray*/

        .newHomeHeading {
            text-align: center;
        }

        .newHomePart5 {
            background-size: cover !important;
        }

        .carousel-item {
            padding: 0px;
        }

        .successStoryShadow {
            width: 240px;
            height: 260px;
        }

        .successStoryBox .successStoryInfoBox {
            width: 260px;
            height: 296px;
        }

        .newHomeChatTextBox.bigBuble {
            width: 240px;
            height: 165px;
            background-size: 100% !important;
            background: url(/Content/images/newLandingImages/newHomePage/largeBuble.svg);
        }

        .successStoryHolder {
            padding-left: 15px;
        }

        .arrow-prev,
        .arrow-next {
            top: -30px;
        }

        .newHomePart5 .newHomeHeadingCenter {
            margin-bottom: 30px;
        }

        .successStoryHolder {
            align-items: center;
            justify-content: center;
        }
        /*tourism page*/
        .problemTextImg,
        .solution_bgr_textImg {
            left: calc(50% - 150px);
            max-width: 300px;
        }
        .solution_bgr_textImg {
            top: 240px;
        }

        .problemPointImg {
            top: 30px;
            left: calc(50% - 50px);
        }
        .tourismPart1 .problemContent {
            max-width: 150px !important;
        }
        .tourismPart1 .problemBox {
            align-items: flex-start;
        }
        .solutionContentHeading span {
            font-size: 48px;
        }
        .solutionHeadingImg {
            max-width: 480px;
            width: 100%;
            left: 0px;
            bottom: -5px;
        }
        .answerSkillyHeading {
            margin: 50px auto 40px auto;
            text-align: center;
        }
        .tourismHeaderImg {
            max-width: 460px;
            width: 90%;
        }
        .solutionContentTextBox {
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }
        .solutionContentTextBox {
            width: 100%;
        }
        .solutionContentHeading {
            margin-left: auto;
            margin-right: auto; 
        }
        .solutionContentText{
            text-align: center;
        }
        .newHomePart9.tourismPart8 .absoluteBtn {
            margin: 60px auto 40px auto;
        }

    }

    @media only screen and (max-width: 400px) {
        .remoteWorkHomePage .remoteWorkPart2 {
            display: flex;
            flex-direction: column-reverse;
        }

        .remoteWorkHomePage .remoteWorkPart1 {
            padding-top: 450px;
        }

        .remoteWorkHomePage .remoteWorkPart2 {
            padding-bottom: 300px;
        }

        .remoteWorkPart1 .title, .remoteWorkHomePage .remoteWorkPart1 .title {
            font-size: 30px;
            line-height: 35px;
        }

        .remoteWorkHomePage .remoteWorkPart1 .chatText,
        .remoteWorkPart1 .description,
        .remoteWorkChallengesBox .heading,
        .remoteWorkChallengesBox .description,
        .subNameSection, .chatText,
        .remoteWorkPage .contactDescription,
        .remoteWorkPage .personDetails p,
        .remoteWorkColumnBoxText,
        .remoteWorkHomePage .description,
        .remoteWorkHomePage .description div {
            font-size: 16px;
            line-height: 20px;
        }

        .remoteWorkHomePage .remoteWorkPart1 .chatBox {
            margin-top: 50px;
        }

        .remoteWorkPart1 .subTitle,
        .remoteWorkPart5 .subTitle,
        .nameSection,
        .remoteWorkHomePage .remoteWorkPart2 .nameSection,
        .remoteWorkHomePage .remoteWorkPart2 .nameSection .bigFont {
            font-size: 25px;
            line-height: 30px;
        }

        .chattigBox {
            margin-top: 20px;
            border: 0px;
            width: auto !important;
            position: absolute !important;
            background: none;
            height: auto !important;
        }

            .chattigBox.first {
                left: calc(50% - 85px);
                top: 500px;
            }

            .chattigBox.second {
                left: 20px;
                top: 650px;
            }

            .chattigBox.third {
                right: 20px;
                top: 650px;
            }

        .remoteWorkHomePage .remoteWorkPart1 .imgPart1 {
            margin-top: -355px;
            width: 90%;
            margin-left: auto;
            margin-right: auto;
            display: block;
            left: 0px;
        }
        /*features page style*/
        .featuresPart3.newHomePart9 .buttonTestBox.active {
            width: 100%;
            height: 140px;
        }
            .featuresPart3.newHomePart9 .buttonTestBox.active .buttonTest {
                max-width: 175px;
            }
    }