body, html{
    overflow-x: hidden !important;
}

body{
    background3: url("/resources/img/home-banner.svg");
    
    background4: url('/resources/img/shape/top.png')no-repeat right top;
    background-size: 900px auto;
    background-position: right top;
    background-repeat: no-repeat;
    font-size:1.1rem;
}

.font-medium {
    font-size:1rem;
}

.font-small {
    font-size:0.7rem !important;
    margin-top:-4px;
}
@media only screen and (max-width: 768px) {
    body, .lead{
        font-size:1.1rem;
    }
}

@media only screen and (min-width: 1800px) {
    body{
        zoom: 1.15;
    }
}

.btn-primary2{
    background: #00bcd4 !important;
    box-shadow: 0 11px 18px -8px rgb(74, 211, 229);
    border: none !important;
    border-color: none;
}

a{
    text-decoration: none !important;
}

.bg-color1{
    background-color: #01ab7c;
}
.bg-color2{
    background-color: #ff5858;
}
.bg-color3{
    background-color: #ffcd45;
}
.bg-color4{
    background-color: #9c5cff;
}
.bg-color5{
    background-color: #ff5ca3;
}
.bg-color6{
    background-color: #5c85ff;
}
.bg-color7{
    background-color: #3de7ea;
}
.bg-color8{
    background-color: #ff955c;
}

.text-standard{
    color: rgb(159, 158, 158);
}

.text-standard-heading{
    color: #54666e !important;
    font-weight: 700 !important;
}

.far{
    font-weight:300;
}

.text-justify{
    text-align: justify;
}

.offcanvas img, .navbar-brand img{
    height:40px;
}

.navbar-secondary{
    height:40px;
    background: #7b68ee;
    display: none;
}

.navbar-secondary .cont{
    animation: textMarquee 20s linear infinite;
    width:100%;
    text-align:center;
    white-space: nowrap;
    padding:3px;
    position: fixed;
    width:100%;
    top:0;
    z-index:1000;
}

.navbar-secondary a {
    padding: 3px 10px;
    font-size:14px;
    margin:2px 5px;
    background: rgba(255,255,255,0.2);
    color:#fff;
    border-radius:5px;
    width:100px;
    display:inline-block;
}

.navbar{
    position: fixed;
    width:100%;
    top:0px;
    z-index:1000;
}

.affix{
    top:0 !important;
}
.logo-suffix{    
    position: absolute;
    font-size: 12px;
    right: 15px;
    bottom: 0;
}

header{
    height:90px;
}


@media only screen and (max-width: 500px) {
    header{
        height:120px;
    }

    .navbar-secondary{
        display: block;
    }

    .navbar{
        top:40px;
    }
}

.navbar-toggler .fas {
    color: #adabbc;
}

.hero-section{
    background2: url('/resources/img/shape/color-particles-2.svg')no-repeat center top;
}

.ptb-100{
    padding: 100px 0;
}

.ptb-80{
    padding: 80px 0;
}

.ptb-60{
    padding: 60px 0;
}

@media only screen and (max-width: 600px) {
    .ptb-80{
        padding: 50px 0;
    }

    .ptb-100{
        padding: 60px 0;
    }
}

.apptimus-product{
    cursor: pointer;
}

.apptimus-product img{
    transition: all 2s;
}

.apptimus-product:hover img{
    transform: scale(120%);
}

.pattern-bg{
    position: absolute;
} 

.p-bg1{
    bottom: 0%;
    right: -10%;
    width:1000px;
}

