.bg_fixed {
    background-attachment: fixed !important;
}

/*BANNER*/

#banner {
    width: 100%;
    height: 35.4%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    position: relative;
    margin-top: calc(4rem + 5pt);
}

#banner img {
    width: 100%;
    height: 100%;
}

.content_banner {
    position: absolute;
    width: 100%;
    text-align: center;
    top: 35%;
    right: 0;
    bottom: 0;
    left: 0%;
    color: white;
    line-height: 1.1;
    text-shadow: 2px 5px 5px #444;
}

.img_banner {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center 60% !important;
    background-size: 100% auto;
}

.tag_line {
    text-transform: uppercase;
    font-size: 6.5vw;
    width: 57%;
    margin: 0 auto;
}

.tag_line p {
    font-weight: 900 !important;
}

.sub_title {
    color: #e3e2e2;
    font-weight: 600;
    font-size: 2.3vw;
    position: absolute;
    top: 53%;
    right: 0;
    bottom: 0;
    left: 0;
}

.sub_title p {
    font-weight: 600 !important;
    font-size: 2.4vw;
}

/*BANNER*/

/*OUR_CORE*/

.learn_more {
    visibility: hidden;
}

.our_core_frame {}

#our_core_frame .container_our_core .swiper-slide {
    width: 33.33%;
}

.btn_clients,
.swiper-button-next,
.swiper-button-prev,
.panigation-oa,
.panigation-ms {
    display: none;
}

#idealisation {
    color: #3399cc;
}

#development {
    color: #4d4e88;
}

#solution {
    color: #333333;
}

.text_item {
    text-align: center;
    max-width: 100%;
    margin: 1% auto;
    display: block;
}

.text_item h4 {
    text-transform: uppercase;
    font-size: 2.5vw;
    font-family: "Muli" !important;
    font-weight: bold;
}

.text_item p {
    font-size: 1.2vw;
    margin-top: 1.54%;
    font-weight: normal;
    margin-bottom: 5%;
    min-height: 2.5em;
}


.full_item {
    width: 33.33%;
    display: inline-block;
    float: left;
}

.container_our_core {
    width: 100%;
    padding-bottom: 2.31%;
}

.container_our_core .item {
    position: relative;
    display: block;
    float: left;
    width: 100%;
    max-height: 6.44%;
    line-height: 6.44%;
    background-color: black;
}

.bg_item_our_core {
    padding-top: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 100%;
}

.img_item_oc {
    display: none;
}

.bg_item_our_core:hover .bg_item_our_core:after {
    background-color: black;
    width: 33.33%;
    padding-top: 100%;
    position: absolute;

}

.bg_item_our_core:hover {
    opacity: 0.3;
}



.item:hover .learn_more {
    opacity: 1;
    display: none;

}

.item:hover .triangular {
    opacity: 1;
}

.item:hover .overlay {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.learn_more {
    z-index: 1;
    color: white;
    text-transform: uppercase;
    position: absolute;
    left: 34%;
    bottom: 12%;
    font-size: 1.2vw;

}

.triangular {
    position: absolute;
    width: 9.5%;
    left: 45%;
    top: -4%;
    z-index: 1;
}

.overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    width: 100%;
    height: 100%;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-transition: .3s ease;
    -o-transition: .3s ease;
    transition: .3s ease;
}


.text_overlay {
    color: white;
    font-size: 1.2vw;
    position: absolute;
    top: 30%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 90%;
    height: 80%;
    line-height: 1.5em;
    margin-bottom: 28.42%;
    margin-top: 24%;
}

/*OUR_CORE*/


/*OUR_EXPERTISE*/

.title_tab {
    display: none;
}

#our_expertise_frame {
    width: 100%;
    height: auto;
    display: block;
    width: 100%;
    background: url('../images/bg_expertise_section.jpg') no-repeat center center;
}

#our_expertise_frame .title_section {
    padding-top: 1.543% !important;
}

.container_our_expertise {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    /* height: 100%; */
    margin-top: 3%;
    float: left;
    padding-bottom: 3%;
    position: relative;
}

/* Style the tab */
.tab_expertise {
    overflow: hidden;
    background-color: #f1f1f1;
}

/* Style the buttons inside the tab */
.tab_expertise button {
    width: 33.33%;
    text-transform: uppercase;
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 1% 1%;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    font-size: 1.3vw;
    border: 0.01vw solid white;
    border-bottom: none;
}

.tab_expertise button:first-child {
    border-left: none;
}

.tab_expertise button:last-child {
    border-right: none;
}


/* Change background color of buttons on hover */
.tab_expertise button:hover {
    background-color: #39b6e9;
    color: white;
}

/* Create an active/current tablink class */
.tab_expertise button.activeExpertise {
    background-color: #39b6e9;
    color: white;
}

.table_expertise {
    width: 100%;
    display: table;
    border-top: 0.3vw solid #39b6e9;
}


.row_expertise {
    width: 100%;
    display: table-row;
}

