



/*==================================================
FOOTER AREA
==================================================*/

#footerArea{

    position:relative;

    overflow:hidden;

    background:
        linear-gradient(rgba(4,25,82,.96),rgba(4,25,82,.96)),
        url("../images/footer-bg.jpg") center center;

    background-size:cover;

    padding:70px 0 0;

    font-family:'Poppins',sans-serif;
}


/*==================================================
BACKGROUND OVERLAY
==================================================*/

#footerArea::before{

    content:"";

    position:absolute;

    inset:0;

    background:
    radial-gradient(circle at top right,
    rgba(24,150,255,.10),
    transparent 45%);

    pointer-events:none;
}


/*==================================================
CONTAINER
==================================================*/

#footerArea .container{

    position:relative;

    z-index:2;
}


/*==================================================
WIDGET
==================================================*/

.footer-widget{

    padding-right:20px;
}


/*==================================================
COLUMN DIVIDER
==================================================*/

.footer-widget{

    position:relative;
}

.footer-widget::after{

    content:"";

    position:absolute;

    top:0;

    right:0;

    width:1px;

    height:140px;

    background:rgba(255,255,255,.10);
}

#footerArea .row>div:last-child .footer-widget::after{

    display:none;
}


/*==================================================
LOGO
==================================================*/

.footer-logo{

    display:inline-block;

    margin-bottom:22px;
}

.footer-logo img{

    max-width:240px;

    height:auto;

    display:block;
}


/*==================================================
DESCRIPTION
==================================================*/

.footer-widget p{

    color:#d8e4ff;

    font-size:15px;

    line-height:1.9;

    margin-bottom:25px;
}


/*==================================================
HEADING
==================================================*/

.footer-widget h4{

    color:#fff;

    font-size:15px !important;

    font-weight:700;

    margin-bottom:24px;

    text-transform:uppercase;

    letter-spacing:.5px;
}


/*==================================================
SOCIAL ICONS
==================================================*/

.social-icons{

    display:flex;

    gap:12px;

    padding:0;

    margin:0;

    list-style:none;
}

.social-icons li{

    list-style:none;
}

.social-icons a{

    width:42px;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    border:1px solid rgba(255,255,255,.35);

    color:#fff;

    text-decoration:none;

    transition:.35s;
}

.social-icons a:hover{

    background:#1698ff;

    border-color:#1698ff;

    transform:translateY(-4px);
}


/*==================================================
LINKS
==================================================*/

.footer-links{

    list-style:none;

    padding:0;

    margin:0;
}

.footer-links li{

    margin-bottom:13px;
}

.footer-links li:last-child{

    margin-bottom:0;
}

.footer-links a{

    color:#d9e5ff;

    text-decoration:none;

    font-size:15px;

    transition:.35s;

    display:inline-flex;

    align-items:center;
}

.footer-links a::before{

    content:"›";

    margin-right:10px;

    color:#19a0ff;

    font-size:16px;

    transition:.35s;
}

.footer-links a:hover{

    color:#19a0ff;

    padding-left:6px;
}


/*==================================================
NEWSLETTER
==================================================*/

.newsletter-form{

    position:relative;

    margin-top:18px;

    margin-bottom:25px;
}

.newsletter-form input{

    width:100%;

    height:52px;

    border:none;

    outline:none;

    border-radius:4px;

    padding:0 65px 0 18px;

    font-size:15px;

    color:#1d2b55;
}

.newsletter-form input::placeholder{

    color:#9aa7c2;
}

.newsletter-form button{

    position:absolute;

    top:0;

    right:0;

    width:58px;

    height:52px;

    border:none;

    border-radius:0 4px 4px 0;

    background:#ff9800;

    color:#fff;

    font-size:18px;

    transition:.35s;

    cursor:pointer;
}

.newsletter-form button:hover{

    background:#1698ff;
}


/*==================================================
FORM FOCUS
==================================================*/

.newsletter-form input:focus{

    box-shadow:
    0 0 0 3px rgba(22,152,255,.20);
}

/*==================================================
FOOTER FEATURES
==================================================*/

.footer-features{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    margin-top:25px;
}

.feature-item{

    display:flex;

    flex-direction:column;

    align-items:center;

    text-align:center;

    flex:1;

    transition:.35s;
}

.feature-item i{

    font-size:30px;

    color:#00a2ff;

    margin-bottom:10px;

    transition:.35s;
}

