:root{
    --primary-600 : #007DA8;
    --primary-50 : #EFFBFF;
    --primary-700 : #035876;
    --primary-500 : #00A7E1;
    --primary-100 : #D3EDF5;
    --primary-300 : #F3BF71;
    --primary-400 : #EFA941;
    --gray-blue-200 : #D5D9EB;
    --moss-200 : #CEEAB0;
    --gray-25  : #FCFCFD;
    --gray-100 : #F2F4F7;
    --gray-200 : #EAECF0;
    --gray-300 : #D0D5DD;
    --gray-400 : #98A2B3;
    --gray-500 : #667085;
    --gray-600 : #475467;
    --gray-700 : #344054;
    --gray-800 : #1D2939;
    --gray-900 : #101828;
    --gray-50 : #F9FAFB;
    --light : #F8F8F8;
    --blue-light-600 : #0086C9;
    --blue-50 : #EFF8FF;
    --blue-500 : #1D9CE8;
    --blue-700 : #175CD3;
    --blue-900 : #003A5D;
    --gray-cool-300: #B9C0D4;
    --gray-cool-400 : #7D89B0;

    --bs-border-radius: 8px;

    --bs-border-color: #D0D5DD;

    --bs-border-radius-xxl: 48px;

}
body{
    font-family: "Inter", sans-serif;
}


[x-cloak] { display: none !important; }


.navbar-nav{
    --bs-nav-link-padding-x: 0;
    --bs-nav-link-padding-y: 0;
    --bs-navbar-nav-link-padding-x: 1rem;
    --bs-nav-link-font-weight : 500;
    --bs-navbar-color: #667085;
    --bs-navbar-hover-color:#101828
}
@media(max-width:1200px){
    .navbar-collapse{
        position: absolute;
        width: 100%;
        top: 100%;
        left: 0px;
        border: 1px solid var(--gray-300);
        border-radius: 0px;
        background-color: white;
        z-index: 100;
    }
}

@media(max-width:768px){
    .navbar-brand img{
        width: 150px;
    }
}
@media(max-width:576px){
    .navbar-brand img{
        width: 60px;
    }
}

/* ============ desktop view ============ */
@media all and (min-width: 1200px) {

    .navbar .has-megamenu{position:static!important;}
    .navbar .megamenu{
      padding: 32px ;
      top: 101%;
      left:0; 
      right:0; 
      width:100%; 
      margin-top:0;
      border: 0;
      border: 0px;
      box-shadow: 0px 4px 6px -2px rgba(16, 24, 40, 0.03), 0px 12px 16px -4px rgba(16, 24, 40, 0.08);  
  }
  
  }	
  /* ============ desktop view .end// ============ */
  
  /* ============ mobile view ============ */
  @media(max-width: 1200px){
    .navbar .megamenu{
        padding: 16px;
    }
    .navbar .navbar-collapse, .navbar.fixed-top .navbar-collapse, .navbar.sticky-top .navbar-collapse{
        overflow-y: auto;
        max-height: 80vh;
    }
    .navbar .nav-link{
        padding: 12px 0px;
    }
  }
  /* ============ mobile view .end// ============ */


.w-20{
    width: 20px;
}
.h-20{
    height: 20px;
}
.w-24{
    width: 24px;
}
.h-24{
    height: 24px;
}
.w-32{
  width: 32px;      
}
.h-32{
    height: 32px;
}
.w-40{
    width: 40px;
}
.h-40{
    height: 40px;
}
.dropdown-menu{
    --bs-dropdown-link-color: #667085;
    --bs-dropdown-link-hover-color: #101828;
    --bs-dropdown-link-hover-bg: #D3EDF5;
}

/* Buttons */
.btn{
    --bs-btn-padding-x: 28px;
    --bs-btn-padding-y: 16px;
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 500;
    --bs-btn-border-radius: 200px;
}
.btn-primary{
    --bs-btn-bg: hsl(195, 100%, 33%);
    --bs-btn-border-color: hsl(195, 100%, 33%);

    --bs-btn-hover-bg: hsl(195, 100%, 38%);
    --bs-btn-hover-border-color: hsl(195, 100%, 38%);

    --bs-btn-active-bg: hsl(195, 100%, 33%);
    --bs-btn-active-border-color: hsl(195, 100%, 33%);
}