.col_expertise {
    max-width: 25%;
    padding: 10%;
    display: table-cell;
    border: 0.01vw solid #efefef;
    text-align: center;
    position: relative;
}

.col_expertise p {
    padding-top: 9.5em;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    font-weight: bold;
    font-size: 1.4vw;
    background-repeat: no-repeat;
    background-size: 25% auto;
    background-position: 50% center;
}

#angular-item {
    background-size: 27% auto;
    background-position: 50% center;
}

#cakephp-item {
    background-size: 34% auto;
    background-position: 50% center;
}

#codeigniter-item {
    background-size: 25% auto;
    background-position: 50% center;
}

#eclipse-item {
    background-size: 28% auto;
    background-position: 50% center;
}

#grails-item {
    background-size: 27% auto;
    background-position: 50% center;
}

#laravel-item {
    background-size: 25% auto;
    background-position: 50% center;
}

#android-item {
    background-size: 25% auto;
    background-position: 50% center;
}

#ionic-item {
    background-size: 25% auto;
    background-position: 50% center;
}

#ios-item {
    background-size: 52% auto;
    background-position: 50% center;
}

#phonegap-item {
    background-size: 34% auto;
    background-position: 50% center;
}

#react-native-item {
    background-size: 30% auto;
    background-position: 50% center;
}

#titanium-item {
    background-size: 25% auto;
    background-position: 50% center;
}

#alibaba-item {
    background-size: 44% auto;
    background-position: 50% center;
}

#amazon-item {
    background-size: 44% auto;
    background-position: 50% center;
}

#digital-ocean-item {
    background-size: 41% auto;
    background-position: 50% center;
}

#azure-item {
    background-size: 25% auto;
    background-position: 50% center;
}

.bg_grey {
    background-color: #f5f5f5;
}

.button-learnmore {
    text-transform: uppercase;
    font-size: 1.6vw;
    font-weight: bold;
    padding: 1% 6%;
    border: none;
    background: #39b6e9;
    border-radius: 100pt;
    color: #fff;
    background-clip: -webkit-linear-gradient(#38b5e8, #289ac8);
    background-clip: -webkit-gradient(linear, left top, left bottom, from(#38b5e8), to(#289ac8));
    background-clip: -o-linear-gradient(#38b5e8, #289ac8);
    background-clip: linear-gradient(#38b5e8, #289ac8);
    -webkit-box-shadow: 2px 5px 14px -5px #1e2021;
    box-shadow: 2px 5px 14px -5px #1e2021;
    text-decoration: none;
    margin-bottom: 2.543%;

}

.button-learnmore {
    text-transform: uppercase;
    font-size: 1.6vw;
    font-weight: bold;
    background: #39b6e9;
    border-radius: 100pt;
    color: #fff;
}

.button-learnmore:hover {
    background: #33a3d1;
    padding: 0.9% 5.9%;
    cursor: pointer;
}




.clearfix {
    content: ' ';
    display: block;
    clear: both;
}

.container_our_expertise .item {
    position: relative;
    display: inline-block;
    float: left;
    width: 33.33%;
    height: 6.44%;
    line-height: 6.44%;
    padding: 1%;
}


.container_our_expertise .bg_item_our_expertise {
    width: 100%;
    height: 100%;
}

.container_our_expertise .item:hover .bg_item_our_expertise {
    opacity: 0.5 !important;
}

.container_our_expertise .item .triangular {
    top: -0.5% !important;
}

.text_content {
    display: block;
    color: white;
    float: left;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 23%;
    right: 0;
    bottom: 0;
    left: 3%;
    line-height: 0.3;
}

.text_content li:first-child {
    text-transform: uppercase;
    padding-bottom: 0.5%;
    font-size: 2.3vw !important;
}


.text_content li {
    height: 100%;
    margin-top: 6.7%;
    font-size: 1.5vw;
    list-style: none;
}

.icon_content {
    float: left;
    width: 100%;
    height: 10%;
    position: absolute;
    top: 75%;
    right: 0;
    bottom: 0;
    left: 0;
}

.icon_content img {
    width: 15%;
    height: 100%;
    padding: 1% 3.6%;
    margin-right: 3%;
}


/*OUR_EXPERTISE*/



/*FOCUS*/


#focus_frame {
    width: 100%;
    /* padding-top: 50%; */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url('../images/bg-focus-travel.jpg');
    position: relative;
    overflow: hidden;
}

#top_focus {
    position: relative;
    /* top: -5%; */
    top: 0;
    right: 0;
    left: 0;
    margin-bottom: 2.5rem;
}

.swipe-focus {
    /* position: absolute; */
    position: relative;
    top: 14%;
    left: 0;
    right: 0;
}

.sliders-focus {
    background-color: transparent;
}

/* .container_focus::before,
.container_focus::after {
    content: '.';
    display: block;
    padding-top: 1%;
    visibility: hidden;

} */

.container_focus::after {
    clear: both;
}

.container_focus {
    zoom: 1;
    /* width: 66.5%; */
    width: 100%;
    margin: 0 auto;
    display: table;
    position: relative;
    /* margin-top: 3rem; */
    /* margin-bottom: 2rem; */
}

.container_focus img {
    width: 30%;
    float: left;
    border-radius: 5%;
}

.content-focus-title {
    color: #3992cf;
    font-size: 1.4vw !important;
    width: 60%;
    text-align: left;
    position: absolute;
    top: 5%;
    left: 35%;
}

.content-focus-subtitle {
    font-size: 1.1vw !important;
    display: block;
    width: 60%;
    margin-top: 2.4%;
    overflow-x: hidden !important;
    text-align: left;
    position: absolute;
    top: 15%;
    left: 35%;
}

#focus_frame .lSAction {
    display: none;
    opacity: 0;
    z-index: -1;
    visibility: hidden;
}

#focus_frame .btn-linking{
    margin-top: 2rem;
}


.middle_focus .lSAction>.lSPrev {
    display: none;
}

.bottom_focus {
    width: 100%;
    position: relative;
    margin-top: 2.5rem;
    /* top: 60%; */
    /* bottom: 2.25rem; */
    /* left: 1.5%; */
}

#focus_frame .lSPager.lSpg {
    position: absolute;
    top: 84.5%;
    left: 1%;
    right: 0;
    /*    background-color: red;*/
}

