.lions-section { position: relative; }

.lions-section-with-bg { background-position: center center; background-repeat: no-repeat; background-size: cover; }

.lions-hero-section-top-padding { padding-top: 100px; }
.lions-hero-section-top-padding-50 { padding-top: 50px; }
.lions-hero-section-top-margin { margin-top: 120px; }

/* padding / margin top for responsive hero section */
@media (max-width: 992px) {
.lions-hero-section-top-padding { padding-top: 150px; }
.lions-hero-section-top-padding-50 { padding-top: 50px; }
.lions-hero-section-top-margin { margin-top: 80px; }
}

.lions-pb-100, .lions-py-100 { padding-bottom: 100px !important }

.text-size-xxl { font-size: 68px; line-height: 68px; }
.text-size-xl { font-size: 47px; line-height: 52px; }
.text-size-lg { font-size: 29px; line-height: 38px; }
.text-size-md { font-size: 23px; line-height: 36px; }
.text-size-sm { font-size: 13px; line-height: 18px; }
.text-size-xs { font-size: 0.765em; line-height: 1.4em; }
.font-weight-extrabold { font-weight: 700; }


.lions-mt-minus10 { margin-top: -10px !important; }
.lions-mt-minus20 { margin-top: -20px !important; }
.lions-mt-minus30 { margin-top: -30px !important; }
.lions-mt-minus40 { margin-top: -40px !important; }
.lions-mt-minus50 { margin-top: -50px !important; }
.lions-mt-minus60 { margin-top: -60px !important; }
.lions-mt-minus70 { margin-top: -70px !important; }
.lions-mt-minus80 { margin-top: -80px !important; }
.lions-mt-minus90 { margin-top: -90px !important; }



.lions-btn-styled { display: inline-block; width: auto; height: auto; position: relative; cursor: pointer; border-width: 0; text-decoration: none; outline: none; -webkit-backface-visibility: hidden; vertical-align: middle; padding: 22px 30px 18px 30px; font-size: 16px; line-height: 22px; text-transform: uppercase; z-index: 9; }
.lions-btn-styled span { display: block; width: 60px; height: 60px; position: absolute; left: 0; top: 50%; border-radius: 50%; z-index: -1; margin-top: -30px; }
.lions-btn-styled:focus { outline: none; }
.lions-btn-styled:hover span { width: 100%; height: 100%; border-radius: 200px; }
/* styled btn small */
.lions-btn-styled-small { padding: 11px 20px 11px 20px; font-size: 14px; line-height: 18px; }
.lions-btn-styled-small span { width: 40px; height: 40px; margin-top: -20px; }

/*===== Common transitions =====*/
.lions-btn, button, .lions-btn-styled span, input[type="submit"], input[type="reset"], .lions-form-btn, .lions-logo, a:link, select, textarea, input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="number"], input[type="tel"], input[type="search"], #lions-header-global, .lions-social a, .lions-icon-list li, .lions-servicebox-caption { -webkit-transition: all .3s ease; transition: all .3s ease }


.lions-mt-30, .lions-my-30 { margin-top: 30px !important }
.lions-mt-20, .lions-my-20 { margin-top: 20px !important }

.lions-btn-styled-dark {
    color: #0e153a;
}

.lions-mt-30, .lions-my-30 {
    margin-top: 30px !important;
}

.h1, .h1 a {
    color: #0e153a;
}
.h1, .h1 a {
    font-size: 3.333em;
    line-height: 1.2em;
    letter-spacing: -2px;
}

.color-blue {
    color: #22d1ee !important;
}

.font-weight-extrabold {
    font-weight: 700;
}
.text-size-md {
    font-size: 23px;
    line-height: 36px;
}

.lions-btn-styled-dark {
    color: #0e153a;
}

.lions-btn-styled {
    background: transparent !important;
}

.lions-btn-styled {
    display: inline-block;
    width: auto;
    height: auto;
    position: relative;
    cursor: pointer;
    border-width: 0;
    text-decoration: none;
    outline: none;
    -webkit-backface-visibility: hidden;
    vertical-align: middle;
    padding: 22px 30px 18px 30px;
    font-size: 18px !important;
    line-height: 22px;
    text-transform: uppercase;
    z-index: 9;
}

.padding-0 {
    padding: 0px 0px 0px 0px !important;
}

