html {
  font-size: 62.5%;
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

@font-face {
  font-family: myFirstFont;
  src: url('fonts/Myriad Pro Bold.ttf');
}

@font-face {
  font-family: mySecondFont;
  src: url('fonts/Myriad Pro Regular.ttf');
}

body {
  font-family: "mySecondFont";
  font-size: 21px;
  font-weight: 400;
  line-height: 1.3;
  color: #333;
  text-align: left;
  background-color: #fff;
}

h1 { font-size: 4.5rem; color: #0051bf;line-height:1.2 }
h2 { font-size: 2.2rem; color: #0051bf }
h3 { font-size: 2rem; color: #0051bf }
h4 { font-size: 1.8rem; color: #0051bf }

body.path-buscador-de-productos div.region-content h3 {
    margin-top: 7rem;
    font-size: 4rem;
    color: #0051bf;
    margin-bottom: 2rem;
}


div.izq {
  text-align: left;
}

div.cent {
  text-align: center;
}

div.der {
  text-align: right;
}


div.feed-icons {
  display: none;
}

a.ficha {
    margin-top: 2rem;
    border-radius: 25px;
    color: #fff;
    padding: 0.5rem 2rem 0.5rem 2rem;
    display: block;
    background: #0051bf;
    text-transform: uppercase;
    transition: 0.3s;
    text-align: center;
}


a.ficha:hover {
  background: #c13a02;
}

@media (min-width:900px){
  div.fotoseccion {
  position: relative;
    margin-bottom: 1rem;
}
div.hseccion {
  text-transform: uppercase;
/*  position: absolute;*/
  top: 20%;
  left: 0;
  right: 0;
}

body.path-frontpage div.hseccion {
  position: relative;
}

div.hseccion h1 {
  font-size: 7rem;
  color: #1d1548;
  text-shadow: -10px 0px 0px #f8f8f8;
}

}




body.path-buscador-de-productos div.region-content h3:first-child {
    margin-top: 0;
}

span.counter {
  background: #0051bf;
  color: #fff;
  padding: 0.5rem;
  font-size: 3rem;
  font-weight: bold;
  border-radius: 20px;
}

span.mtitulo {
  font-size: 3rem;
  font-weight: bold;
  margin-bottom: 0;
}

p.min {
  margin-top: 0;
 font-weight: bold;
 padding-left: 4.7rem;
}

p.ptop {
  margin-bottom: 0;
}

div.catdec a {
  display: block;
    cursor: pointer;
    position: relative;
    margin: 2px 0 0 0;
    margin-top: 1rem;
    margin-left: 1rem;
    margin-right: 1rem;
    margin-bottom: 0;
    padding: .5em .5em .5em .7em;
    font-size: 100%;
    border: 1px solid #ccc;
    background: #f6f6f6;
    color: #333333;
    border-radius: 3px;

}

div.catdec a:hover {
    background: #ededed;
}

div.view-id-productos.view-display-id-block_6 div.view-content {
  padding-top: 0 !important;
}

a {
  text-decoration: none;
  color: #0051bf;
}

main a:hover {
 /* color: #c13a02;*/
}
li.facet-item:has(>a[data-drupal-facet-item-count="0"]) {
  display: none;
}

header {
  /*margin-top: 1.5rem;*/
  border-bottom: 1px dotted #eee;
}

body.path-frontpage header {
  border-bottom: 0;
}

/*ADMIN*/
body.user-logged-in div#block-jarthatari-primary-local-tasks ul {
  display: flex;
  gap: 1rem;
    margin: 1rem 0;


}

div.miadminblock {
  background: orange;
  padding: 1rem 2rem;
}

div.miadminblock, div.miadminblock a, div.miadminblock h2 {
  color: #fff;
  text-align: left !important;
}

div#block-jarthatari-tutorialesweb {
    margin-top: 2rem;
  margin-bottom: 3rem;
}

div#block-jarthatari-tutorialescomoadministrador {
  margin-top: 3rem;
  margin-bottom: 2rem;
}

div#block-jarthatari-tutorialesweb > div {
  position: relative;
}


@media (min-width: 768px){
div#block-mostoles-views-block-blog-home-block-1 h2 {
  margin-top: 0;
}

div.region.region-catalogo, div.region.region-textocatalogo {
  margin-top: 10rem;
}
}

div.up {
  position: absolute;
  top: 3rem;
  right: 3rem;
}

div.miadminblock a:hover {
  text-decoration: underline;
}

div.miadminblock h2 {
  margin-top: 0;
}

body.path-todo main {
  font-size: 1.1rem;
}

