footer{
    width: 100%;
    height: auto;
    overflow: hidden;
    padding: 70px 0;
    background: $black;
    .logo-footer{
        img{
            max-width: 250px;
        }
    }
    nav{
        ul{
            li{
                margin-bottom:20px;
                a{
                    text-transform: uppercase;
                    font-size: 1.2rem;
                    color:$gray;
                    &:hover{
                        color:$yellow;
                    }
                }
            }
        }
    }
    .contact-info{
        section{
            margin-bottom:20px;
            strong{
                font-size: 1.2rem;
                text-transform: uppercase;
                color: $yellow;
                font-weight: 500;
                margin-bottom: 8px;
                display: inline-block;
            }
            p{
                font-size: 1.4rem;
                color:$gray;
            }
        }
    }
    .newsletter{
        position: relative;
        h2{
            font-size: 2.5rem;
            color:$yellow;
            font-weight: 500;
            margin-bottom: 20px;
        }
        .form-control{
            background: transparent;
            border-color: $gray-dark;
        }
        .btn-default{
            color:$white;
            background: $gray-dark;
            &:hover{
                background: $yellow;
                color:$black;
            }
        }
        .loading{
            background: #211e1e;
        }
    }
    .copyright{
        width: 100%;
        display: block;
        text-align: center;
        margin-top: 70px;
        font-size: 1.0rem;
    }
}

@include breakpoint(1000px){
    footer{
        padding:50px 0 30px;
        .logo-footer{
            @include flexbox();
            @include justify-content(center);
            margin-bottom:50px;
            img{
                max-width: 160px;
                height: 69px;
            }
        }
        .copyright{
            margin-top: 60px;
        }
        .newsletter{
            h2{
                font-size: 3.2rem;
                max-width: 90%;
            }
        }
    }
}

@include breakpoint(580px){
    footer{
        .menu-footer{
            display: none;
        }
        .contact-info{
            text-align: center;
            margin-bottom:50px;
            section{
                padding: 0 60px;
            }
        }
        .newsletter{
            text-align: center;
            form{
                h2{
                    display: block;
                    margin:0 auto 20px;
                    max-width: 200px;
                    font-size: 2.6rem;
                }
            }
        }
    }
}