.bg-light-blue { background-color: #22d1ee !important; }
.bg-light-blue:hover { background-color: #004360 !important; color: #fff; }




/*.main-apply-now{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 18px 30px;
    text-decoration: none;
    overflow: hidden;
}

.main-apply-now .apply-text{
    position: relative;
    z-index: 2;
    color: #0e153a;
    transition: color .3s ease;
    user-select: none;
}

.main-apply-now:hover .bg-light-blue{
    background: #004360 !important;
}

.main-apply-now:hover .apply-text{
    color: #fff !important;
}

.main-apply-now:focus,
.main-apply-now:active{
    outline: none;
    box-shadow: none;
}

.main-apply-now,
.main-apply-now *{
    user-select: none;
    -webkit-user-select: none;
}*/

.main-apply-now{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    width:170px;
    height:55px;

    background:#22d1ee;
    color:#004360;

    border-radius:50px;
    text-decoration:none;
    font-size:18px;
    font-weight:600;
    text-transform:uppercase;

    transition:all .35s ease;
    cursor:pointer;

    user-select:none;
    -webkit-user-select:none;
}

.main-apply-now:hover{
    background:#004360;
    color:#fff;
    text-decoration:none;
}

.main-apply-now:focus,
.main-apply-now:active{
    outline:none;
    color:#fff;
    text-decoration:none;
}





.bg-dark-blue { background-color: #0e153a !important; }



.bg-grey-alt {
    background-color: #e6e7eb !important;
}
.lions-section {
    position: relative;
}
.lions-pb-100, .lions-py-100 {
    padding-bottom: 100px !important;
}
.lions-pt-100, .lions-py-100 {
    padding-top: 100px !important;
}

.lions-promobox {
    border-color: rgba(14, 21, 58, 0.10);
}

.lions-promobox {
    border-radius: 12px;
    overflow: hidden;
}


/*===== servicebox =====*/
.lions-promobox { border-color: rgba(14,21,58,0.10); }
.lions-promobox:hover { background-color: rgba(14,21,58,0.05); }
.lions-promobox-number { color: rgba(23,50,164,0.10); }
.lions-promobox:hover .lions-promobox-number { color: rgba(14,21,58,0.30); }

/*===== Servicebox =====*/
.lions-promobox { border-radius: 12px; overflow: hidden; }
.lions-promobox-tagline { display: block; position: absolute; left: 10px; right: 10px; top: 0; padding: 5px 20px; border-radius: 200px; text-align: center; transform: translateY(-50%); margin: 0 0 10px 0; }
.lions-promobox-content { position: relative; padding: 50px 30px; text-align: center; }
/*===== promoboxes =====*/
/*.lions-servicebox { width: 100%; min-height: 400px; position: relative; background-position: center center; background-repeat: no-repeat; background-size: cover; overflow: hidden; padding: 10px; }*/
/*.lions-servicebox-caption { display: inline-block; position: absolute; top: auto; bottom: 10px; left: 10px; right: 10px; padding: 20px; overflow: hidden; border-radius: 4px; }*/
/*.lions-servicebox-caption-inner { margin-bottom: -85px; transition: all .3s ease; }*/
/*.lions-servicebox:hover .lions-servicebox-caption-inner { margin-bottom: 0; }*/
.lions-servicebox-subtitle { display: block; margin-bottom: 5px; }


.lions-servicebox{
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;      /* Perfect Square */
    overflow: hidden;
    border-radius: 12px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.lions-servicebox-caption{
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 10px;
    padding: 20px;
    border-radius: 8px;
}

.lions-servicebox-caption-inner{
    margin-bottom: -80px;
    transition: .35s ease;
}

.lions-servicebox:hover .lions-servicebox-caption-inner{
    margin-bottom: 0;
}

@media (max-width:767px){
    .lions-servicebox{
        aspect-ratio: 1 / 1;
    }
}

.lions-servicebox-title {
    font-size: 1.1rem !important;
}

.lions-img {
    max-width: 100%;
}

.lions-img {
    vertical-align: middle;
    border-style: none;
}

.lions-btn-styled-small {
    padding: 11px 20px 11px 20px;
    font-size: 14px;
    line-height: 18px;
}

.bg-grey {
    background-color: #f6f6e9 !important;
}

.lions-video-wrapper { position: relative; }
.lions-video-wrapper-inner { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.lions-video-button { position: relative; display: block; width: 60px; height: 60px; margin: 0 auto; -webkit-border-radius: 100%; border-radius: 100%; text-align: center; }
.lions-video-button::after { position: absolute; left: 50%; top: 50%; margin-top: -16px; margin-left: -5px; display: inline-block; font-family: 'icomoon'; content: '\eb7a'; font-size: 16px; line-height: 32px; z-index: 99; }
.lions-video-button-wrap-inner { position: relative; display: block; width: 60px; height: 60px; -webkit-border-radius: 100%; border-radius: 100%; z-index: 99; }
.lions-border-animation { width: 100%; height: 100%; position: absolute; top: 0; left: 0; border-width: 1px; border-style: solid; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; animation: pulse-border 4s linear 0s infinite; -webkit-animation: pulse-border 4s linear 0s infinite; -ms-animation: pulse-border 4s linear 0s infinite; -o-animation: pulse-border 4s linear 0s infinite; -webkit-animation-play-state: running; -moz-animation-play-state: running; -o-animation-play-state: running; animation-play-state: running; opacity: 0; z-index: 9; }
.lions-border-2 { -webkit-animation-delay: 1s; -moz-animation-delay: 1s; -o-animation-delay: 1s; animation-delay: 1s; }
.lions-video-button:hover .lions-border-animation { -webkit-animation-play-state: paused; -moz-animation-play-state: paused; -o-animation-play-state: paused; animation-play-state: paused }
.lions-video-heading { text-align: center; margin: 30px 0 0 0; padding: 0; }
.lions-video-button-wrap-inner::before { content: ''; position: absolute; left: 50%; top: 50%; margin-top: -20px; margin-left: -20px; display: inline-block; z-index: 99; border: 1px solid #fff; width: 40px; height: 40px; border-radius: 50%; }
/*== pulse border ==*/
@-webkit-keyframes pulse-border {
0% {
-webkit-transform:scale(1);
transform:scale(1);
opacity:0
}
20% {
-webkit-transform:scale(1.5);
transform:scale(1.5);
opacity:1
}
100% {
-webkit-transform:scale(2.6);
transform:scale(2.6);
opacity:0
}
}
@-moz-keyframes pulse-border {
0% {
-moz-transform:scale(1);
transform:scale(1);
opacity:0
}
20% {
-moz-transform:scale(1.5);
transform:scale(1.5);
opacity:1
}
100% {
-moz-transform:scale(2.6);
transform:scale(2.6);
opacity:0
}
}
@-o-keyframes pulse-border {
0% {
-o-transform:scale(1);
transform:scale(1);
opacity:0
}
20% {
-o-transform:scale(1.5);
transform:scale(1.5);
opacity:1
}
100% {
-o-transform:scale(2.6);
transform:scale(2.6);
opacity:0
}
}
@keyframes pulse-border {
0% {
-webkit-transform:scale(1);
-moz-transform:scale(1);
-o-transform:scale(1);
transform:scale(1);
opacity:0
}
20% {
-webkit-transform:scale(1.5);
-moz-transform:scale(1.5);
-o-transform:scale(1.5);
transform:scale(1.5);
opacity:1
}
100% {
-webkit-transform:scale(2.6);
-moz-transform:scale(2.6);
-o-transform:scale(2.6);
transform:scale(2.6);
opacity:0
}
}


/* Only for Career Promobox Section */
.career-promobox-section .row > [class*="col-"]{
    display: flex;
    margin-bottom: 30px;
}

.career-promobox-section .lions-promobox{
    display: flex;
    flex-direction: column;
    /*width: 100%;*/
    height: 100%;
}

.career-promobox-section .lions-promobox-content{
    display: flex;
    flex-direction: column;
    flex: 1;
}

.career-promobox-section .lions-promobox-content h4{
    margin-bottom: 15px;
}

/* Description takes remaining space */
.career-promobox-section .lions-promobox-content p:not(.lions-promobox-tagline){
    flex: 1;
    margin-bottom: 20px;
}

/*.career-promobox-section .lions-promobox-content .lions-btn-styled{
    margin-top: auto;
}*/

/* Button always at bottom */
.career-promobox-section .btn-apply,
.career-promobox-section .lions-btn-styled{
    margin-top: auto;
    align-self: center; /* optional - keeps button centered */
}

.lions-py-30 { padding-top: 30px !important; padding-bottom: 30px !important;  }
.lions-py-80 { padding-top: 80px !important; padding-bottom: 80px !important;  }
.lions-p-50 { padding: 50px !important }
.lions-pt-50, .lions-py-50 { padding-top: 50px !important }
.lions-pr-50, .lions-px-50 { padding-right: 50px !important }
.lions-pb-50, .lions-py-50 { padding-bottom: 50px !important }
.lions-pl-50, .lions-px-50 { padding-left: 50px !important }


/*.lions-rounded-img, .lions-rounded-img img, .lions-rounded { border-radius: 12px; width:90%; }*/
.lions-rounded-img, .lions-rounded-img img, .lions-rounded { border-radius: 12px; }

@media (max-width: 767px) {
    .small-device-space { margin: 25px 0 !important; }
    .small-device-center { text-align: center; }
}



/*Videos*/
.video-wrapper{
    position:relative;
    display:inline-block;
    overflow:hidden;
    border-radius:20px;
}

.video-wrapper img{
    width:100%;
    display:block;
    border-radius:20px;
}

.video-overlay{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
}

.video-popup{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:90px;
    height:90px;
    text-decoration:none;
}

.play-button{
    width:90px;
    height:90px;
    background:#1faaa5;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    z-index:3;
    box-shadow:0 10px 30px rgba(0,0,0,.2);
    transition:.3s;
}

.play-button i{
    /*color:#0056ff;*/
    color: #fff;
    font-size:28px;
    margin-left:4px;
}

.play-button:hover{
    transform:scale(1.08);
}

.ripple{
    position:absolute;
    width:90px;
    height:90px;
    border:2px solid #fff;
    border-radius:50%;
    animation:ripple 2s linear infinite;
    z-index:1;
}

.ripple2{
    animation-delay:1s;
}

@keyframes ripple{
    0%{
        transform:scale(1);
        opacity:1;
    }
    100%{
        transform:scale(1.8);
        opacity:0;
    }
}