div.miadminblock ol a {
  color: #000;
}


@media (min-width: 768px){
  div.miadminblock ol {
gap: 2rem;
    display: flex;
    padding: 0;
    margin: 0;
    padding: 0 1rem;
}

}

div.miadminblock ol li {
  list-style: none;
  font-size: 1.5rem;
}

div.miadminblock ol li a:hover {
  text-decoration: underline;
}

body.user-logged-in div#block-jarthatari-primary-local-tasks ul li {
    background: #eee;
  border-radius: 10px;
    font-size: 1.6rem;
  padding: 0.3rem 1.5rem;
}

.accordionMenu{
    margin: 2rem 0;
    padding-left: 0rem;
}
.accordionMenu input[type=radio]{
    display: none;
}
.accordionMenu label{
    display: block;
    height: 25px;
    line-height: 47px;
    padding: 0 25px 0 25px;
    background: #fff;
    font-size: 14px;
    color: #fff;
    position: relative;
    cursor: pointer;
    border-bottom: 1px solid #0051bf;
}
.accordionMenu label::after{
    display: block;
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 10px;
    border-color: transparent transparent transparent #0051bf;
    position: absolute;
    left: 10px;
    top: 7px;
    z-index: 10;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition:all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}
.accordionMenu .content{
    max-height: 0;
    height: 0;
    overflow: hidden;
    -webkit-transition: all 2s ease-in-out;
    -moz-transition: all 2s ease-in-out;
    -o-transition: all 2s ease-in-out;
    transition: all 2s ease-in-out;
}
.accordionMenu .content .inner{
    text-align: left;
    padding: 0;
}

.accordionMenu .content .inner ul {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.accordionMenu label {
    margin-top: 0.5rem;
}

.accordionMenu h3 {
    margin: 0;
    line-height: 1.4;
    font-size: 2rem;
}

.accordionMenu input[type=radio]:checked + label:after{
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}
 
.accordionMenu input[type=radio]:checked + label + .content{
    max-height: 2000px;
    height: auto;
}

/* UTILIDADES */

.tdestacado, .destacado {
  background: #fcfaf5;
  margin: 10rem 0;
  padding: 3rem;
}


.tdestacado.blanco, .destacado.blanco {
  background: #fff;
}


.tdestacado.azul, .destacado.azul {
  color: #fff;
  background: #0051bf;
}

div.container90.mar50 {
  margin-top: 15rem;
}


div#block-mostoles-textocatalogo div.field--name-body {
  display: flex;
  font-weight: bold;
  font-size: 2.5rem;
  padding: 3rem;
  justify-content: center;
  align-items: center;
  text-align: center;
      width: 100%;
    min-height: 40rem;
}

img.unset {
  width: unset !important;
  max-width: 100%;
  height: auto !important;
}

div.views-field.views-field-field-imagen-infonews {
  max-width: 500px;
  margin: 0 auto;
}

div.views-field.views-field-title-1 a {
  text-align: center;
  margin: 0 auto;
}


.azul {
  background: #0051bf;
  color: #fff;
}

p.nopadb {
  margin-bottom: 0;
  padding-bottom: 0;
}

section.numeros > div {
 /* padding: 3rem; */
} 

div.azul h2, div.azul h3, div.azul h4, div.azul p, div.azul a {
  color: #fff;
}

body.page-node-type-info-news div.field--name-body h2, body.page-node-type-info-news div.field--name-body h3 {
  text-align: center;
}

.dos {
  display: grid;
  gap: 2rem;
}

.dosgrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

.dosgrid img {
  width: 100%;
  height: auto;
}

div#homeblock {
  margin: 10rem 2rem;
}
/*
.dos.misproductos div {
  height: 30rem;
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;

}
*/

div.container80 {
  max-width: 80rem;
  margin: 0 auto;
}

div.container90, body.path-info-news div.views-view-responsive-grid--horizontal {
  max-width: 90rem;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .dos {
    grid-template-columns: 1fr 1fr;
  }
  .container50 {
    max-width: 50%;
    margin: 0 auto;
  }
}

.full {
  width: 100%;
}
.tres {
  display: grid;
  gap: 2rem;
}

.dis {
  text-indent: -9999px;
  position: absolute;
}

