@import url('https://fonts.googleapis.com/css2?family=Teko:wght@300;400;500;600;700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@800&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,300;0,500;1,600&family=Montserrat&display=swap');

/* START WEBSITE NAVIGATION */


/* #Navigation
================================================== */
ul li a {
    color:#eeeeee;
    font-family: 'Montserrat', sans-serif;
    font-size:0.9rem;
    transition: all 150ms ease-in;
}
ul li a:hover {
    color:#B280D8;
    transition: all 150ms ease-in;

}
.start-header {
    opacity: 1;
    transform: translateY(0);
    padding: 20px 0;

    -webkit-transition : all 0.3s ease-out;
    transition : all 0.3s ease-out;
}
.start-header.scroll-on {
    box-shadow: 0 10px 30px 0 rgba(138, 155, 165, 0.15);

    padding: 10px 0;
    -webkit-transition : all 0.3s ease-out;
    transition : all 0.3s ease-out;
}
.start-header.scroll-on .navbar-brand img{
    height: 24px;
    -webkit-transition : all 0.3s ease-out;
    transition : all 0.3s ease-out;
}
.navigation-wrap{
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 1000;
    -webkit-transition : all 0.3s ease-out;
    transition : all 0.3s ease-out;
}
.navbar{
    padding: 0;
}
.navbar-brand img{
    height: 40px;
    width: auto;
    display: block;

    -webkit-transition : all 0.3s ease-out;
    transition : all 0.3s ease-out;
}
.navbar-toggler {
    float: right;
    border: none;
    padding-right: 0;
}
.navbar-toggler:active,
.navbar-toggler:focus {
    outline: none;
}

.nav-item-nohov:hover {
    text-decoration: none !important;
    color:#eee;
    background-color: transparent !important;
}
.nav-item-nohov:hover:after {
    text-decoration: none !important;
    color:#eee;
    background-color: transparent !important;
    transition:all 0ms linear;
}

