@charset "UTF-8";
/* CSS Document */

/* Fem la web responsive :) */

/* NOMÉS MENÚ: hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 980px) {
     .topnav a:not(:first-child) {
          display: none;
     }

     .topnav a.icon {
          float: right;
          display: block;
     }

     .topnav {
          float: left;
     }

     #idioma{
          float: left;
     }
}

/* NOMÉS MENÚ: The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 980px) {
     .topnav.responsive {
          position: relative;
     }

     .topnav.responsive a.icon {
          position: absolute;
          right: 0;
          top: 0;
     }

     .topnav.responsive a {
          float: none;
          display: block;
          text-align: left;
     }
}

/* Menys de 980px */
@media (max-width: 980px){

     /* General i capçalera */
     .main{
          width: 95%;
     }

     .mainContent{
          grid-template-columns: 1fr;
     }

     .capcalera .textRM .imgA{
          min-width: 300px;
          width: 35%;
     }
	
     .colRight{
          grid-area: 1;
     }

     .colLeft{
          grid-area: 2;
     }

     .colRight .FeaturMineral{
          padding-left: 10px;
     }

     .colRight .catMinerals .linia{
          border-left: 0px;
     }

     .colRight .catMinerals .titol{
          overflow: hidden;
          padding-left: 10px;
     }

     .colRight .catMinerals .places .map{
          padding-right: 5px;
     }

     /* Columna esquerra */
     .colLeft{
          grid-template-columns: 33% 33% 33%;
     }

     /* Carret */
     .comanda{
          width: 600px;
     }

     .comanda .contenidoraCarro{
          width: 600px;
     }

     .comanda .contenidoraCarroEsp{
          width: 600px;
     }

     .comanda .contenidoraCarro textarea{
          width: 600px;
     }

     /* minerals */
     .content-gral .content-verde .mineral .interior{
          grid-template-columns: 225px auto;
     }

     .content-gral .content-verde .interior .col-img{
          margin-top: 16px;
     }

     .content-gral .content-verde .interior .col-img .duesImatges .IG2{
          display: none;
     }

     .content-gral .content-verde .mineral .interior .col-img .mes_fotos div:nth-child(1){
          display: block;
     }

     .contenidora .responsive-iframe{
          height: 100%;
     }

     .escena_A{
          display: none;
     }
     .escena_B{
          display: flex;
     }

     /* Resultats */
     .colRightR{
          margin-left: 20px;
     }

}

/* Menys de 750px */
@media (max-width: 750px){
     .colLeft{
          grid-template-columns: 50% 50%;
     }

     .colRight .FeaturMineral .dinsTop .capaTop3{
          display: none;
     }

     .catMinerals{
          display: none;
     }

     /* Darreres publicacions */
     .colRight .lastMinerals{
          height: auto;
          padding: 8px 16px 0 16px;
          width: 100%;
     }
}

/* Menys de 700px */
@media (max-width: 700px){

     /* Cos de la web */
     .colRight .titolOferta{
          width: 100%;
     }

     .colRight .FeaturMineral div .minerals{
          width: 180px;
     }

     .FeaturMineral{
          width: 400px;
     }

     .FeaturMineral .capaTop3{
          display: none;
     }

     .newsletter{
          width: 400px;
     }

     .footer{
          display: none;
     }

     /* Carret */
     .comanda{
          width: 380px;
     }

     .comanda .contenidoraCarro{
          width: 350px;
     }

     .comanda .contenidoraCarroEsp{
          width: 350px;
     }

     .comanda .contenidoraCarro textarea{
          width: 350px;
     }

     .comanda .botoEP{
          width: 370px;
     }

     .comanda .frase{
          line-height: normal;
     }

     #carret .cont-carret .carretCont .carret-registre .grup-nom{
          width: 340px;
     }

     #carret .cont-carret .preuSub{
          padding-right: 20px;
     }

     #carret .cont-carret .temps .fraseDalt{
          flex-direction: column;
     }

     #carret .cont-carret .temps .fraseDalt #cosa{
          height: 24px;
          padding: 5px 0px 5px 0px;
     }

     #carret .cont-carret .temps .fraseDalt{
          margin-bottom: 12px;
     }

     #carret .cont-carret .carretCont .carret-registre .preu{
          font-size: 16px;
     }

     #carret .cont-carret .carretCont .carret-registre .preu .preuAntic{
          font-size: 13px;
     }

     .comanda .contenidoraCarroGris{
          width: 350px;
     }

     /* minerals */
     .content-gral .content-verde .mineral .interior{
          grid-template-columns: 1fr;
     }

     .content-gral .content-verde .mineral .interior .col-img{
          align-items: flex-start;
          display: flex;
          flex-direction: row;
          justify-content: flex-start;
     }

     .content-gral .content-verde .mineral .interior .col-img .mes_fotos{
          margin-top: 0px;
     }

     /* acerca de RM */
     .mainContent .colRightn .parrafada{
          width: 410px;
     }

     .mainContent .colRightn .parrafada img{
          width: 100%;
     }

     .mainContent .colRightn .parrafada iframe{
          /* sembla que no redimensiona */
          width: 350px;
     }

     /* Contacte */
     .mainContent .colRightn .contacteDreta{
          width: 400px;
     }

     .mainContent .colRightn .contacteDreta .formulari .estruct{
          display: block;
          width: 400px;
     }

     .mainContent .colRightn .contacteDreta .formulari .estruct .input{
          width: 90%;
     }

     .mainContent .colRightn .contacteDreta .formulari .estruct .comentarios{
          width: 360px;
     }

     .mainContent .colRightn .contacteDreta .formulari .estruct .legal{
          width: 350px;
     }

}

/* Menys de 600px */
@media (max-width: 600px){
     /* General i capçalera */
     .capcalera .textRM{
          text-align: center;
     }

     .capcalera .textRM .imgA{
          margin-right: 0px;
          min-width: 250px;
          width: 35%;
     }

     .colRight .FeaturMineral .dinsTop .minerals img{
          height: 180px;
          width: 180px;
     }

     .content-gral .content-verde .mineral .interior .col-detalle .sota{
          align-items: flex-start;
          display: flex;
          flex-direction: column;
          justify-content: flex-start;
     }

     /* Darrers minerals */
     .colRight .lastMinerals{
          grid-template-columns: 1fr;
     }

     .colRight .lastMinerals .img{
          display: none;
     }
}

@media (max-width: 520px){
     .colRight .FeaturMineral .dinsTop .capaTop2{
          display: none;
     }

     .content-gral .content-verde .mineral .interior .col-img{
          align-items: flex-start;
          display: flex;
          flex-direction: column;
          justify-content: flex-start;
     }

     .content-gral .content-verde .mineral .interior .col-img .mes_fotos{
          margin-top: 6px;
     }

     .content-gral .breadc{
          grid-template-columns: 1fr;
     
     }
     
     .content-gral .breadc .ruta{
          grid-row: 2;
          padding-top: 6px;
     }
     
     .content-gral .breadc .cap{
          grid-row: 1;
          padding-top: 6px;
     }
}

@media (max-width: 490px){
     .colLeft{
          grid-template-columns: 1fr;
     }
}