#focus_frame .lSSlideOuter .lSPager.lSpg>li>a {
    /*
    cursor: pointer;
    height: .9em;
    width: .9em;
    background-color: white;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
    border-color: #3e3e3e;
    border-style: solid;
    border-width: 1px;
*/
    display: none;
}

#focus_frame .lSSlideOuter .lSPager.lSpg>li:hover a,
#focus_frame .lSSlideOuter .lSPager.lSpg>li.active a {
    background-color: #3e3e3e;
}

.wrapper_dot {
    width: 100%;
    display: inline-block;
    /* padding-top: 6.5%; */

    padding-right: 0;
}

.hide {
    visibility: hidden;
}


.dotFocus {
    cursor: pointer;
    height: 1em;
    width: 1em;
    background-color: white;
    border-radius: 50%;
    display: inline-block;
    -webkit-transition: background-color 0.6s ease;
    -o-transition: background-color 0.6s ease;
    transition: background-color 0.6s ease;
    border-color: #878787;
    border-style: solid;
    border-width: 0.01em;
}

.dotFocus+.dotFocus {
    margin-left: 0.5%;
}

.dotActiveFocus,
.dotFocus:hover {
    background-color: #3992cf;
    border-color: #3992cf;
}

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

.divider {
    background-color: #878787;
    width: 100%;
    padding-top: 2%;
    border-style: none;
    margin: 0 auto;
}

.box_divider {
    width: 21.5%;
    display: inline-block;
    position: relative;
    /* right: 1%; */
    margin-top: 1.5%;
}

.box_divider img {
    width: 15%;
    height: 45%;
    opacity: 0;
    position: absolute;
    top: -25%;
    right: 0;
    left: 50%;
    transform: translateX(-50%);
}

.box_divider hr {
    margin-top: 0;
    margin-bottom: 0;
}

.box_divider p {
    width: 100%;
    padding-top: 1.925%;
    color: #878787;
    font-size: 1.2vw;
    text-transform: uppercase;
}



.dividerActiveFocus,
.box_divider:hover hr {
    background-color: #3992cf;
}

.box_divider:hover img {
    opacity: 1 !important;
}


.dividerActiveFocus p,
.box_divider:hover p {
    color: #3992cf;
}

.box_divider:hover {
    cursor: pointer;
}


/*FOCUS*/



/* CLIENTS */


.content_clients_b_mobile {
    display: none;
}

.aaa {
    background-image: url('../images/bg_micro_services.jpg');
    background-attachment: fixed;
    background-size: 100% auto;
}

#clients_frame_b {
    width: 100%;
    /* padding-bottom: 15px; */
    position: relative;
    /* background-color: #f6f6f6; */
    /* background-image: url('../images/bg_micro_services.jpg');
    background-attachment: fixed;
    background-size: 100% auto; */
}

#clients_frame_b .title_main {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    right: 0;
}

#clients_frame_b .subtitle_section {
    font-size: 1.3vw !important;
}

.content_clients_b_desktop {
    width: 100%;
    display: inline-block;
    /* flex-wrap: wrap; */
    padding: 0% 0% 0 0% !important;
    /* height: 700px; */
    /* columns: 7; */
    /* background-color: #f6f6f6; */
}

.item-client {
    width: 20%;
    padding-bottom: 15%;
    /* margin: 0.3%; */
    display: inline-block;
    background-color: #ffffff;
    /* float: left; */
    position: relative;
    /* border: 0.5px solid #eeeeee; */
    float: left;
}


