/*******************************************************/
/******************* 24. Main Footer *******************/
/*******************************************************/
.footer-logo-newsletter
    border: 1px solid rgba(255, 255, 255, 0.1)
    +res-ab(lg)
        display: flex
.footer-logo
    width: 30%
    flex: none
    padding: 25px
    align-self: center
    text-align: center
    +res-bl(lg)
        width: 100%
.footer-newsletter
    width: 100%
    padding: 45px 70px
    +res-ab(lg)
        border-left: 1px solid rgba(255, 255, 255, 0.1)
    +res-bl(lg)
        padding: 25px
        border-top: 1px solid rgba(255, 255, 255, 0.1)
    +res-bl(xs)
        padding: 15px
    form
        width: 100%
        padding: 15px
        background: white
        align-items: center
        +res-ab(ms)
            display: flex
        input
            border: none
            font-size: 18px
            border-radius: 0
            color: $base-color
            padding: 10px 20px
            +res-bl(ms)
                font-size: 16px
                text-align: center
            &::placeholder
                font-weight: 400
                color: $base-color
                font-family: $base-font
        button
            flex: none
            +res-bl(ms)
                width: 100%
                
.footer-newsletter-wrap
    z-index: 2
    position: relative
    border-radius: 7px
    +flexcenter(space-between)
    transform: translateY(-80px)
    +res-bl(xl)
        display: block
        .section-title
            margin-bottom: 25px
    +res-bl(sm)
        text-align: center
        +gapLR(padding, 25px)
    .footer-newsletter
        padding: 0
        max-width: 600px
        border-left: none
        form
            border-radius: 7px
            
.footer-widget
    max-width: 315px
    margin-bottom: 50px
    +res-ab(xl)
        +gapLR(margin, auto)

.footer-title
    font-size: 18px
    margin-bottom: 35px
    text-transform: uppercase

.menu-widget
    ul
        li
            &:not(:last-child)
                margin-bottom: 8px
            a
                display: flex
                position: relative
                padding-left: 20px
                &:before
                    content: ''
                    left: 0
                    top: 12px
                    opacity: 0.5
                    transition: 0.5s
                    position: absolute
                    +circle($base-color, 5px)
                &:hover:before
                    opacity: 1
                    background: $primary-color
                
.contact-widget
    ul
        li
            display: flex
            &:not(:last-child)
                margin-bottom: 12px
            i
                margin: 8px 12px 0 0
                color: $primary-color
                
.news-widget
    li
        display: flex
        align-items: center
        &:not(:last-child)
            margin-bottom: 10px
        .image
            flex: none
            max-width: 80px
            margin-right: 20px
            +res-bl(xs)
                margin-right: 15px
        .content
            h6
                font-size: 17px
                font-weight: 500
                margin-bottom: 0
                +res-bl(xs)
                    font-size: 15px
                a:hover
                    color: $primary-color
            .date
                font-size: 13px
                text-transform: uppercase
                i
                    margin-right: 5px
                
.copyright-area
    border-top: 1px solid rgba(22, 22, 22, 0.1)
    p
        margin: 0
        a
            color: $primary-color
            
            
.text-white
    .about-widget
        p
            opacity: 0.6
        .social-style-two
            a
                i
                    transition: 0.5s
                &:not(:hover)
                    i
                        color: $base-color
    .menu-widget
        ul
            li
                a
                    opacity: 0.5
                    &:before
                        background: white
                    &:hover
                        opacity: 1
    .news-widget
        li
            .image
                max-width: 70px
                margin-right: 28px
            .content
                h6
                    +res-bl(xs)
                        font-size: 13px
                .date
                    opacity: 0.5
    .footer-widget
        max-width: 350px
        
    .contact-widget
        ul
            li
                span, a
                    opacity: 0.5
                a:hover
                    opacity: 1
    .copyright-area
        border-top-color: rgba(255, 255, 255, 0.1)
        p
            color: $base-color