.navbar-light .navbar-toggler-icon {
    width: 24px;
    height: 17px;
    background-image: none;
    position: relative;
    border-bottom: 1px solid #fff;
    transition: all 300ms linear;
}
.navbar-light .navbar-toggler-icon:after,
.navbar-light .navbar-toggler-icon:before{
    width: 24px;
    position: absolute;
    height: 1px;
    background-color: #fff;
    top: 0;
    left: 0;
    content: '';
    z-index: 2;
    transition: all 300ms linear;
}
.navbar-light .navbar-toggler-icon:after{
    top: 8px;
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:after {
    transform: rotate(45deg);
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:before {
    transform: translateY(8px) rotate(-45deg);
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
    border-color: transparent;
}
.nav-link{
    color: #000 !important;
    font-weight: 500;
    transition: all 200ms linear;
    font-family:'Teko', sans-serif;
    text-transform: uppercase;
    font-size:18px;
    letter-spacing: 2px;
}
.nav-item:hover .nav-link{
    color: #8167a9 !important;
}
.nav-item.active .nav-link{
    color: #777 !important;
}
.nav-link {
    position: relative;
    padding: 5px 0 !important;
    display: inline-block;
}
.nav-item:after{
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    height: 2px;
    content: '';
    background-color: #8167a9;
    opacity: 0;
    transition: all 200ms linear;
}
.nav-item:hover:after{
    bottom: 0;
    opacity: 1;
}
.nav-item.active:hover:after{
    opacity: 0;
}
.nav-item{
    position: relative;
    transition: all 200ms linear;
}
.nav-item .dropdown-menu {
    transform: translate3d(0, 10px, 0);
    visibility: hidden;
    opacity: 0;
    max-height: 0;
    display: block;
    padding: 0;
    margin: 0;
    transition: all 200ms linear;
}
.nav-item.show .dropdown-menu {
    opacity: 1;
    visibility: visible;
    max-height: 999px;
    transform: translate3d(0, 0px, 0);
}


.dropdown-menu {
    padding: 10px!important;
    margin: 0;
    font-size: 13px;
    letter-spacing: 1px;
    color: #111;
    background-color: #fff  ;
    border: none;
    border-radius: 3px;
    box-shadow: 0 5px 10px 0 rgba(138, 155, 165, 0.15);
    transition: all 200ms linear;
}
.dropdown-toggle::after {
    display: none;
}

.dropdown-item {
    font-family:'Teko', sans-serif;
    padding: 3px 15px;
    color: #111;
    border-radius: 2px;
    transition: all 200ms linear;
    font-size:18px;
}
.dropdown-item:hover,
.dropdown-item:focus {
    color: #7031FE;
    background-color: #fff;
    transition: all 200ms linear;
    margin-left:10px;
}


.dropdown-item:hover::before {
    content: url(../img/mini-arrow.svg);
    background-size: 10px 10px;
    display: inline-block;
    width: 15px;
    height: 10px;
    margin-right: 15px;
    position: absolute;
    left: 13px;
    margin-left:10px;

}

.nav-button-contact {
    padding:6px 20px !important;
    color: #fff;

    background: #ffffff1a;


    transition: 0.2s;
    transition-delay: 0.1s;

    text-decoration: none !important;
    border-radius:14px;
}

.nav-button-contact:hover{
    background-position:170px;
    background-color:#ffffff29;
    text-decoration: none !important;
    color:#eee;
}

.nav-item.active .nav-link {
    color:#eee !important;
    font-family:'Teko', sans-serif;
}
.navlink {
    color:#eee !important;
    font-family:'Teko', sans-serif !important;
}
/* #Media
================================================== */

@media (max-width: 767px) {
    h1 {
        font-size: 38px;
    }

    .nav-item:after {
        display: none;
    }

    .nav-item::before {
        position: absolute;
        display: block;
        top: 15px;
        left: 0;
        width: 11px;
        height: 1px;
        content: "";
        border: none;
        background-color: #fff;
        vertical-align: 0;
    }

    .dropdown-toggle::after {
        position: absolute;
        display: block;
        top: 10px;
        left: -23px;
        width: 1px;
        height: 11px;
        content: "";
        border: none;
        background-color: #fff;
        vertical-align: 0;
        transition: all 200ms linear;
    }

    .dropdown-toggle[aria-expanded="true"]::after {
        transform: rotate(90deg);
        opacity: 0;
    }

    .dropdown-menu {
        padding: 0 !important;
        background-color: transparent;
        box-shadow: none;
        transition: all 200ms linear;
    }

    .dropdown-toggle[aria-expanded="true"] + .dropdown-menu {
        margin-top: 10px !important;
        margin-bottom: 20px !important;
    }
    .bg-light {
        background-color: #1E0034 !important;
    }
}



/* END NAVIATION BAR */


/* BODY STYLE */





/* LOADER */

.loader-dissapear {
    width: 100%;
    height: 100vh;
    background: #6800B5;
    position: fixed;
    top: 0;
    z-index: 9998;
}

.loading-spinner {
    position: fixed;
    left: 50%;
    transform: translate(-50%,-50%) translateZ(0);
    top: 50%;
    width: 90px;
    height: 90px;
    z-index: 1;
    /* background: url(/assets/img/logo.svg); */
    background-size: contain;
    background-repeat: no-repeat;
    /* animation: spinning 1.5s infinite ease-in-out;*/
}

.loading-spinner:after {
    content:"";
    position:absolute;
    width:160px;
    height:160px;
    background-color:rgba(0,0,0,0);
    border-radius:100%;
    margin:-33px;
    box-shadow: 0 4px 0 0 #fff;
    transition: all 1s linear;
    animation: lds-eclipse 1s linear infinite;
    margin-top:-44px;
}



@keyframes spinning {
    0% { transform: translate(-50%,-50%) scale(1) translateZ(0);}
    50% { transform: translate(-50%,-50%) scale(1.1) translateZ(0);}
    100% { transform: translate(-50%,-50%) scale(1) translateZ(0);}
}

@keyframes lds-eclipse {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    50% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}


#toTop {
    padding: 6px 6px;
    background-image: linear-gradient( 135deg, #00C79E 40%, #00ECBC 90% );
    color: #fff;
    position: fixed;
    bottom: 25px;
    right: 25px;
    display: none;
    border-radius: 10px;
    cursor: pointer;
    z-index: 1018;
}




.moving-arrow {
    animation: MoveUpDown 1s linear infinite;
    position: absolute;
    right: -8px;
    bottom: 0;
}

@keyframes MoveUpDown {
    0%, 100% {
        bottom: 5px;
    }
    50% {
        bottom: 20px;
    }
}


/* CUSTOM WEBSITE CSS */

body {
    font-family: 'Montserrat', sans-serif;
    font-size:1.1rem;
    line-height: 1.2;
    background-color:#F2F3F5;
}

.header-section {
    background: #300c83;
    margin-top:90px;
    padding-top:200px;
    padding-bottom:200px;
    position: relative;

}
.header-section-about {
    background: #300c83;
    margin-top: 90px;
    padding-top: 158px;
    padding-bottom: 158px;
    position: relative;

}


.heading-teko-sm {
    font-family:'Teko', sans-serif !important;
    color:#fff;
    font-size:22px;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 2px;

}

.main-header-lg {
    font-family: 'Montserrat', sans-serif;
    font-size:50px;
    font-weight: 800;
    color:#fff;
}

.general-paragraph-white {
    color:#fff;
    right:3px;
    bottom:3px;
}

.general-paragraph{
    line-height: 1.5;
}



.white-simple-btn {
    color:#fff;
    text-decoration: none;
    font-size:0.9rem;
    position:relative;
    transition: all 100ms ease-in-out;
    font-weight: 600;
}

.white-simple-btn::after{
    content: url('../img/Arrow-btn.png');
    background-size: 10px 10px;
    display: inline-block;
    width: 15px;
    height: 10px;
    margin-right: 15px;
    position: absolute;
    bottom:8px;
    margin-left:10px;

}

.white-simple-btn:hover {
    color:#fff;
    text-decoration: none;
    transition: all 100ms ease-in-out;
}

.white-simple-btn:hover::after{
    content: url('../img/Arrow-btn.png');
    background-size: 10px 10px;
    display: inline-block;
    width: 15px;
    height: 10px;
    margin-right: 15px;
    position: absolute;
    bottom:8px;
    margin-left:14px;
    transition: all 100ms linear;

}


.black-simple-btn {
    color:#000;
    text-decoration: none;
    font-size:0.9rem;
    position:relative;
    transition: all 100ms linear;
    top:13px;
}

.black-simple-btn::after{
    content: url('../img/black-arrow.png');
    background-size: 10px 10px;
    display: inline-block;
    width: 15px;
    height: 10px;
    margin-right: 15px;
    position: absolute;
    bottom:8px;
    margin-left:10px;

}

.black-simple-btn:hover {
    color:#000;
    text-decoration: none;
    transition: all 100ms linear;
}

.black-simple-btn:hover::after{
    content: url('../img/black-arrow.png');
    background-size: 10px 10px;
    display: inline-block;
    width: 15px;
    height: 10px;
    margin-right: 15px;
    position: absolute;
    bottom:8px;
    margin-left:14px;
    transition: all 100ms linear;

}

.black-simple-btn-2 {
    color:#000;
    text-decoration: none;
    font-size:0.9rem;
    position:relative;
    transition: all 100ms linear;
    padding-left:20px;
    font-weight: bold;

}

.black-simple-btn-2::after{
    content: url('../img/black-arrow.png');
    background-size: 10px 10px;
    display: inline-block;
    width: 15px;
    height: 10px;
    margin-right: 15px;
    position: absolute;
    bottom:8px;
    margin-left:10px;

}

.black-simple-btn-2:hover {
    color:#000;
    text-decoration: none;
    transition: all 100ms linear;
}

.black-simple-btn-2:hover::after{
    content: url('../img/black-arrow.png');
    background-size: 10px 10px;
    display: inline-block;
    width: 15px;
    height: 10px;
    margin-right: 15px;
    position: absolute;
    bottom:8px;
    margin-left:14px;
    transition: all 100ms linear;

}


.first-img-abs {
    position:absolute;
    right:0px;
    bottom: 0px;
}


.squiggle {
    stroke-dasharray: 2050;
    stroke-dashoffset: 2050;
    animation: draw 5s linear forwards;
}

@keyframes draw {
    to {
        stroke-dashoffset: 0;
    }
}

.background-line-triangle {
    background-image: url("../img/Group 62.svg");
    background-size: cover;
    background-repeat:no-repeat;
    padding-top:50px;
    padding-bottom:50px;

}

.background-line-triangle-2 {
    background-image: url("../img/Group 65.svg");
    background-size: cover;
    background-repeat:no-repeat;
    padding-top:50px;
    padding-bottom:50px;

}

.come-in {
    transform: translateY(150px);
    animation: come-in 0.8s ease forwards;
}
.come-in:nth-child(odd) {
    animation-duration: 0.6s; /* So they look staggered */
}

@keyframes come-in {
    to { transform: translateY(0); }
}


.clipped-img {

}

.background-img {
    background-image: url("../img/first-img-slider.png");
    background-size:cover;
    background-repeat:no-repeat;
    min-height: 500px;
    clip-path: polygon(100% 0, 100% 64%, 85% 100%, 0 100%, 0 0);
    margin-top:40px;

}

.background-img-about {
    background-image: url("../img/about-us-banner.jpg");
    background-size:cover;
    background-repeat:no-repeat;
    min-height: 500px;
    background-position: center;
    margin-top:40px;

}

.background-img-contact {
    background-image: url("../img/contact-us-banner.png");
    background-size:cover;
    background-repeat:no-repeat;
    min-height: 500px;

    margin-top:90px;

}

.background-img-about-1 {
    background-image: url("../img/about-us-img-1.png");
    background-size:cover;
    background-repeat:no-repeat;
    min-height: 500px;
    z-index: -1;
    margin-top:-95px;

}

.background-img-2 {
    background-image: url("../img/technology-connection-online-networking-medias-conpt 1 (1).png");
    background-size:cover;
    background-repeat:no-repeat;
    min-height: 560px;

    margin-top:40px;

}

.background-img-3 {
    background-image: url("../img/third-section-background.png");
    background-size:cover;
    background-repeat:no-repeat;
    min-height: 560px;

}



.custom-white-bg {
    background-color:#fff;
    padding-top:50px;
    padding-bottom:50px;
    padding-left:30px;
    margin-top:-237px;
    padding-right: 30px;
}

.custom-white-bg-header {
    background-color:#fff;
    padding-top:50px;
    padding-bottom:50px;
    padding-left:30px;
    margin-top:-160px;
    padding-right: 30px;
}

.custom-white-bg-header-about {
    background-color:#fff;
    padding-top:50px;
    padding-bottom:50px;
    padding-left:30px;
    margin-top:-179px;
    padding-right: 30px;
}

.custom-white-bg-2 {
    background-color:#fff;
    padding-top:50px;
    padding-bottom:50px;
    padding-left:30px;
    margin-top:-297px;
    padding-right: 30px;
}

.custom-white-bg-3 {
    background-color:#fff;
    padding-top:50px;
    padding-bottom:50px;
    padding-left:30px;
    padding-right: 30px;
    margin-top:-299px;
}

.white-med-title {
    color:#fff;
    font-weight: bold;
    font-size: 3rem;
}

.white-med-title-header {
    color:#fff;
    font-weight: bold;
    font-size: 3rem;
    margin-top:156px;
}

.black-med-title {
    color:#131313;
    font-weight: bold;
    font-size: 3rem;
}


.positioning {
    position:absolute;
    left: 0px;
}



.fill {
    stroke-dasharray: 2050;
    stroke-dashoffset: 2050;
    animation: fill 5s linear forwards;
}

@keyframes fill {
    to {
        stroke-dashoffset: 0;
    }
}

.fourth-section {
    padding-top:150px;
    padding-bottom:150px;
    position:relative;
}

.first-triangle {
    position: absolute;
    top:20%;
    left:0px;
    z-index:-1;
}

.second-triangle {
    position:absolute;
    top: 40%;
    left: 0%;
    z-index:-1;
}
.square {
    float:right;
    margin-top:-40px;
}

.third-triangle {
    position: absolute;
    right: 0px;
    top:370px;
    z-index:-1;

}

.lines {
    position: absolute;
    right: 0px;
    z-index:-1;

}
.lines-2 {
    position: absolute;
    left: 0px;
    z-index:-1;

}

.fourth-triangle {
    position: absolute;
    right:0px;
    z-index:-1;
    top:0;
}
.fixed-inside {
position: -webkit-sticky;
position: sticky;
top: 150px;
z-index: 7;}

.img__wrap {
    position: relative;
    height: auto;
    width: auto;
    margin-top:-9px;
}

.img__wrap img {
    width:100%;
    height: 200px;
    border-bottom: 2px solid #00ECBC;
    object-fit: cover;
    border-top-right-radius: 11px;
    border-top-left-radius: 11px;
}

.fifth-section {
    padding-top:100px;
    padding-bottom:100px;
    background-color:#391982;
}

.title-wrap {
    padding: 20px 30px;
    background-color:#290E68;
    border-top: 2px solid #00ECBC;
}

.title-wrap h5{
    color:#fff;
    font-family:'Teko', sans-serif;
    text-align: center;
    font-size:1.5rem;

}

.split-btn-color {
    color:#000;
    font-weight: 500;
    text-shadow: 1px 0 0 black;
    padding: 15px 30px;
    text-align:center;
    background: #ff3232;
    /* Old browsers */
    background: linear-gradient(to right top, #00C79E 50%, #00ECBC 50%);
    background-size: 100% 100%;
    background-position:left bottom;

    transition:all 0.4s ease;
    position: relative;
    top: 30px;

}

.split-btn-color:hover {
    text-decoration: none;
    background-size: 400% 200%;
    background-position:right top;
    color:#000;
}

.split-btn-color-orange {
    text-transform: uppercase;
    color:#FFFFFF;

    text-shadow: 1px 0 0 white;
    padding: 15px 30px;
    text-align:center;
    background: #ff3232;
    /* Old browsers */
    background: linear-gradient(to right top, #f4bb12 50%, #ffcc00 50%);
    background-size: 100% 100%;
    background-position:left bottom;

    transition:all 0.4s ease;

}

.split-btn-color-orange:hover {
    text-decoration: none;
    background-size: 400% 200%;
    background-position:right top;
    color:#FFFFFF;
}


.sixth-section {
    padding-top:100px;
    padding-bottom:100px;
    background-color:#fff;
}

.cta-first-triangle {
    position: absolute;
    top: 30px;
    left: -200px;
    z-index: 1;
}
.cta-third-triangle {
    position: absolute;
    bottom:0;
    right: 0;
}

.cta-fourth-triangle {
    position: absolute;
    left: 0;
    top: 364px;
    z-index: 3;
}


.heading-footer {
    color:#fff;
    font-family:'Teko', sans-serif;
    font-size:1.5rem;
    font-width: 600;
}

.footer-logo-title {
    color:#fff;
    font-family:'Teko', sans-serif;
    font-size:2rem;

    font-weight: 800;
    line-height: 1;
    margin-bottom: 0;
    margin-top:20px;
}
.footer-logo {
    margin-left:40px;
}
.footer-logo-subtitle {
    color:#fff;
    font-family:'Teko', sans-serif;
    font-size:1.4rem;
    font-weight: 300;
    margin-left: 36px;
}

footer {
    background-color:#391982;
    padding-top:50px;
    padding-bottom:0px;
}

.general-paragraph-footer  {
    color:#fff;
    font-size:14px;
}

.footer-copyright {

}

.background-copyright {
    padding-top: 30px;
    padding-bottom:30px;
    background-color:#290E68;
}

.cta {
    padding-top:100px;
    padding-bottom:100px;
    background-color:#D90068;
    text-align: center;
    margin-top:50px;
    position: relative;
}


.cta-head-lg {
    color:#fff;
    font-size:3rem;
    margin-bottom:20px;
    font-weight: 800;
}

.cta-paragraph {
    color:#fff;
    font-weight: 400;
    margin-bottom:60px;
}

.empty-triangle {
    position: absolute;
    right: 20px;
    top:20px;
}

.services-section {
    padding-top:100px;
    padding-bottom:100px;
}

.panel-default>.panel-heading {
    color: #333;
    background-color: transparent;

    padding: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.panel-default>.panel-heading a {
    display: block;
    padding: 10px 15px;
    color: #000;
    font-family:'Teko', sans-serif;
    font-size:3rem;
    transition: all ease-in-out 0.3s;
}

.panel-default>.panel-heading a:hover {
    color:#7031FE;
    text-decoration: none;

}

.panel-default>.panel-heading a:before {
    content: "";
    position: relative;
    top: 1px;
    display: inline-block;

    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    float: left;
    margin-right: 30px;
    transition: transform .25s linear;
    -webkit-transition: -webkit-transform .25s linear;

}

.panel-default>.panel-heading a[aria-expanded="true"] {
    background-color: transparent;
}

.panel-default>.panel-heading a[aria-expanded="true"]:before {
    content: "\2212";
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.panel-default>.panel-heading a[aria-expanded="false"]:before {
    content: "\002b";
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}


.background-accordion-text {
    padding-top: 40px;
    padding-bottom:40px;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    background-color: #fff;
    padding-left:19px;
    padding-right: 19px;
    border:1px solid #fff;
    border-bottom:2px solid #7031FF;
    transition: all ease-in-out 0.3s;
    margin-bottom:40px;
    box-shadow: 0px -4px 15px 2px rgba(0,0,0,0.13);

}
.background-accordion-text:hover {
    border:1px solid #7031FF;
    border-bottom:2px solid #7031FF;
    transition: all ease-in-out 0.3s;
}

.accordion-header-sm {
    font-size:2.2rem;
    font-family:'Teko', sans-serif;
    margin-bottom:20px;
    margin-top:40px;
    font-weight: 400;
}

.about-title-sm {
    font-family:'Teko', sans-serif;
    font-size:3rem;
    font-weight: 600;
    color: #131313;
}

body.dark .about-title-sm{
    color: #FFFFFF;
}

input {
    padding: 10px 20px;
    width: 100%;
    background-color: rgba(0,0,0,0.05);
    border: 1px solid #F2F3F5;
    margin-bottom: 20px;
}

textarea{
    padding: 10px 20px;
    width: 100%;
    background-color: rgba(0,0,0,0.05);
    border: 1px solid #F2F3F5;
    margin-bottom: 20px;
    max-height: 300px;
}

body.dark input,
body.dark textarea{
    color: #FFFFFF;
}

.contact-lines {
    position:absolute;
    right:0px;
    z-index:99;
    top: 0px;
}

@media (max-width:670px) {
    .header-section {
        padding-top:50px;
        padding-bottom:50px;
    }
    .first-img-abs {
        position: absolute;
        width:100%;
        height: auto;
        opacity: 0.4;
        z-index: -1;
    }
    .main-header-lg {
        font-size:2.3rem;
    }
    .white-med-title {
        text-align: center !important;
    }
    .positioning {
        width:80%;
        height: auto;
        right: 0px;
        left: auto;
    }
    .custom-white-bg-2 {
        margin-top:-150px;
    }
    .background-img {
        clip-path: polygon(100% 0, 100% 100%, 100% 100%, 0 100%, 0 0);
    }
    .lines{
        display: none;
    }
    .nav-link{
    color:#fff !important;
    }
    .second-triangle {
        display: none;
    }
    .square {
        float: right;
        margin-top: -40px;
        position: absolute;
        right: 0;
        z-index: -1;
    }
    .fixed-inside {
        position: relative;
        top: 0;
    }
    .fourth-section {
        padding-top:50px;
        padding-bottom:50px;
    }
    .custom-white-bg {
        margin-top:-300px;
    }
    .white-simple-btn {
    top:10px;
    }
    .black-med-title {
    margin-bottom:30px;
    }
    .custom-white-bg-3 {
    margin-top:-350px;
    }
    .img__wrap {
        width:100%;
        margin-bottom:20px;
    }
    .fifth-section {
        padding-top:50px;
        padding-bottom:50px;
    }
    .white-med-title {
        font-size:2.2rem;
    }
    .black-med-title {
        font-size:2.2rem;
    }
    .sixth-section {
    padding-top:50px;
        padding-bottom:50px;
    }
    .custom-white-bg-header-about {
        background-color: #fff;
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 30px;
        margin-top: -35px;
        padding-right: 30px;
        margin-right: 0px;
        margin-left: 0px;
    }
    .header-section-about {
    padding-top:50px;
        padding-bottom:50px;

    }

    .background-img-about-1 {
        display:none;
    }
    .dropdown-item {
        color:#fff;
    }

    .white-med-title-header {
        margin-top:0px;
        font-size:2.2rem;
        text-align: left !important;
    }
    .custom-white-bg-header {
        margin-left:0px;
        margin-right: 0px;
        margin-top: -270px;
    }
    .contact-lines {
        z-index: -1;
    }
    .background-img-contact {
        background-position:right;
    }
    #captcha_image {
        width:33% !important;
        height: 40px !important;
    }
    #sendMessageButton {
        right:0 !important;
        width:100%;
    }
    .cstm-group p {
        margin-top:0px !important;
    }
    .background-img-about {
    background-position:center;
    }
    .cta-head-lg {
        font-size:2.2rem;
    }
    .panel-default>.panel-heading a {
        font-size:2.2rem;
    }
    .accordion-header-sm {
        font-size: 1.6rem;
        margin-top:20px;
    }
    .mob-margin {
        margin-left: 44px;
    }
    .services-section {
        padding-top:50px;
        padding-bottom:30px;
    }
    .cta {
        margin-top:0px;
        padding-top:50px;
        padding-bottom:70px;
    }
    .about-title-sm {
        font-size:2.2rem;
    }
}


:target {
    display: block;
    position: relative;
    top: -120px;
    visibility: hidden;
}

/* Updates */

body{
    background-color: rgba(153, 255, 241, 0.3);
}

li.nav-item:hover a.nav-link,
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.show,
.dropdown-item.show{
    color: #7031FE !important;
}

.nav-item:after{
    display: none;
}

.nav-item .dropdown-menu {
    border-radius: 0;
    width: 300px;
    max-width: 90vw;
}

.dark-mode-toggle{
    position: absolute;
    right: 15px;
    top: calc(50% - 10.5px);
    cursor: pointer;
}

.dark-mode-toggle i{
    color: #7031FF;
    transform: rotate(180deg);
    transition: 300ms;
    font-size: 18px;
}

body.dark .dark-mode-toggle i{
    transform: rotate(0);
}   

body.dark{
    background-color: #7031FF;
}

.nav-item::before{
    display: none;
}

.navigation-wrap {
    background-color: #F8F9FA !important;
}

.navbar-light .navbar-toggler-icon{
    border-color: #000;
    transition: 100ms;
}

.navbar-light .navbar-toggler-icon:after, .navbar-light .navbar-toggler-icon:before{
    background-color: #000;
    transition: 100ms;
}

.navbar-collapse{
    position: absolute;
    background-color: #F8F9FA;
    top: calc(100% + 8px);
    right: 0;
    left: 0;
}

.nav-item .dropdown-menu{
    padding-left: 0;
    max-width: 280px;
    box-shadow: none;
    transition: 0ms;
}

body.dark .dropdown-menu{
    background-color: #290E68;
}

.dropdown-item{
    white-space: wrap;
    text-transform: uppercase;
    padding-left: 10px;
    font-size: 18px;
    background-color: transparent !important;
}

@media screen and (max-width: 767px){
    .dark-mode-toggle{
        right: 60px;
    }

    li.nav-item a.nav-link{
        color: #111 !important;
    }

    .nav-item .dropdown-menu{
        visibility: visible;
        opacity: 1;
        max-height: 100%;
        margin-bottom: 20px;
    }

    .dropdown-item{
        color: #111;
    }

    .nav-item .dropdown-menu{
        padding-left: 0;
        max-width: 100%;
    }
}

.dropdown-item:hover{
    padding-left: 5px;
}

.dropdown-toggle::after,
.dropdown-item:hover::before{
    display: none;
}

body.dark .navigation-wrap,
body.dark .navbar-collapse{
    background-color: #290E68 !important;
}

body.dark .navbar-collapse a,
body.dark .navbar-light .navbar-nav .nav-link{
    color: #FFFFFFBB !important;
}

body.dark .navbar-light .navbar-nav .nav-link:hover,
body.dark .navbar-light .navbar-nav .nav-link.show,
body.dark .dropdown-item:hover, body.dark .dropdown-item:focus, body.dark .dropdown-item.show{
    color: #FFFFFF !important;
}

body.dark .navbar-light .navbar-toggler-icon{
    border-color: #FFFFFF;
}

body.dark .navbar-light .navbar-toggler-icon:after, body.dark .navbar-light .navbar-toggler-icon:before{
    background-color: #FFFFFF;
}

body.dark .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon{
    border-color: transparent;
}

.navigation-wrap{
    transition: 50ms;
}

.video{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.video .m-video{
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.video .overlay{
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

body.dark .video .overlay{
    background-color: rgba(0, 0, 0, 0.6);
}

body.dark img,
body.dark .background-img,
body.dark .background-img-2,
body.dark .background-img-3{
    filter: brightness(0.88) contrast(1.08) !important;
}

.video + .container{
    position: relative;
    z-index: 2;
}

p.general-paragraph{
    color: #000000;
}

body.dark .dark-purple{
    background: #290E68 !important;
    color: #FFFFFF !important;
}

body.dark .dark-purple p,
body.dark .dark-purple a{
    color: #FFFFFF !important;
}

body.dark .dark-pink{
    background: #aa1551 !important;
}

body.dark .dark-pink p{
    color: #FFFFFF !important;
}

body.dark .dark-mix{
    color: #f8f8f8 !important;
}

body.dark .dark-purple-darker{
    background-color: #16053c !important;
}

body.dark footer .dark-overlay{
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    pointer-events: none;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 1;
}

body.dark footer .dark-overlay + div,
body.dark footer .dark-overlay + div + div{
    position: relative;
    z-index: 2;
}

.img__description_layer{
    padding: 20px;
    color: #FFFFFF;
    font-size: 14px;
    line-height: 22px;
    background-color: #31166e;
}

body.dark .img__description_layer{
    background-color: #16053c;
}

.no-hover{
    pointer-events: none;
}

.contact-box .info{
    margin-bottom: 10px;
}

.contact-box .info i{
    width: 30px;
    color: #7031FE;
}

section{
    overflow-x: clip;
}

body.dark .split-btn-color {
    color:#FFF;
    text-shadow: 1px 0 0 #FFF;
}

@media screen and (max-width: 425px){
    .contact-container{
        padding-left: 0;
        padding-right: 0;
    }
}

body.dark form ::placeholder{
    color: #FFFFFF;
}

body.dark .cta-dark{
    background-color: #c6004f;
}

.services-section .service{
    margin-bottom: 20px;
    padding: 20px;
    border: 5px solid #13131313;
    background: url(../img/waves.png);
    background-color: rgba(0, 0, 0, 0.02);
}

body.dark .services-section .service{
    border-color: #FFFFFF;
}

body.dark .text-dark{
    color: #FFFFFF !important;
}

.services-section .service h2{
    margin-bottom: 15px;
    font-weight: bold;
}

.services-section .service h2 a{
    text-decoration: none;
    transition: 0ms;
    color: #131313;
}

body.dark .services-section .service *{
    color: #FFFFFF;
}

@media screen and (min-width: 576px){
    .custom-white-bg-header{
        margin-left: 0;
        margin-right: 0;
    }
}

.custom-white-bg-header,
.custom-white-bg-header-about{
    padding: 30px 10px 20px !important;
}

.nowrap{
    white-space: nowrap;
}

.background-img-service{
    background: none;
}

.service-content h2{
    font-weight: bold;
}

.service h3{
    font-weight: 600;
    color: #FFFFFF;
}

body:not(.dark) .service h3,
body:not(.dark) .service b{
    color:#131313;
}

.cta-2{
    background-color: #7031FE;
}

body.dark .cta-2{
    background-color: #16053c;
}

.text-dark {
  color: #131313 !important;
}

.dark-sv .service *{
    color: #FFFFFF !important;
}

.dark-sv .service{
    border-color: #FFFFFF !important;
}

@media screen and (max-width: 1199px){
    .heading-footer + ul li:nth-child(5) a{
        word-break: break-all;
    }

    .white-med-title-header{
        font-size: 2.7rem;
    }
}

.not-exp{
    width: fit-content !important;
    margin: auto;
}

body.dark .background-line-triangle,
body.dark .background-line-triangle-2 {
    background-image: url("../img/Group 62-dark.svg");
}