/* .item-client img{
    width: 100%;
    height: 100%;
} */
.item-client .img-item-client {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-size: 80% auto;
    background-repeat: no-repeat;
    position: absolute;
}

.hover-item-client, .hover-item-partner {
    width: 100%;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    transition: all .5s ease-out;
    opacity: 0;
    padding: 10%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;

}

.hover-item-client p.text-item, .hover-item-partner p.text-item {
    font-size: 1.5vw;


}

.hover-item-client .text-item, .hover-item-partner .text-item {
    color: #ffffff;
    font-weight: lighter;
}

.hover-item-client .link-item, .hover-item-partner .link-item {
    width: 13%;
    height: 17.5%;
    border-radius: 50%;
    background: #289ac8 url('../images/ic-link.png') center center no-repeat;
    background-size: 40% auto;
    position: absolute;
    left: 0;
    right: 0;
    display: inline-block;
    margin: 0 auto;
    margin-top: 5%;
}

/* 
.item-client:hover .hover-item-client, .item-partner:hover .hover-item-partner {
    opacity: 1;
}

.item-client .hover-item-client *, .item-partner .hover-item-partner * {
    transition: all .5s ease-out;
    transform: translateY(-25%)
}

.item-client:hover .hover-item-client *, .item-partner:hover .hover-item-partner * {
    transform: translateY(25%)
} */

.content_clients_b_desktop .item-clients_b {
    background-size: 70% auto;
    background-repeat: no-repeat;
    background-position: center;
    height: initial;
}

.item_clients_desktop {
    padding: 4% 3.5%;
}

.item_clients_desktop img {
    width: 100%;
    padding-bottom: 12%;
}

.hide {
    visibility: hidden;
}

.grandchild {
    float: left;
}

.zoomClientsLogo {
    background-size: 100% auto !important;
}

.content_clients_b_desktop .next-clientsdt {
    background-size: 100% auto;
    width: 7%;
    height: 12%;
}

.next-clientsmb,
.prev-clientsmb {
    display: none;
}

#clients_frame_b .subtitle_section {
    width: 80%;
    margin: 0 auto;
}

.content_clients_b_desktop .swiper-button-prev {
    left: 0;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.content_clients_b_desktop .arrow {
    width: 3.6%;
    height: 12%;
    background-size: 100% auto;
    position: absolute;
    top: 45%;
    display: inline-block;
    outline: none;

}

.content_clients_b_desktop .swiper-button-next {
    right: 0%;
}

.content_clients_b_desktop .swiper-button-prev {
    left: 0%;
}



/* CLIENTS */
.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3);
    }

    50% {
        opacity: 1;
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3);
    }

    50% {
        opacity: 1;
    }
}

.one_page_clients.activeSlider {

    /*
    -webkit-transition: all 2s ease;
    -moz-transition: all 2s ease;
    -o-transition: all 2s ease;
    -ms-transition: all 2s ease;
    transition: all 2s ease;
*/

    -webkit-animation-name: lightSpeedIn;
    animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0;
    }

    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }
}

@keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0;
    }

    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg);
        opacity: 1;
    }

    100% {
        -webkit-transform: none;
        transform: none;
        opacity: 1;
    }

}


#clients_frame .lSSlideOuter .lSPager.lSpg>li>a {
    display: none;
}




/* OUR_APPROACH */

#our_approach_frame {
    width: 100%;
    text-align: center;
    padding-left: 6.8%;
    padding-right: 6.7%;
}


.content-our-app {
    width: 100%;
    display: block;
    float: left;
    margin: 0 auto;
    margin-top: 2.5rem !important;
    /* margin-bottom: 7.5% !important; */
    position: relative;
}

.content-our-app:hover .box-content-our-app {
    opacity: 0.5;
}

.content-our-app:hover .arrow {
    opacity: 0.6;
}

.content-our-app:hover .arrow:first-child {
    opacity: 0.3;
}


.box-content-our-app {
    display: inline-block;
    width: 14.285%;
    position: relative;
    padding-top: 40%;
    cursor: pointer;
    -webkit-transition: -webkit-transform 1s;
    transition: -webkit-transform 1s;
    -o-transition: transform 1s;
    transition: transform 1s;
    transition: transform 1s, -webkit-transform 1s;
    float: left;
}

#our_approach_frame .content-our-app .swiper-slide {
    width: 14.285% !important;
}

.fixed_content {
    width: 100%;
    -webkit-transition: -webkit-transform 1s;
    transition: -webkit-transform 1s;
    -o-transition: transform 1s;
    transition: transform 1s;
    transition: transform 1s, -webkit-transform 1s;
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
}

.box-content-our-app:nth-child(1) {
    background-color: #39b6e9;
    z-index: 7;
}

.box-content-our-app:nth-child(2) {
    background-color: #3399cc;
    z-index: 6;
}

.box-content-our-app:nth-child(3) {
    background-color: #206181;
    z-index: 5;
}

