/* 
=======================================
==   CUSTOMIZACION DE ESTILOS.CSS    ==
=======================================
*/


/*Importación*/
@import url('https://fonts.googleapis.com/css?family=Fjalla+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Antonio:wght@200&display=swap');

 
/*Colores identidad de la web TEXTO*/
 .colordest { color: #c80000 }
 .fondo-colordest {background-color: #c80000 }
 
/*Fuente destacada*/
.fuente-destacada { font-family: 'Fjalla One', sans-serif; }
.fuente-destacada2 { font-family: 'Anton', sans-serif; }
.fuente-destacada3 { font-family: 'Quicksand', sans-serif; }


/*Separa de menu (espacio que ocupa el menu horizontalmente)*/
.separa-menu { height: 0px } /*Escritorio*/
 @media (max-width:1200px) { .separa-menu { height: 0px } }  /*Tableta / Movil*/




/*
 * Descripción:
 * Copyright (c) 2020
*/

/* ------------------------------*/


:root {
  --colordest:#c80000;
  --colorinvert:#1c1c1c;
  --main-padding: 15px;
}



/*=========================
	   Google Fonts
=========================*/

@import url('https://fonts.googleapis.com/css2?family=Fjalla+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Antonio:wght@200&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;500;700&display=swap');


/*font-family: 'Barlow Semi Condensed', sans-serif;
font-family: 'Open Sans', sans-serif;*/



/*=========================
        Generales
=========================*/

a{color: #333333;}
a:hover, a:focus {color: #000000;}/*cambia color*/
acronym, abbr {border-bottom:1px dotted #111;}

.linea {background:rgba(0,0,0,0.16);}
.linea.footer {background:rgba(255,255,255,0.06);}

.imgborde{border:1px solid rgba(0,0,0,0.15);}

hr {background: #dddddd;}

blockquote {background-color: rgba(0,0,0,0.03); border-left:2px solid #cccccc;}
.blockquote-reverse {border-right: 2px solid #cccccc;}
.blockquote-footer {color: #74788d;}
.blockquote-footer::before {content: "\2014\00A0";}

.mark, mark {background-color: #fcf8e3;}

.sombra{-webkit-box-shadow: 0px 0px 28px -2px rgba(0,0,0,0.28);	-moz-box-shadow: 0px 0px 28px -2px rgba(0,0,0,0.28); box-shadow: 0px 0px 28px -2px rgba(0,0,0,0.28);}
.sombra-texto{text-shadow: 3px 3px 7px rgba(0,0,0,0.2);}
.text-shadow{text-shadow:1px 1px 12px #000000;}

.scrolltop{color:#c50000; background:#c80000;}/*colordest*/
a.scrolltop, a:hover .scrolltop , a:focus .scrolltop {color:white;}

#dimensions {background:#000\9; background-color:rgba(0, 0, 0, 0.8); color: #fff;}

::selection { background:#c80000;  color:#fff;}/*colordest*/
::-moz-selection { background:#c80000; color:#fff;}/*colordest*/

.whatsapp-box{background:#00c144; color:white; border:1px solid white;}
a.whatsapp-box{color:white;}

.header-modal.privado{background-color:#c80000; color:white;}/*colordest*/

.header-modal.login{background-color:#000;}
.header-modal.login .cerrar-modal a{color:#fff;}
.header-modal.login + .content-modal{background-color:#000;}
.header-modal.bordetop{border-top:4px solid #c80000; padding-bottom:0px;}/*colordest*/

.page-wrapper {background-color: #e8e8e8;}

.fondo-oscuro{background-color:#1c1c1c; color:white;}
.fondo-claro{background-color:#ffffff;}

.listado-vertical{border:1px solid rgba(0,0,0,0.07); background-color:white; border-bottom: 3px solid #c80000;}/*colordest*/

.zona-avatar {background-color: var(--colordest); color: var(--white);}

.caja {border: 1px solid rgba(0,0,0,0.1); background-color: #fff;}
.caja.zonaprivada {border-top: 3px solid #c80000;}/*colordest*/

.nav-link.disabled{color:#6c757d;}
.nav-tabs{border-bottom:1px solid #dee2e6}
.nav-tabs .nav-link{border-top-left-radius:.25rem; border-top-right-radius:.25rem}
.nav-tabs .nav-link:focus,.nav-tabs .nav-link:hover{border-color:#e9ecef #e9ecef #dee2e6}
.nav-tabs .nav-link.disabled{color:#6c757d;}
.nav-tabs .nav-item.show .nav-link,.nav-tabs .nav-link.active{color:#495057; background-color:#fff; border-color:#dee2e6 #dee2e6 #fff}
.nav-pills .nav-link:hover{background-color:rgba(0,0,0,0.03)}
.nav-pills .nav-link.active,.nav-pills .show>.nav-link{color:#fff; background-color:#000}

.zona-full-tabs > .nav-tabs > .nav-item > .nav-link:focus, .zona-full-tabs > .nav-tabs > .nav-item > .nav-link:hover{border:1px solid #dee2e6; border-bottom:2px solid #dee2e6;}
.zona-full-tabs > .nav-tabs > .nav-item > .nav-link.active{color:#000; background-color:#fff; border-bottom:2px solid #000}

.nav-tabs-raya{border-bottom:2px solid #f6f6f6;}
.nav-tabs-raya .nav-item{color:#343a40;}
.nav-tabs-raya .nav-item .nav-link{background-color:transparent}
.nav-tabs-raya .nav-item .nav-link::after{background:#000;height:2px;}/*cambia color*/
.nav-tabs-raya .nav-item .nav-link.active{color:#000}/*cambia color*/

.boton:hover, .boton:focus {color: #ffffff !important;; background-color: #1c1c1c !important;}/*color hover en botones*/

.boton.default:hover{color:#333; background-color:#e6e6e6; border-color:#adadad;}

.boton.colordest, .boton.colordest:focus {background-color: #c80000!important; color: #ffffff !important;}/*colordest*/
.boton.colordest:hover, .boton.colordest:focus{color:#fff !important; background-color: #1c1c1c !important;}/*cambia color en horve*/
.boton.colordest a{color:inherit;}

.boton.invert, .boton.invert:focus{color: #ffffff; background-color: #1c1c1c;}/*invert*/
.boton.invert:hover, .boton.invert:focus {color: #ffffff; background:#c80000;}/*colordest*/
.boton.invert a{color:#fff}

a.subrayar {background-image: linear-gradient(black, black);}

a.btn-texto {color: #0c54a0;}
.btn-texto:after {content: "\203A";}

.miniform{border: 1px solid #cccccc; background: #fff; color: #666;}
.miniform::-moz-placeholder {color: #666666; opacity: 1;}
.miniform:-ms-input-placeholder {color: #666666;}
.miniform::-webkit-input-placeholder {color: #666666;}

.slidercontent {color:white; font-family: Arial, Helvetica, sans-serif;}
.slider-text {font-size:3em; font-weight:bold; color: #fff;}

.img-add{border:1px solid #dbdbdb;}
.contenido-modal.add .header-modal{background:#4cbb6c; color:white;}

.btnpop {background: #000000; color: #fff;}
.btnpop:hover, .btnpop:focus {color: #fff; background: #c80000;}/*colordest*/
.btnpop.seguir{background:#ccc; color:#222}
.btnpop.seguir:hover {color: #222; background: #ccc;}

.cerrar-modal-out{background:#f3efe1; color:#222;}

.zona-date-table {background:#f2f2f2; background:rgba(255,255,255,0.3);}

.info{color: #666; border:1px solid #dbdbdb; background:#fffdee;}

.stock.no{background:#e5352f;}
.stock.si{background:#41b849;}

p.preciocarro{color: #e53131;}
p.preciocarro span{color:#666;}

.imgcompra{border:1px solid #dbdbdb;}

.gmap iframe{border:1px solid #e7e7e7;}
#mapacontacto {border-bottom:1px solid #ccc; border-top:1px solid #ccc;}
.gm-style .gm-style-iw {background-color: white !important;}

.spinner-border {color: #000!important;}

.table {border:1px solid #ccc;}
.table th, .table td {border-top: 1px solid #ccc;}
.table th {background:#f2f2f2;  color:white;}
.table thead th {background:#404040}
.table tbody + tbody {border-top: 2px solid #ccc;}
.table .table {background-color: #ffffff;}

.table.tienda thead th{background:none; color:#666; border-bottom: 0px solid #ccc;}
.table.tienda tr {border-bottom: 1px solid #ccc;}

.table.table-condensed{border:0px;}
.table-condensed th, .table-condensed td {border-top: 1px solid #ccc;}
.table.table-condensed th {background:#404040; color:white;}
.table-bordered {border: 1px solid #dddddd;}

.share a span {color:#fff; background:#2d2d2d;}
.share a span:before {border-left: 5px solid transparent; border-right: 5px solid transparent;border-top: 5px solid #2d2d2d;}
.share a span.nomostrar {color:#fff;}

.share.rounded a{color:#ffffff;}
.share.rounded a span{color: #ffffff}
.share.rounded .facebook, .share.rounded .twitter, .share.rounded .instagram, .share.rounded .youtube{background-color: #282828;}
.share.rounded .facebook:hover, .share.rounded .twitter:hover, .share.rounded .instagram:hover, .share.rounded .youtube:hover{background-color: #c80000;}/*colordest*/

.share.mini a{color:white;}
.share.mini a span{color: #ffffff;}
.share.mini .facebook:hover, .share.mini .twitter:hover, .share.mini .instagram:hover, .share.mini .youtube:hover{background-color: #e71514;}

.facebook {background-color: #3b5998;}
.twitter {background-color: #55acee;}
.linkedin {background-color: #0077b5;}
.pinterest {background-color: #cb2027;}
.telegram{background-color:#517da2;}
.whatsapp{background-color:#00c144;}
.instagram{background-color:#eb4d4e;}
.youtube{background-color:#de2021;}

.overlay-modal {background-color:rgba(0,0,0,0.8);}

.header-modal.verde{background-color:#5cb85c; color:white !important;}
.header-modal.naranja{background-color:#f49100; color:white !important;}
.header-modal.rojo{background-color:#e41a3f; color:white !important;}

.content-modal{background:white;}
.bottom-modal{background:white;}

.boton-modal {background: #999; color: #fff;}
.boton-modal:hover, .boton-modal:focus {color: #fff; background: #666;}

.boton-modal.verde, .boton-modal.verde:focus{color: #fff !important; background: #5cb85c;}
.boton-modal.verde:hover {color: #fff !important; background: #5cb85c;}

.boton-modal.naranja, .boton-modal.naranja:focus{color: #fff !important; background: #f49100;}
.boton-modal.naranja:hover {color: #fff !important; background: #f49100;}

.boton-modal.rojo, .boton-modal.rojo:focus{color: #fff !important; background: #e41a3f;}
.boton-modal.rojo:hover {color: #fff !important; background: #e41a3f;}

.tooltip .tiptext {background-color: black; color: #fff !important; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);}
.tooltip.top .tiptext::after{border-color: #000 transparent transparent transparent;}
.tooltip.bottom .tiptext::after{border-color: transparent transparent #000 transparent;}
.tooltip.left .tiptext::after{border-color: transparent transparent transparent #000;}
.tooltip.right .tiptext::after{border-color: transparent #000 transparent transparent;}

.top-urgente {background-color: #fbb700; color:black;}
.top-urgente p {color: #000000;}
.top-urgente p a, .top-urgente p a:hover, .top-urgente p a:focus{color:black;}
.top-urgente p span {background-color: #ff3c00; color:white;}
.topurgente-close {color: black;}

#infotopbar{color: #000; background-color: #fff7dd;}
.infotopbar-close {color: #000;}





/* 
==============================
==   CONTENIDO DE LA WEB    ==
==============================
*/


/*============================
	Header
=============================*/

.fontop{background:rgba(255,255,255,0); width:100%; padding:0; color:white; position: fixed; z-index: 100; border-top: 0px solid #e39000; border-bottom: 0px solid #dbdbdb; height: 60px}
@media (max-width:1200px) { .fontop { background-color: rgba(0,0,0,0.8); height: 36px} }

.fon-secc { background-color: #ffffff }


.logotipo{max-width:232px; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; height: 100% }

/*@media (max-width:1200px) {  .logotipo { margin:0;} 
                            .logotipo img { width: 220px }}*/
@media (max-width:991px) {  .logotipo { margin:0; line-height: 3em; height: 65%} 
                            .logotipo img { width: 135px;  }}

.icos-menu { font-size: 2.3em; padding: 18px 0; visibility: hidden; display: none;  }
.icos-menu__link { color: #c0107d ; }
.icos-menu__link:link, .icos-menu__link:visited, .icos-menu__link:active, .icos-menu__link:hover { color: #e39000 ; }

@media (max-width: 991px) { .icos-menu { display: inline-block; visibility: visible; } }

.zona-menu{margin-top: 0px; float:right; } 

/*Menu desktop (eliminar si se mete el menu complejo) */ 
  .menu-desktop { line-height: 1.1em; text-align: center; vertical-align: middle}
   @media (max-width: 1200px) { .menu-desktop { margin: 6px 0 } }

  .menu-opcion  { line-height: 1em; display: inline-block; margin: 0; padding: 0px 10px;   }
  .menu-opcion.resaltado { background-color: #FC9100;  }
  .menu-opcion.resaltado:hover { background-color: #ffc926;  }
  .menu-opcion.resaltado a { color: #fff; }
  .menu-opcion a { color: #5d5d5d;   }
  .menu-opcion a:hover { color: #000 }
  .menu-opcion.login { font-size: 1em; color: #e39000 }
  .menu-opcion.login a { color: #e39000 }
  .menu-opcion:hover { background-color: none; border-bottom: 0px solid #FC9100; webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } 
  /*@media (max-width: 991px) { .menu-desktop { display: none } }*/


/*Menu movil*/
  #menumovil { display: none }

  .menu-movil {  position: fixed; top: 52px; right: 0; z-index: 2; display: block;  width:100%; padding: 0 0px;  box-shadow: -2px 0px 3px grey; border-bottom: 2px solid grey }
  .menu-opcionm { display: block; background-color: #e4e4e4; border-bottom: 1px solid #fff; }
  .menu-opcionm a { font-size: 1.2em; width: 100%; line-height: 24px; padding: 20px 20px; display: block;}
  .menu-opcionm.resaltado { background-color: #e39000; }
  @media (min-width:991px) { #menumovil{ display: none; visibility: hidden; } }



/*===========================
	Footer
===========================*/
.caja-pie { background-color: #656565; padding: 50px 0; font-size: 1em}
@media (max-width:991px) { .caja-pie{font-size: 0.9em} }

/*Ajusta web al 100% alto*/
.ajustafooter {  min-height: 100vh; position: relative; }
.ajustapie { height: 278px }

.footer { position: absolute; left: 0; bottom: 0; width: 100% }

/*Zona legal*/
.zona-legal { font-size: 0.7em; background-color: #595959; padding: 25px 15px;   }
.zona-legal a { color: #878787; }

.color-f-pie{background-color: #606060;}
.zona-abajo { color:#fff; font-size: .9em }
.desresalta { color:#b9b9b9; }



.boton.lf1 { border-radius: 25px; padding: 5px 25px }
@media (max-width:1200px)  { .boton.lf1 { padding: 0 25px } }


/*Globales*/
.colordest { color: #f71953 !important }
.destaca { border-radius: 20px; background-color: #eec050; color: #000000; padding: 0 15px; }
.resalta { color: #f71953 }
.caja-advertencia {background-color: #ededed; width: 100%}
.rayita { width: 100px; height: 3px; background-color: #f71953; margin:0 auto; }


/*Cabecera*/
.logotipo { display: inline-block; vertical-align: top; margin-right: 30px }
@media (max-width:991px) {  .logotipo { margin:0;  width: 100px}
}

.fon-cabecera { background-color: #f71953; padding: 10px 0 }
@media (max-width:1200px) { .fon-cabecera { padding-top: 0px } }



.caja-profesora { width: 100% }
.profesora { /*float:right;*/  margin-right: 30px; padding-bottom: 20px }
 @media (max-width:991px) { .profesora { float: none; margin: 0 auto; width: 165px} }

.tit1 { font-size: 3em; font-weight: bolder; color: #ffffff; line-height: 1em; text-align: left !important}
 @media (max-width:991px) { .tit1{ font-size: 2em } }


.subtit1 { font-size: 1em; color: #a5a5a5; margin-left: 10px }
 @media (max-width:600px) { .subtit1{ font-size: 1em } }

.parrafo1 { font-size: 1.4em; color: #000000; /*background-color: rgba(0,0,0,0.37);*/ }
 @media (max-width:600px) { .parrafo1{ font-size: 1.2em } }

.parrafo2 { font-size: 1.2em; color: #000000 }

.boton.lf2 { font-size: 1.4em; border-radius: 30px; padding: 4px 15px }
 @media (max-width:600px) { .boton.lf2 { font-size: 1.2em; } }

.caja-premios { background-color: #ffffff; width: 100%; padding: 3px; font-weight: bolder;  }
.caja-premios h2 { font-size: 1.2em }
 @media (max-width:600px) { .caja-premios h2 { font-size: 1em } }

.boxflota { position: absolute; width: 100%; bottom: -31px; left: 0; z-index: 2;font-weight: 700  }
.boxflota-content{ background-color: #ffffff; color: #f71953; font-size: 1.6em; display: inline-block; line-height: 1em; padding: 6px 15px; }


.caja1 { background-color: #f8f8f8; border-radius: 8px; padding: 10px 50px; width: 800px   }
.caja1.opc2 { width: 100% }
@media (max-width:1400px) { .caja1 { width: 100%; } }
@media (max-width:991px) { .caja1 { width: 100%;padding: 1px 30px 0px 30px; } }

/*=========================================
  LISTADO CON NÚMEROS DECORADOS
=========================================*/ 
ol.numbered-list > li:before {
 content: counter(li);
 position: absolute;
 box-sizing: border-box;
 width: 40px;
 height: 40px;
 background: #f3b70f;
 border-radius: 50%;

 /*Añadido por mi*/
 left: -50px;
 font-size: 25px;
 line-height: 38px;
 text-align: center;
 font-weight: bolder;
}

ol.numbered-list li {
  position: relative;
  left: 0px;
  list-style: none;
  counter-increment: li;

  /*Añadido por mi*/
  line-height: 1em;
  font-size: 1.2em;
  padding-left: 15px;
  padding-bottom: 25px;
  text-align: left;
}


@media (max-width:991px) { 
  ol.numbered-list > li:before { font-size: 15px; width: 30px; height: 30px; line-height: 32px } 
  ol.numbered-list li { font-size: 1em; line-height: 1.3em; padding-left: 0 } 


}



.fon-cuerpo { background-color: #ffffff }
.caja-tema { width: 100% }
@media (max-width:991px) { .caja-tema { width: 100% } }
.parr-tema { font-size: 1.4em; color: #000000; line-height: 1.2em;  }
@media (max-width:991px) { .parr-tema { font-size: 1.4em } }




.fon-como { background-color: #ffffff  }
.tit-sec { font-size: 1.87em; line-height: 1em; width: 100% }
@media (max-width:991px) { .tit-sec { text-align: center } }
.box-parr { background-color: rgba(255,255,255,0.3); padding: 25px; color: #000000; font-size: 1.4em; line-height: 1.5em;  }
@media (max-width:991px) { .box-parr { width: 100% } }