.btn-outline-primary{
    background-color: white;
    --bs-btn-color: var(--primary-700);
    --bs-btn-border-color: var(--primary-500);

    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--primary-600);
    --bs-btn-hover-border-color: var(--primary-600);

    --bs-btn-active-bg: var(--primary-500);
    --bs-btn-active-border-color: var(--primary-500);
}
.btn-link{
    --bs-btn-hover-color: var(--primary-700);
    --bs-btn-active-color: var(--primary-600);
}
.btn-light{
    --bs-btn-color: var(--gray-700);
    --bs-btn-bg: white;
    --bs-btn-border-color: var(--gray-300);

    --bs-btn-hover-color: var(--gray-700);
    --bs-btn-hover-bg: #f8f9fa;
    --bs-btn-hover-border-color: var(--gray-300);

    --bs-btn-active-color: var(--gray-700);
    --bs-btn-active-bg: white;
    --bs-btn-active-border-color: var(--gray-300);
}

/* Fonts */
.fs-12{
    font-size: 12px;
}
.fs-14{
    font-size: 14px;
}
.fs-18{
    font-size: 18px;
}
.fs-30{
    font-size: 30px;
}
.fs-36{
    font-size: 36px;
}

.fw-bolder{
    font-weight: 800 !important;
}

/* Gaps */
.gap-12{
    gap: 12px;
}
.gap-18{
    gap: 18px;
}
.gap-20{
    gap: 20px;
}
.gap-32{
    gap: 32px;
}
.g-32, .gy-32 {
    --bs-gutter-y: 32px;
}
.g-64, .gy-64{
    --bs-gutter-y: 64px;
}

.g-32, .gx-32 {
    --bs-gutter-x: 32px;
}
.g-12, .gx-12 {
    --bs-gutter-x: 12px;
}
.g-12, .gy-12 {
    --bs-gutter-y: 12px;
}

@media (min-width: 1400px) {
    .g-xxl-64, .gy-xxl-64 {
        --bs-gutter-y: 64px;
    }
    .g-xxl-64, .gx-xxl-64 {
        --bs-gutter-x: 64px;
    }

    .g-xxl-80, .gy-xxl-80 {
        --bs-gutter-y: 80px;
    }
    .g-xxl-80, .gx-xxl-80 {
        --bs-gutter-x: 80px;
    }
}

@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1304px;
    }
}

@media (min-width: 1200px){
    .g-xl-64, .gx-xl-64 {
        --bs-gutter-x: 64px;
    }
}
@media(min-width:992px){
    .gap-lg-12{
        gap: 12px !important;
    }
}

@media (min-width: 768px){
    .g-md-32, .gy-md-32 {
        --bs-gutter-y: 32px;
    }
}
@media (min-width: 768px){
    .g-md-32, .gx-md-32 {
        --bs-gutter-x: 32px;
    }
}


/* Spacing */

.p-10{
    padding: 10px;
}
.px-10{
    padding-left: 10px;
    padding-right: 10px;
}
.py-10{
    padding-top: 10px;
    padding-bottom: 10px;
}
.px-12{
    padding-left: 12px;
    padding-right: 12px;
}
.p-12{
    padding: 12px;
}
.py-12{
    padding-top: 12px;
    padding-bottom: 12px;
}
.px-18{
    padding-left: 18px;
    padding-right: 18px;
}
.py-18{
    padding-top: 18px;
    padding-bottom: 18px;
}
.py-20{
    padding-top: 20px;
    padding-bottom: 20px;
}
.px-32{
    padding-left: 32px;
    padding-right: 32px;
}
.pb-32{
    padding-bottom: 32px;
}
.pt-32{
    padding-top: 32px;
}
.py-32{
    padding-top: 32px;
    padding-bottom: 32px;
}
.p-32{
    padding: 32px;
}
.py-40{
    padding-top: 40px;
    padding-bottom: 40px;
}
.py-64{
    padding-top: 64px;
    padding-bottom: 64px;
}
.px-64{
    padding-left: 64px;
    padding-right: 64px;
}
.pb-64{
    padding-bottom: 64px;
}
.pt-80{
    padding-top: 80px;
}
.py-80{
    padding-top: 80px;
    padding-bottom: 80px;
}
.py-96{
    padding-top: 96px;
    padding-bottom: 96px;
}
.pt-96{
    padding-top: 96px;
}
.pb-96{
    padding-bottom: 96px;
}

.mb-12{
    margin-bottom: 12px;
}
.mb-20{
    margin-bottom: 24px;
}
.mb-32{
    margin-bottom: 32px;
}
.mb-40{
    margin-bottom: 40px;
}
.mb-64{
    margin-bottom: 64px;
}
.mb-80{
    margin-bottom: 80px;
}
.mb-96{
    margin-bottom: 96px;
}

/* Text Colors */
.text-primary-400{
    color: var(--primary-400);
}