.box-content-our-app:nth-child(4) {
    background-color: #383c4d;
    z-index: 4;
}

.box-content-our-app:nth-child(5) {
    background-color: #2c2c65;
    z-index: 3;
}

.box-content-our-app:nth-child(6) {
    background-color: #45457e;
    z-index: 2;
}

.box-content-our-app:nth-child(7) {
    background-color: #696eab;
    z-index: 1;
}

.box-content-our-app:nth-child(1) .arrow {
    z-index: 7;
}

.box-content-our-app:nth-child(2) .arrow {
    z-index: 6;
}

.box-content-our-app:nth-child(3) .arrow {
    z-index: 5;
}

.box-content-our-app:nth-child(4) .arrow {
    z-index: 4;
}

.box-content-our-app:nth-child(5) .arrow {
    z-index: 3;
}

.box-content-our-app:nth-child(6) .arrow {
    z-index: 2;
}

.box-content-our-app:nth-child(7) .arrow {
    z-index: 1;
}


.box-content-our-app .arrow {
    position: absolute;
    right: -10%;
    width: 14%;
    height: 10%;
    z-index: 1;
    top: 50%;
    transform: translateY(-100%);
}

.box-content-our-app .icon {
    width: 60%;
    max-width: 60%;
    margin-bottom: 25%;
}

.box-content-our-app:nth-child(1) .icon {
    /*    max-width: 55%;*/
}

.box-content-our-app:nth-child(2) .icon {
    /*    max-width: 70%;*/

}

.box-content-our-app:nth-child(3) .icon {
    /*    max-width: 60%;*/
}

.box-content-our-app:nth-child(4) .icon {
    /*    max-width: 60%;*/
}

.default_icon {
    position: absolute;
    left: 0;
    right: 0;
    top: 15%;
}

.hover_icon {
    /*    display: none;*/
    position: absolute;
    left: 0;
    right: 0;
    visibility: hidden;
    top: 15%;
}


.box-content-our-app h4 {
    font-family: 'Oswald';
    font-weight: 600;
    text-transform: uppercase;
    color: #cccccc;
    font-size: 1.5vw;
    position: absolute;
    top: 39%;
    left: 10%;
    right: 10%;
    min-height: 3em;
    display: flex;
    align-items: center;
    justify-content: center;
}

.box-content-our-app p {
    width: 89%;
    color: #cccccc !important;
    font-size: 1vw !important;
    font-weight: 600;
    margin: 0 auto;
    margin-bottom: 1%;
    margin-top: 160%;
}

.box-content-our-app:hover h4,
.box-content-our-app:hover p {
    color: #fff !important;
}


.box-content-our-app:nth-child(1) h4 {}

/* .box-content-our-app:nth-child(2) h4 {
    top: 49%;

}

.box-content-our-app:nth-child(3) h4 {
    top: 35%;
}

.box-content-our-app:nth-child(4) h4 {
    top: 35%;
}

.box-content-our-app:nth-child(5) h4 {
    top: 40.5%;
}

.box-content-our-app:nth-child(6) h4 {
    top: 40.5%;
}

.box-content-our-app:nth-child(7) h4 {
    top: 40.5%;
} */

.box-content-our-app:hover .hover_icon {
    /*    display: block;*/
    visibility: visible;
    -webkit-animation: zoomIn 1s infinite;
    animation: zoomIn 1s infinite;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}

.box-content-our-app:hover .default_icon {
    /*    display: none;*/
    visibility: hidden;
}

.content-our-app:hover:after {
    width: 100%;
    content: ' ';
    background-color: black;
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0%;
    padding-top: 40%;
    margin-right: 6.7%;
}

.box-content-our-app:hover {
    -webkit-transform: scaleX(1.4);
    -ms-transform: scaleX(1.4);
    transform: scaleX(1.4);
    z-index: 34;
    opacity: 1 !important;
}


.box-content-our-app:hover .arrow {
    display: none;
}

.box-content-our-app:hover .fixed_content {
    -webkit-transform: scaleX(.7142);
    -ms-transform: scaleX(.7142);
    transform: scaleX(.7142);
}


@-webkit-keyframes bounceIn {

    from,
    20%,
    40%,
    60%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }

    40% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03);
    }

    80% {
        -webkit-transform: scale3d(0.97, 0.97, 0.97);
        transform: scale3d(0.97, 0.97, 0.97);
    }

    to {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes bounceIn {

    from,
    20%,
    40%,
    60%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }

    40% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03);
    }

    80% {
        -webkit-transform: scale3d(0.97, 0.97, 0.97);
        transform: scale3d(0.97, 0.97, 0.97);
    }

    to {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.bounceIn {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
}

@-webkit-keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    50% {
        opacity: 1;
    }
}

@keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    50% {
        opacity: 1;
    }
}

.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
}

/*SERVICE_FRAME*/

.service_frame {
    text-align: center;
    font-size: 1.1vw;
    width: 100%;
    padding-top: 60.62%;
    position: relative;
    overflow: hidden;
}