@media (min-width: 768px) {
  .tres {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

/* div.region-content div.catimg img, div#block-mostoles-valvulasreductorespresion img {
  height: 345px;
  object-fit: cover;
}*/

div.region-content div.catimg.altura200 img {
  height: 200px;
}

div.region-content div.catimg.altura345 img {
  height: 345px;
}

div.region-content div.catimg.altura500 img {
  height: 500px;
}

div.region-content div.catimg.cover img {
  object-fit: cover;
}

div.region-content div.catimg.none img {
  object-fit: none;
}

div.region-content div.catimg.contain img {
  object-fit: contain;
}

div.region-content div.catimg.fill img {
  object-fit: fill;
}

div.catimg.osc9,
div.catimg.osc8,
div.catimg.osc7,
div.catimg.osc6,
div.catimg.osc5,
div.catimg.osc4,
div.catimg.osc3,
div.catimg.osc2,
div.catimg.osc1
 {
  position: relative;
}

div.catimg.osc9::after,
div.catimg.osc8::after,
div.catimg.osc7::after,
div.catimg.osc6::after,
div.catimg.osc5::after,
div.catimg.osc4::after,
div.catimg.osc3::after,
div.catimg.osc2::after,
div.catimg.osc1::after {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.9) 100%);
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 222;
}

div.catimg.osc8::after {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);

}
div.catimg.osc7::after {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);

}
div.catimg.osc6::after {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);

}
div.catimg.osc5::after {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);

}
div.catimg.osc4::after {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);

}
div.catimg.osc3::after {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%);

}
div.catimg.osc2::after {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);

}
div.catimg.osc1::after {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 100%);

}





.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
  border: 1px solid #0051bf;
  background-color: #0051bf;
}

div.ui-accordion-content div.views-row {
  padding-bottom: 2rem;
  border-bottom: 2px solid #ccc;
  margin-bottom: 2rem;
}

div.ui-accordion-content div.views-row:last-child {
  border-bottom: 0;
  margin-bottom: 0;
}

div.view.view-productos div.view-content {
  padding: 1rem;
}

.cuatro {
  display: grid;
  gap: 2rem;
}

