/*******************
* estilos para los artículos
*******************/

/*************************************/
/*             índice                */
/*************************************/

.indice{
  position: fixed;

  z-index: 999;

  left: 2vw;
  top: 7vh;

  max-width: 14vw;
  
  display: none;
}

.list-group{
  flex-wrap: wrap;
  max-width: 15vw;
  --bs-list-group-active-bg: #32659D;
  --bs-list-group-border-color: transparent;
  --bs-list-group-action-color: #32659D;
  --bs-list-group-action-active-color: #32659D;
  --bs-list-group-action-hover-color: #32659D;
  /* --bs-list-group-active-border-color: transparent; */
  
}


.lista-indice{
  list-style-type: none;

  padding-left: 0;
  padding: 1rem;

  background-color: #FFFFFF;
  box-shadow: 2px 2px 5px 1px #D2D2D2;

  border-radius: 10px;
}

.enlace-pagina, .enlace-indice{
  text-decoration: none;
}

.enlace-indice{
  color: #32659D;
  font-weight: 500;
  padding: 0.5rem;
}



.enlace{
  line-height: 20px;
  cursor: pointer;
}

.enlace:hover{
  background-position: left;
  text-decoration:none;
  
}

.link{
  color: inherit;
  
  transition: .2s ease-in;
  -webkit-transition: .2s ease-in;
  -moz-transition: .2s ease-in;
  -ms-transition: .2s ease-in;
  -o-transition: .2s ease-in;
}

.link:hover{
  color: inherit;
  
  background-color: #E6E6E6;
}


/**************************************************/
/*      flecha arriba                             */
/**************************************************/

.list-group{
  position: fixed;
}


.arriba{
  display: none;

  position: fixed;

  z-index: 1000;

  right: 50px;

  bottom: 10px;

  cursor: pointer;

}


.flecha-arriba{
  width: 40px;

  height: 40px;

  color: #238FCA;
}

/******** 1024px **************/
@media (max-width: 1366px){
  .flecha-arriba{
      display: none;
  }
}


/*******************************/
/*      derecha whatsapp       */
/*******************************/

  .derecha-whatsapp{
    
    display: none;
  }



/*********************************************/
/*         columna de la derecha             */
/*********************************************/

.columna-derecha{
  position: fixed;

  right: 5vw;
  top: 7vh;
  
  background-color: #FFFFFF;
  border-radius: 10px;
  box-shadow: 2px 2px 5px 1px #D2D2D2;

  text-align: center;

  max-width: 16vw;
  
  padding: 0.5rem;

  z-index: 1000;

  display: none;

}

.parrafo-derecha{
  margin-bottom: 0;
  padding-top: 2vh;
}

.subparrafo-derecha{
  padding-bottom: 1vh;
}

.telefono{
  color: #32659D;
  text-decoration: none;
  font-size: 1.5rem;
  font-weight: 600 !important;
}

.telefono:hover{
  color: #269BCD !important;
  
}

