
.logo_sitio {

width: 50%; 
height: auto; 
}

.fondo_adaptable {

   width: 62%;

  background-size: contain;  /* contain hace alinear perfectamente el fondo con la imagen */
background-repeat: repeat-x;

}

.logo_sitio:hover {

//border: 1px solid #cccccc;
border-radius: 5px;
padding: 0px;

cursor: pointer;

filter: grayscale(70%);

box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.12);

}


.imagen_adaptable{
 width: 60%;
  
}
.imagen_adaptable_shopping {
 width: 100%;
  
}

.imagen_adaptable_comprar{
 width: 90%;
  
}



.icono_telegram_whatsapp {

border-radius: 7px;
width: 90%;
}

.icono_telegram_whatsapp:hover {

//border: 1px solid #cccccc;
border-radius: 7px;
padding: 0px;

cursor: pointer;

filter: grayscale(100%);

box-shadow: 0px 0px 12px 1px rgba(0,0,0,0.12);

}







/*----------------- style para formularios -----------*/

* {
  box-sizing: border-box;
}

input[type=text], select, textarea {
  width: 100%;
  padding: 8px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  resize: vertical;
}

input[type=password], select, textarea {
  width: 100%;
  padding: 8px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  resize: vertical;
background-color: white;
}




label {
  padding: 12px 12px 12px 0;
  display: inline-block;
}



.text_field{
font-family: arial;
font-size: 10pt;
 width: 100%;
  padding: 8px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  resize: vertical;
  background-color:#FFFFFF;
}

.text_field:hover{

 background-color: #f2f2f2;
}



.boton_submit_search_go {
  background-color: #4CAF50;
  color: white;
  padding: 8px 8px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
font-weight: bold;
font-family: arial;
font-size: 10pt;
float: left;
margin-left:5px;
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
}


.boton_precio {
      //font-size:0.575em;
font-family: arial;
font-size:2.8vw;
font-weight: bold;
      display:block;
      //left:-60px;
      margin-top:20px;
      margin-bottom:20px;
      width:30%;

      background-color: #4CAF50;
      color: white;
      padding: 8px 8px; 
      border: none;
      border-radius: 5px;
      cursor: pointer;

float: left;
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);


    }





/*----------- Hover submit & button --------*/

input[type=submit]:hover {

  background-color: #FF0000;

box-shadow: none;

}

input[type=submit]:active {

  background-color: #818EA9;

filter: drop-shadow(4px 4px 10px white);

}

input[type=button]:hover {

  background-color: #FF0000;

box-shadow: none;

}

input[type=button]:active {

  background-color: #818EA9;

filter: drop-shadow(4px 4px 10px white);

}







/*----------------- Items Listado Items home --------------*/

.tabla_ordenar_resultados{

font-weight: none;
font-family: arial;
font-size: 8pt;
background-color: #F4F6F8;

}


.fondo_gris_shopping{
BACKGROUND-COLOR: #F4F6F8;
TEXT-ALIGN: left;
COLOR: #000000; 
FONT-FAMILY: verdana; 
FONT-SIZE: 11; 
HEIGHT: 25px;
}

.fondo_gris_tablas{
BACKGROUND-COLOR: #F4F6F8;
TEXT-ALIGN: center;
COLOR: #000000; 
FONT-FAMILY: verdana; 
FONT-SIZE: 11; 
HEIGHT: 25px;
}

.Items_listado{

COLOR: #000000; 
FONT-FAMILY: arial; 
FONT-SIZE: 13; 
HEIGHT: 30px;
text-decortion: none;
}

.Items_listado a {

COLOR: #000000; 
FONT-FAMILY: arial; 
FONT-SIZE: 13; 
HEIGHT: 30px;

}


.Items_listado a:hover:not(.active) {
 
 COLOR: #FF0000;
text-decoration: none;

}
.Items_listado a {
 
 COLOR: #000000;
text-decoration: none;

}



/*---------------- paging ---------------*/

.paging_td{

  font-family: arial;
  font-size: 10pt;
  padding: 10px;
}


.pagination {
  display: inline-block;
  font-family: arial;
 

}


.pagination a {
 
  color: white;
  
  float: left;
  padding: 5px 8px;
  text-decoration: none;
  //border: 1px solid #ddd;
background-color: #ddd;

}