div.field--name-field-productos-relacionados div.field__items {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

@media (min-width: 768px) {
  div.field--name-field-productos-relacionados div.field__items {
    grid-template-columns: 1fr 1fr 1fr;
  }
}

div.field--name-field-productos-relacionados  div.field__label {
  margin-top: 4rem;
  margin-bottom: 2rem;
  font-size: 3rem;
  font-weight: bold;
  text-align: center;
}

div.field--name-field-productos-relacionados h3 {
  text-align: center;
  font-weight: bold;
}

body.page-node-type-info-news div.region-content div.field--name-field-productos-relacionados img {
  width: 200px;
}

.dos.misproductos,.cuatro.misproductos {
  gap: 0;
}



.dos.misproductos a,.cuatro.misproductos a {
  opacity: 0.8;
  min-height: 30rem;
  flex-direction: column;
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
  text-transform: uppercase;
  transition: .4s;
  padding: 4rem;
  border: 0;

}

.dos.misproductos a:hover,.cuatro.misproductos a:hover {
  width: 100%;
  opacity: 1;
  height: 100%;
  padding: 2rem;
border: 0;


  }



.dos.misproductos span,.cuatro.misproductos span {
  display: block;
    margin: 0 auto;
    max-width: 20rem;
}


.dos.misproductos div a:hover:after,.cuatro.misproductos div a:hover:after {
    opacity: 0.8;
    transition: .3s;
}



.dos.misproductos a,.cuatro.misproductos a {
  position: relative;
}




@media (min-width: 600px) {

  .dos.misproductos a:after,.cuatro.misproductos a:after {
  content: '';
  height: 40%; //You can change this if you want smaller/bigger borders
  width: 1px;
  border: 1px solid #27314c;
  position: absolute;
  right: 0;
  top: 40%; // If you want to set a smaller height and center it, change this value

  background-color: #27314c; // The color of your border
}


.cuatro.misproductos a:last-child:after, .cuatro.misproductos a:nth-child(2):after,.cuatro.misproductos a:nth-child(4):after,.cuatro.misproductos a:nth-child(6):after {
  border: 0;
}

  .dos.misproductos a:last-child:after, .dos.misproductos a:nth-child(2):after,.dos.misproductos a:nth-child(4):after,.dos.misproductos a:nth-child(6):after {
    border: 0;
  }
  }


@media (min-width: 1000px) {



.cuatro.misproductos a:nth-child(2):after,.cuatro.misproductos a:nth-child(6):after {
  border: 1px solid #27314c;
}
  }


.misproductos img {
  padding: 4.5rem;
}






@media (min-width: 600px) {
  .dos,.cuatro {
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 1000px) {
  .cuatro {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}

/* FIN UTILIDADES */


main div.facets-widget-checkbox ul {
  list-style-type: none;
  padding-left: 0;

}

input.facets-checkbox {

  width: 15px;
  height: 15px;
  border-radius: 5px;
  border: 2px solid #27314;
  cursor: pointer;

}
input.facets-checkbox:checked {
    appearance: none;
   background: #27314c;
  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
    width: 13px;
  height: 13px;
  border-radius: 3px;


}


span.facet-item__count {
  font-size: 1.4rem;
}



.block-facets ul ul li {
  margin-left: 3rem !important;
  margin-bottom: 0.3rem;
}

li.facet-item {
  margin-bottom: 0.3rem;
}

span.facet-item__value {
  margin-left: 0.3rem;
  cursor: pointer;
}

div.region.region-header {
  display: flex;
  justify-content: center;
}

div.site-name {
  text-align: center;
}

form#views-exposed-form-buscador-de-productos-page-1 div.form--inline  {
  display: flex;
  justify-content: center;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.slick img, .slick iframe {
 width: 100%;
 height: auto;
  /*height: 580px;
  object-fit: cover;*/
}

.slick-arrow::before, .slick-arrow::after {
  color: #fff !important;
  font-size: 4rem !important;
}

main {
  min-height: 60rem;
}

main ol, main ul {
  padding-left: 1.5em;
}

main ul {
  list-style-type: disc;
}

.menu-item {
  margin: 0;
  padding-top: 0;
}

nav#block-mostoles-main-menu ul li a {
  padding-top: 0;
  padding-bottom: 0;
}

/*Strip the ul of padding and list styling*/
nav#block-mostoles-main-menu ul {
  /* list-style-type:none;
   margin:0;
   padding:0;
   position: absolute;
   z-index: 9999;*/

}
/*Create a horizontal list with spacing*/
nav#block-mostoles-main-menu li {
  display:inline-block;
  float: left;
}
/*Style for menu links*/
nav#block-mostoles-main-menu li a {
  display:block;
}
/*Hover state for top level links*/
nav#block-mostoles-main-menu li:hover a {
  /* background: #7ae6d9;*/
}
/*Style for dropdown links*/
nav#block-mostoles-main-menu li:hover ul a {
  /* background: #f3f3f3;
   color: #2f3036;
   height: 40px;
   line-height: 40px;*/
}
/*Hover state for dropdown links*/
nav#block-mostoles-main-menu li:hover ul a:hover {
  background: #27314c;
  color: #fff;
}
/*Hide dropdown links until they are needed*/
nav#block-mostoles-main-menu li ul {
  display: none;
}
/*Make dropdown links vertical*/
nav#block-mostoles-main-menu li ul li {
  display: block;
  float: none;
}
/*Prevent text wrapping*/
nav#block-mostoles-main-menu li ul li a {
  width: auto;
  min-width: 100px;
  padding: 0 20px;
}
/*Display the dropdown on hover*/
nav#block-mostoles-main-menu  li a:hover + .hidden, nav#block-mostoles-main-menu .hidden:hover {
  display: block;
}
/*Style 'show menu' label button and hide it by default*/
nav#block-mostoles-main-menu .show-menu {
  text-decoration: none;
  color: #fff;
  background: #27314c;
  text-align: center;
  padding: 0;
  height: 3.5rem;
  line-height: 3.5rem;
  font-weight: 700;
  display: none;
  margin: 0;
}
/*Hide checkbox*/
nav#block-mostoles-main-menu input[type=checkbox]{
  display: none;
}
/*Show menu when invisible checkbox is checked*/
nav#block-mostoles-main-menu input[type=checkbox]:checked ~ ul{
  display: block;
}
/*Responsive Styles*/
@media screen and (max-width : 1100px){

  nav#block-mostoles-main-menu ul, nav#block-mostoles-main-menu ul li {
    padding: 0;
    margin: 0;
  }

  nav#block-mostoles-main-menu ul li a {
    padding-top: 1rem;
    padding-bottom: 1rem;
    text-transform: uppercase;
  }

  nav#block-mostoles-main-menu, nav#block-mostoles-main-menu ul li:last-child {
    margin-bottom: 1rem;
  }



  /*Make dropdown links appear inline*/
  nav#block-mostoles-main-menu ul {
    position: static;
    display: none;
  }
  /*Create vertical spacing*/
  nav#block-mostoles-main-menu li {
  }
  /*Make all menu links full width*/
  nav#block-mostoles-main-menu ul li, nav#block-mostoles-main-menu li a {
    width: 100%;

  }

  nav#block-mostoles-main-menu li a {
    border-left: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    padding-left: 1rem;
  }

  nav#block-mostoles-main-menu {
    /* position: absolute;
     width: 93%;*/
    background: #fdfdfd ;
    z-index: 999;
  }


  body.aas-incendio nav#block-mostoles-main-menu .show-menu,  body.page-node-type-aas- nav#block-mostoles-main-menu .show-menu {
    background: #da251c;
  }
  /*Display 'show menu' link*/
  nav#block-mostoles-main-menu .show-menu {
    display:block;
  }

}

