style.css

@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

*{
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    box-sizing: border-box;
}

a:hover{
    text-decoration: none;
}

body{
    font-family: 'Roboto', sans-serif;
}

.bgWhite{
    background-color: #FFFFFF;
}

.bgBlue{
    background-color: #5591CD;
}

.bgGreen{
    background-color: #00A169;
}

.bgLightBlue{
    background-color: #E1F0FC;
}

.fontBlack{
    color: #3E4040;
}

.fontWhite{
    color: #FFFFFF;
}

.fontGrey{
    color: #7A7A7A;
}

.fontBlue{
    color: #5591CD;
}

.fontGreen{
    color: #00A169;
}

.regular{
    font-weight: 400;
}

.bold{
    font-weight: 600;
}

.mayuscula{
    text-transform: uppercase;
}

.linealWhiteButton{
    border: solid 2px #FFFFFF;
    color: #FFFFFF;
    padding: 0;
    font-size: 1.1em;
    height: 2.7em;
    width: 9.125em;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.linealBlueButton{
    border: solid 2px #5591CD;
    color: #5591CD;
    padding: 0;
    font-size: 1.1em;
    height: 2.7em;
    padding: 0 1.3em;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.linealBlueButton:hover{
    background-color: #E1F0FC;
    color: #5591CD;
}

.coverGreenButton{
    color: #FFFFFF;
    background-color: #00A169;
    padding: 0;
    font-size: 1.1em;
    height: 2.5em;
    padding: 0 1.3em;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
}

.coverGreenButton:hover{
    background-color: #018658;
    color: #FFFFFF;
}

.coverBlueButton{
    color: #FFFFFF;
    background-color: #5591CD;
    padding: 0;
    font-size: 1.1em;
    height: 2.5em;
    padding: 0 1.3em;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
}

.coverBlueButton:hover{
    background-color: #0b6bcb;
    color: #FFFFFF;
}

i.fas.fa-caret-right {
    margin-left: 1em;
    margin-top: .2em;
}

.titles{
    font-size: 2em;
}

.block{
    display: block;
}

.flex{
    display: flex;
}

.none{
    display: none;
}

nav.migaPan{
    width: 100%;
    margin-bottom: 2em;
    padding-top: 1em;
}

nav.migaPan ul{
    display: flex;
    font-size: .875em;
    margin: 0;
}

nav.migaPan ul li a{
    color: #3E4040;
}

nav.migaPan ul li:last-child a{
    color: #5591CD;
}

nav.migaPan ul span{
    padding: 0 .5em
}




/* Header */

header{
    width: 100%;
    z-index: 100;
    position: fixed;
    top: 0;
/*    border-bottom: solid 2px #5591CD;*/
    border-bottom: solid 1px #5591CD;
}

div.headerBox{
    padding: 1.3em 2em;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

div.headerBox .upNav{
    display: flex;
    justify-content: space-between;
}

#btnMenu{
    cursor: pointer;
    height: 1.6em;
    width: 1.6em;
    background-color: #FFFF;
    border-radius: 3px;
    border: solid 2px #5591CD;
    font-size: 1.57em;
    display: flex;
    justify-content: center;
    align-items: center;
}

.iconCloseHide{
    display: none;
}

.iconClose{
    display: block;
}

nav.supNav{
    display: none;
}

nav.hiddenSupNav{
    display: none
}

nav.supNav li{
    display: flex;
    align-items: center;
    padding: .5em
}

nav.supNav li p{
    margin-bottom: 0;
}

nav.supNav i.circulo{
    font-size: .5em;
}

img#logoHeader{
    display: block;
    width: auto;
    max-height: 2em;
}

.mainNav{
    width: 100%;
    position: fixed;
    left: -100%;
    top: 4.5em;
    transition: all ease .4s;
    z-index: 9000;
}

.hideMenu{
    left: 0;
}

nav.mainNav ul li{
    border-bottom: 1px solid #E1F0FC;
}

nav.mainNav ul li a{
    display: block;
    padding: .8em 1.3em;
    display: flex;
    justify-content: space-between;
    transition: all .2 ease;
}

nav.mainNav ul li.active a{
    color: #5591CD;
}

nav.mainNav ul li ul.subMenu{
    background-color: #F5FBFF;
    
}

.subMenu{
    display: none;
    transition: all .5s ease;
}

.subMenuView{
    display: block;
    transition: all .2s ease;
}

.submenuDownHide{
    display: none;
}

.submenuDown{
    display: block;
}




/* -Footer- */
.footerBox{
    display: flex;
    flex-direction: column;
    padding: 5em 2em 0 2em;
    justify-content: center;
    align-content: center;
    text-align: center;
}

.footerBox img{
    width: 16em;
    margin: auto;
}

.footerBox nav ul{
    margin-top: 4em
}

.footerBox nav ul li a{
    display: block;
    text-align: center;
    padding: .2em
}

.footerBox nav ul li a:hover{
    color: #C4D9F2;
}

.footerBox .footerContacto ul li{
    margin-top: 2em
}

.footerBox .copyright{
    border-top: solid 1px #ffffff;
    margin-top: 2em;
    padding: 1em
}

.topButton{
    background-color: #5591CD;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1em;
    border: 1px solid #ffffff;
    border-radius: 3px;
    width: 3.3em;
    cursor: pointer;
    position: fixed;
    bottom: 2.5em;
    right: 1em
}

.topButton:hover{
    background-color: #227cd6;
    color: #ffffff;
}








/* -Slider- */
#sliderContent{
    height: 100vh;
    overflow: hidden;
}

.sliderIndex{
        width: 100%;
    margin: auto;
    overflow: hidden;
    height: 100vh;
    z-index: -10;
    /*position: fixed;*/
    bottom: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    
}