.pagination a.active {

  color: white;
  background-color: grey;

  //border: 1px solid #4CAF50;
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
}

.pagination a:hover:not(.active) {
 
 background-color: red;
}

.pagination a:first-child {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
background-color: #4CAF50;
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
}

.pagination a:last-child {
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  background-color: #4CAF50;
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
}


/*--------------- footer titles  -----------*/

.footer{

COLOR: #787878; 
FONT-FAMILY: arial; 
FONT-SIZE: 13px; 
text-align: center;


}

.footer_titles{

color: #0078D7;
//color: #ff7800;
//color:#048259;

width: 85%;
font-family: sans-serif; 
font-size: calc(1.7vw + 1.5vh + 1.5vmin);
text-align: left;
FONT-WEIGHT: bold;
//border: 1px solid #ddd;
//border-radius: 5px;
//background-color: #4CAF50;
text-shadow:2px 1px 1px white,2px 2px 5px #c6c6c6;

}


.cartegorias_footer{

border: 1px solid #ddd;
border-radius: 5px;
padding: 15px;
color: black;

font-family: sans-serif; 
font-size: 0.8em;
text-align: left;
//FONT-WEIGHT: bold;

text-decoration: none;
}


.cartegorias_footer a {

color: #787878;

padding: 5px 8px;
  text-decoration: none;

}


.cartegorias_footer a:hover:not(.active) {

color: white;
background-color: red;
border-radius: 5px;

}


.paginas_contenido_footer{

border: 1px solid #ddd;
border-radius: 5px;
padding: 15px;
color: black;

font-family: sans-serif; 
font-size: 0.8em;
text-align: left;
//FONT-WEIGHT: bold;

text-decoration: none;
}


.paginas_contenido_footer a {

color: #787878;

padding: 5px 8px;
  text-decoration: none;

}


.paginas_contenido_footer a:hover:not(.active) {

color: white;
background-color: black;
border-radius: 5px;

}


.website_footer_links{

//border: 1px solid #ddd;
//border-radius: 5px;
padding: 15px;
color: black;

font-family: sans-serif; 
font-size: 0.8em;
text-align: left;
//FONT-WEIGHT: bold;

text-decoration: none;
}

.website_footer_links a{

color: #787878;

padding: 5px 8px;
  text-decoration: none;

}

.website_footer_links a:hover:not(.active){

color: white;
background-color: black;
border-radius: 5px;
}





/*--------------------- comprar ----------------*/

.comprar_titulo {
width: 95%;
border: 0px solid #ddd;
border-radius: 5px;

margin:auto;
margin-top: 20px;
margin-bottom: 20px;

font-family: arial;
font-weight: bold;

font-size: calc(0.60rem + 2vw);

text-align: center;

text-shadow:1px 1px 1px white,2px 2px 6px #929292;
}



.tabla_descripcion {
//border: 1px solid #cccccc;
width: 90%; 
margin:auto;
margin-top: 20px;
margin-bottom: 20px;
}


.imagen_adaptiva_comprar {

width: 100%; 
height: auto;

}


.cross_selling_title{
color: black;//#ff7800;//#048259;
width: 85%;
font-family: sans-serif; 
font-size: calc(1.7vw + 2vh + 2vmin);
text-align: left;
FONT-WEIGHT: bold;
//border: 1px solid #ddd;
//border-radius: 5px;
//background-color: #4CAF50;
text-shadow:2px 1px 1px white,2px 2px 5px #929292;
}

.cross_selling{

font-family: sans-serif; 
font-size: 0.8em;
text-align: left;

}

.cross_selling a {
 
  color: white;
  
  float: left;
  padding: 5px 8px;
  text-decoration: none;
  //border: 1px solid #ddd;
border-radius: 5px;
  background-color: #4CAF50;

}



.cross_selling a:hover:not(.active) {
 
 background-color: red;
}


.categoria_titulo {
width: 95%;
height: 50px;
border: 0px solid #ddd;
border-radius: 5px;

margin:auto;
margin-top: 20px;
margin-bottom: 20px;

font-family: arial;
font-weight: bold;

font-size: calc(0.60rem + 2vw);

text-align: center;

text-shadow:1px 1px 1px white,2px 2px 6px #929292;
}


