@font-face {
    font-family: 'robotoregular';
    src: url('../fonts/roboto-regular-webfont.woff2') format('woff2'),
         url('../fonts/roboto-regular-webfont.woff') format('woff'),
         url('../fonts/roboto-regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'frnkgothitc_bk_btbook';
    src: url('../fonts/franklin_gothic_itc_book_bt-webfont.eot');
    src: url('../fonts/franklin_gothic_itc_book_bt-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/franklin_gothic_itc_book_bt-webfont.woff2') format('woff2'),
         url('../fonts/franklin_gothic_itc_book_bt-webfont.woff') format('woff'),
         url('../fonts/franklin_gothic_itc_book_bt-webfont.svg#frnkgothitc_bk_btbook') format('svg');
    font-weight: normal;
    font-style: normal;

}
.logo{
    width: 51px
}
/*iconos sociales*/
.sociales{
	max-width: 100%
}

.iconos{
    padding:0.5rem 2rem 1rem 0rem;
}

.sociales-footer{
    max-width: 80%;
    padding:1rem 1rem 1rem 0rem;
}

.bt-comprar{
    padding-top:2rem;
    padding-bottom:1rem;
}

.top-bar-section ul li > a {
    color: #FFFFFF;
    display: block;
    font-family: 'robotoregular';
    font-size: 1.2rem;
    font-weight: normal;
    padding-left: 0.9375rem;
    padding: 12px 0 12px 0.9375rem;
    text-transform: none;
    width: 100%;
}

.productos{
    color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.1rem;
    font-family: 'frnkgothitc_bk_btbook'; 
    padding-right: 1rem;
}

.footer{
    color: #ffffff;
    color: #ffffff;
    font-size: 0.71rem;
    line-height: 0.9rem;
    font-family: 'frnkgothitc_bk_btbook'; 
    padding-top:1rem;
    letter-spacing: 0.01rem;
}

.nueve{
    max-width: 100%;
    min-height: 9rem
}

.siete{
   padding-top: 7rem
}

.row-footer{
  margin: 0 auto;
  max-width: 62.5rem;
  width: 100%;
}
/*media queries*/

// Small screens
@media only screen {

 } /* Define mobile styles */

@media only screen and (max-width: 40em) {
	.top-bar-section ul li > a {
    font-size: 0.9rem;
}
.nueve{
    max-width: 100%;
    min-height: 1rem
}
.siete{
   padding-top: 1rem
}
.footer{
    font-size: 0.6rem;
    line-height: 0.8rem;

}
.logo{
    width: 150px
}


 } /* max-width 640px, mobile-only styles, use when QAing mobile issues */

// Medium screens
@media only screen and (min-width: 40.063em) { } /* min-width 641px, medium screens */

@media only screen and (min-width: 40.063em) and (max-width: 64em) {

.top-bar-section ul li > a {
    color: #FFFFFF;
    display: block;
    font-family: 'robotoregular';
    font-size: 0.9rem;
    font-weight: normal;
    padding-left: 0.9375rem;
    padding: 12px 0 12px 0.9375rem;
    text-transform: none;
    width: 100%;
}
.sociales{
	max-width: 70%
}
 } /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */

// Large screens
@media only screen and (min-width: 64.063em) { } /* min-width 1025px, large screens */

@media only screen and (min-width: 64.063em) and (max-width: 90em) { } /* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */

// XLarge screens
@media only screen and (min-width: 90.063em) { } /* min-width 1441px, xlarge screens */

@media only screen and (min-width: 90.063em) and (max-width: 120em) { } /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */

// XXLarge screens
@media only screen and (min-width: 120.063em) { } /* min-width 1921px, xxlarge screens */