/*Responsive Styles*/
@media screen and (max-width : 768px){



  nav#block-mostoles-main-menu ul, nav#block-mostoles-main-menu ul li {
    padding: 0;
    margin: 0;
  }

  nav#block-mostoles-main-menu ul li a {
    padding-top: 1rem;
    padding-bottom: 1rem;
    text-transform: uppercase;
  }

  nav#block-mostoles-main-menu, nav#block-mostoles-main-menu ul li:last-child {
    margin-bottom: 1rem;
  }

  /*Make dropdown links appear inline*/
  nav#block-mostoles-main-menu ul {
    position: static;
    display: none;
  }
  /*Create vertical spacing*/
  nav#block-mostoles-main-menu li {
  }
  /*Make all menu links full width*/
  nav#block-mostoles-main-menu ul li, nav#block-mostoles-main-menu li a {
    width: 100%;

  }

  nav#block-mostoles-main-menu li a {
    border-left: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    padding-left: 1rem;
  }

  nav#block-mostoles-main-menu {
    /* position: absolute;
     width: 93%;*/
    background: #fdfdfd ;
    z-index: 999;
  }

}

img {
  max-width: 100%;
  height: auto;
  display: block;
}


div#block-mostoles-admostoles img {
  width: 100%;
}


/*.slick-slide img {*/
/*  width: 100%;*/
/*}*/

header > .container {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 1rem;
}

header > .container > div {
  flex: 1;
}

div#block-mostoles-site-branding {
  text-align: center;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

div#block-mostoles-site-branding a {
  margin-top: 0rem;
  display: block;
}

div#block-mostoles-site-branding img {
  width: 100px;
  height: auto;
  margin-bottom: 1rem;
}


div#block-formularioexpuestobuscador-de-productospage-1 .form-item {
  /*margin-top: 0;*/
}

div.region.region-lang {
  margin-right: 3rem;
}

input#edit-aggregated-field, inputedit-aggregated-field--2, inputedit-aggregated-field--3 {
  border: 0;
  border-bottom: 1px solid #ccc;
}

div.form-item-aggregated-field input, div.modal div.form-item-aggregated-field input:focus-visible, div.modal div.form-item-aggregated-field input:focus {
  border: 0;
  border-bottom: 1px solid #ccc;
  outline: none;
}

input#edit-submit-buscador-de-productos, input#edit-submit-buscador-de-productos--2, input#edit-submit-buscador-de-productos--3 {
  background-color: #ffffff;
  background-image: url("/themes/custom/mostoles/images/ico-lupa-sm-25.png");
  background-repeat: no-repeat;
  height: 25px;
  width: 25px;
  color: transparent;
  border: 0;
  padding: 0.4rem;
}

form.webform-submission-form {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

form.webform-submission-form .form-item, form.webform-submission-form .form-textarea-wrapper textarea {
  margin-top: 0;
  margin-bottom: 0;
}

form.webform-submission-form input, form.webform-submission-form textarea {
  border: 1px solid #fff;
  border-bottom: 2px solid #0051bf;
  margin-bottom: 3rem;
  font-size: 1.7rem;
  width: 100%;
  color: #000;
  max-width: 45rem;
  resize: none;
}

.captcha-type-challenge--math {
  width: 100%;
  max-width: 45rem;
}

form.webform-submission-form input::placeholder, form.webform-submission-form textarea::placeholder {
  color: #aaa;
  opacity: 1; /* Firefox */
  font-size: 1.3rem;
}

form.webform-submission-form input::-ms-input-placeholder, form.webform-submission-form textarea::-ms-input-placeholder {
  color: #aaa;
  opacity: 1; /* Firefox */
  font-size: 1.2rem;
}



form.webform-submission-form input:focus, form.webform-submission-form textarea:focus {
  outline: 0;
}

form.webform-submission-form input[type="submit"] {
  color: #fff;
  background: #0051bf;
  border: 2px solid #0051bf;
  border-radius: 25px;
  cursor: pointer;
  width: 35rem;
  padding: 1rem;
  transition: 0.3s;
}

form.webform-submission-form input[type="submit"]:hover {
  background: #c13a02;
  border: 2px solid #c13a02;
}

main {
  padding-bottom: 4rem;
}
div.milang {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

div#block-idioma {
  display: flex;
  justify-content: center;
}
div.mimenu {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}



div.mimenu nav ul li {
  margin-left: 1.5rem;
}

div.mimenu nav ul li a {
  background: none;
  color: #0051bf;
  font-size: 17px;
  font-family: "myFirstFont";
  text-transform: uppercase;
  position: relative;
  padding: 0;
}



nav ul.menu {
  display: flex;
  justify-content: space-between;
  align-items: center;

}

 nav {
  /*background: #eee;*/
  line-height: 3rem;
  padding: 0 1rem;
  min-height: 3rem;
  font-size: 1.2rem;
  color: #bbb;
  text-align: center;
}

div#block-mostoles-breadcrumbs nav ol {
    display: flex
;
    justify-content: right;
    padding: 1rem 0;
    margin: 0;
    flex-wrap: wrap;
    line-height: 1.5;
    font-size: 1.5rem;
}

