@charset "utf-8";

:root{
  --vermell:#d60000;
  --vermell-hover:#cc0000;
  --gris:#333;
  --font-v:Verdana,Arial,Helvetica,sans-serif;
  --font-a:Arial,Helvetica,sans-serif;
}

/* =========================================================
   BASE / GLOBAL
   ========================================================= */

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

a{
  color:var(--gris);
  text-decoration:none;
}

a:hover{
  color:var(--vermell);
  text-decoration:none;
}

h1{
  font-family:var(--font-a);
  color:var(--vermell);
}

h2{
  margin-bottom:10px;
  text-decoration:none;
}

/* =========================================================
   ESPAIS / CLEARS
   ========================================================= */

.espai-blanc{
  height:20px;
  clear:both;
}

.clear-blanc{
  clear:both;
}

/* =========================================================
   TEXTOS BASE
   ========================================================= */

.detall{
  font-family:var(--font-v);
  font-size:10px;
  line-height:120%;
  color:var(--gris);
  text-decoration:none;
  list-style-position:inside;
  text-align:left;
}

.detall-centre{
  font:400 9px/12px var(--font-v);
  color:var(--gris);
  text-align:center;
  vertical-align:middle;
  text-decoration:none;
}

.normal{
  font:400 12px/20px var(--font-a);
  color:var(--gris);
  text-align:left;
}

.normal-centre{
  font:400 12px/21px var(--font-a);
  color:var(--gris);
  text-align:center;
  vertical-align:middle;
  text-decoration:none;
}

.normal-REF{
  font:700 12px/18px var(--font-a);
  color:var(--gris);
  text-align:center;
  vertical-align:top;
  text-decoration:none;
}

.normal-precios{
  font:700 12px/21px var(--font-a);
  color:var(--gris);
  text-align:right;
  vertical-align:middle;
  text-decoration:none;
}

.normal-precios_vermell{
  font:700 13px/21px var(--font-a);
  color:#f00;
  text-align:right;
  vertical-align:top;
  text-decoration:none;
}

.text3{
  font:700 8pt/normal var(--font-v);
  color:#626262;
}

.centrat{
  font-weight:400;
  text-align:center;
}

.no-deco{
  text-decoration:none;
}

/* =========================================================
   FORMULARIS
   ========================================================= */

.normal_11_formulari{
  font:400 12px/19px var(--font-v);
  color:var(--gris);
  text-align:left;
  vertical-align:top;
  text-decoration:none;
  cursor:pointer;
  margin:1px;
  border:1px solid #ccc;
}

.normal_10_formulari{
  font:400 10px/15px var(--font-v);
  color:var(--gris);
  text-align:left;
  vertical-align:top;
  text-decoration:none;
  cursor:pointer;
  margin:0;
  border:1px solid #ccc;
}

/* =========================================================
   TITULARS
   ========================================================= */

.titol_1{
  font:700 14px/24px var(--font-a);
  color:var(--gris);
  text-align:left;
  vertical-align:top;
  text-decoration:none;
  cursor:pointer;
}

.titol_Producte{
  font:700 21px/25px var(--font-v);
  color:var(--vermell);
  text-align:left;
  vertical-align:top;
}

.titol_Producte_MIG{
  font:700 14px/normal var(--font-v);
  color:var(--vermell);
  text-align:center;
  vertical-align:top;
}

.titol_Producte20{
  font:700 20px/25px var(--font-v);
  color:#666;
  text-align:left;
  text-decoration:none;
}

a .titol_Producte20{
  text-decoration:none;
}

.titol_Producte28{
  font:700 28px/40px var(--font-v);
  color:#666;
  text-align:left;
  text-decoration:none;
}

.titol_Producte_28_ROIG{
  font:700 28px/38px var(--font-a);
  color:var(--vermell);
  text-align:left;
  vertical-align:top;
  text-decoration:none;
}

#titol-producte-34{
  font:700 34px/38px var(--font-a);
  color:var(--vermell);
  text-align:left;
  vertical-align:top;
  text-decoration:none;
}

.titol-Porducte10{
  font:700 15px/25px var(--font-v);
  color:#666;
  text-align:left;
  vertical-align:top;
  text-decoration:none;
}

.titol-Porducte10-centrat{
  font:700 15px/22px var(--font-v);
  color:#666;
  text-align:center;
  vertical-align:top;
  text-decoration:none;
}

.h1{
  font-family:var(--font-a);
  font-weight:700;
  text-align:left;
  color:var(--vermell);
  text-decoration:none;
  font-variant:normal;
  line-height:44px;
}