.service_frame .subtitle_section {}

.top_service {
    width: 60%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.top_service>p:nth-child(3) {
    padding-bottom: 3%;
    padding-top: 3%;
}


/*UX_UI_DESIGN_SECTION*/

.ux_ui_design_section {
    /*        background-color: #1f5c7b;*/
    background-image: url('../images/bg-services-conceptualization.jpg');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% 100%;
    color: white;
    width: 100%;
    position: absolute;
    top: 20%;
    left: 0;
    bottom: 0;
    right: 0;
}

.ux_ui_design_section_wrapper {}


.top_content p:first-child {
    padding-top: 3.5%;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 2vw;
}

.middle_content {
    width: 100%;
    padding-top: 46.5%;
    margin: 0 auto;
    position: relative;
}

.slider_design {
    width: 100%;
    padding-top: 23.46%;
    margin: 0 auto;
    position: absolute;
    top: 5%;
    left: 0;
    right: 0;
}

.slider_design ul,
.slider_design ul li {
    width: 100%;
    height: 100%;
}

.slider_design ul {
    list-style-type: none;
}

.slider_design li {
    position: absolute;
    top: 0%;
    display: block;
    background-color: transparent;
}

.active {
    top: 0 !important;
}

.left_slide {
    width: 45%;
    max-width: 35vw;
    padding-top: 23.46%;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% auto;
    position: absolute;
    top: 0;
    left: 5%;
}


.right_slide {
    width: 50%;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto 0;
    text-align: center;
}

.right_slide p {
    padding-top: 5%;
    padding-left: 10%;
    padding-right: 10%;
    margin-bottom: 5%;
    font-size: 1.4vw;
}

.bottom_content {
    width: 100%;
}

.web_design {
    padding-left: 20%;
    padding-right: 20%;
}


.item_wrapper {
    width: auto;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    bottom: 0;
}

.dot_services {
    width: 12%;
    padding-top: 15%;
    text-transform: uppercase;
    text-align: center;

    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 70% auto;
    position: relative;
    display: inline-block;
}

.dot_services:hover {
    cursor: pointer;
}

#item_dot-1 {
    background-image: url('../images/default-concept-icon.png');
}

#item_dot-1:hover {
    background-image: url('../images/hover-concept-icon.png');
}

#item_dot-2 {
    background-image: url('../images/default-uiux-icon.png');
}

#item_dot-2:hover {
    background-image: url('../images/hover-uiux-icon.png');
}

#item_dot-3 {
    background-image: url('../images/default-mobile-app-icon.png');
}

#item_dot-3:hover {
    background-image: url('../images/hover-mobile-app-icon.png');
}

#item_dot-4 {
    background-image: url('../images/default-web-icon.png');
}

#item_dot-4:hover {
    background-image: url('../images/hover-web-icon.png');
}

#item_dot-5 {
    background-image: url('../images/default-project-icon.png');
}

#item_dot-5:hover {
    background-image: url('../images/hover-project-icon.png');
}

.dot_services p {
    width: 100%;
    font-size: 1.2vw;
    font-weight: bold;
    text-align: center;
    line-height: 1.2;

    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;

}

#item_dot-1 p {
    top: 20.5%;
}

#item_dot-2 p,
#item_dot-5 p {
    top: 10.5%;
}


/*UX_UI_DESIGN_SECTION*/


/*SERVICE_FRAME*/

/* MICRO_SERVICES */

.micro_services_frame {
    max-width: 100%;
    background-image: url('../images/bg_micro_services.jpg');
    background-size: 100% 100%;
    text-align: center;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.micro_services_frame .swiper-container {
    margin-top: 3rem
}

.micro_services_frame .col {
    /* padding-bottom: ; */
}

.title_section {
    /* padding-top: 2.25rem; */
    padding-top: 0;
}


.subtitle_micro_services {
    padding-bottom: 3%;
}

.container {
    max-width: 66%;
    overflow: hidden;
    margin: 0 auto;
    display: table;
}

/*
.container::before {
    content: " ";
    width: 100%;
    display: block;
    padding-top: 2.5em;
}
*/

.row {
    width: 100%;
    display: table-row;
}

.col {
    width: 20%;
    display: table-cell;
    text-align: center;
    padding-bottom: 3%;
}

.col-blank {
    visibility: hidden !important;
}

.col img {
    width: 45%;
}

.col p {
    font-weight: bold;
    font-size: 1.2vw !important;
    margin-top: 13%;
    margin-bottom: 1em;

}

.col:hover p {
    color: #3992cf;
}


.micro_services_frame .swiper-slide .col:nth-child(3) img {
    width: 50%;
}

.micro_services_frame.mobile {
    display: none;
}

.micro_services_frame .col p {
    margin-top: 1rem;
}


/* PARTNER _ DISCUSS */
.partner_discuss_frame {
    text-align: center;
    width: 100%;
    height: 100%;
    display: block;

}


#clients_frame_b {
    padding-bottom: 0;
}