.sliderIndex ul{
    display: flex;
    padding: 0;
    width: 2000%;
    animation: cambio 30s infinite alternate;
    animation-timing-function: ease-out;
    
}

.sliderIndex li{
    width: 500%;
    position: relative;
}

.sliderIndex img{
    width: 100%;
    height: 100vh;
    margin-left: 10%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.sliderFrame{
    /*position: relative;*/
}

.sliderInfo{
    position: absolute;
    top: 0;
    left: 0%;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: auto;
    text-align: center;
    padding: 1em;
    margin-top: 0;
}

.sliderSection{
    border-bottom: solid 2px #FFFF;
    padding: .3em;
    margin-bottom: 1em;
    font-size: 1em;
}

.sliderTitle{
    margin-bottom: 3em;
}

.sliderFigure{
    position: relative;
}

.sliderFilter{
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(85, 117, 205, 0.55)
}

.searchTop{
    display: none;
}





/* -Slider Bootstrap- */
.carousel-item {
    height: 100vh;
}

.w-100 {
    width: 100%!important;
    height: 100%;
    object-fit: cover;
}




/* -Main- */
.mainBox{
    padding: 1em 0 6em 0;
}

.contentMain{
    padding: 0 2em;
    text-align: center;
}

.slogan{
    padding: 2em 0;
    max-width: 900px;
    margin: auto;
}






/* -Home Industrias- */
ul.industriasList{
    margin-bottom: 9em;
}

li.industriasItem{
    border: solid 1px #C4D9F2;
    border-radius: 3px;
    padding: 0;
    position: relative;
    margin-bottom: 5em;
    transition: all .3s ease;
}

li.industriasItem:hover{
    box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
    transition: all .2s ease;
}

li.industriasItem>a{
    display: block;
    padding: 0;
}

figure.industriasImage{
    margin: 0;
}

figure.industriasImage img{
    width: 100%;
    margin: 0;
    padding: 0;
    display: block;
    height: 12.25em;
    object-fit: cover;
    object-position: center;
}

div.industriasInfo{
    padding: 1.5em;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

div.industriasInfo p{
    margin-bottom: 2em;
    background-color: #FFFFFF;
}

div.contentIcon{
    width: 100%;
    position: absolute;
    top: -2.15em;
}

div.industriasIcon{
    height: 4.31em;
    width: 4.31em;
    overflow: hidden;
    border-radius: 50%;
    border: 2px solid #5591CD;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
}

div.industriasIcon img{
    display: block;
    max-height: 2.9em;
}





/* -Home Productos- */
.productosItem{
    border: 1px solid #C4D9F2;
    border-radius: 3px;
    margin-bottom: 2em;
}

.productosItem:hover{
    box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
}

.cabecera{
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    flex-direction: column;
}

.cabecera h3,
.cabecera a{
    margin: auto;
}

.cabecera>a{
    order: 2;
    margin-top: 2em
}

.entryPage:hover,
.entryPage:hover i{
    color: #33699f;
}

.productosList{
    margin: auto;
    margin-top: 2.5em;
}

.cabecera .contentNews .col.mb-4.contentCard {
    margin-top: 3em;
    max-width: 100%;
}

/*.cabecera .contentNews .col.mb-4.contentCard .card {
    min-height: 100%;
    width: 96%;
}*/

a.productosCard {
    margin: 0;
}

.productosItem{
    position: relative;
}

.productosItem .logoProducto{
    width: 100%;
    position: absolute;
    top: -1em;
}

.productosItem .logoProducto img{
    background-color: #ffffff;
    max-width: 60%;
    max-height: 2em;
    display: block;
    margin: auto;
    padding: 0 .8em;
}

figure.productosImage{
    margin: 0
}

.productosImage img{
    width: 100%;
    height: 230px;
    object-fit: contain;
}

.productosInfo{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background-color: #E1F0FC;
    padding: .8em;
}

.productosIcon img{
    max-height: 2.2em;
    padding: 0 .8em;
    
}

.productosInfo h4{
    flex: 1;
    text-align: start;
    padding-left: .8em;
    font-size: 1em;
    display: flex;
    align-content: center;
    margin: 0;
    border-left: 1px #5591CD solid;
}

.productoDestacado{
    margin-top: 2em;
}

.productoDestacado a:hover{
    box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
}

.productoDestacado a{
    display: block;
    border: 1px solid #C4D9F2;
    border-radius: 3px;
    width: 100%;
    padding: 0
}

.productoDestacado figure{
    margin: 0;
    background-color: #ffffff;
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 85%);
    overflow: hidden;
    width: 100%;
}

.productoDestacado figure img{
    display: block;
    width: 100%;
    height: 22em;
    object-fit: cover;
}

.destacadoInfo{
    padding: 1em
}

.destacadoInfo h4{
    margin-bottom: 1em;
    font-size: 1.7em;
}

.destacadoInfo button{
    margin: auto;
    margin-top: 2em
}




.headPage{
    background-image: url(img/novedades/portada-novedades.jpg);
    background-size: cover;
    background-position: center;
    margin-bottom: 1em;
}

.filterPage{
    background-color: rgba(85,145,205,.5);
    min-height: 8em;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.filterSection{
    background-color: rgba(85,145,205,.5);
    padding: 4em 0;
}

.headPage h1,
.headPageIndustrias h1{
    text-align: center;
    text-transform: uppercase;
    font-weight: 600;
}

.topMargin{
    margin-top: 81.5px;
}



/* -Home Novedades- */
section.novedades{
    background-image: url(img/bg-novedades.jpg);
    background-position: center;
    background-size: cover;
}

ul.cardsNovedades {
    display: flex;
    margin-top: 3.5em;
    flex-direction: column;
    width: 100%;
    margin: auto 0;
    justify-content: center;
    align-items: center;
}

section.novedades ul.cardsNovedades li{
    padding: 1.8em 1.4em;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 22em;
    text-align: start;
    border-radius: 3px;
    transition: all .3s ease;
    width: 100%;
    max-width: 25em;
    margin: auto;
    margin-bottom: 1em
}

section.novedades ul.cardsNovedades li:hover{
    background-color: #eef7ff;
}

section.novedades ul.cardsNovedades li:hover i.fas.fa-caret-right{
    color: #028155
}

section.novedades ul.cardsNovedades li:hover h4{
    text-decoration: underline;
    transition: all .3s ease;
}

section.novedades ul.cardsNovedades li a{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

section.novedades ul.cardsNovedades li h4{
    font-size: 2em;
}

section.novedades ul.cardsNovedades li h5{
    font-size: .875em;
    border-bottom: solid 1px #5591cd;
    margin-bottom: 1.2em;
    padding: .2em 0;
    display: inline-block;
}

section.novedades ul.cardsNovedades li span{
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    
}

section.novedades ul.cardsNovedades li span i.fas.fa-caret-right{
    margin: 0;
    font-size: 2.2em
}

.novedades .entryPage:hover,
.novedades .entryPage:hover i{
    color: #E1F0FC;
}






/* -Novedades- */

.contentCard{
    padding-right: 0;
    padding-left: 0;
    display: flex;
}

.contentCard:hover.contentCard .card{
    box-shadow: 0px 0px 5px rgba(0,0,0,0.4);
}

.contentCard:hover button{
/*    color: #007e52;*/
    font-weight: 500;
}

.card{
    height: 100%;
    justify-content: flex-end;
    flex: 1;
}

.cardNews{
    text-align: start;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: space-between;
}

.cardNews h2{
    font-size: 1.2em;
    line-height: 1.4em;
}

.cardNews h3{
    font-size: .875em;
    border-bottom: solid 1px #5591cd;
    margin-bottom: 1.2em;
    display: inline-block;
    padding: .2em 0
}

.cardNews p{
    font-size: .875em
}

.cardNews button{
    border: none;
    background-color: transparent;
    font-size: .875em;
    flex: 1;
    display: flex;
    align-items: flex-end;
}

.cardNews button i.fas.fa-caret-right{
    margin-bottom: .25em;
}


.novBox .contentNews img.card-img-top {
    /* height: 32%; */
    object-fit: cover;
    height: 155px;
}


.filtroBusqueda{
    
}

.filtroBusqueda .tituloFiltro{
    font-size: 1em;
    text-align: start
}

.selectPublicacion,
.selectCategoria,
.selectIndustria{
    margin-bottom: 2em
}

.formBlue{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.formBlue label{
    width: 100%
}

.formBlue input{
    width: calc(100% - 44px);
    height: 44px;
    border: solid 1px #C4D9F2;
    padding: .5em;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.formBlue select{
    width:100%;
    height: 44px;
    border: solid 1px #C4D9F2;
    padding: .5em;
    border-radius: 3px;
}

.formBlue input::placeholder,
.formBlue select{
    color: #5591CD;
    font-size: 1em;
}

.formBlue button{
    height: 44px;
    width: 44px;
    border: none;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.filtroBusqueda .selectIndustria{
    
}

.checkbox {
    display: flex;
    position: relative;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 1em;
    text-align: start;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    
}

.selectIndustria label{
    background-color: #E1F0FC;
    color: #5591CD;
    display: flex;
    align-items: center;
    padding: .5em;
    margin-bottom: .5em;
    border-radius: 3px;
}

.selectIndustria label img{
    height: 30px;
    margin-right: .5em
}

.checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

.check {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: transparent;
    transition: all .2s ease;
}

.checkbox:hover input ~ .check {
    border: 1px solid #2489C5;
    transition: all .2s ease;
}

.checkbox input:checked ~ .check {
    background-color: rgba(0,0,150,.1);
    border:none;
}

.selectArchivo ul li a{
    font-size: .875em;
    color: #7A7A7A;
    display: block;
    text-align: left;
    padding: .1em
}

.selectArchivo ul li a:hover{
    font-weight: 600;
}


.novedadesPage .paginacion{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    order: 2;
    font-size: .875em;
}

.novedadesPage .paginacion{
    margin-top: 2em;
}

.novedadesPage .paginacion nav ul{
    margin-bottom: 2em;
}

.novedadesPage .paginacion nav ul li a {
    padding: .4em .8em;
    border: 1px solid #C4D9F2;
    border-radius: 3px;
    display: block;
    margin-right: .5em;
    color: #5591CD;
}

.novedadesPage .paginacion span{
    padding-right: 1em;
    color: #7A7A7A
}

.novedadesPage .paginacion nav ul li a.active{
    background-color: #E1F0FC;
}

.novedadesPage .paginacion nav ul li a:hover{
    border: 1px solid #5591CD;
}

.novedadesPage nav ul{
    display: flex;
}


/* -Nota- */

.pageNota{
    padding-bottom: 0;
}

.pageNota nav.migaPan{
    margin-bottom: 1.2em;
    margin-top: 1em;
}

.pageNota nav.migaPan ul li a{
    display: block;
    text-align: left;
}

.pageNota .contentNota h1{
    
}

aside.piePagNota{
    background-color: #E1F0FC;
    padding: 3em 2em;
}

aside.piePagNota p{
    max-width: 47em;
    margin: auto;
    margin-bottom: 2em;
}

.pageNota .contentMain figure img{
    height: 18.75em;
    object-fit: cover;
    object-position: center;
    width: 100%;
}

.pageNota .textoNota{
    max-width: 47em;
    margin: auto;
}

.pageNota .contentNota .encabezadoNota{
    margin-top: 2em;
}

.pageNota .contentNota h1{
    margin-top: .3em;
    margin-bottom: .5em;
}

.pageNota .contentNota h2{
    font-size: 1em;
    border-bottom: 1px solid #5591CD;
    display: inline-block;
    padding-bottom: .5em;
}

.pageNota .contentNota>div{
    margin-top: 1em;
    margin-bottom: 3em;
}

.pageNota .contentNota .textoNota{
    text-align: left;
}

.pageNota .contentNota .textoNota h3{
    font-size: 1.125em;
    margin-top: 2.5em;
    margin-bottom: 1.5em;
}

.pageNota .contentNota .textoNota figure img{
    width: 100%;
}

.pageNota .contentNota .textoNota figure figcaption{
    font-size: .875em;
    text-align: left;
    margin-top: 1em;
}

.pageNota .backPage{
    margin-bottom: 3em;
}

.pageNota .piePagNota{
    background-color: #E1F0FC;
    padding: 2em;
}

.pageNota .piePagNota p{
    font-size: .875em;
}

.pageNota .contentMain{
    flex-direction: column;
}



/* -Industria- */
.industriaPage .headPageIndustrias nav ul{
    margin: 0;
}

.industriaPage .headPageIndustrias nav ul li a{
    color: #ffffff;
    padding: 0 .7em 
}

.industriaPage .headPageIndustrias nav ul li a:hover{
    text-decoration: underline;
}

.headIndustria{
    padding-bottom: 2em;
    width: 100%;
}

.headIndustria h2,
.headIndustria p{
    max-width: 43em;
    margin: auto;
}

.headIndustria h2{
    font-size: 2.25em;
    border-bottom: solid 1px #5591CD;
    display: inline-block;
    padding-bottom: .4em;
}

.headIndustria p{
    font-size: 1em;
    margin-top: 1.5em;
    margin-bottom: 1em;
}

.contentIndustria .contentCard{
    margin-bottom: 4em!important
}

.contentIndustria .card{
    border: none;
    padding: 0 1em;
}

.contentIndustria .card .cardNews{
    padding: 0;
    align-items: center;
    text-align: center;
}

.contentIndustria .card img.card-img-top{
    height: 18.25em;
    object-fit: contain;
}

.contentIndustria .card h2.card-title{
    font-size: 1.5em;
}

.contentIndustria .card p{
    font-size: .875em
}

.contentIndustria .card button{
    font-size: 1em
}

.backPage{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 20vh
}

.backPage i{
    margin-right: 1em
}

.headPageIndustrias{
    background-image: url(img/industrias/portada-industrias.jpg);
    background-size: cover;
    background-position: center;
    margin-bottom: 1em;
}


/* -Hospitales- */
.headPageHospital{
    background-image: url(img/hospital/portada-hospital.jpg);
    background-size: cover;
    background-position: center;
    margin-bottom: 1em;
}

.hospitalesPage section div.headIndustria h2{
    border: none;
}

.hospitalesPage section div.headIndustria hr{
    border-bottom: 1px solid #5591CD;
    width: 11em;
    margin: auto;
    margin-top: .5em;
    margin-bottom: .5em
}

.hospitalesPage section div.headIndustria button{
    margin: auto;
    margin-top: 2em;
    margin-bottom: 1em;
}

.hospitalesPage .contentCard h2{
    font-size: 1.125em!important;
}



/* -Empresa- */
.headPageEmpresa{
    background-image:url(img/empresa/portada-empresa.jpg); 
    background-size: cover;
    background-position: center;
    margin-bottom: 1em;
}

.headPageEmpresa .sliderSection{
    margin-bottom: .5em;
    padding: 0;
    padding-bottom: .2em;
}


.contentEmpresa{
    max-width: 47em;
    margin: auto;
    text-align: left;
}

.contentEmpresa h2{
    font-size: 1.6em;
    margin-bottom: 1.6em;
    max-width: 27.5em;
    line-height: 1.4em;
}

.contentEmpresa hr{
    width: 7em;
    border: 1px solid #5591CD;
    margin-top: 0;
    margin-bottom: 3em;
}


.representaciones{
    margin-top: 6em;
}

.representaciones h3{
    font-size: 2.25em;
    margin-bottom: 1em;
}

.logosRepresentaciones ul{
    display: flex;
    flex-wrap: wrap;
}

.logosRepresentaciones ul li{
    padding: .2em;
    margin: 1em auto;
}

.logosRepresentaciones ul li img{
    display: block;
    max-height: 3em;
    margin: auto;
}





/* -Productos- */
.headPageProductos .filterPage{
    background-color: #ffffff;
}

.pageProductos .filtroBusqueda{
    display: block;
}

.filtroBusqueda form.busquedaProducto{
    display: block; 
}

.filtroBusqueda form.busquedaProducto label{
    display: block;
    min-width: 100%;
    font-size: 18px;
    padding: .4em 1.2em;
}

.setPaddingBottom{
    padding-bottom: 0!important;
}

.row.row-cols-1.row-cols-md-2.row-cols-xl-4.contentNews{
    margin: 0;
    max-width: 100%;
}

.pageProductos .contentCard{
    padding-left: 6px;
    padding-right: 6px;
    margin-bottom: 3em!important
}

.pageProductos .productosInfo{
    min-height: 5.18em;
}

.pageProductos .productosImage .productosIcon img{
    height: 250px;
    border-right: 0em!important
}

.pageProductos .productosInfo h4{
    font-size: 1em;
    border-left: 1px #5591CD solid;
    min-height: 3.5em;
    display: flex;
    align-items: center;
}

.pageProductos .backPage i{
    margin-left: 1em;
    margin-right: 0;
}

.pageProductos .productoDestacado{
    margin-bottom: 4em
}

.pageProductos .prodDestacado img.imgEmpresaDestacado{
   display: block;
    margin: auto;
}

.pageProductos .prodDestacado .infoProdDestacado{
    text-align: center;
}

.pageProductos .prodDestacado .infoProdDestacado .imgEmpresaDestacado{
    max-width: 10em;
    max-height: 6em;
}

.pageProductos .prodDestacado button.coverGreenButton{
    margin: auto;
}

.hiddenDest{
    display: none
}

/*1739*/


.novedadesPage .row.row-cols-1.row-cols-md-2.row-cols-xl-3.contentNews {
    width: 100%;
    margin: auto;
}

.col.mb-4.contentCard a {
    display: block;
    width: 100%;
}

.pageProductos .card
li.productosItem.card,
{
    width: 100%;
}



/* -Detalle Producto- */
.pageProdDetail article.productDetail{
    margin-bottom: 8em;
}

.pageProdDetail article.productDetail img{
    width: 100%;
}

.pageProdDetail article.productDetail hr{
    width: 60px;
    border-bottom: solid 1.5px #5591CD;
    margin: auto;
    margin-top: 1em;
    margin-bottom: 2em;
}

.pageProdDetail article.productDetail p{
    margin-bottom: 3em;
}

.pageProdDetail article.productDetail .nav-link{
    display: block;
    padding: .7rem .6rem;
    font-size: .9em;
    border: 1px solid #E1F0FC;
    border-radius: 0;
    color: #5591CD;
}

.pageProdDetail article.productDetail .active{
    background-color: #E1F0FC;
    font-weight: 600;
    color: #5591CD;
}

.pageProdDetail article.productDetail .active h4{
    margin-bottom: .5em;
}

.pageProdDetail article.productDetail .active p{
    font-weight: 400;
    color: #3E4040;
}

.pageProdDetail article.productDetail div#myTabContent{
    padding: 1.5em .5em;
    background-color: #E1F0FC;
    margin-bottom: 3em;
}

.pageProdDetail article.productDetail button{
    background-color: #5591CD;
    color: #FFFFFF;
    padding: .7em 1.2em;
    border: none;
    border-radius: 3px;
}

.pageProdDetail section.prodSimilares{
    margin-bottom: 10em;
}

.pageProdDetail section.prodSimilares h2{
    font-size: 1.5em;
    text-align: center;
    width: 100%;
}

.pageProdDetail .mainBox {
    padding-bottom: 0em;
}



/* -Contacto- */
.headPageContacto{
    background-image:url(img/contacto/portada-contacto.jpg); 
    background-size: cover;
    background-position: center;
    margin-bottom: 1em;
}

.pageContacto{
    display: flex;
    flex-direction: column;
}

.pageContacto nav.migaPan{
    width: 100%;
}

.pageContacto article.formulario{
    
}

.pageContacto aside.datosContacto{
    
}

.mainBox.pageContacto.contentMain {
    padding: 0 2em;
    text-align: left;
    padding-bottom: 5em;
}

.pageContacto article.formulario form{
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    flex-wrap: wrap;
    margin-top: 3em;
}

.pageContacto article.formulario h2{
    font-size: 1.5em;
}

.pageContacto article.formulario p{
    font-size: .875em;
}

.pageContacto article.formulario .requiredIcon{
    color: #00A169;
    font-weight: 600;
}

.pageContacto article.formulario hr{
    border-bottom: solid 1.5px #5591CD;
    width: 7em;
    margin-top: 2em;
    margin-bottom: 1em;
}

.pageContacto article.formulario .inputContacto{
    width: 100%;
}

.pageContacto article.formulario .inputContacto input,
.pageContacto article.formulario .inputContacto textarea{
    display: block;
    width: 100%;
    border: 1px solid #C4D9F2;
    background-color: #FBFBFB;
    border-radius: 3px;
    margin-bottom: 1em;
}

.pageContacto article.formulario .inputContacto input{
    min-height: 2.25em;
}

.pageContacto article.formulario .inputContacto textarea{
    min-height: 6em;
}

.pageContacto article.formulario .requiredIcon{
    color: #00A169;
}

.pageContacto article.formulario #btnEnviar button{
    width: 100%;
    background-color: #5591CD;
    border: none;
    color: #FFFFFF;
    padding: .7em 2.6em;
    border-radius: 3px;
    margin-top: 2em;
    
}

div#btnEnviar {
    margin: auto;
}

.pageContacto aside.datosContacto{
    margin-top: 5em;
}

.pageContacto aside.datosContacto h3{
    font-size: 1.2em;
}

.pageContacto aside.datosContacto ul{
    margin-top: 3em;
}

.pageContacto aside.datosContacto ul li{
    display: flex;
    margin-bottom: 1em;
}

.pageContacto aside.datosContacto ul li div{
    flex: 1;
}

.pageContacto aside.datosContacto ul li figure{
    width: 15%;
    max-width: 5em;
}

.pageContacto aside.datosContacto ul li figure img{
    width: 1.7em;
}

.pageContacto aside.datosContacto ul li h4{
    font-size: 1em;
}


.gracias{
    text-align: center;
    margin-top: 2em;
    font-size: 1.25em;
}

.resaltado{
    background-color: #C4D9F2
}

#resultados{
    padding-top: 3em;
}

#resultados h1{
    text-align: left;
    font-size: 1em;
    font-weight: 600;
}

#resultados .listadoBusqueda{
    margin-top: 3em;
}