.feature-item span{

    color:#ffffff;

    font-size:14px;

    font-weight:500;
}

.feature-item:hover{

    transform:translateY(-6px);
}

.feature-item:hover i{

    color:#ff9800;

    transform:rotateY(360deg);
}


/*==================================================
BOTTOM FOOTER
==================================================*/

.footer-bottom{

    margin-top:55px;

    border-top:1px solid rgba(255,255,255,.10);

    padding:20px 0;
}

.footer-bottom p{

    margin:0;

    color:#d7e3ff;

    font-size:14px;
}

.footer-bottom i{

    margin:0 4px;
}


/*==================================================
GENERAL HOVER
==================================================*/

.footer-widget{

    transition:.35s;
}

.footer-widget:hover{

    transform:translateY(-3px);
}

.footer-widget h4{

    position:relative;
}

.footer-widget h4::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-8px;

    width:45px;

    height:3px;

    background:#1698ff;

    border-radius:30px;
}

.footer-widget:hover h4::after{

    width:70px;

    background:#ff9800;
}


/*==================================================
NEWSLETTER BUTTON
==================================================*/

.newsletter-form button{

    overflow:hidden;
}

.newsletter-form button::before{

    content:"";

    position:absolute;

    left:-100%;

    top:0;

    width:100%;

    height:100%;

    background:rgba(255,255,255,.18);

    transition:.45s;
}

.newsletter-form button:hover::before{

    left:100%;
}


/*==================================================
LINK ANIMATION
==================================================*/

.footer-links li{

    transition:.35s;
}

.footer-links li:hover{

    transform:translateX(5px);
}


/*==================================================
SOCIAL ICON GLOW
==================================================*/

.social-icons a:hover{

    box-shadow:0 8px 20px rgba(22,152,255,.35);
}


/*==================================================
TABLET
==================================================*/

@media(max-width:991px){

#footerArea{

    padding-top:60px;
}

.footer-widget{

    margin-bottom:40px;

    padding-right:0;
}

.footer-widget::after{

    display:none;
}

.footer-features{

    justify-content:center;

    flex-wrap:wrap;

    gap:25px;
}

.feature-item{

    flex:0 0 30%;
}

.footer-bottom{

    text-align:center;
}

.footer-bottom .text-lg-start,

.footer-bottom .text-lg-end{

    text-align:center!important;
}

.footer-bottom .col-lg-6:first-child{

    margin-bottom:10px;
}

}


/*==================================================
MOBILE
==================================================*/

@media(max-width:767px){

#footerArea{

    padding-top:50px;
}

.footer-logo img{

    max-width:200px;
}

.footer-widget h4{

    font-size:18px;
}

.footer-widget p{

    font-size:14px;
}

.footer-links a{

    font-size:14px;
}

.newsletter-form input{

    height:48px;

    padding-right:55px;
}

.newsletter-form button{

    width:50px;

    height:48px;
}

.footer-features{

    flex-direction:column;

    align-items:center;
}

.feature-item{

    width:100%;
}

.feature-item i{

    font-size:26px;
}

.footer-bottom{

    margin-top:35px;
}

.footer-bottom p{

    font-size:13px;
}

}


/*==================================================
SMALL MOBILE
==================================================*/

@media(max-width:575px){

#footerArea{

    padding-top:45px;
}

.footer-logo{

    display:block;

    text-align:center;
}

.footer-widget{

    text-align:center;
}

.footer-widget h4::after{

    left:50%;

    transform:translateX(-50%);
}

.social-icons{

    justify-content:center;
}

.footer-links a{

    justify-content:center;
}

.newsletter-form{

    max-width:100%;
}

.newsletter-form input{

    font-size:14px;
}

.newsletter-form button{

    width:48px;
}

.footer-features{

    gap:18px;
}

.feature-item span{

    font-size:13px;
}

.footer-bottom{

    padding:18px 0;
}

}


/*==================================================
LARGE DESKTOP
==================================================*/

@media(min-width:1400px){

.footer-widget p{

    font-size:16px;
}

.footer-links a{

    font-size:16px;
}

.footer-widget h4{

    font-size:22px;
}

.feature-item span{

    font-size:15px;
}

.footer-bottom p{

    font-size:15px;
}

}


/*==================================================
REDUCED MOTION
==================================================*/

@media(prefers-reduced-motion:reduce){

*{

    transition:none!important;

    animation:none!important;
}

}