#partner_discuss_frame {
    padding-top: 0;
}

.partner_frame {
    text-align: center;
    /* margin-bottom: 5%; */
    /* margin-top: -20px; */
}

.partner_frame h3 {
    font-weight: bold;
    font-size: 2vw !important;
    color: #2a2d39;
    text-transform: uppercase;
    margin-bottom: 3.5%;
    padding-top: 2% !important;

}


#goToPrevSlide {
    top: 28%;
    left: 15%;
    z-index: 1;
    padding: .7%;
}

#goToNextSlide {
    top: 28%;
    right: 15%;
    padding: .7%;
}


.lSAction>.lSPrev {
    left: 15%;
    background-image: url(../images/default-left-arrow.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
}

.lSAction>.lSPrev:hover {
    background-image: url(../images/hover-left-arrow.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
}

.lSAction>.lSNext {
    right: 15%;
    background-image: url(../images/default-right-arrow.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
}

.lSAction>.lSNext:hover {
    background-image: url(../images/hover-right-arrow.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
}

#partner_discuss_frame {
    /* background-color: #f6f6f6; */
    /* margin-top: 115px; */
}

#partner_discuss_frame .swiper-container-partner {
    margin: auto auto;
    text-align: center;
    margin-top: -1%;
    /* height: 450px; */
    /* width: 86.5%; */
    width: 100%;
}

.item-partner {
    width: 20%;
    padding-bottom: 15%;
    position: relative;
    /* margin: 0.3%; */
    display: inline-block;
    background-color: #ffffff;
    /* border: 0.5px solid #eeeeee; */
    float: left;
}

.img-partner {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-size: 80% auto;
    background-repeat: no-repeat;
    position: absolute;
}

#partner-3 {
    background-size: 110% auto;
}

#partner_discuss_frame .swiper-container .swiper-wrapper {
    width: 100%;
    height: 100%;
    position: relative;
}


#partner_discuss_frame .swiper-container .swiper-wrapper .swiper-slide {
    width: 100%;
}

#partner_discuss_frame .swiper-container .swiper-wrapper .swiper-slide {
    content: ' ';
    width: 100%;
    padding-top: 10%;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
}

/* 
#partner-1 {
    background-position: center 68%!important;
}

#partner-2 {
    background-size: 110% auto!important;
    background-position: center 55%!important;
}

#partner-3 {
    background-size: 130% auto!important;
    background-position: center 95%!important;
}

#partner-4 {
    background-size: 120% auto!important;
    background-position: center 55%!important;
}

#partner-5 {
    
} */

#partner-4 {
    background-size: 90% auto;
}

#partner_discuss_frame .swiper-button-prev {
    display: block;
    top: 78%;
    left: 13.7%;
    background-size: 80% auto;
    padding: 1.5%;
    outline: none;
}

#partner_discuss_frame .swiper-button-next {
    display: block;
    top: 78%;
    right: 13.7%;
    background-size: 80% auto;
    padding: 1.5%;
    outline: none;
}



/* DISCUSS */