.text-primary-500{
    color: var(--primary-500);
}
.text-primary-600{
    color: var(--primary-600);
}
.text-primary-700{
    color: var(--primary-700);
}
.text-blue-500{
    color: var(--blue-500);
}
.text-blue-700{
    color: var(--blue-700);
}
.text-gray-25{
    color: var(--gray-25);
}
.text-gray-200{
    color: var(--gray-200);
}
.text-gray-400{
    color: var(--gray-400);
}
.text-gray-500{
    color: var(--gray-500);
}
.text-gray-600{
    color: var(--gray-600);
}
.text-gray-700{
    color: var(--gray-700);
}
.text-gray-900{
    color: var(--gray-900);
}


/* Background Colors */
.bg-primary-50{
    background-color: var(--primary-50);
}
.bg-primary-100,.hover-bg-primary-100:hover{
    background-color: var(--primary-100);
}
.bg-primary-500{
    background-color: var(--primary-500); 
}
.bg-primary-600{
    background-color: var(--primary-600);
}
.bg-gray-100{
    background-color: var(--gray-100);
}
.bg-gray-50{
    background-color: var(--gray-50);
}
.bg-gray-800{
    background-color: var(--gray-800);
}
.bg-gray-900{
    background-color: var(--gray-900);
}
.bg-blue-500{
    background-color: var(--blue-500);
}
.bg-blue-900{
    background-color: var(--blue-900);
}
.bg-light{
    background-color: var(--light) !important;
}
/* borders */
.border-blue-light-600{
    border-color: var(--blue-light-600);
}
.border-gray-25{
    border-color: var(--gray-25) !important;
}
.border-gray-100{
    border-color: var(--gray-100) !important;
}
.border-gray-200{
    border-color: var(--gray-200) !important;
}

.border-gray-300{
    border-color: var(--gray-300) !important;
}
.border-gray-400{
    border-color: var(--gray-400) !important;
}
.border-primary-500{
    border-color: var(--primary-500) !important;
}
.border-gray-600{
    border-color: var(--gray-600) !important;
}
.borde-primary-500{
    border-color: var(--primary-500) !important;
}
.border-primary-600{
    border-color: var(--primary-600) !important;
}

.border-dashed{
    border-style: dashed !important;
}
.border-s-dashed{
    border-left-style: dashed !important;
}
.border-e-dashed{
    border-right-style: dashed !important;
}
.border-t-dashed{
    border-top-style: dashed !important;
}
.border-b-dashed{
    border-bottom-style: dashed !important;
}

/* Forms */
.form-control{
    padding: 10px 14px;
}
.form-select{
    padding-top: 10px;
    padding-left: 14px;
    padding-bottom: 10px;
}
.form-control:focus,.form-select:focus{
    box-shadow: none;
    border-color: var(--primary-600);
}

.form-check input + span{
    display: inline-block;
    width: 44px;
    height: 24px;
    border-radius: 12px;
    padding: 2px;
    background-color: #81CDE8;
    position: relative;
    cursor: pointer;
}
.form-check input:checked + span
{
    background-color: #81CDE8;
}
.form-check input + span::after{
    content: "";
    display: block;
    background-color: #F9F9F9;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    filter: drop-shadow(0px 1px 2px rgba(8, 11, 13, 0.06)) drop-shadow(0px 1px 3px rgba(8, 11, 13, 0.10));
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0px;
    transition: all ease-in-out 300ms;
}
.form-check input:checked + span::after{
    left: calc(100% - 22px) ;
}

.form-check-input:checked {
    background-color: #EFFBFF;
    border-color: #007DA8;
}
.form-check-input:checked[type=checkbox] {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23007DA8' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

.radio-control-wrappper{
    cursor: pointer;
}
.radio-control-wrappper input[type="radio"] + .radio-control .radio{
    width: 16px;
    height: 16px;
    border: 1px solid #D0D5DD;
}
.radio-control-wrappper input[type="radio"]:checked + .radio-control .radio{
    background-color: #007DA8;
    border: 5px solid #EFFBFF;
    box-shadow: 0px 0px 0px 1px #007DA8;
}
.shadow-md{
    box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03) !important;
}
.shadow{
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.20) !important;
}
.shadow-sm{
    box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.06), 0px 1px 3px 0px rgba(16, 24, 40, 0.10) !important;
}
.shadow-xl{
    box-shadow: 0px 8px 8px -4px rgba(16, 24, 40, 0.03), 0px 20px 24px -4px rgba(16, 24, 40, 0.08);
}
.shadow-3xl{
    box-shadow: 0px 32px 64px -12px rgba(16, 24, 40, 0.14);
}