.h1_centrat{
  font-family:var(--font-a);
  font-weight:700;
  text-align:center;
  color:#f00;
  text-decoration:none;
  font-variant:normal;
  line-height:44px;
}

/* =========================================================
   TEXTOS NEGATIUS / VARIANTS
   ========================================================= */

.titol_1-Negatiu{
  font:700 12px/normal var(--font-v);
  color:#fff;
  text-align:center;
  vertical-align:middle;
}

.titol-25-Negatiu{
  font:700 x-large/normal var(--font-v);
  color:#fff;
  text-align:center;
  vertical-align:middle;
}

.titol-14-Negatiu{
  font:400 10px/24px var(--font-v);
  color:#fff;
  text-align:center;
  vertical-align:middle;
}

.detall-vermell{
  font:400 9px/15px var(--font-v);
  color:var(--vermell);
  text-align:left;
  vertical-align:top;
  text-decoration:none;
}

.detall_10_NEGATIU{
  font:700 10px/15px var(--font-v);
  color:#fff;
  text-align:center;
  vertical-align:middle;
  text-decoration:none;
}

.detall_dreta{
  font:400 9px/15px var(--font-v);
  color:#000;
  text-align:right;
  vertical-align:top;
  text-decoration:none;
}

.normal_instop_vermell{
  font:400 11px/17px var(--font-v);
  color:var(--vermell);
  text-align:left;
  text-decoration:none;
  cursor:pointer;
}

.normal-REF_lloguer{
  font:400 12px/18px var(--font-a);
  color:#f00;
  text-align:center;
  vertical-align:top;
  text-decoration:none;
}

.caixa{
  font:400 7pt/normal Verdana,Arial,sans-serif;
  color:#e6e6e6;
  text-transform:uppercase;
  cursor:default;
}

.transparencia{
  opacity:.5;
  filter:alpha(opacity=50);
}

/* =========================================================
   TEXT INSTOP
   ========================================================= */

.normal_instop_factura{
  font-family:var(--font-v);
  font-size:12px;
  text-align:left;
  color:#000;
}

.normal_instop{
  font-family:var(--font-v);
  font-size:clamp(.75rem,1.5vw,.875rem);
  line-height:1.8;
  padding:4px 6px;
  border-radius:4px;
  text-align:left;
  word-spacing:normal;
  color:#222;
  font-weight:400;
  text-decoration:none;
  font-variant:normal;
  letter-spacing:normal;
  cursor:text;
  user-select:text;
  caret-color:#007ACC;
}

.normal_instop_dreta{
  font-family:var(--font-v);
  font-size:clamp(.75rem,1.5vw,.875rem);
  line-height:1.8;
  padding:4px 6px;
  border-radius:4px;
  text-align:right;
  word-spacing:normal;
  color:#222;
  font-weight:400;
  text-decoration:none;
  font-variant:normal;
  letter-spacing:normal;
  cursor:text;
  user-select:text;
  caret-color:#007ACC;
}

.normal_instop_NEGRE{
  font-family:var(--font-v);
  font-size:clamp(.75rem,1.5vw,.875rem);
  line-height:1.8;
  padding:4px 6px;
  border-radius:4px;
  text-align:left;
  word-spacing:normal;
  color:#222;
  font-weight:700;
  text-decoration:none;
  font-variant:normal;
  letter-spacing:normal;
  cursor:text;
  user-select:text;
  caret-color:#007ACC;
}

.visto::before{
  content:"✔";
  color:red;
  display:inline-block;
  font-weight:700;
  font-size:1.1em;
  min-width:19px;
  min-height:19px;
  margin-right:6px;
  vertical-align:top;
}

/* =========================================================
   LAYOUTS DE COLUMNES
   ========================================================= */

.dos-columnes-text,
.tres3-columnes-text,
.quatre-columnes-text,
.cinc-columnes-text{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  max-width:1000px;
  margin:0 auto;
}

.dos-columnes-text .columna{
  flex:1 1 calc(50% - 20px);
  min-width:300px;
}

.tres3-columnes-text .columna{
  flex:1 1 30%;
  min-width:280px;
}

.quatre-columnes-text .columna{
  flex:1 1 calc(25% - 20px);
  min-width:250px;
}

.cinc-columnes-text .columna{
  flex:1 1 18%;
  min-width:220px;
}

/* =========================================================
   VISIBILITAT
   ========================================================= */

.nomostrar-en-mobil{
  display:block;
}

/* =========================================================
   ELEMENTS FIXOS / BOTONS
   ========================================================= */