.discuss_frame {
    text-align: center;
    background-color: #39b6e9;
    position: relative;
    padding: 1.4% 0 2.2% 0;
    background: -webkit-linear-gradient(to bottom, #39b6e9, #3992cf);
    /* Chrome 10-25, Safari 5.1-6 */
    background: -webkit-gradient(linear, left top, left bottom, from(#39b6e9), to(#3992cf));
    background: -webkit-linear-gradient(top, #39b6e9, #3992cf);
    background: -o-linear-gradient(top, #39b6e9, #3992cf);
    background: linear-gradient(to bottom, #39b6e9, #3992cf);
    -webkit-box-shadow: 2px 5px 14px -5px #1e2021;
    box-shadow: 2px 5px 14px -5px #1e2021;
}

.discuss_frame span {
    display: block;
    margin-top: 1%;
}

.title_discuss span {
    margin-top: 0%;
}

.title_discuss {
    text-transform: uppercase;
    font-weight: bold;
    color: white;
    font-size: 2.5vw;
}

.content_discuss {
    font-size: 1.27vw;
    font-weight: 300;
}



#focus_frame_mobile {
    display: none;
}

.services_mobile_frame {
    display: none;
}

.col-last {
    display: none;
}

.micro_services_frame .swiper-wrapper {
    display: initial;
}

.micro_services_frame .swiper-slide {
    margin-top: 2rem;
    margin-bottom: 0rem;
    display: table;
}


@media screen and (max-width: 1024px) {
    #clients_frame_b {
        /* padding-top: 0; */
    }

    #clients_frame_b .title_section {
        padding-bottom: 3.5%;
    }

    .partner_frame h3 {}

    .item-client, .item-partner {
        width: 19%;
        /* padding-bottom: 33%; */
        /* margin:0.15%; */
        float: left;
    }

    #clients_frame_b .title_main, #partner_discuss_frame .title_main {
        position: relative;
    }

    .hover-item-client p.text-item, .hover-item-partner p.text-item {
        font-size: 2.5vw;
    }
}


@media only screen and (max-width: 480px) {
    .content_clients_b_desktop .arrow {
        top: 55%;
    }

    .item-client, .item-partner {
        /* width: 23.5%; */
        /* padding-bottom: 23.5%; */
        float: none;


    }

    #clients_frame_b .title_main, #partner_discuss_frame .title_main {
        position: relative;
    }

    .partner_frame {
        margin: 0;
    }

}




/* Oct 28 2022 */

.container_our_expertise {
    padding-bottom: 0%;
}

.slider_design {
    position: relative;
    padding-top: 0;
    min-height: 300px;
    width: 500%;
    transition: all 600ms ease-in-out;
}

.item_wrapper {
    position: relative;
    margin-top: 15px;
    float: left;
    width: 100%;
}

.ux_ui_design_section {
    float: left;
    position: relative;
    width: 100%;
    padding-bottom: 30px;
    background-color: #3c6581;
    transition: background 400ms linear;
}

.ux_ui_design_section_wrapper {
    float: left;
    width: 100%;
}

.service_frame {
    padding-top: 0;
}

.middle_content {
    padding-top: 0;
    margin-top: 30px;
    overflow: hidden;
}

.middle_content .left_slide,
.middle_content .right_slide {
    position: relative;
    float: left;
    width: 50%;
    left: 0;
}

.slider_design ul, .slider_design ul li {
    position: relative;
    float: left;
}

.slider_design ul li {
    width: 20%;
}

@media screen and (max-width: 1600px) {
    .left_slide {
        max-width: none;
    }
}

@media screen and (min-width: 1280px) {

    .btn_discuss,
    /*SERVICE_FRAME*/
    .service_frame {
        /* font-size: 1.1vw; */
        font-size: 0.8rem;
    }

    .content-focus-subtitle {
        /* font-size: 1.1vw !important; */
        font-size: 0.8rem !important;
    }

    .content_discuss {
        /* font-size: 1.27vw; */
        font-size: 0.8rem;
    }

    .box_divider p,
    .dot_services p,
    .learn_more,
    .text_item p,
    .text_overlay {
        /* font-size: 1.2vw; */
        /* font-size: 0.8rem; */
        font-size: 0.9rem;
    }

    .col p {
        /* font-size: 1.2vw; !important */
        font-size: 0.8rem !important;
    }

    /* Style the buttons inside the tab */
    .tab_expertise button {
        /* font-size: 1.3vw; */
        font-size: 0.8rem;
    }

    #clients_frame_b .subtitle_section {
        /* font-size: 1.3vw !important; */
        font-size: 0.8rem !important;
    }

    .col_expertise p,
    .right_slide p {
        /* font-size: 1.4vw; */
        font-size: 0.8rem;
    }

    .content-focus-title {
        /* font-size: 1.4vw !important; */
        font-size: 0.9rem !important;
    }

    .box-content-our-app h4,
    .hover-item-client p.text-item,
    .hover-item-partner p.text-item,
    .text_content li {
        /* font-size: 1.5vw; */
        /* font-size: 0.8rem; */
        font-size: .9rem;
    }

    .button-learnmore {
        /* font-size: 1.6vw; */
        font-size: 1rem;
    }

    .box-content-our-app p {
        /* font-size: 1vw !important; */
        /* font-size: 0.65rem !important; */
        font-size: 0.75rem !important;
    }

    .sub_title {
        /* font-size: 2.3vw; */
        font-size: 1.45rem;
    }

    .text_content li:first-child {
        /* font-size: 2.3vw !important; */
        font-size: 1.45rem !important;
    }

    .sub_title p {
        /* font-size: 2.4vw; */
        font-size: 1.55rem;
    }

    .text_item h4,
    .title_discuss {
        /* font-size: 2.5vw; */
        font-size: 1.4rem;
    }

    .top_content p:first-child {
        /* font-size: 2vw; */
        font-size: 1.3rem;
    }

    .partner_frame h3 {
        /* font-size: 2vw !important; */
        font-size: 1.25rem !important;
    }

    .tag_line {
        /* font-size: 6.5vw; */
        font-size: 4.15rem;
    }
}


#our_core_frame .swiper-wrapper {
    width: calc(100% + 3rem);
    margin-left: -1.5rem;
}

#our_core_frame .container_our_core .swiper-slide {
    padding: 0 1.5rem;
}


#our_core_frame .container_our_core .swiper-wrapper {
    margin-top: 1.5rem;
    /* margin-bottom: 3rem; */
}

#our_core_frame .container_our_core .frame_bg_item_our_core,
#our_core_frame .container_our_core .item {
    border-radius: 20px;
    overflow: hidden;
}

.frame {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.micro_services_frame .col {
    padding-bottom: 0;
}