#resultados .listadoBusqueda ul li{
    text-align: left;
    border-bottom: solid 1px #C4D9F2;
    margin-bottom: 1em;
}

#resultados .listadoBusqueda ul li h2{
    font-size: 1.5em;
    font-weight: 400;
    margin-bottom: .5em;
}

#resultados .listadoBusqueda ul li a{
    color: #3E4040;
    padding: 1.5em 0em;
    display: block;
}

#resultados .listadoBusqueda ul li p{
    margin-bottom: 0;
}

#resultados .listadoBusqueda ul li:hover{
    background-color: #E1F0FC;
}

.novedadesPage .paginacion{
    margin-top: 6em;
}


/*----Mediaquery----*/

@media(min-width:25em){
    
    .sliderInfo{
        height: 100%;
    }
    
}


@media(min-width:40em){
    
    ul.industriasList{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between
    }
    
    ul.industriasList li{
        width: 49%;
    }
    
    ul.industriasList li img{
        height: 250px
    }
    
    .cabecera .contentNews .col.mb-4.contentCard {
        margin-top: 1em;
        max-width: 49%;
    }
    
    .row.row-cols-1.row-cols-md-2.row-cols-xl-4.contentNews {
        margin: 0;
        max-width: 100%;
        display: flex;
        justify-content: space-between;
        margin-top: 3em;
    }
    
    .novedadesPage .paginacion{
        flex-direction: row;
    }
    
    .novedadesPage .paginacion nav ul{
        margin-bottom: 0;
    }
    
}



