
html,body{ width: 100%; height: 100%; margin: 0; padding: 0; }

img{ max-width: 100%; display: block; }

header{ position: relative; overflow: hidden; }

footer{ background: url('../img/bg-pie.jpg') top center no-repeat; background-size: cover; display: flex; }

#information{ background: url('../img/market/bg.jpg') center top no-repeat; background-size: cover; padding: 20px; }

#footer-social{ width: auto; margin: 50px 80px 0 0;}

#footer-social ul{ padding: 0; list-style: none; display: flex; justify-content: space-around;}

.container{ width: 90%; margin: 0 auto; }

.flex{ display: flex; justify-content: center; flex-wrap: wrap; }

.col-4{ width: 20%; padding-right: 2%; margin-bottom: 20px;}

.col-4 img{ border-radius: 2px; -webkit-box-shadow: 0 1rem 3rem rgba(0,0,0,.175)!important; box-shadow: 0 1rem 3rem rgba(0,0,0,.175)!important;  }

.spacer{ flex: 1 auto; }

@media (max-width: 880px) {

    #logo{ top: 10px; left: 10px; width: 320px; }

}

@media (max-width: 800px) {

    #information{ background: url('../img//market/movil/bg.png') center top no-repeat; background-size: cover; }

    footer{ background: url('../img/movil/bg-pie.jpg') center top no-repeat; background-size: cover; flex-flow: wrap; }

    #footer-social{ width: 200px; margin: 0 auto;}

    .col-4{ width: 30%;}

}

@media (max-width: 550px) {

    #logo{ width: 200px; }

    .col-4{ width: 100%;}

}