.whatsapp-float{
  position:fixed;
  bottom:70px;
  right:10px;
  z-index:1000;
  cursor:pointer;
  transition:transform .3s ease;
}

.whatsapp-float img{
  width:60px;
  height:60px;
  border-radius:50%;
  box-shadow:none;
  background:none;
}

.whatsapp-float:hover{
  transform:scale(1.1);
}

.scrollup{
  width:40px;
  height:40px;
  opacity:.3;
  position:fixed;
  bottom:40px;
  right:300px;
  display:none;
  text-indent:-9999px;
  background:url('https://www.instop.es/ic/icon_top.png') no-repeat center center;
  background-size:contain;
  cursor:pointer;
  z-index:9999;
  transition:opacity .3s ease;
}

.scrollup:hover{
  opacity:1;
}

.scrollup:focus{
  outline:none;
}

/* =========================================================
   ALTRES
   ========================================================= */

.nom_fitxa152{
  height:34px;
}

.tipus{
  width:23%;
  float:left;
  clear:none;
  padding-right:4px;
  margin-right:9px;
}

.titol-intro{
  font-family:"Gill Sans","Gill Sans MT","Myriad Pro","DejaVu Sans Condensed",Helvetica,Arial,sans-serif;
}

.interes{
  width:80%;
  margin:0 0 0 30px;
  padding:11px;
  background:var(--vermell);
  color:#fff;
  font-family:"Gill Sans","Gill Sans MT","Myriad Pro","DejaVu Sans Condensed",Helvetica,Arial,sans-serif;
  float:left;
  bottom:0;
  top:0;
  border-radius:5px;
  -webkit-border-radius:5px;
}

button .interes{
  width:100px;
  text-align:left;
  margin:16px 28px 16px 25px;
  font-weight:400;
  font-size:medium;
}

.interes a{
  color:#fff;
  text-decoration:none;
}

.pdf{
  margin-right:20px;
  margin-top:8px;
  margin-bottom:25px;
}

.video-petit{
  margin:6px;
}

#text-cb::before{
  content:"◄ ";
}

#text-cb{
  width:80%;
  padding-top:5px;
}

/* =========================================================
   CARRET
   ========================================================= */

#divCarroPetit{
  min-height:50px;
  position:fixed;
  top:180px;
  right:20px;
}

#cart{
  float:left;
  width:192px;
  margin-left:2px;
  margin-bottom:10px;
  border:1px solid #ccc;
  background:#e6e6e6;
  border-radius:10px;
  -webkit-border-radius:10px;
}

/* =========================================================
   LLOGUER - CATEGORIES SENSE RECUADRE
   ========================================================= */

#categoria-alquiler,
#categoria-alquiler2{
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  height:auto !important;
  margin:18px 0 6px !important;
  padding:0 !important;
}

.titol-categoria{
  padding:0 !important;
  font-family:var(--font-a, Arial, Helvetica, sans-serif) !important;
  color:#111 !important;
  letter-spacing:.2px;
}

#categoria-alquiler .titol-categoria{
  font-weight:800 !important;
  font-size:18px !important;
}

#categoria-alquiler2 .titol-categoria{
  font-weight:700 !important;
  font-size:15px !important;
  color:#333 !important;
}

#categoria-alquiler .titol-categoria,
#categoria-alquiler2 .titol-categoria{
  padding-bottom:8px !important;
  border-bottom:1px solid #e6e6e6;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width:768px){
  .only-mobile{
    display:inline-flex;
  }

  #contingut,
  .contenidor-1050{
    width:100% !important;
    max-width:100% !important;
    padding:0 15px;
    box-sizing:border-box;
  }

  .intro17,
  .intro17 p,
  .normal_instop,
  .visto.normal_instop{
    max-width:100% !important;
    word-break:break-word;
  }

  .normal_instop{
    font-size:.8125rem;
    line-height:1.5;
    padding:4px 0 !important;
    box-sizing:border-box;
    word-break:break-word;
    max-width:100% !important;
  }

  .dos-columnes-text .columna,
  .tres3-columnes-text .columna,
  .quatre-columnes-text .columna,
  .cinc-columnes-text .columna{
    flex:1 1 100%;
  }

  .nomostrar-en-mobil{
    display:none !important;
  }
}

@media (max-width:480px){
  .normal_instop{
    font-size:.75rem;
    line-height:1.4;
  }

  #categoria-alquiler .titol-categoria{
    font-size:16px !important;
  }

  #categoria-alquiler2 .titol-categoria{
    font-size:14px !important;
  }
}