div#block-mostoles-breadcrumbs nav ol li {
    list-style: none;
}

div#block-mostoles-breadcrumbs nav a {
   color: #111;
}

div#block-mostoles-breadcrumbs nav a:hover {
  color: #0051bf;
  text-decoration: underline;
}

div#block-mostoles-breadcrumbs nav li::before {
    content: "/\00a0";
    margin-left: 10px;
}

div#block-mostoles-breadcrumbs nav li:first-child::before {
  content: none;
}

nav.migas, nav.breadcrumb {
  background: #f3f3f3;
  color: #000;
  font-size: 1.8rem;
  text-transform: uppercase;
    padding: 1rem;
    text-align: center;
}

nav.migas a {
  color: #000;
}

nav.migas a:hover {
  color: #0051bf;
}

nav.migas h1 {
  color: #0051bf;
  display: inline;
  font-size: 1.8rem;
}

body.lang-en div.view-productos nav.migas, body.lang-en div.view-productos nav.breadcrumb{
  color: #0051bf;
    display: inline;
    font-size: 2.1rem;
    line-height: 1;
    display: flex;
    margin-left: 7px;
    justify-content: center;
}

body.lang-en div.view-productos nav.migas h1 {
 line-height: 1.6;
    margin-left: 0.5rem; 
}


nav.breadcrumb li:last-child {
  color: #0051bf;
}

div.region-content img, div.fotoseccion img {
  width: 100%;
  height: auto;
}

.container {
  width: 98%;
  max-width: 120rem;
  margin: 0 auto;
}

.container.container180 {
  max-width: 180rem;
  margin: 0 auto;
}

.container120 {
  max-width: 120rem;
  margin: 0 auto;
}

.container.container90 {
  max-width: 90rem;
  margin: 0 auto;
}

.container.container80 {
  max-width: 80rem;
  margin: 0 auto;
}

.container.container60 {
  max-width: 60rem;
  margin: 0 auto;
}

.dos, .tres, .cuatro, .cinco, .tresdos, .dostres {
  display: grid;
    grid-gap: 2rem;
    grid-template-columns: 1fr;
}

.rect img, .dos img, .tres img, .cuatro img, .cinco img, .tresdos img, .dostres img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

div.mar2 {
  margin: 2rem 0;
}

div.martop2 {
  margin: 2rem 0 0;
}

div.marbottom2 {
  margin: 0 0 2rem;
}


div.mar3 {
  margin: 3rem 0;
}

div.martop3 {
  margin: 3rem 0 0;
}

div.marbottom3 {
  margin: 0 0 3rem;
}

div.text {
  flex: 1;
    line-height: 1.2;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

div.center {
  text-align: center;
}

div.region-textoseo1 .accordion, div.region-content .accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
}

div.region-textoseo1 .panel, div.region-content .panel {
    padding: 0.3rem 1.8rem 0;
    background-color: white;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

div.region-textoseo1 .accordion:after, div.region-content .accordion:after {
    content: '\02795';
    font-size: 13px;
    color: #777;
    float: right;
    margin-left: 5px;
}

@media (min-width: 768px) {
  div.text {
    padding: 5rem;
  }
}

div.imgtext {
  position: relative;
}

div#block-mostoles-acordeon {
  margin-top: 2rem;
}

div.imgtext div.ttext {
    color: #fff;
    text-align: center;
    font-size: 3rem;
    width: 46rem;
    max-width: 100%;
    top: calc(40% - 6rem);
    left: calc(50% - 23rem);
    position: absolute;
    z-index: 999;
}

