/* Button */
.btn{ display: inline-block; text-decoration: none; width: auto;  position: relative; font-weight: 600; text-align: center; 
border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; padding-bottom: .65em; padding-top: .75em; padding-right: 2.5em; padding-left: 1em; font-size: 1.125rem; height: auto; border: 0; outline: none; transition: .25s ease; line-height: 1; white-space: nowrap;}

.btn-white{ background: #fff; color: #0079c8; border: 2px solid #fff; }
.btn-white:hover{ color: #fff; background-color: #00548c; border: 2px solid #00548c;}

.btn-transparent { background-color: transparent; border: 2px solid #0d1846; color: #0d1846; text-align: center;}
.btn-transparent::after{ border-style: solid; border-width: .2em .2em 0 0; content: ""; display: inline-block; height: .45em; width: .45em; margin-left: 5px; transition: .25s ease; left: 0; transform: rotate(45deg); color: #0d1846;}
.btn-transparent:hover { background-color: #022540; border: 2px solid #022540; color: #fff; text-decoration: none; cursor: pointer;}

.link-btn{ background-color: transparent; border: 2px solid transparent; color: #0079c8; padding: 0; position: relative; font-weight: 600; text-decoration: none;}
.link-btn::after{ border-style: solid; border-width: .2em .2em 0 0; content: ""; display: inline-block; height: .45em; width: .45em; margin-left: 5px; transition: .25s ease; left: 0; transform: rotate(45deg); color: #0079c8;}
.link-btn:hover{ text-decoration: underline;}

/* Global */
.image-fit{ display: flex; min-width: initial; position: relative; overflow: hidden; flex: 0 0 auto; display: flex;}
.image-fit img { flex: 1 1 auto; align-self: center; justify-self: center; object-fit: cover; height: 100%; min-width: 100%; width: auto;}
.content-inner{ max-width: 1323px; margin-left: auto; margin-right: auto; padding-left: 68px; padding-right: 68px;}

/* Jobs Banner */
.jobs-banner { position: relative; }
.jobs-banner .image-fit {position: relative;}
.jobs-banner .content { max-width: 570px; min-height: 240px; justify-content: center; display: flex; flex-direction: column; align-items: flex-start; padding: 40px; border-radius: 8px; background: hsla(0,0%,100%,.8); box-shadow: 0 16px 32px 0 rgba(0,33,55,.2); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-sizing: border-box; position: relative; top: 50%; transform: translateY(-50%); height: auto; position: absolute;}
.jobs-banner .content h1{ margin: 0; font-size: 56px; font-weight: 700; line-height: 64px; letter-spacing: -1.68px; color: #0079c8; word-wrap: break-word; margin-bottom: 24px; }
.jobs-banner .content h2{ color: #21272a; margin: 0; font-size: 20px; font-weight: 600; line-height: 28px;}

/* Promo Details */
.promo-details { background-color: rgb(13, 24, 70); color: #fff; padding: 20px 0px;}
.promo-details .content-inner{ display: flex; gap: 30px;}
.promo-details .content-inner .item { display: flex; flex-direction: column; justify-content: center;}
.promo-details .content-inner .item p{line-height: 1.5; margin: 0; font-size: 16px;}
.promo-details .promo-heading{ margin-bottom: 12px; font-size: 17px; font-weight: 600; display: block;}
.promo-details .content-inner .item .button--white{ white-space: nowrap; border-radius: 4px;}
.promo-details .content-inner .item .button--white::after{transform: rotate(45deg); color: #0079c8; border-style: solid; border-width: .2em .2em 0 0; content: ""; display: inline-block; height: .45em; width: .45em; margin-left: 5px; transition: .25s ease;}

/* Intro Section */
.intro-section h2{ font-size: 32px; font-weight: 600; color: #000; margin-top: 0;}
.intro-section .text-center > :last-child { margin-bottom: 0; }

/* Text Icon Grid */
.text-icon-grid-section .page-padding{ padding-top: 0px; position: relative;}
.text-icon-grid-section h2{ font-size: 32px; font-weight: 600; color: #000; margin-top: 0;}
.text-icon-grid{ display: flex; gap: 30px; flex-wrap: wrap;}
.text-icon-grid .item .icon{ height: 50px; width: 50px;}
.text-icon-grid .item .icon img{ width: 100%; height: auto;}
.text-icon-grid .item .title{font-size: 18px; font-weight: 600; margin-bottom: 15px;}
.text-icon-grid .item{background-color: #f3f5f8; padding: 30px; text-align: left;}
.text-icon-grid .item > :last-child { margin-bottom: 0; }
.text-icon-grid .item{ width: calc(100% / 3);}
.text-icon-grid.jb-column-four .item{ width: calc(100% / 4 - 22.5px);}
.text-icon-grid.jb-column-three .item{ width: calc(100% / 3 - 20px);}
.text-icon-grid.jb-column-two .item{ width: calc(100% / 2 - 15.5px);}

/* Join Us Grid */
.join-us-section{background-color: #f3f5f8; position: relative;}
.join-us-section h2{ font-size: 32px; font-weight: 600; color: #000; margin-top: 0; }
.join-us-section .text-icon-grid .item{ padding: 0; background-color: #fff;}
.join-us-section .text-icon-grid .item .content{ padding: 30px 20px;}

/* CTA section */
.cta-section{ position: relative; background-color: #0d1846; color: #fff !important;}
.cta-section h2{ font-size: 32px; font-weight: 600; color: #fff !important; margin-top: 10px;  margin-bottom: 10px;}
.cta-section p{margin-top: 10px;}
.cta-section .icon{ height: 60px; width: 60px; margin: 0 auto;}
.cta-buttons { margin-top: 20px; display: flex; gap: 10px; flex-wrap: wrap; justify-content: center;}
.cta-buttons .button{ border-radius: 4px;}

/* Text Video */
.text-video-section{ position: relative;}
.text-video-section .page-padding{ padding-top: 0px; }
.text-video-outer{ position: relative; display: flex; flex-wrap: wrap; background-color: #ddedf8; padding: 40px;}
.text-video-outer h2{ font-size: 32px; font-weight: 600; color: #000; margin-top: 0; margin-bottom: 0;}
.text-video-outer .item{ width: calc(100% / 2); position: relative;}
.text-video-outer .item:last-child{ padding: 40px; display: flex; flex-direction: column; justify-content: center; text-align: left;}
.text-video-outer .item .yt-video { position: relative; width: 100%; padding-bottom: 56.25%;  height: 0; overflow: hidden; top: 50%; transform: translateY(-50%);}
.text-video-outer .item .yt-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;}
.text-video-outer .item .play-icon { font-size: 4em; width: 1em; height: 1em; position: absolute; top: 45%; left: 50%; z-index: 2; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); -webkit-transition: all .4s cubic-bezier(.175,.885,.32,1.275); transition: all .4s cubic-bezier(.175,.885,.32,1.275);}
.text-video-outer .item .play-icon::after { content: ''; display: block; height: 1em; width: 1em; line-height: 1em; background-position: 50% 50%; background-size: 1em 1em; background-size: contain; background-repeat: no-repeat; background-image: url(../../images/icon-play.svg);}
.text-video-outer .item .play-icon::before { content: ''; display: block; position: absolute; z-index: -2; left: -10%; top: -10%; width: 120%; height: 120%; border-radius: 100%; background: #FFF; opacity: 0; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transition: all .4s cubic-bezier(.175,.885,.32,1.275); transition: all .4s cubic-bezier(.175,.885,.32,1.275);}
.text-video-outer .item .play-icon:hover::before { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);}


@media all and (max-width: 1024px) {
    .jobs-banner .content{ position: relative; min-height: unset; justify-content: unset; transform: translateY(-80px); margin-bottom: -40px; width: 100%; padding: 24px; max-width: 100%;}
    .jobs-banner .content h1{ font-size: 44px; line-height: 52px;}
    .jobs-banner .image-fit { padding: 0; aspect-ratio: 16/9; }
    .promo-details .content-inner { gap: 30px; }
    .text-icon-grid .item{ width: calc(100% / 3 - 20px) !important;}
}

@media all and (max-width: 924px){
    .text-video-outer .item .yt-video{ top: unset; transform: translateX(0);}
   .text-video-outer{ flex-direction: column; }
   .text-video-outer .item { width: calc(100%);}
   .text-video-outer .item:last-child{ padding: 40px 0px 0px 0px;}
}

@media all and (max-width: 767px){
    .content-inner{ padding-left: 45px; padding-right: 45px;}
    .promo-details .content-inner { flex-direction: column; gap: 15px;}
    .text-icon-grid .item{  width: calc(100% / 2 - 15.5px) !important;}
}

@media all and (max-width: 649px){
    .content-inner{ padding-left: 18px; padding-right: 18px;}
}

@media all and (max-width: 480px){
    .text-icon-grid .item{  width: calc(100%) !important;}
    .text-video-outer{ padding: 20px;}
    .text-video-outer .item:last-child{ padding: 20px 0px 0px 0px;}
    .text-video-outer .item .play-icon { font-size: 3.5em; }
}