.pagination{
    --bs-pagination-border-width: 0px;
    --bs-pagination-color: #667085;
    --bs-pagination-hover-color:#1D2939;
    --bs-pagination-active-bg:transparent;
    --bs-pagination-hover-bg: var(--blue-50);
    --bs-pagination-active-color:#1D2939;
    --bs-pagination-padding-x: 16px;
    --bs-pagination-padding-y: 10px;

    --bs-pagination-focus-bg: var(--blue-50);

    --bs-pagination-focus-box-shadow: none;
}
.table th{
    background-color: #F9FAFB;
    color: #667085;
}
.table td{
    vertical-align: middle;
}

/* footer */
.footer-nav .nav-link{
    color: #EAECF0;
    font-weight: 500;
}
.footer-nav .nav-link:hover{
    opacity: .8;
}
.link-hover:hover{
    opacity: .8;
}
.slider-pagination span{
    display: block;
}

.swiper-pagination-bullet{
    --swiper-pagination-bullet-size : 8px;
    --swiper-theme-color : white;
    --swiper-pagination-bullet-inactive-color : #D3EDF5;
    --swiper-pagination-bullet-inactive-opacity : 1
}
.swiper-btn {
    width: 56px;
    height: 56px;
}


.support-card-aside{
    margin-top: -20px;
}
.banner-grid .grid-item{
    width: 20%;
}
.banner-grid .grid-item:not(:last-child){
    border-right: 1px dashed #EAECF0;
}
.cloud1{
    bottom: -57%;
    left: -46%;
    width: 600px;
}
.cloud2{
    bottom: -57%;
    right: -30%;
    width: 600px;
}
.cloud3{
    bottom: -26%;
    left: -31%;
    width: 600px;
}
.cloud4{
    top: -31%;
    right: -11%;
    width: 600px;
}


.testimonial-wrapper{
    padding:24px;
}
@media(min-width:992px){
    .testimonial-wrapper{
        padding: 64px;
    }
    .testimonial-slider h4{
        font-size: 30px;
    }
    
}
.ring-icon{
    box-shadow: 0px 0px 0px 4px var(--primary-50);
}

.compare-list li{
    padding: 20px 24px;
    height: 64px;
}
.compare-list li:nth-child(odd){
    background-color: #F9FAFB;
}
.compare-col-head{
    height: 152px;
}
.product-thumb-slider .swiper-slide img{
    border: 1px solid #D0D5DD;
}
.product-thumb-slider .swiper-slide-thumb-active img{
        border: 4px solid #00A7E1;
        /* box-shadow: 0px 0px 0px 3px #00A7E1; */
}

.blog-sidebar-links li a{
    color: #667085;
}
.blog-sidebar-links li.active a, .blog-sidebar-links li a:hover {
    background-color: #EFFBFF;
    color: #1D9CE8;
}
.tweetwall .tweet{
    width: 332px;
    flex-shrink: 0;
}

.hover-link-primary-50:hover{
    background-color: var(--primary-50);
}


/* Cards Overlay */
.program-card .content-overlay,.product-card .content-overlay{
    top: calc(100% - 128px);
    transition: all ease-in-out 300ms;
}
.program-card{
    min-height: 480px;
}
.product-card .thumb{
    margin-bottom: 128px;
}
.program-card h5, .product-card h5{
    overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2; /* number of lines to show */
   line-height: 19px;        /* fallback */
   max-height: 48px;       /* fallback */
   height: 40px;
   flex-shrink: 0;
}
@media only screen and (max-width: 1200px) and (min-width: 768px){
    .program-card p, .product-card p{
        font-size: 14px !important;
    }
}
.program-card:hover .content-overlay, .product-card:hover .content-overlay{
    top: 0;
}


.avatar-group a{
    margin-left: -15px;
   }

.floating-drone {
    width: 29%;
    left: 17%;
    margin-top: -12px;
}

@media (min-width: 992px) {
    .aside-img {
        min-width: 50vw;
    }
}

.box-44{
    width: 44px;
    height: 44px;
}

.competition-categories-slider .program-card .content-overlay{
    top: calc(100% - 120px);
}

.competition-categories-slider .program-card:hover .content-overlay{
    top: 0;
}
.rule-list-expend{
    background: linear-gradient(180deg, rgba(249, 250, 251, 0.00) 0%, #F9FAFB 100%);
}

.rule-list:not(.expend){
    height: 460px;
    overflow: hidden;
} 
.pl-32{
    padding-left: 32px;
}

@media (min-width: 992px) {
    .aside-img {
        min-width: 50vw;
    }
}