@media(min-width:768px){
  div.imgtext div.ttext {
    font-size: 5rem;
  }
  
}
div.imgtext {
  position: relative;
  }

  div.imgtext h2, div.imgtext h3, div.imgtext h4 {
    margin: 0;
    margin-bottom: 1rem;
    color: #fff;
  }

  div.imgtext p {
    color: #fff;
  }

div.imgtext::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 222;
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);

}

@media (min-width: 768px) {
  .dos {
    grid-template-columns: 1fr 1fr;
  }
  .tres {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .cuatro {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
  .cinco {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  }
  .seis {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  }
  .siete {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }
  .ocho {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }
  .tresdos {
    grid-template-columns: 3fr 2fr;
  }
  .dostres {
    grid-template-columns: 2fr 3fr;
  }
}

}

section {
  margin: 6rem 0;
}

section.newsletter {
  margin-top: 12rem;
  }

body.path-frontpage h1 {
  text-align: center;
  font-size: 3rem;
  margin-top: 12rem;
}

@media(min-width:768px) {
  body.path-frontpage h1 {
font-size: 5rem;

}
}

body.path-frontpage h2 {
  text-align: center;
  font-size: 4.5rem;

}


div.misocho {
  display: grid;
  grid-gap: 1rem;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 3rem;
}

div.block-views-blockproductos-destacados-block-1 h2 {
  font-size: 2.2rem;
  text-align: center;
}

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

div.info div.col-1 {
   flex: 1;
   line-height: 0;
  display: flex;
  justify-content: center;
  flex-direction: column;
 }

div.info div.col-1 img {
  width: 100%;
  height: auto;
}

div.info div.col-1  h2 {
  font-size: 3.8rem;
  text-align: left;
  padding-right: 4rem;
  padding-left: 4rem;
  margin-bottom: 0.5rem;
  line-height: 1;
}

div.info div.col-1  p{
  font-size: 2rem;
  line-height: 1.2;
  padding-right: 4rem;
  padding-left: 4rem;
}

div.info div.col-1  .views-field-view-node{
  padding-right: 4rem;
  padding-left: 4rem;
}

blockquote {
  border-left: 5px solid #ccc;
  font-style: italic;
  margin-left: 0;
  margin-right: 0;
  overflow: hidden;
  padding-left: 1.5em;
  padding-right: 1.5em;
}

blockquote::before {
  position: absolute;
  left: -2.5rem;
  content: open-quote;
  line-height: 1em;
}

blockquote::after {
  content: no-close-quote;
}


body.path-buscador-de-productos div.micontenido {
  display: grid;
  grid-template-columns: 2fr 6fr;
  grid-gap: 2rem;
}

div.distribuidores div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

footer {
  margin-top: 6rem;
}

footer h3, footer h4 {
  color: #fff;
}

footer img {
  max-width: 100%;
  height: auto;
}



div#block-mostoles-footer img{
  margin: 0 auto;
}

body.path-frontpage footer {
  margin-top: 0;
}

div.distribuidores p {
  font-weight: bold;
  color: #0051bf;
}

div.mifooter {
  min-height: 20rem;
  background: #0051bf;
  color: #fff;
  padding-top: 2rem;
  padding-bottom: 2rem;
}

div.mifooter p, div.mifooter a {
  color: #fff;
}

div.mifooter a:hover {
 color: #c13a02;
}

div.postfooter {
  min-height: 5rem;
  line-height: 5rem;
  background: #0051bf;
  color: #fff;
}

div.postfooter a{
  color: #fff;
}

div#block-mostoles-fotoer img {
  margin-top: 6rem;
  width: 100%;
  max-width: 100%;
  height: auto;
}

div.miblog {
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
}

div.postfooter p{
  margin-top: 0;
  margin-bottom: 0;
  text-align: center;
}
div.views-field.views-field-field-image img, div.views-field.views-field-field-imagen-catalogo img {
  border: 1px solid #000;
  transition: 0.3s;
}

div.views-field.views-field-field-image img:hover, div.views-field.views-field-field-imagen-catalogo img:hover {
  border: 1px solid #0051bf;
}

div.views-field.views-field-title span.field-content, div.views-field.views-field-field-image div.field-content a, div.views-field.views-field-title-1 span.field-content {
  text-align: center;
  font-family: myFirstFont;
  display: flex;
  /*justify-content: center;*/
  align-content: center;
  /*align-items: center;*/
  padding-top: 1rem;
  min-height: 8rem;
}

body.path-blog h1, h1 {
  text-align: center;
}