.boton-presupuesto{
  font-weight: 600;
  background: linear-gradient(90deg, #244881, #2A92BC);
  border-radius: 10px;
  border: none;
  color: #ffffff;
  padding: 1vh 3% !important;
  
  transition: 0.5s;
  text-decoration: none;

  box-shadow: 2px 2px 5px 1px #D2D2D2;
}

.boton-presupuesto:hover{
  
  color: #ffffff;
  text-decoration: underline;
  
}

.imagen-whatsapp{
  padding-bottom: 4px;
}

  /********* 1440px ********************/
    @media (max-width: 1440px){

      .columna-derecha{
        right: 3vw;
        
      }

      .copy{
          width: 90%;
      }     
      
      .columna-derecha .boton-presupuesto{
          font-weight: 500;
      }

    }

    /********** 1280px *************/
    @media (max-width: 1280px){
      .columna-derecha{
          display: none !important;
      }

    }


/********************************/
/*        izquierda             */
/********************************/

.izquierda{
  position: absolute;

  z-index: 1000;

  left: 2vw;
  top: 19vh;

  max-width: 15vw;

  background-color: #FFFFFF;

  border-top-left-radius: 10px;
  border-top-right-radius: 10px;

}

.fondo-azul{
  background-color: #32659D;

  padding: 1rem;

  border-radius: 10px;
}


/******************
* imágenes
******************/
.imagenes{
  width: 100%;
  margin-bottom: 2rem;
  
}

.imagen{
  width: 100%;
}

/****************
* div apartado principal
****************/
.apartado-principal{
  margin-top: 2rem;
}



/*********************
* listas
/********************/

section ul, ol{
  font-size: calc(var(--subtitulo) - 1.2rem);
  color: #1B4476;
}

.lista-check{
  list-style-image: url('/assets/img/iconos/check2-circle.svg');
  
}

.lista-mark{
  list-style-image: url('/assets/img/iconos/x-lg.svg');
}

.lista-recuadro{
  list-style-type: none;
  color: #269BCD;
}

.bi.bi-lightning-charge-fill{
  color: #FFD205;
}

.lista-parametros-baterias{
  list-style-type: none;
}

.lista li {
  margin-bottom: 2rem;
}

.lista-tiempo{
  list-style-type: none;
}

.lista-romanos{
  list-style-type: lower-greek;
}

.lista-dinero{
  list-style-image: url('/assets/img/iconos/wallet2.svg');
}

.icono-gases{
  width: 20px;
  height: 20px;
}

.row.listas{
  gap: 20px;
}

.lista-izquierda,
.lista-derecha{
  background-color: #fff;
  padding: 1rem 0;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  box-shadow: 2px 2px 5px 1px #D2D2D2;
}

.icono-enchufe{
  width: 30px;
}

.recuadro.lista-recuadro li{
  margin-bottom: 2vmin;
}

/************************
* tabla
************************/
.tabla{
  margin: 1.5rem 0;
  vertical-align: middle;
  font-size: calc(var(--subtitulo) - 1.4rem);
}

.table{
  --bs-table-striped-bg: #fff;
  color: #1B4476;
  --bs-table-striped-color: #1B4476;
  --bs-table-border-color: transparent;
}

@media (min-width: 100px){
  .imagen-tabla{
    width: 100%;
  }
}

@media (min-width: 992px){
  .imagen-tabla{
    width: 20%;
  }
}

/*************
* 2 columnas inicio
*************/

.apartados{
  margin-top: 2rem;
  gap: 40px;
}
.apartado{
  background-color: #fff;
  padding: 2rem;
  border-radius: 1rem;
  -webkit-border-radius: 1rem;
  -moz-border-radius: 1rem;
  -ms-border-radius: 1rem;
  -o-border-radius: 1rem;
  box-shadow: 2px 2px 5px 1px #D2D2D2;
}

.recuadroLink{
  color: #32659D;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -ms-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
}
.recuadroLink:hover{
  color: #32659D;
  background-color: #E6E6E6;
  
}

/*****************
* row-baterias
*****************/
.row-baterias{
  align-items: center;
}

/**************
* recuadro
**************/
.recuadro{
  background-color: #fff;
  padding: 2rem;
  border-radius: 1rem;
  -webkit-border-radius: 1rem;
  -moz-border-radius: 1rem;
  -ms-border-radius: 1rem;
  -o-border-radius: 1rem;
  margin-bottom: 2rem;
  box-shadow: 2px 2px 5px 1px #D2D2D2;
}

.recuadro p{
  margin-bottom: 0;
  color: #269BCD;
}
.recuadro p::before{
  content: '\01F4A1';
}

.cuadro{
  background-color: #fff;
  padding: 2rem;
  border-radius: 1rem;
  -webkit-border-radius: 1rem;
  -moz-border-radius: 1rem;
  -ms-border-radius: 1rem;
  -o-border-radius: 1rem;
  box-shadow: 2px 2px 5px 1px #D2D2D2;
  
}
.cuadro * {
  color: #269BCD;
}