/* ===================================
    Tech Tomorrow 1
====================================== */

/* font */
    @import url('https://fonts.googleapis.com/css2?family=Inter+Tight:ital,wght@0,100..900;1,100..900&display=swap');
    
/* variable */
    :root {    
        
 /* Brand Fonts */         
          --alt-font: 'Inter Tight', sans-serif;
          --primary-font: 'Inter Tight', sans-serif;
          
          
/* Web Agency Fonts */ 
          --base-color: #5cbeb1;
          --medium-gray:#484849;
          --dark-gray:#1C1D1F; 
                      
            
/* --- SOLID COLORS--- */
                 
        /* Brand Asset Solids (Dark Shades) */
          --dark-blue-brand: #262f5a;
          --dark-teal-brand: #3b9085;
          --dark-yellow-brand: #fac43e;
        
          /* Brand Asset Solids (Core Logo Colors) */
          --blue-brand: #34417d;
          --teal-brand: #5cbeb1;
          --yellow-brand: #fcd364;
          --new-blue-brand: #4761d6;
          --new-dk-blue-brand: #263c9c;
        
          /* Brand Asset Solids (Lite Shades) */
          --lite-blue-brand: #616eaa;
          --lite-teal-brand: #b8e0db;
          --lite-yellow-brand: #fbe09a;
          
          
/* --- DARK SHADE GRADIENTS --- */
          
            /* Dark Blue: #262F5A to #34417D */
            --dark-blue-grad-lr: linear-gradient(to right, #262F5A, #34417D);
            --dark-blue-grad-ll-ur: linear-gradient(to top right, #262F5A, #34417D);
          
            /* Dark Teal: #3B9085 to #5CBEB1 */
            --dark-teal-grad-lr: linear-gradient(to right, #3B9085, #5CBEB1);
            --dark-teal-grad-ll-ur: linear-gradient(to top right, #3B9085, #5CBEB1);
          
            /* Dark Yellow: #FAC43E to #FCD364 */
            --dark-yellow-grad-lr: linear-gradient(to right, #FAC43E, #FCD364);
            --dark-yellow-grad-ll-ur: linear-gradient(to top right, #FAC43E, #FCD364);
          
          
            /* --- CORE COLOR GRADIENTS --- */
            
            /* Blue: #34417D to #616EAA */
            --blue-grad-lr: linear-gradient(to right, #34417D, #616EAA);
            --blue-grad-ll-ur: linear-gradient(to top right, #34417D, #616EAA);
          
            /* Teal: #5CBEB1 to #B8E0DB */
            --teal-grad-lr: linear-gradient(to right, #5CBEB1, #B8E0DB);
            --teal-grad-ll-ur: linear-gradient(to top right, #5CBEB1, #B8E0DB);
          
            /* Yellow: #FCD364 to #FBE09A */
            --yellow-grad-lr: linear-gradient(to right, #FCD364, #FBE09A);
            --yellow-grad-ll-ur: linear-gradient(to top right, #FCD364, #FBE09A);
          
          
 /* --- LITE SHADE GRADIENTS (to White) --- */
            
            /* Lite Blue: #616EAA to #FFFFFF */
            --lite-blue-grad-lr: linear-gradient(to right, #616EAA, #FFFFFF);
            --lite-blue-grad-ll-ur: linear-gradient(to top right, #616EAA, #FFFFFF);
          
            /* Lite Teal: #B8E0DB to #FFFFFF */
            --lite-teal-grad-lr: linear-gradient(to right, #B8E0DB, #FFFFFF);
            --lite-teal-grad-ll-ur: linear-gradient(to top right, #B8E0DB, #FFFFFF);
          
            /* Lite Yellow: #FBE09A to #FFFFFF */
            --lite-yellow-grad-lr: linear-gradient(to right, #FBE09A, #FFFFFF);
            --lite-yellow-grad-ll-ur: linear-gradient(to top right, #FBE09A, #FFFFFF);
          
          
            /* --- LITE SHADE REVERSE GRADIENTS (Lite to Dark) --- */
            
            /* Lite Blue Rev: #616EAA to #262F5A */
            --lite-blue-grad-rev-lr: linear-gradient(to right, #616EAA, #262F5A);
            --lite-blue-grad-rev-ll-ur: linear-gradient(to top right, #616EAA, #262F5A);
          
            /* Lite Teal Rev: #B8E0DB to #3B9085 */
            --lite-teal-grad-rev-lr: linear-gradient(to right, #B8E0DB, #3B9085);
            --lite-teal-grad-rev-ll-ur: linear-gradient(to top right, #B8E0DB, #3B9085);
          
            /* Lite Yellow Rev: #FBE09A to #FAC43E */
            --lite-yellow-grad-rev-lr: linear-gradient(to right, #FBE09A, #FAC43E);
            --lite-yellow-grad-rev-ll-ur: linear-gradient(to top right, #FBE09A, #FAC43E);
          
    }
    



    
    h6 {
      font-size: 1.40rem;
      line-height: 1.95rem;
    }
    
    
    
    /* text shadow */
    .text-shadow-small { text-shadow: 0 0 10px rgba(0, 0, 0, 0.9);}
    .text-shadow-small2 { text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);}
    .text-shadow-small-teal { text-shadow: 0 0 10px rgba(31,100,91);}
    .text-shadow-blue-small { text-shadow: 0 0 10px rgba(13, 82, 242);}
    .text-shadow-medium { text-shadow: 0 0 35px rgba(0, 0, 0, 0.9);}
    .text-shadow-large { text-shadow: 0 0 50px rgba(0, 0, 0, 0.9);}
    .text-shadow-extra-large { text-shadow: 0 0 60px rgba(0, 0, 0, 0.9);}
    .text-shadow-double-large { text-shadow: 0 0 100px rgba(0, 0, 0, .9);}
    
    /* drop shadow */
    .drop-shadow svg { filter: drop-shadow( 0px 1px 4px rgba(0, 0, 0, .1)); }
    
    
    
    



    
    /* Text color */
    
    .text-new-blue-brand {
      color: var(--new-blue-brand);
    }
    .text-new-dk-blue-brand {
      color: var(--new-dk-blue-brand);
    }
    .text-yellow-brand {
      color: var(--yellow-brand);
    }
    
    
    
    

/* Gradient background color */


.bg-gradient-tt-bluedark1 { background-image: linear-gradient(to left bottom, #616eaa, #262f5a); }
.bg-gradient-tt-bluedark2 { background-image: linear-gradient(to left bottom, #263C9C, #4761D6); }
.bg-gradient-tt-bluedark3 { background-image: linear-gradient(to left bottom, #263C9C, #616eaa); }

.bg-gradient-tt-bluelight1 { background-image: linear-gradient(to left bottom, #ffffff, #616eaa); }


.bg-gradient-tt-teallight1 { background-image: linear-gradient(to left bottom, #B8E0DB, #ffffff); }

    .bg-gradient-fast-blue-purple {
      background-image: linear-gradient(to right top, #2a46f4, #5f42f9, #833cfc, #a233fe, #bf25ff);
    }

    .bg-gradient-blue-green {
      background-image: linear-gradient(to right top, #18cdbb, #22d2ae, #3cd69d, #57da89, #73dc73);
    }

    .bg-gradient-sky-blue-pink {
      background-image: linear-gradient(to right top, #5758df, #a553cb, #d055b5, #ea63a0, #f77991);
    }

    .bg-gradient-very-light-gray {
      background-image: linear-gradient(to bottom, #f7f8f9, #f9fafb, #fbfbfc, #fdfdfd, #ffffff);
    }
    
    .bg-gradient-top-very-light-gray {
      background-image: linear-gradient(to top, #f7f7f7, #f7f7f7, #fcfafa, #fcfafa, #ffffff);
    }

    .bg-gradient-blue-transparent {
      background: linear-gradient(to right, rgb(30, 163, 177) 10%, rgba(255, 255, 255, 0) 95%);
    }
    
    .bg-gradient-emerald-blue-emerald-green {
      background-image: linear-gradient(50deg, #09afea 0, #19e089 100%);
    }
    
    .bg-gradient-very-ghost-white {
      background-image: linear-gradient(to bottom, #f4f6ff, #f7f8ff, #fafaff, #fdfdff, #ffffff);
    }
    
    
    
    
    
    
/* Transparent background color */
    .bg-transparent {
      background-color: transparent;
    }
    .bg-gradient-fast-blue-purple-transparent {
      background-image: linear-gradient(to right top, rgb(42, 70, 244), rgba(95, 66, 249, 0.9), rgba(131, 60, 252, 0.9), rgba(162, 51, 254, 0.9), rgba(191, 37, 255, 0.9));
    }
    .bg-gradient-fast-pink-light-yellow-transparent {
      background-image: linear-gradient(to right top, rgba(247, 86, 127, 0.9), rgba(254, 113, 119, 0.9), rgba(255, 138, 116, 0.9), rgba(255, 163, 120, 0.9), rgba(255, 186, 131, 0.9));
    }
    .bg-gradient-sky-blue-pink-transparent {
      background-image: linear-gradient(to right top, rgba(87, 88, 223, 0.9), rgba(165, 83, 203, 0.9), rgba(208, 85, 181, 0.9), rgba(234, 99, 160, 0.9), rgba(247, 121, 145, 0.9));
    }
    .bg-gradient-gray-light-dark-transparent {
      background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(32, 35, 41, 0.8)), to(transparent));
      background-image: linear-gradient(to top, rgba(32, 35, 41, 0.8) 0%, transparent 100%);
    }
    .bg-gradient-dark-transparent {
      background: -webkit-gradient(linear, left bottom, left top, color-stop(7%, #141622), to(transparent));
      background: linear-gradient(to top, #141622 7%, transparent 100%);
    }
    .bg-gradient-dark-gray-left-transparent {
      background: -webkit-linear-gradient(right, rgba(24, 25, 28, 0.5), rgba(255, 255, 255, 0));
      background: linear-gradient(to right, rgba(24, 25, 28, 0.5), rgba(255, 255, 255, 0));
    }
    .bg-gradient-white-transparent {
      background: linear-gradient(to top, #ffffff 20%, rgba(255, 255, 255, 0) 80%);
    }
    .bg-gradient-white-dark-transparent {
      background: -webkit-gradient(linear, left bottom, left top, color-stop(35%, #ffffff), to(transparent));
      background: linear-gradient(to top, #ffffff 30%, rgba(255, 255, 255, 0) 70%);
    }
    .bg-gradient-white-bottom-transparent {
      background: rgb(0, 0, 0);
      background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgb(255, 255, 255) 60%);
    }
    .bg-gradient-black-bottom-transparent {
      background: rgb(255, 255, 255);
      background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
    }
    .bg-gradient-solitude-blue-transparent {
      background: -webkit-linear-gradient(bottom, rgb(240, 244, 253), rgba(255, 255, 255, 0));
      background: linear-gradient(to top, rgb(240, 244, 253), rgba(255, 255, 255, 0));
    }
    .bg-gradient-extra-midium-gray-transparent {
      background: -webkit-gradient(left top, left bottom, color-stop(50%, rgba(0, 0, 0, 0.5)), color-stop(150%, rgba(20, 20, 20, 0.3)));
      background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(20, 20, 20, 0.3) 150%);
    }
    .bg-dark-gray-transparent {
      background-color: rgba(35, 35, 35, 0.8);
    }
    .bg-dark-gray-transparent-light {
      background-color: rgba(35, 35, 35, 0.2);
    }
    .bg-dark-gray-transparent-medium {
      background-color: rgba(35, 35, 35, 0.4);
    }
    .bg-medium-gray-transparent {
      background-color: rgba(111, 111, 111, 0.1);
    }
    .bg-light-gray-transparent {
      background-color: rgb(251, 251, 251);
    }
    .bg-medium-gray-transparent {
      background-color: rgba(136, 136, 136, 0.3);
    }
    .bg-black-transparent-light {
      background-color: rgba(0, 0, 0, 0.2);
    }
    .bg-black-transparent-medium {
      background-color: rgba(0, 0, 0, 0.5);
    }
    .bg-black-transparent {
      background-color: rgba(0, 0, 0, 0.8);
    }
    .bg-white-transparent-extra-light,
    .bg-white-transparent-extra-light:focus {
      background-color: rgba(255, 255, 255, 0.1);
    }
    .bg-white-transparent-very-light {
      background-color: rgba(255, 255, 255, 0.2);
    }
    .bg-white-transparent-light {
      background-color: rgba(255, 255, 255, 0.4);
    }
    .bg-white-transparent {
      background-color: rgba(255, 255, 255, 0.7);
    }


/* body */
body {
    font-size: 17px;
    line-height: 32px;
}
.top-space-margin {
    margin-top: 120px;
}






/* header */
.navbar .navbar-nav .nav-link {
    font-weight: 500;
    font-size: 18px;
}
header .navbar-brand img {
    max-height:56px;
}
header .btn.btn-switch-text.btn-medium > span {
    padding: 11px 30px;
}
.navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu li a img {
    border-radius: 0;
}
    
    
    
    
    
/* TT26 Gradient buttons */

    [class*=btn-gradient-] {
      background-color: transparent;
      border-color: transparent;
    }
    
    [class*=btn-gradient-]:active {
      background-color: transparent;
      border-color: transparent !important;
      color: var(--white) !important;
    }
    
    [class*=btn-gradient-]:hover {
      background-position: right center;
      color: var(--white);
    }
    
    .btn-gradient-dark-teal-grad-ll-ur {
      background-image: linear-gradient(to right, #3B9085, #5CBEB1);
      background-size: 200% auto;
      color: var(--white);
    }
    
    .btn-gradient-blue-green {
      background-image: linear-gradient(to right top, #18cdbb, #22d2ae, #3cd69d, #57da89, #73dc73);
      background-size: 200% auto;
      color: var(--black);
    }






/* btn  */

.btn.btn-base-color {
  background-color: var(--base-color);
  color: var(--white);
}
.btn.btn-base-color:hover, .btn.btn-base-color:active {
  background-color: transparent;
  border-color: var(--base-color);
  color: var(--black);
}





.btn.btn-dark-gray {
  background-color: var(--dark-gray);
  color: var(--white);
}
.btn.btn-dark-gray:hover, .btn.btn-dark-gray:active {
  background-color: transparent;
  border-color: var(--dark-gray);
  color: var(--dark-gray);
}
.btn.btn-black {
  background-color: var(--black);
  color: var(--white);
}
.btn.btn-black:hover, .btn.btn-black:active {
  background-color: transparent;
  border-color: var(--black);
  color: var(--black);
}
.btn.btn-white {
  background-color: var(--white);
  color: var(--dark-gray);
}
.btn.btn-white:hover, .btn.btn-white:active {
  background-color: transparent;
  border-color: var(--white);
  color: var(--white);
}
.btn.btn-cornflower-blue {
  background-color: var(--cornflower-blue);
  color: var(--white);
}
.btn.btn-cornflower-blue:hover, .btn.btn-cornflower-blue:active {
  background-color: transparent;
  border-color: var(--cornflower-blue);
  color: var(--cornflower-blue);
}
.btn.btn-jade {
  background-color: var(--jade);
  color: var(--white);
}
.btn.btn-jade:hover, .btn.btn-jade:active {
  background-color: transparent;
  border-color: var(--jade);
  color: var(--jade);
}
.btn.btn-transparent-black {
  background-color: transparent;
  border-color: var(--black);
  color: var(--black);
}
.btn.btn-transparent-black:hover, .btn.btn-transparent-black:active {
  background-color: var(--black);
  border-color: var(--black);
  color: var(--white);
}
.btn.btn-transparent-white {
  background-color: transparent;
  border-color: var(--white);
  color: var(--white);
}
.btn.btn-transparent-white:hover, .btn.btn-transparent-white:active {
  background-color: var(--white);
  border-color: var(--white);
  color: var(--dark-gray);
}
.btn.btn-transparent-white-light {
  background-color: transparent;
  border-color: rgba(255, 255, 255, 0.3);
  color: var(--white);
}
.btn.btn-transparent-white-light:hover, .btn.btn-transparent-white-light:active {
  background-color: var(--white);
  border-color: rgba(255, 255, 255, 0.3);
  color: var(--dark-gray);
}
.btn.btn-transparent-base-color {
  background-color: transparent;
  border-color: var(--base-color);
  color: var(--base-color);
}
.btn.btn-transparent-base-color:hover, .btn.btn-transparent-base-color:active {
  background-color: var(--base-color);
  border-color: var(--base-color);
  color: var(--white);
}
.btn.btn-transparent-dark-gray {
  background-color: transparent;
  border-color: var(--dark-gray);
  color: var(--dark-gray);
}
.btn.btn-transparent-dark-gray:hover, .btn.btn-transparent-dark-gray:active {
  background-color: var(--dark-gray);
  border-color: var(--dark-gray);
  color: var(--white);
}
.btn.btn-transparent-light-gray {
  background-color: transparent;
  border-color: var(--extra-medium-gray);
  color: var(--dark-gray);
}
.btn.btn-transparent-light-gray:hover, .btn.btn-transparent-light-gray:active {
  background-color: var(--dark-gray);
  border-color: var(--dark-gray);
  color: var(--white);
}






/* letter spacing */
.bg-base-color-transparent {
    background-color: rgba(204, 255, 0,0.9);
}
/* banner title */
.banner-title {
    font-size: 650px;
    word-break: normal;
    letter-spacing: -40px;
}
/* letter spacing */
.ls-minus-20px {
    letter-spacing: -20px;
}
.ls-minus-13px {
    letter-spacing: -13px;
}
.mt-minus-12 {
    margin-top: -12%;
}
/* word break normal */
.word-break-normal {
    word-break: normal;
}
/* bg color */
.bg-sherpa-blue {
    background-color: #333436;
}
/* page title */
.page-title-extra-large h1 {
    font-size: 5rem;
    line-height: 5rem;
}
/* team style */
.team-style-05 img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
}
.team-style-05:hover img {
    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
}
.team-style-08 figure img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
}
.team-style-08:hover figure img {
    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
}
.team-style-08 figure figcaption .social-icon a {
    background-color: var(--base-color);
}
.team-style-08 figure figcaption .social-icon a:hover {
    color: var(--dark-gray);
}
/* blog comment */
.blog-classic .card .blog-image img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
}
.blog-comment li .btn-reply:hover {
    color: var(--text-dark-gray);
}
/* tag */
.tag-cloud a {
    background-color: var(--white);
}
/* portfolio-image */
.portfolio-simple .grid-item .portfolio-image img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
}
.portfolio-simple .portfolio-box:hover .portfolio-image img {
    opacity: 1;
    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
}
/* popular post sidebar */
.popular-post-sidebar li figure {
    width: 190px;
    height: auto;
}
.popular-post-sidebar li .media-body {
    padding-left: 40px;
}
/* social icon style 06 */
.social-icon-style-06 li {
    position: relative;
}
.social-icon-style-06 li:before {
    width: 6px;
    height: 6px;
    border-radius: 100%;
    background-color: var(--medium-gray);
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
    opacity: .5;
}
.social-icon-style-06 li:last-child:before {
    display: none;
}
/* footer */
footer .footer-logo img {
    max-height: 120px;
}
footer .nav-link {
    color:  var(--dark-gray);
}
.footer-navbar li a:hover {
    color: var(--dark-gray);
}
/* media query responsive */
@media (min-width: 992px) {
    .navbar .navbar-nav .dropdown.dropdown-with-icon .dropdown-menu {
        padding: 15px 25px;
    }
}
@media (min-width: 768px) {
    /* heading tag */
    h1 {
        font-size: 5rem;
        line-height: 5rem;
    }
    h2 {
        font-size: 3.75rem;
        line-height: 3.75rem;
    }
    h3 {
        font-size: 3.125rem;
        line-height: 3.125rem;
    }
}
@media (max-width: 1399px) {
    .banner-title {
        font-size: 500px;
    }
    header .btn.btn-switch-text.btn-medium > span {
        padding: 11px 22px;
    }
}
@media (max-width: 1199px) {
    .banner-title {
        font-size: 380px;
        letter-spacing: -25px;
    }
    .ls-minus-20px {
        letter-spacing: -15px;
    }
    header .btn.btn-switch-text.btn-medium > span {
        padding: 6px 11px;
    }
    .navbar .navbar-nav .nav-link {
        padding: 10px 12px;
    }
    footer .nav-link {
        padding: 2px 8px;
    }
}
@media (max-width: 991px) {
    .banner-title {
        font-size: 270px;
        letter-spacing: -15px;
    }
    .ls-minus-20px {
        letter-spacing: -10px;
    }
    .top-space-margin {
        margin-top: 100px;
    }
    header .btn.btn-switch-text.btn-medium > span {
        padding: 9px 24px;
    }
    .navbar-collapse-show[data-mobile-nav-style=full-screen-menu] .navbar-full-screen-menu-inner {
        background-image: url(../../images/vertical-line-bg-small.svg) !important;
    }
    [data-mobile-nav-style=full-screen-menu] .navbar-full-screen-menu-inner .navbar-nav {
        text-align: center;
    }
    [data-mobile-nav-style=full-screen-menu] .navbar-full-screen-menu-inner .navbar-nav > .nav-item {
        border-bottom: 0;
        padding: 0;
    }
    [data-mobile-nav-style=full-screen-menu] .navbar-full-screen-menu-inner .navbar-nav .nav-item .nav-link {
        font-size: 42px;
        line-height: 46px;
    }
}
@media (max-width: 767px) {
    .banner-title {
        font-size: 200px;
        letter-spacing: -15px;
    }
    .process-step-style-10.hover-box:hover .hover-content {
        bottom: 0;
    }
    .ls-minus-20px {
        letter-spacing: -4px;
    }
    .ls-minus-13px {
        letter-spacing: -5px;
    }
}
@media (max-width: 575px) {
    .banner-title {
        font-size: 110px;
        letter-spacing: -3px;
    }
    .popular-post-sidebar li figure {
        width: 100%;
    }
    .popular-post-sidebar li .media-body {
        padding-left: 0;
        padding-top: 25px;
    }
}