footer {
    margin-top: 60px
}

/*
****************************************************************************
****************************************************************************
Row 1
****************************************************************************
****************************************************************************
*/

footer > .row-1 {
    background-color:  var(--factory-color-hex)
}

footer > .row-1 > .wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 40px 50px;
}

footer .suscribe {
    display: flex;
    align-items: center;
    /* padding: 40px 50px; */
}


footer .suscribe img {
    height: 26px;
    width: auto;
}

footer .suscribe h6 {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 400;
    color: #ffffff;
    margin-left: 20px;
    margin-right: 35px
}

footer .suscribe form {
    display: flex;
}

footer .suscribe form input {
    background-color: #ffffff;
    border-radius: 4px 0 0 4px;
    border: 0;
    padding: 10px 20px;
    width: 300px
}

footer .suscribe form button {
    background-color: #EB911B;
    color: #6D2D2E;
    border-radius: 0 4px 4px 0;
    border: 0;
    font-weight: 500;
    text-transform: uppercase;
    padding: 0 20px
}

footer .social-media {
    display: flex;
    align-items: center
}

footer .social-media h6 {
    margin: 0 20px 0 0;
    font-weight: 400;
    color: #ffffff;
    text-transform: uppercase;
    font-size: 14px
}


footer .social-media > a {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #ffffff;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    margin-left: 10px;
}

footer .social-media > a  img {
    height: 12px;
    width: auto;
}



@media only screen and (max-width: 1024px) {
    footer > .row-1 > .wrapper {
        flex-direction: column
    }
    footer .suscribe {
        margin-bottom: 20px
    }
}

@media only screen and (max-width: 768px) {
    footer .suscribe {
        flex-direction: column
    }

    footer .suscribe h6 {
        text-align: center;
        margin: 20px 0 15px
    }
    footer .suscribe form input {
        width: 100%
    }

}

@media only screen and (max-width: 768px) {

    footer .social-media h6 {
        display: none
    }

}


/*
****************************************************************************
****************************************************************************
Row 2
****************************************************************************
****************************************************************************
*/


footer > .row-2 {
    background-color: #F9F9FA
}

footer > .row-2 > .wrapper {
    display: flex;
    justify-content: space-between;
    /* align-items: center; */
    padding: 40px 100px;
}


footer > .row-2 .info .logo {
    height: 56px;
    width: auto;
    margin-bottom: 20px
}


footer > .row-2 .info {
    width: 350px;
    min-width: 350px;
    margin-right: 30px
}

footer > .row-2 .info .payment-methods {
    margin-top: 30px
}
footer > .row-2 .info .payment-methods img {
    height: 25px;
    width: auto;
}


footer > .row-2 .links {
    flex-grow: 1;
    display: flex;
    justify-content: space-between;
}

footer > .row-2 .links h6 {
    margin: 0;
    font-weight: 500;
    font-size: 20px
}

footer > .row-2 .links ul {
    margin-top: 15px;
}

footer > .row-2 .links ul > li {
    margin-bottom: 10px;
}
footer > .row-2 .links ul > li:last-child {
    margin-bottom: 0;
}
footer > .row-2 .links ul > li a {
    color: #555555;
    text-decoration: none;
    transition: color 0.2s ease
}
footer > .row-2 .links ul > li a.big {
    color: #151414;
    font-size: 15px;
    font-weight: 600;
}



footer > .row-2 .links ul > li.active a,
footer > .row-2 .links ul > li a:hover,
footer > .row-2 .links ul > li a:focus {
    color:  var(--factory-color-hex);
}


@media only screen and (max-width: 1024px) {
    
    footer > .row-2 > .wrapper {
        padding: 40px 40px;
    }

    footer > .row-2 > .wrapper {
        flex-direction: column
    }
    
    footer > .row-2 .info {
        margin-bottom: 30px;
        display: flex;
        width: 100%;
        min-width: 100%

    }

    footer > .row-2 .info > div{
        text-align: right;
        flex-grow: 1
    }

    footer > .row-2 .info .payment-methods {
        margin-top: 15px
    }
}


@media only screen and (max-width: 768px) {
    footer > .row-2 .info {
        display: block
    }
    footer > .row-2 .info > div{
        text-align: left;
    }

    footer > .row-2 .links {
        flex-direction: column;
    }

    footer > .row-2 .links > div {
        margin-bottom: 20px
    }

    footer > .row-2 .links > div:last-child {
        margin-bottom: 0
    }

    
}



/*
****************************************************************************
****************************************************************************
Row 3
****************************************************************************
****************************************************************************
*/

footer > .row-3 > .wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px 50px;
    color: #555555;
}

footer > .row-3 > .wrapper p {
    margin: 0;
}

footer > .row-3 > .wrapper > div:first-child {
    display: flex;
    align-items: center;
}

footer > .row-3 > .wrapper > div:first-child img {
    margin-right: 15px
}



@media only screen and (max-width: 992px) {
    
    footer > .row-3 > .wrapper {
        flex-direction: column;
        text-align: center
    }

    footer > .row-3 > .wrapper > div:first-child {
        flex-direction: column;
        margin-bottom: 10px
    }

    footer > .row-3 > .wrapper > div:first-child img {
        margin-right: 0;
        margin-bottom: 10px
    }
    
}