/*======================
workflow: Zebra
Theme version : 1.0.0
========================*/

/*======================
Global style start here
========================*/
@font-face {
    font-family: 'ProximaNova';
    src: url('../fonts/ProximaNova-Regular.eot');
    src: url('../fonts/ProximaNova-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/ProximaNova-Regular.woff2') format('woff2'),
        url('../fonts/ProximaNova-Regular.woff') format('woff'),
        url('../fonts/ProximaNova-Regular.ttf') format('truetype'),
        url('../fonts/ProximaNova-Regular.svg#ProximaNova-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'ProximaNova';
    src: url('../fonts/ProximaNova-Bold.eot');
    src: url('../fonts/ProximaNova-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/ProximaNova-Bold.woff2') format('woff2'),
        url('../fonts/ProximaNova-Bold.woff') format('woff'),
        url('../fonts/ProximaNova-Bold.ttf') format('truetype'),
        url('../fonts/ProximaNova-Bold.svg#ProximaNova-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'ProximaNova';
    src: url('../fonts/ProximaNova-Semibold.eot');
    src: url('../fonts/ProximaNova-Semibold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/ProximaNova-Semibold.woff2') format('woff2'),
        url('../fonts/ProximaNova-Semibold.woff') format('woff'),
        url('../fonts/ProximaNova-Semibold.ttf') format('truetype'),
        url('../fonts/ProximaNova-Semibold.svg#ProximaNova-Semibold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

:root{ 
	--white: #FFFFFF;
    --black: #000000;
    --link: #0073e6;    
    --blue: #1e22aa;
    --text: #333333;
    --lightmeta: #666666;
    --borderlight:#e5e8e8;
    --sky: #00a7ff;
    --sborder:#a6adb2;
    --grey : #e5e5e5;
    --proxima: 'ProximaNova';
    --secbg:#f2f2f2; /* Rebranding */
    --angle: 3deg;
    --reverse-angle: -3deg;
    --magic-number: .02620;
    --width: calc(100vw - 80px);
    --translation: calc(var(--skew-padding)*0);
    --magic-number: .02620;
    --skew-padding: calc(var(--width)*var(--magic-number));
}


html , body {
    font-family: var(--proxima) !important;
    font-weight: 400;
    font-size: 16px;
    color: var(--text , #333333);
}
a {
    color: var(--link , #0073e6);
}
/*======================
Global style end here
========================*/
.topbar  {
    padding: 0 25px;
    background: var(--white , #FFFFFF);
}
.topbar .uk-navbar-nav>li {
    line-height: 24px;
    display: flex;
    align-items: center;
    height: 24px;
}

.topbar .uk-navbar-nav>li>a {
    min-height: unset;
    font-size: 12px;
    font-weight: 400;
    line-height: 1;
    color: var(--black , #000000);
    border-right: 1px solid var(--black , #000000);
    padding-left: 5px;
    padding-right: 5px;
    text-transform: unset;
    font-family:var(--proxima);
    display: flex;
    align-items: center;
    letter-spacing: 0.2px;
}
.topbar .uk-navbar-nav li:last-child a {
    border-right: none;
}
.topbar .uk-navbar-nav li .uk-icon {
    width: 15px;
    height: 15px;
    margin-right: 5px;
}
.border-top-bottom {
    background: var(--white , #FFFFFF) !important;
    border-top:1px solid var(--borderlight, #e5e8e8);
    border-bottom:1px solid var(--borderlight, #e5e8e8);
}
.border-top-bottom .uk-navbar-nav>li>a  , .border-top-bottom .uk-navbar-item{
    min-height: 67px;
}
.border-top-bottom .uk-navbar-nav>li>a{
    color: #000;
    font-size: 14px;
    font-weight: 400;
    text-align: left;
    letter-spacing: .01em;
    text-transform: unset;
    position: relative;
    border-bottom: 3px solid transparent;
    font-family: var(--proxima) ;
}
.border-top-bottom .uk-navbar-nav>li.uk-active>a  , .border-top-bottom .uk-navbar-nav>li>a:hover {
    border-color: var(--sky ,#00a7ff);
}
.uk-navbar-dropdown-width-full {
    width: 100vw !important;
    left:0 !important;
}

.border-top-bottom .uk-search-default .uk-search-input{
    width: 100%;
    border: 1px solid var(--sborder , #a6adb2);
    padding: 10px 30px 10px 10px;
    box-sizing: border-box;
    background: transparent;
    height: 34px;
    background-color: var(--grey , #e5e5e5);
    
}
.border-top-bottom .uk-search-default {
    width: 400px;
    margin-right: 50px;
}
.border-top-bottom .uk-navbar-right .uk-search-icon , #search .uk-search-icon{
    background: var(--blue , #1e22aa);
    color: var(--white , #FFFFFF);
}


.cta-btn {
    width: 210px;
    height: 38px;
    min-height: unset;
    background: var(--blue , #1e22aa);
    color: var(--white , #FFFFFF);
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 50px;
}

.featured  .section-title h3 {
    font-size: 36px;
    font-weight: 600;
}
.f-content h4 {
    font-weight: 600;

}
.featured {
    background: var(--secbg , #f3f8fe);
}

.slider-bottom-spare {
  background: var(--secbg , #f3f8fe);
}

.circle-btn {
    background: var(--white , #FFFFFF);
    border-radius: 50%;
    height: 60px;
    width: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;    
    box-shadow: 0 0 0.625rem 0 rgb(0 0 0 / 15%);
    -webkit-box-shadow: 0 0 0.625rem 0 rgb(0 0 0 / 15%);
    -moz-box-shadow: 0 0 0.625rem 0 rgb(0 0 0 / 15%);
    margin: 0 !important;
}
.circle-btn  svg polyline {
    stroke:var(--blue , #1e22aa) !important;  
    stroke-width:3px;
}
.circle-btn.uk-position-center-left {
    left: -30px;
}
.circle-btn.uk-position-center-right {
    right: -30px;
}
.slider-bottom-spare .uk-card-title {
    margin-bottom: 0;
}

.uk-dotnav>*>*{
    background: rgba(30,34,170,.4);
    height: 2px;
    border-radius: 0;
    width: 60px;
}
.uk-dotnav>.uk-active>* {
    background: #fff;
}

.uk-slider-nav.uk-dotnav {
    margin-top: 30px !important
}
.slider-bottom-spare {
    position: relative;
    z-index: 0;
}
.slider-bottom-spare:after{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    content: "";
    background: #1f69ff; /* rebranding */
    height: 50%;
    z-index: -1
}

.line-btn {
    display: inline-flex;
    padding: 0;
    align-items: center;
    justify-content: center;
    height:45px;
    width: 210px;
    position: relative;
    border:2px solid var(--blue , #1e22aa) !important;
    color: var(--blue , #1e22aa) !important;
}
.line-btn span.uk-icon {
    position: absolute;
    height: 100%;
    width: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 0;
    top: -1px;
}
.line-btn span.uk-icon svg{
    width: 14px;
    height: 14px;
}
.slider-bottom-spare hr {
    border-color: var(--borderlight , #e5e8e8);
}

/*tools section style start here*/

.tools-section {
 background: var(--sky , #00a7ff);  
 padding-left:30px !important;  
 padding-right:30px !important; 
 padding-bottom: 150px !important
}

.tools-section .section-title h3 {
    color: var(--white, #FFFFFF);
    font-size: 36px;
    font-weight: 600;
}

.tool-item{
    margin: 0 .15625rem .3125rem;
    width: calc(50% - 5px);
    position: relative;
    background: #fff;
    transform: translateY(var(--translation)) skewY(var(--angle));
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    padding: 0;
}
.tool-item:nth-child(odd) {
    --translation: calc(var(--skew-padding)*0);
}
.tool-content{
    position: relative;
    width: 100%;
    height: 100%;
}
.tool-image{
    -webkit-clip-path: polygon(0 0,100% 0,100% 85%,0 100%);
    clip-path: polygon(0 0,100% 0,100% 85%,0 100%);
}
.tool-title {
    font-size: 24px;
    justify-content: space-between;
    line-height: 1.5em;
    color: var(--sky , #00a7ff);
    display: flex;
    align-items: center;
    padding: 0 35px;
    margin: 35px 0;
    transform: skewY(var(--reverse-angle));
    font-weight: 600;
}
.tool-overlay-content h3 {
    font-size: 32px;
    line-height: 1.5em;
    font-weight: 600;
    color: var(--sky , #00a7ff);
}
.tool-overlay {
    display: none;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    transition: transform .6s ease-in-out,opacity .3s ease-in-out;
    background: #fff;
    transform: translateY(79%);
    opacity: 0;
}
 .tool-cta{
    --translation: calc(var(--skew-padding)*0.25);
    padding: 2.5rem 1.875rem 1.875rem;
    margin-top: auto;
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.0625rem;
    letter-spacing: .5px;
    text-align: right;
    text-transform: uppercase;
    transform: translateY(var(--translation)) skewY(var(--reverse-angle));
    -webkit-clip-path: polygon(0 70%,100% 0,100% 100%,0 100%);
    clip-path: polygon(0 70%,100% 0,100% 100%,0 100%);
    z-index: 1;
    background: #0ff;
    background: linear-gradient(120deg,#0ff,#00c9ff 50%,#09f);
}
.tool-highlight {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    left: 0;
    content: "";
    z-index: 1;
}
.tool-overlay-content{
    padding: 20px 30px 0;
    margin-top: auto;
    transform: skewY(var(--reverse-angle));
    transition: opacity .2s ease-in-out;
    opacity: 0;
}
.tool-cta span {
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.tool-item a.tool-highlight:hover~.tool-overlay{
    transform: translateY(0);
    opacity: 1;
} 
.tool-item a.tool-highlight:hover~.tool-overlay .tool-overlay-content {
  opacity: 1;  
}
.tools-section {
    position: relative;
    z-index: 0;
}
.tools-section > div {
    position: relative;
    z-index: 1;
}
.tools-section:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #007aba;
    background: linear-gradient(160deg,#00a7ff 50%,#007aba);
    -webkit-clip-path: polygon(0 96%,100% 25%,100% 100%,0 100%);
    clip-path: polygon(0 96%,100% 25%,100% 100%,0 100%);
}
.tools-section:before {
     content: ""; 
    width: 100%;
    height: 100%;
     position: absolute; 
    top: 0;
    left: 0;
    background: #007aba;
    background: linear-gradient(
60deg
,#00a7ff 5%,#007aba 30%);
    -webkit-clip-path: polygon(0 5%,0 100%,45% 100%);
    clip-path: polygon(0 5%,0 100%,45% 100%);
    opacity: .3;
    z-index: 1;
}
.nws_image {
    margin: 0 0 1.25rem;
    -webkit-clip-path: polygon(0 0,100% 0,100% 100%,0 90%);
    clip-path: polygon(0 0,100% 0,100% 100%,0 90%);
} 
.nws_image  img {
    width: 100%;
}

.whats-new {
    background: var(--secbg , #f3f8fe);
}
.whats-new .section-title h3{
    font-size: 36px;
    font-weight: 600;
}
.nws-box {
    position: relative;
    background: #fff;
    display: flex;
    flex-direction: column;
    border-radius: 15px; /* Adds rounded corners */
    overflow: hidden;    /* Ensures content respects the rounded corners */
}
.nws-box-small {
    position: relative;
    background: #fff;
    display: flex;
    flex-direction: column;
    height: 335px;
    border-radius: 15px; /* Adds rounded corners */
    overflow: hidden;    /* Ensures content respects the rounded corners */
}
.nws_content {
    padding: 0 60px;
    margin-bottom: 40px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    width: 100%;
}

/* rebranding - Google custom search field */
.gsc-control-cse {
    border-radius: 15px; /* Rounds the corners of the search input field */
    overflow: hidden; /* Ensures content respects the rounded corners */
    padding: 8px; /* Optional: Adjust padding for a cleaner look */
}

.light-meta {
    line-height: 1em;
    color: var(--lightmeta , #666666);  
    font-size: 14px;  
}
.light-meta span {
    font-weight: 700;
    letter-spacing: 1.5px;
}
.light-meta span:after {
    content: "|";
    display: inline-block;
    padding: 0 10px;
    color: var(--lightmeta , #666666);  
}

.nws_content h3 {
    font-size: 30px;
    color: var(--link , #0073e6);
}
.nws_blurb {
    font-size: 20px;    
}
.nws_link-hover{
    padding: 45px 45px 41px;
    margin-top: auto;
    font-weight: 500;
    letter-spacing: .44px;
    text-align: right;
    text-transform: uppercase;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    will-change: opacity;
    z-index: 1;
    background: var(--background-color, #1f69ff);
    color: var(--white , #ffffff);
    font-weight: 600;
    font-size: 24px;
    display: flex;align-items: center;
    justify-content: flex-end;
}
.nws_link{

    margin-top: auto;
    font-weight: 500;
    letter-spacing: .44px;
    text-align: right;
    text-transform: uppercase; 
    z-index: 1;
    opacity: 1 ;
    position: absolute;
    right: 46px;
    bottom: 44px;
    width: 100%;
    transition: opacity .3s ease-in-out;
}
.nws_link span{
    color: var(--link , #0073e6);
    width:  28px;
}
.featured-articles__inactive-link {
    
}

/* Rebranding - Round corners for carousel/slider */
.uk-slider-items > * {
    border-radius: 15px; /* Rounded corners for individual items */
    overflow: hidden; /* Prevent content overflow */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* Optional shadow for items */
}

.uk-slider-items img {
    border-radius: 15px; /* Rounded corners for images */
    width: 100%;
    height: auto;
}

.in-relation {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: 11;
}
.in-relation:hover ~ .nws_link-hover {
    opacity: 1;
    color: var(--white , #ffffff);

}
.in-relation:hover ~ .nws_link {
    opacity: 0;
}

.smaller {
    padding: 0 20px;
}
.nws_content.smaller h3 {
    font-size: 16px;
    line-height: 1.3;
    font-weight: 600;
}
.smaller-arrow{
    padding: 25px 25px 20px;
    font-size: 16px;
}
.smaller-i {
    right:20px;
    bottom:20px;
}

.reverse .tool-item {
    transform: translateY(var(--translation)) skewY(var(--reverse-angle));
}
.reverse .tool-title   , .reverse .tool-overlay-content{
    transform: skewY(var(--angle));
}
.reverse .tool-cta{
    transform: translateY(var(--translation)) skewY(var(--angle));
        clip-path:polygon(0 0,100% 70%,100% 100%,0% 100%);
        -webkit-clip-path:polygon(0 0,100% 70%,100% 100%,0% 100%);

}
.reverse .tool-cta span{
    justify-content: flex-start;
}
.uk-tab-left::before {
    border-width:2px;
}
.uk-tab-left>*>a {
    border-right-width: 2px;
}
h4.uk-nav-header {
    font-weight: 700;
}
.txt-c {
    padding-top: 45px !important;
}
.txt-c li a , .txt-c li {
    text-transform: unset !important;
}
.nv-title {
    left: 15px;
    top: 15px;
    font-size:16px;
    font-weight: 700;
}
.txt-c li a , .child-tab li a{
        color: var(--black , #000000);
    font-size: 14px;
    font-weight: 400;
    text-align: left;
    letter-spacing: .01em;
}
.txt-c li a:hover , .txt-c li.uk-active > a{
    color: var(--sky , #00a7ff);
    border-color: var(--sky , #00a7ff);
} 
.child-tab h4 {
    font-size:16px;
    font-weight: 700;
    margin: 0 0 8px;
}
.uk-box-shadow-none {
    box-shadow: none;
}
div.center{
    text-align: center;
}

@media (min-width: 1024px){
    .tool-item {
        margin: 0 .3125rem .625rem;
        width: calc(25% - 10px);

    }
    .tool-item:first-child {
        --translation: calc(var(--skew-padding)*0);
    }
    .tool-item:nth-child(2) {
        --translation: calc(var(--skew-padding)*0.5);
    }
    .tool-item:nth-child(3) {
        --translation: calc(var(--skew-padding)*1);
    }
    .tool-item:nth-child(4) {
        --translation: calc(var(--skew-padding)*1.5);
    }

    .reverse .tool-item:first-child {
        --translation: calc(var(--skew-padding)*1.5);
    }
    .reverse .tool-item:nth-child(2) {
        --translation: calc(var(--skew-padding)*1);
    }
    .reverse .tool-item:nth-child(3) {
        
        --translation: calc(var(--skew-padding)*0.5);
    }
    .reverse .tool-item:nth-child(4) {
        --translation: calc(var(--skew-padding)*0);
        
    }
    .tool-overlay {
        display: flex;
    }
}

#search {
    width: 100%;
    top: 100% !important;
    transform: unset !important;
    left: 0 !important;

}
@media(min-width: 1300px) and (max-width:1480px) {
    .border-top-bottom .uk-search-default {
        width: 250px;
        margin-right: 20px;
    }
    .cta-btn {
        margin:  0 20px;
    }
}
@media(min-width: 960px) and (max-width: 1299px){
 .border-top-bottom .uk-search-default {
        width: 250px;
        margin-right: 20px;
    }
    .cta-btn {
        display: none;
    }   
    .border-top-bottom .uk-navbar-nav>li>a {
        padding: 0 10px;
    }
}
@media(max-width: 767px){
    .tool-item {
        width: calc(100% - 5px);
    }
    .circle-btn {
        top: unset;
        transform: unset !important;
        bottom: 30px;
        height: 40px;
        width: 40px;
    }
    .circle-btn svg {
        width: 10px;
    }
    .circle-btn.uk-position-center-left {
        left: 0;
    }
    .circle-btn.uk-position-center-right {
        right: 0;
    }  
    .uk-slider-nav.uk-dotnav {
        position: relative;
        bottom: -10px;
    }
    .tools-section .section-title h3 {
        font-size: 28px;
    }
        .nws_content {
            padding: 0 20px;
        }
        .uk-slider-container-offset{
            margin: 0;
        }
        .whats-new .section-title h3 , .featured .section-title h3{
            font-size: 28px;
        }
}

/***********************
********* Footer ******
************************/
#footer {
    padding-top: 10px;
    padding-bottom: 10px;
    color: #fff;
    background: #2e2e2e;
    font-size: 10px;
    width: 100%;
  }
  #footer a {
    color: #fff;
  }
  #footer a:hover {
    color: #45aed6;
  }
  #footer ul {
    list-style: none;
    padding: 0;
    margin: 0 -7.5px;
  }
  #footer ul > li {
    display: inline-block;
    margin: 0 7.5px;
  }