.pagina_contenido_titulo {
width: 95%;
height: 50px;
border: 0px solid #ddd;
border-radius: 5px;

margin:auto;
margin-top: 20px;
margin-bottom: 20px;

font-family: arial;
font-weight: bold;

font-size: calc(0.60rem + 2vw);

text-align: center;

text-shadow:1px 1px 1px white,2px 2px 6px #929292;
}


.boton_buscador_categoria {
  background-color: #4CAF50;
  color: white;
  padding: 6px 6px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
float: left;
font-weight: bold;
font-family: arial;
font-size: 12pt;
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
}



.resultado_alert_type{

COLOR: #000000; 
FONT-FAMILY: verdana; 
FONT-SIZE: 30; 
FONT-WEIGHT: bold;

text-shadow:1px 1px 1px white,2px 3px 5px #929292;

}


.resultado_msg_type{

COLOR: #000000; 
FONT-FAMILY: verdana; 
FONT-SIZE: 12; 
FONT-WEIGHT: none;

text-decoration : none;

}

.boton_submit_volver_resultado {
  background-color: #4CAF50;
  color: white;
  padding: 8px 20px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
float: center;
font-weight: bold;
font-family: arial;
font-size: 15pt;
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
}


/*--------------------- Logo sitio en texto y css ----------------*/

.marca_registrada_logo{
//color:white;
font-family: arial;
font-size: clamp(1rem, 2vw, 10rem);
font-weight:bold;
vertical-align: top;
}

.tabla_format{
font-size: clamp(1rem, 5vw, 30rem);
//font-size:3.8vw;
font-family: arial;
padding: 10px;
//background-color: #0078D7;
//background: #f08410;
//background: #0078d7;
//background: #188c0f;
background: #3985EC;
width: 100%;
height: auto; 
//border-radius: 7px 7px 0 0;
//box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.2);
}

.link{
color: rgba(0, 0, 0, 0.11);

font-weight: bold;
text-decoration: none;
text-shadow: 1px 2px 0px #FFFFFF;
cursor: pointer;



}

.link:hover{
color: yellow;

text-shadow: none;
padding-left: 1px;

}


.slogan{

color: #E3E3E3;
font-family: arial;
font-size: clamp(1rem, 2vw, 2rem);
//font-size:1.2vw;
font-weight: none;

}

.com-ar{
width:37%;

color: white;
font-family: arial;
font-size:1.9vw;
padding-bottom: 10px;
text-align: right;
vertical-align: top;
//border: 1px solid black;

}



/*--------------------- Home page contenidos ----------------*/



.texto_grande {
font-family:arial;
font-size: clamp(1rem, 4vw, 5rem);
font-weight:bold;
//color: #188c0f;
//color:#44ADE6;
color: #3985EC;
text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
//text-shadow: 0px 0px 10px 1px rgba(0,0,0,0.2);
}

.texto_gris_subtitulo_mediano{
font-family:arial;
font-size: clamp(1rem, 3vw, 5rem);
color: #393939;
}

.texto_gris_titulos{
font-family:arial;
font-size: clamp(1rem, 2vw, 4rem);
color: #393939;
}

.tabla_contenido_home_format{

color: #393939;
font-family:arial;
font-size: clamp(1rem, 1.5vw, 4rem);
width: 90%;
padding-left:10%;
border: 0px solid black;

}


.imagen_adaptable_cuerpo_contenido {

width: 50%; 
height: auto; 
border-radius: 50%;
filter: drop-shadow(grey 1rem 1rem 10px)
}

.imagen-flotante {
  float: left; /* Cambia a 'right' si quieres que esté a la derecha */
  margin-right: 15px; /* Espacio entre la imagen y el texto */
  margin-bottom: 10px;
  width: 200px; /* Ajusta el tamaño de tu imagen */
}


.imagen-circular {
  width: 50%; 
height: auto; 
  border-radius: 50%;
  float: left; /* Envía la imagen a un lado y permite que el texto fluya */
  shape-outside: circle(50%); /* Hace que el texto siga el contorno circular */
  margin-right: 15px; /* Separa el texto de la imagen */
  margin-bottom: 10px;
  object-fit: cover; /* Evita que la imagen se deforme */

filter: drop-shadow(grey 1rem 1rem 10px)
}
