@media(min-width:49em){
    .col.mb-4.contentCard a {
        display: block;
        width: 97%;
    }     
    
    .indexPage .col.mb-4.contentCard a,
    .pageProdDetail .col.mb-4.contentCard a{
        display: block;
        width: 100%;
    } 
    
    .pageProductos .col.mb-4.contentCard a {
        display: block;
        width: 100%;
    } 
    
    .pageProdDetail article.productDetail img {
        width: 100%;
        /* max-height: 10em; */
        height: 44em;
        object-fit: contain;
    }
    
    .pageProdDetail article.productDetail .nav-link{
        font-size: 1em
    }
    
    
    
}



@media(min-width:65em){
    
    nav.migaPan{
        padding-top: 0;
    }
    
    .noveadesPage{
        
    }
    
    ul.industriasList li {
        width: 24%;
    }
    
    ul.cardsNovedades{
        flex-direction: row;
    }
    
    .filterPage{
        min-height: 9em;
    }
    
    .topMargin{
        margin-top: 136.5px;
    }
    
    img#logoHeader{
        max-height: 3em;
        transition: all .3s ease;
    }
    
    .titles{
        font-size: 3em;
    }

    div.headerBox{
        display: block;
        padding: 1.3em 2em 0 2em;
    }
    
    nav.mainNav{
        display: flex;
        justify-content: space-between;
    }
    
    nav.mainNav ul{
        display: flex;
    }
    
    nav.mainNav ul li{
        border-bottom: none;
    }
    
    nav.supNav{
        display: block;
    }
    
    nav.hiddenSupNav{
        display: none;
    }
    
    nav.supNav ul{
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    nav.mainNav ul li.active a{
        color: #5591CD;
        border-bottom: 4px solid #5591CD;
    }
    
    nav.mainNav ul li a:hover{
        background-color: #FFFFFF;
        border-bottom: 4px solid #5591CD; 
        transition: all .2s ease;
    }
    
    #btnMenu{
        display: none;
    }
    
    .fa-caret-right{
        margin-left: .4em
    }
    
    .mainNav{
        width: 100%;
        position: static;
    }
    
    nav.mainNav ul{
        margin-bottom: 0;
    }
    
    nav.mainNav ul.subMenu{
        display: none;
        position: absolute;
    }
    
    .btnSection:hover ul.subMenu{
        display: block;
        z-index: 9000;
    }
    
    .languages{
        display: none;
    }
    
    .searchTop{
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    
    .inputSearch input{
        border: none;
        border-bottom: solid 1px #5591CD;
        color: #5591CD;
    }
    
    .inputSearch input::placeholder{
        color: #5591CD;
        font-size: 1em;
    }
    
    .searchTop button{
        border: none;
        background: transparent;
        color: #5591CD;
        margin-left: 1em;
        font-size: 1.1em;
    }
    
    nav.mainNav ul li a {
        padding: 1em 0em;
        margin-right: 2em;
        border-bottom: 4px solid #FFFF;
        transition: all .2s ease;
    }
    
    nav.mainNav ul li a:hover {
        color: #5591CD;
        transition: all .4s ease;
    }
    
    nav.mainNav ul li ul.subMenu li a{
        border-bottom: solid 1px #FFFFFF;
        margin: 0;
        padding: .7em;
    }
    
    nav.mainNav ul li ul.subMenu li a:hover{
        border-bottom: solid 1px #5591CD;
    }
    
    
    
    .cabecera .contentNews{
        display: flex;
        justify-content: space-between
    }
    
    .cabecera .contentNews .contentCard{
    }
    
    .cabecera .contentNews .col.mb-4.contentCard .card {
        min-height: 100%;
        
    }
    
    .cabecera .contentNews .col.mb-4.contentCard {
        max-width: 24%;
    }



    .novedadesPage .row.row-cols-1.row-cols-md-2.row-cols-xl-3.contentNews, 
    .paginacion {
        width: 77%;
        margin: auto;
        margin-left: 0;
    }

    
    #resultados .paginacion{
        width: 100%;
        margin-top: 6em;
    }

    .listadoBusqueda ul li a{         
        padding: 2em 1em;
    }
    
    #resultados .paginacion span{
        padding-right: 0;
    }
    
    
    /* -Footer- */
    .footerBox{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-content: flex-start;
        text-align: start;
        margin: auto;
        flex-wrap: wrap
    }

    .footerBox img{
        margin: 0;
        width: auto;
        height: 6em;
    }

    .footerBox nav ul{
        margin-top: 0em
    }

    .footerBox nav ul li a{
        display: block;
        text-align: start;
        padding: .2em
    }

    .footerBox .footerContacto ul li{
        margin-top: 0
    }

    .footerBox .copyright{
        width: 100%;
        margin-top: 4em
        
    }



    
    
    
    
    
    
    
    
    /* -slider- */
    .sliderIndex ul {
        width: 400%;
    }
    
    .sliderIndex li {
        width: 100%;
    }
    
    .sliderIndex img {
        width: 100%;
        height: 100vh;
        margin-left: 0;
    }
    
    .sliderInfo{
        top: 0;
        left:0;
        height: 100%;
        width: 100vw;
        margin-top: 0;
    }
    
    .sliderSection{
        font-size: 1.3em;
    }
    
    .sliderTitle{
        font-size: 3.2em;
        max-width: 50%;
    }
    
    /*@keyframes cambio{
        0%{margin-left: -0%;}
        25%{margin-left: -0%;}

        30%{margin-left: -100%;}
        55%{margin-left: -100%;}

        60%{margin-left: -200%;}
        85%{margin-left: -200%;}

        90%{margin-left: -300%;}
        100%{margin-left: -300%;}
    }*/
    
    .linealWhiteButton {
        
    }
    
    .linealWhiteButton:hover {
        background-color: rgba(255,255,255,.2);
        color: #FFFFFF;
    }
    
    .mainBox{
        width: 100%;
        margin: auto;
        padding: 1em 0 11em 0;
    }
    
    .filterSection .mainBox{
        padding-bottom: 1em;
    }
    
    
    
    /* -Home Industrias- */
    
    ul.industriasList{
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    li.industriasItem{
        width: 48%;
    }
    
    .industriasInfo{
        min-height: 260px;
    }
    
    /* -Home Productos- */
    .productosItem{
        margin-bottom: 0;
    }
    
    .cabecera{
        align-items: baseline;
        flex-direction: row;
        flex-wrap: wrap;
    }
    
    .cabecera h3,
    .cabecera>a{
        width: 50%;
    }
    
    .cabecera h3{
        text-align: start;
    }
    
    .cabecera>a{
        text-align: end;
        order: 0;
    }
    
    .productosList{
        display: flex;
        justify-content: space-between;
    }
    
    .productosList li{
        width: 24%;
    }
    
    
    /* -Home Productos destacados- */
    .productoDestacado a{
        display: flex;
    }
    
    .productoDestacado figure{
        clip-path: polygon(20% 0%, 100% 0%, 100% 100%, 0% 100%);
        order: 1;
        min-height: 286px;
    }
    
    .productoDestacado figure img{
        width: 90%;
        height: 16em;
        object-fit: cover;
        float: right;
    }
    
    .productoDestacado figure{
        width: 60%;
    }
    
    .productoDestacado .destacadoInfo{
        width: 40%;
    }
    
    .destacadoInfo{
        padding: 2em;
        display: flex;    
        flex-direction: column;
        justify-content: space-between;    
        text-align: start
    }
    
    .destacadoInfo h4{
        font-size: 2.7em;
        margin-bottom: 0em;
    }
    
    .destacadoInfo button{
        margin: 0;
        width: 10em;
    }
    
    
    
    
    
    
    /* -Home Novedades- */
    ul.cardsNovedades {
        display: flex;
        justify-content: space-between;
    }
    
    section.novedades ul.cardsNovedades li{
        width: 32%;
        margin: 0;
    }
    
    .filterSection{
        padding: 8em 0 11em 0;
    }
    
    
    
    
    /* -Novedades- */
    .novBox{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between
    }

    .novBox div.contentNews{
        width: 77%
    }
    
    .novBox aside{
        width: 21%;
        order: 1
    }
    
    .filtroBusqueda{
        position: sticky;
        top: 10em;
    }

    
    .pageNota .contentNota h1{
        font-size: 3em;
    }
    
    
    
    /* -Empresa- */
    
    .logosRepresentaciones ul li{
        width: auto;
        display: flex;
        align-items: center;
    }

    .logosRepresentaciones ul li img {
        display: block;
        max-height: 6em;
        margin: auto;
    }
    
    .pageEmpresa .contentMain{
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        justify-content: space-between;
    }

    .pageEmpresa .contentMain .migaPan{
        width: 100%
    }
    
    .pageEmpresa .contentMain .contentEmpresa{
        width: 54%;
        margin: 0;
        text-align: left;
    }
    
    .pageEmpresa .contentMain .representaciones{
        width: 40%;
        margin: 0;
    }
    
    .pageEmpresa .contentMain .logosRepresentaciones ul li{
        max-width: 38%;
    }
    
    .pageEmpresa .contentMain .logosRepresentaciones {
        margin-top: -2em;
    }
    
    .pageEmpresa .contentMain .logosRepresentaciones ul li {
        padding: 0;
        margin: .5em auto;
    }
    
    .pageEmpresa .contentMain .logosRepresentaciones ul li img{
        max-width: 100%;
    }
    
    .contentEmpresa hr{
        margin: 0;
        margin-bottom: 3em;
    }
    
    
    .pageNota .contentMain{
        display: block;
    }
    
    
    
    
    /* -Productos- */
    .pageProductos .migaPan,
    .pageProdDetail .migaPan{
        padding-top: 1.5em;
    }
    
    .pageProductos .filtroBusqueda{
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    .filtroBusqueda form.busquedaProducto{
        display: flex; 
    }
    
    .filtroBusqueda form.busquedaProducto label{
        display: flex;
        min-width: 23%;
        min-height: 68.38px;
        margin-right: 1em;
        font-size: 18px;
        padding: .4em 1em;
        margin-bottom: 0;
    }
    
    .filtroBusqueda form.busquedaProducto label img{
        margin-right: .8em;
    }
    
    .pageProductos .filtroBusqueda .selectPublicacion input#buscarNota,
    .pageProductos .filtroBusqueda .formBlue button{
        height: 68.38px;
        margin-top: 0;
    }
    
    .pageProductos .filtroBusqueda .selectPublicacion .formBlue{
        width: 100%
    }
    
    
    .pageProductos .prodDestacado{
        display: flex
    }
    
    .pageProductos .productoDestacado{
         
    }
    
    .pageProductos .productoDestacado figure.destLeft{
        order: 0;
        clip-path: polygon(0% 0%, 100% 0%, 80% 100%, 0% 100%);
    }
    
    .hiddenDest{
        display: block;
    }
    
    .pageProductos .productoDestacado .destacadoInfo{
        text-align: center;
        width: 60%;
        display: flex
    }
    
    .pageProductos .productoDestacado .destacadoInfo button{
        margin: 0 auto
    }
    
    
    
    
    /* -Detalle Producto- */
    .pageProdDetail .productDetail{
        display: flex;
    }
    
    .pageProdDetail .productDetail figure.productCard{
        width: 50%;
    }
    
    
    .pageProdDetail .productDetail div.detailInfo{
        width: 50%;
    }
    
    .pageProdDetail article.productDetail div#myTabContent{
        padding: 1.5em 2em;
        margin-bottom: 4em;
    }
    
    .pageProdDetail article.productDetail p{
        font-size: 1.125em;
    }
    
    .pageProdDetail article.productDetail hr{
        margin: 0;
        margin-top: 1.5em;
        margin-bottom: 2em;
        border-bottom: solid .15em #5591CD; 
    }
    
     .pageProdDetail article.productDetail div#myTabContent {
        padding:2em 2.3em; 
        padding-bottom: 2.5em;
        margin-bottom: 4em;
    }
    
    
    .pageProdDetail article.productDetail .tab-pane p {
        margin: 0;
        font-size: 1em;
    }
    
    .pageProdDetail article.productDetail .detailInfo{
        text-align: left;
    }
    
    .pageProdDetail article.productDetail .nav-link{
        padding: .7rem 1.8em;
    }
    
    .pageProdDetail article.productDetail{
        margin-bottom: 10em;
    }
    
    .pageProdDetail article.productDetail h1{
        font-size: 3.4em;
        font-weight: 400;
        margin-bottom: 0;
    }
    
    .pageProdDetail article.productDetail img{
        max-height: 38em;
    }
    
    .pageProdDetail section.prodSimilares h2{
        font-size: 2.5em;  
        text-align: left;
    }
    
    .pageEmpresa{
        padding-bottom: 9em
    }
    
    
    
    
    
    /* -Contacto- */
    
    .pageContacto{
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    
    .pageContacto article.formulario{
        width: 58%;
    }

    .pageContacto aside.datosContacto{
        width: 34%;
    }
    
    .pageContacto article.formulario form{
        flex-direction: row;
    }
    
    .pageContacto article.formulario .inputContacto{
        width: 48%;
    }
    
    .pageContacto article.formulario #inputMensaje{
        width: 100%;
    }
    
    
    
    .pageContacto article.formulario #btnEnviar button:hover{
        background-color: #2b77c3;
    }

    .pageContacto aside.datosContacto{
        margin-top: 0;
    }
    
    .pageNota .mainBox{
        padding-bottom: 0;
    }
    
    .pageNota{
        padding-bottom: 0;
    }
    
}