.text-gradient-pink-blue{
    background: -webkit-linear-gradient(-70deg,#6c33fd 0,#7b68ee 100%);
    /**background: -webkit-linear-gradient(-70deg,#6c33fd 0,#7b68ee 100%);**/
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color:transparent;
    -webkit-box-decoration-break:clone;
}

.text-gradient-blue-purple{
    background: -webkit-linear-gradient(-70deg,#6c33fd 0,#7b68ee 100%);
    /**background: -webkit-linear-gradient(-70deg,#6c33fd 0,#d333fd 100%);**/
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color:transparent;
    -webkit-box-decoration-break:clone;
}

.text-gradient-purple-blue{
    background: -webkit-linear-gradient(-70deg, #9003d7 0%, #175cff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color:transparent;
    -webkit-box-decoration-break:clone;
}

.text-gradient-purple-coral{
    /**background: -webkit-linear-gradient(-70deg, #9867f0 0%, #ed4e50 100%);**/
    background: -webkit-linear-gradient(-70deg, #db469f 0%, #2188ff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color:transparent;
    -webkit-box-decoration-break:clone;
}

.bg-theme{
    background: linear-gradient(-70deg, #6c33fd 0%, #7b68ee 100%);
}

.bg-light{
    background: #f7f9ff !important;
}

.bg-dark{
    background: #0f2145 !important;
}

.glow-bg{
    background-image:url('/resources/img/hero-glow.svg');
    background-repeat:no-repeat;
    animation: glow 100s linear infinite;
}

.bradius-0{
    border-radius:0 !important;
}
@keyframes glow {
	0%{
		
        background-size:auto 100%;
	}
    50%{
		
        background-size:auto 300%;
	}
	100%{
		background-size:auto 100%;
	}
}

@media only screen and (max-width: 600px) {
    .customer-section{
        overflow: hidden !important;
        max-width: 100%;
        height: 70px;
    }

    .customer-logos{
        position: absolute;
        animation: marquee 8s linear infinite;
        display: flex !important;
    }

    @keyframes marquee {
        0% { left: 0; }
        100% { left: -100%; }
    }

    @keyframes textMarquee {
        0% { left: 0; }
        100% { left: -800px }
    }
}

.footer-title{
    -webkit-text-stroke: 0px #fff;
    font-size:15vw;
    margin-bottom:-7.5vw
}

.big-title{
    font-size:7vw;
}

.opac{
    opacity:0.95;
}

.offcanvas-end{
    width:100%;
    border:none;
}

.offcanvas.show{
    transform: none;
}

.span-arrow {
    font-size: 20px;
    margin-bottom: 10px;
    color: #555;
    font-weight: 600;
}

@media only screen and (max-width: 992px) {
    .span-arrow {
        font-size: 16px;
    }

    .arrow-cont img{
        width:30px;
    }

    .arrow-cont{
        text-align: center !important;
    }
}

.brighten{
    filter: brightness(10);
}

.bg-grad{
    background: #2563eb;
    background: -webkit-linear-gradient(-70deg,#00bcd4 25%,#008ad4 100%);
}

.bg-blue{
    background-color: #2563eb;
}

.bg-orange{
    background-color: rgb(242, 165, 58);
}

.bg-orange-dark{
    background-color: rgb(219, 131, 8);
}

.bg-green{
    background: #06c996;
    background: linear-gradient(135deg,#06c996 0,#06c9b9 100%);
}

.bg-red{
    background: #FF3841;
    background: linear-gradient(135deg,#FF3841 0,#ea2e38 100%);
}

.bg-color, .bg-color *{    
    color: white !important;
}

.overflow-img-cont{
    overflow: visible !important;
}

.hero-img {
    margin-top: -180px;
}

@media only screen and (min-width: 992px) {
    .overflow-img-cont{
        overflow: hidden !important;
    }

    .overflow-img-cont .overflow-img{
        width:170% !important;
        max-width: unset !important;
    }

    .hero-img {
        margin-top: unset;
    }
}

/** team sprites **/
.team-tile-parent{
    max-height:316px;
    overflow: hidden;
}

@media only screen and (max-width: 767px) {
    .team-tile-parent{
        max-height:79px;
    }

    .team-tile{
        zoom:0.5;
    }
}

.team-tile{
    border-radius: 0 0 1000px 1000px;
    overflow:hidden;
    position:relative;
    padding-top:20px;
    width: 120px;
    display:inline-block;
    margin:5px;
}

.team-tile-circle{
    aspect-ratio:1 !important;
    border-radius: 100%;
    width: 120px; height: 120px;
    overflow:hidden;
}

.team-sprite{
    background-image: url('/resources/img/team/team.webp');
    width: 300px; height: 300px; /**parent is zoomed out to reduce the size **/
    position:absolute;
    bottom:-83px;
    /**zoom:0.45;**/
    transform: scale(0.47);
    left:-90px;
    overflow:hidden;
    filter: brightness(1.2);
}

.team-tile:hover .team-sprite, .team-tile.pop .team-sprite{    
    bottom:-85px;
    /**zoom:0.45;**/
    transform: scale(0.5);
    left:-90px;
}

.team-1 {
    background-position: -10px -10px;
}

.team-2 {
    background-position: -330px -10px;
}

.team-3 {
    background-position: -10px -330px;
}

.team-4 {
    background-position: -330px -330px;
}

.team-5 {
    background-position: -650px -10px;
}

.team-6 {
    background-position: -650px -330px;
}

.team-7 {
    background-position: -10px -650px;
}

.team-8 {
    background-position: -330px -650px;
}

.team-9 {
    background-position: -650px -650px;
}

.team-10 {
    background-position: -970px -10px;
}

.team-11 {
    background-position: -970px -330px;
}

.team-12 {
    background-position: -970px -650px;
}

.team-13 {
    background-position: -10px -970px;
}

.team-14 {
    background-position: -330px -970px;
}

.team-15 {
    background-position: -650px -970px;
}

.team-16 {
    background-position: -970px -970px;
}

.team-17 {
    background-position: -1290px -10px;
}

.team-18 {
    background-position: -1290px -330px;
}

.team-19 {
    background-position: -1290px -650px;
}

.team-20 {
    background-position: -1290px -970px;
}

.team-21 {
    background-position: -10px -1290px;
}

.team-22 {
    background-position: -330px -1290px;
}


/** CLIENTS SPRITES **/
.client-sprite{
    background-image: url('/resources/img/company/clients-sprite.webp');
    width: 125px; height: 36px;
    opacity:0.6 !important;
    transform: scale(0.8);
}

@media only screen and (max-width: 768px) {
    .client-sprite{
        transform: scale(0.8);
        opacity:0.6 !important;
    }
}

.client-1 {
    background-position: -10px -10px;
}

.client-2 {
    background-position: -10px -66px;
}

.client-3 {
    background-position: -155px -10px;
}

.client-4 {
    background-position: -155px -66px;
}

.client-5 {
    background-position: -10px -122px;
}

.client-6 {
    background-position: -155px -122px;
}

.client-7 {
    background-position: -10px -178px;
}

.client-8 {
    background-position: -155px -178px;
}

.client-10 {
    background-position: -10px -234px;
}

.rounded-sm{
    border-radius:3px;
    /**border:1px solid rgb(240, 240, 240);**/
}

/** icons sprites **/
.sb-icon{
    min-width: 120px;
}
.sb-icon strong{
    font-size:13px;
    color:#555 !important;
}

.sb-icon-social{
    min-width: auto;
}

.sb-icon-social i{
    font-size: 19px;
    color: #999 !important;
}

.icon-sprites{
    background: url('/resources/img/products/icons.webp?v=2');
    width: 48px; height: 48px;
    margin: 0 auto;
    transform: scale(0.8);
}

.bg-about {
    background-position: -10px -10px;
}

.bg-apptimate {
    background-position: -78px -10px;
}

.bg-apptimate2 {
    background-position: -10px -78px;
}

.bg-apptimed {
    background-position: -78px -78px;
}

.bg-apptimed2 {
    background-position: -146px -10px;
}

.bg-blogs {
    background-position: -146px -78px;
}

.bg-casemate {
    background-position: -10px -146px;
}

.bg-contact {
    background-position: -78px -146px;
}

.bg-facebook {
    width: 38px; height: 38px;
    background-position: -10px -282px;
}

.bg-home {
    background-position: -146px -146px;
}

.bg-icons8_cube_96 {
    background-position: -214px -10px;
}

.bg-icons8_home_96 {
    background-position: -214px -78px;
}

.bg-icons8_info_96 {
    background-position: -214px -146px;
}

.bg-icons8_job_seeker_96 {
    background-position: -10px -214px;
}

.bg-icons8_phone_96 {
    background-position: -78px -214px;
}

.bg-icons8_schedule_96 {
    background-position: -146px -214px;
}

.bg-instagram {
    width: 38px; height: 38px;
    background-position: -68px -282px;
}

.bg-linkedin {
    width: 38px; height: 38px;
    background-position: -126px -282px;
}

.bg-placements {
    background-position: -214px -214px;
}

.bg-placements2 {
    background-position: -282px -10px;
}

.bg-products {
    background-position: -282px -78px;
}

.bg-schedule {
    background-position: -282px -146px;
}

.bg-twitter {
    width: 38px; height: 38px;
    background-position: -184px -282px;
}

.bg-vacancies {
    background-position: -282px -214px;
}


  .process-card-two .process-icon {
    background-color: #fff;
    color: #999;
  }

  .process-card-two .text-description{
    opacity: 1;
  }

  .process-card-two:hover .text-description{
    opacity: 0;
  }

  .process-card-two .btn{
    opacity: 0;
    margin-top: -70px !important;
    transition: all 0.5s;
  }

  .process-card-two:hover .btn{
    opacity: 1;
  }

  /** APPTIMATE ICONS **/
  .apptimate-module{
    position: relative;
    overflow: hidden;
    background: #fff;
    cursor: pointer;
  }

  .apptimate-module h4{
    font-weight:700;
    text-align: center;
    font-size:1.5rem;
    margin: 0;
    margin-top:-4px;
    padding-left:30px;
  }

  .apptimate-module p{
    font-weight:900;
    font-size: 0.9rem;
    text-align: center;
    margin:0;
    cursor: pointer;
    padding-left:30px;
  }

  .apptimate-module img{
    position: absolute;
    width: 70px;
    left:10px;
    top:5px;
    opacity: 0.1;
    filter: brightness(0.5);
    transition: all 1s;
  }

  .apptimate-module:hover img{
    opacity: 0.5;
    filter: brightness(1);
    transform: scale(1.4);
    left:-30px;
  }

  .apptimate-module.bg-hr:hover{
    background: #911eb4;
  }

  .apptimate-module.bg-finance:hover{
    background: #4363d8;
  }

  .apptimate-module.bg-pos:hover{
    background: #0bb6a0;
  }

  .apptimate-module.bg-inventory:hover{
    background: #bba200;
  }

  .apptimate-module.bg-crm:hover{
    background: #f58231;
  }

  .apptimate-module.bg-projects:hover{
    background: #e6194B;
  }

  .apptimate-module.bg-assets:hover{
    background: #000075;
  }

  .apptimate-module.bg-production:hover{
    background: #469990;
  }

  .apptimate-module.bg-ecommerce:hover{
    background: #9A6324;
  }

  .apptimate-module.bg-analytics:hover{
    background: #800000;
  }

  .apptimate-module.bg-other:hover{
    background: #252836;
  }

  .apptimate-module:hover *{
    color: #fff !important;
  }
  .font-hr{
    color: #911eb4 !important;
  }

  .font-finance{
    color: #4363d8 !important;
  }

  .font-pos{
    color: #0bb6a0 !important;
  }

  .font-inventory{
    color: #bba200 !important;
  }

  .font-crm{
    color: #b35511 !important;
  }

  .font-projects{
    color: #ca113f !important;
  }

  .font-assets{
    color: #202093 !important;
  }

  .font-production{
    color: #469990 !important;
  }

  .font-ecommerce{
    color: #9A6324 !important;
  }

  .font-analytics{
    color: #af0808 !important;
  }

  .font-other{
    color: #858dba !important;
  }


  .bg-filter-hr{
    filter: invert(20%) sepia(100%) saturate(2336%) hue-rotate(275deg) brightness(82%) contrast(103%);
  }

  .bg-filter-finance{
    filter: invert(32%) sepia(99%) saturate(1047%) hue-rotate(207deg) brightness(91%) contrast(86%);
  }

  .bg-filter-pos{
    filter: invert(63%) sepia(50%) saturate(5243%) hue-rotate(136deg) brightness(96%) contrast(91%);
  }

  .bg-filter-inventory{
    filter: invert(76%) sepia(32%) saturate(7401%) hue-rotate(19deg) brightness(95%) contrast(101%);
  }

  .bg-filter-crm{
    filter: invert(62%) sepia(93%) saturate(2068%) hue-rotate(339deg) brightness(99%) contrast(94%);
  }

  .bg-filter-projects{
    filter: invert(23%) sepia(91%) saturate(6296%) hue-rotate(337deg) brightness(94%) contrast(91%);
  }

  .bg-filter-assets{
    filter: invert(10%) sepia(44%) saturate(6926%) hue-rotate(238deg) brightness(88%) contrast(126%);
  }

  .bg-filter-production{
    filter: invert(52%) sepia(10%) saturate(1957%) hue-rotate(124deg) brightness(100%) contrast(85%);
  }

  .bg-filter-ecommerce{
    filter: invert(40%) sepia(52%) saturate(590%) hue-rotate(352deg) brightness(92%) contrast(95%);
  }

  .bg-filter-analytics{
    filter: invert(13%) sepia(61%) saturate(4376%) hue-rotate(351deg) brightness(93%) contrast(112%);
  }

  .bg-filter-other{
    color: #858dba !important;
  }

  .bg-other{
    background: #444758 !important;
  }

  .bg-black{
    background: #000 !important;
  }
  /** END OF APPTIMATE ICONS **/


.program-sprite{
    width:64px;
    height:64px;
    transform: scale(0.65);
    background: url('/resources/img/tech-sprites.png');
}

.bg-tensor_flow {
    background-position: -10px -10px;
}

.bg-flutter {
    background-position: -94px -10px;
}

.bg-java {
    background-position: -10px -94px;
}

.bg-mongodb {
    background-position: -94px -94px;
}

.bg-csharp {
    background-position: -178px -10px;
}

.bg-swift {
    background-position: -178px -94px;
}

.bg-kotlin {
    background-position: -10px -178px;
}

.bg-figma {
    background-position: -94px -178px;
}

.bg-vuejs {
    background-position: -178px -178px;
}

.bg-google_cloud {
    background-position: -262px -10px;
}

.bg-cassandra {
    background-position: -262px -94px;
}

.bg-mysql {
    background-position: -262px -178px;
}

.bg-redis {
    background-position: -10px -262px;
}

.bg-postgresql {
    background-position: -94px -262px;
}

.bg-azure {
    background-position: -178px -262px;
}

.bg-amazon_aws {
    background-position: -262px -262px;
}

.bg-php {
    background-position: -346px -10px;
}

.bg-react {
    background-position: -346px -94px;
}

.bg-node_js {
    background-position: -346px -178px;
}

.bg-python {
    background-position: -346px -262px;
}

.body-overlay{
    position: fixed;
    top:0;
    left:0;
    width:100%;
    height: 100%;
    background: rgba(255,255,255,0.7);
    backdrop-filter: blur(5px);
    transition: all 1s;
    display:none;
    z-index:1;
}

body:has(.mega-dropdown-menu:hover) .body-overlay{
    display: block;
}

.mega-dropdown-menu{
    width:1000px !important;
}

.bottom-msg{
    position: fixed;
    bottom:0;
    left:0;
    width:100%;
    margin:0;
    z-index:99999;
    padding:20px 10px;
    background: rgba(247,249,255,0.9);
    backdrop-filter: blur(5px);
    font-weight: bold;
    -webkit-box-shadow: 0 5px 20px 0 rgba(112, 112, 112, 0.4);
          box-shadow: 0 5px 20px 0 rgba(112, 112, 112, 0.4);
}

.display-1{
    line-height:1.1;
}

.hero-section-2 .container{
    margin-bottom: 100px;
}

.hero-img-2{
    height:700px;
    margin-top:-300px;
}

.hero-img-2-bg{
    height:400px;
}

@media only screen and (max-width: 767px) {
    .hero-section-2 .container{
        margin-bottom: 0px;
    }

    .hero-img-2{
        height:600px;
        margin-top:-180px;
    }

    .hero-img-2-bg{
        height: unset !important;
        aspect-ratio: 2 !important;
    }
}

@media only screen and (max-width: 450px) {
    .hero-img-2-bg{
        height: unset !important;
        aspect-ratio: 3 !important;
    }
}

.img-feature{
    height: 70px;
    filter: grayscale(100%) brightness(100%) contrast(0%) saturate(40%) sepia(100%) hue-rotate(152deg);
    opacity: 0.6;
}

.btn-hero {
    width: 280px;
    padding: 10px 0;
    margin-bottom: 25px !important;
}

.btn-shadow{
    box-shadow: 0 10px 25px rgb(123 104 238 / 50%);
}