/*body.page-node-type-info-news div.region-content img,*/ body.page-node-type-article div.region-content .field--name-field-media-image img {
/*  width: 400px;
  height: auto;
  display: block;
  margin: 0 auto;
  max-width: 100%;*/
  width: 100%;

}



body.page-node-type-producto h1, h2.titac {
  text-align: left;
    line-height: 1.1;
    margin: 0rem 0 0;
    padding: 0rem;
    background: #fff;
    /*background: #eee;*/
    color: #0051bf;
}

h2.titac {
  font-size: 3.1rem;
}

h2.titac a {
  color: #0051bf;
}

a.btn {
  display: block;
    justify-content: center;
    background: #0051bf;
    color: #fff;
    max-width: 30rem;
    margin: 0 auto;
    padding: 1rem;
    text-align: center;
}

@media (min-width: 768px) {
    div.dosproducto {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }
  body.page-node-type-producto h1 {
  text-align: left;
    line-height: 1.1;
    margin: 2rem 0 0;
    padding: 4rem;
    background: #f8f8f8;
    color: #0051bf;
  }
  }
body.page-node-type-producto h2 {
font-size: 2.6rem;
    margin-top: 4rem;
    color: #0051bf;
    border-bottom: 2px solid #0051bf;
    }
        span.file--application-pdf a {
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
    color: #fff;
    padding: 0.5rem 0.5rem 0.2rem 0.5rem;
    padding-right: 6rem;
    display: block;
    background: #0051bf;
    text-transform: uppercase;
    transition: 0.3s;

    }
span.file--application-pdf a:hover {
  background:  #c13a02;
}


    div.miproducto span.file--application-pdf {
      float: right;
    }

    .breadcrumb ol {
      margin-top: 1rem;
      line-height: 1.5;
    }
body.path-blog div.views-field.views-field-title span.field-content {
  display: block;
  text-align: left;
}
/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
  .container {
    /*margin: 0 1rem;*/
  }
}

@media (min-width: 600px) {
  div.miflex {
    display: flex;
    justify-content: space-between;
  }

  .four {
    flex: 4;
    margin-left: 2rem;
  }
  .eight {
    flex: 8;
  }


}


/* Larger than tablet */
@media (min-width: 768px) {
  div.misseis {
    display: grid;
    grid-gap: 2rem;
    grid-template-columns: 1fr 1fr;
  }

  div.miproducto {
    display: grid;
    grid-gap: 6rem;
    grid-template-columns: 1fr 4fr;
  }
  body.page-node-type-producto div.field--name-body{
    padding-left: 4rem;
  }
}

/* Larger than desktop KIYO */
@media (min-width: 1000px) {
  header {
    margin-top: 0rem;
    min-height: 10rem;
    /*margin-top: 3rem;*/
  }
  header > .container {
    display: grid;
    grid-template-columns: 2fr 4fr;
    grid-gap: 1rem;
  }

  div.mimenu {
    flex-direction: row;
    height: 100px;
  align-items: center;
  justify-content: right;
  }

  div.mimenu .region.region-primary-menu {
    flex-grow: 1;
    display: flex;
    justify-content: right;
    /*margin-right: 2rem;*/
  }



  div.milang {
    justify-content: right;
    flex-direction: row;
  }

  div#block-idioma {
    display: block;
  }

  form#views-exposed-form-buscador-de-productos-page-1 div.form--inline  {
    justify-content: left;
  }

  nav#block-mostoles-main-menu li  a {
    padding-bottom: 0.7rem !important;
    background:
      linear-gradient(
        to right,
        rgba(255, 255, 255, 1),
        rgba(255, 255, 255, 1)
      ),
      linear-gradient(
        to right,
        rgba(39, 49, 76, 1),
        rgba(39, 49, 76, 1)
      );
    background-size: 100% 2px, 0 2px;
    background-position: 100% 100%, 0 100%;
    background-repeat: no-repeat;
    transition: background-size 400ms;
  }

  nav#block-mostoles-main-menu li a:hover {
    padding-bottom: 0.7rem;
    background-size: 0 2px, 100% 2px;
  }


  /* div.view-content {
     display: grid;
     grid-gap: 2rem;
      grid-template-columns: repeat(auto-fit,minmax(200px,205px));
  }*/
}



/* Larger than Desktop HD */
@media (min-width: 1200px) {
  .container {
    width: 98%;
  }
  div.misocho {
    grid-gap: 5rem;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  }

  div.missiete {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-gap: 2rem;
  }

  div.mimenu nav ul li {
    margin-left: 3rem;
  }


}

/* Larger than Desktop HD */
@media (min-width: 1600px) {
  .container {
    /*margin: 0 10rem;*/
  }
}