@media(min-width: 71em){
    
    
    .card{
        min-height: 100%;
    }
    
    
    /* -Home Industrias- */
    
    ul.industriasList{
        display: flex;
        justify-content: space-between;
        margin-bottom: 5em;
    }

    li.industriasItem{
        width: 24%;
    }
    
    .industriasInfo{
        min-height: 277px;
        padding-top: .5em;
    }
    
    div.industriasInfo h4{
        max-width: 8em;
        margin: auto;
    }
    
    .productoDestacado figure{
        width: 55%;
    }
    
    .productoDestacado .destacadoInfo{
        width: 45%;
    }
    
    /* -Industria- */
    .contentIndustria .card img.card-img-top{
        height: 13.25em;
        object-fit: cover;
    } 
               
    .contentIndustria .contentCard{
        margin-bottom: 6em!important
    }
    
    .pageProdDetail article.productDetail img{
        margin-left: -20%;
    }
    
    .pageProdDetail article.productDetail .nav-tabs{
/*        margin-top: 1em;*/
    }
    
    .pageProdDetail article.productDetail .nav-tabs a{
        font-size: 1.15em;   
        padding: .5em 2em
    }
    
}

@media(min-width: 100em){
    
    .topMargin{
        margin-top: 185.5px;
    }
    
    div.headerBox{
        padding: 0;
        padding-top: 3em;
        width: 90%;
        margin: auto;
    }
    
    nav.mainNav ul li a{
        font-size: 1.4em
    }
    
    nav.mainNav ul li a.itemNav{
        font-size: 1.2em;
    }
    
    div.mainBox,
    div.footerBox{
        width: 68%;
    }
    
}