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


.espOferta {
  background: #333;
  background: linear-gradient(to bottom,  #fefcea 0%,#f1da36 100%);

  height: 300px;
  position: relative;
  width: 300px;
}

.espOferta:before {
  background: #fff;
  border-radius: 50%;
  box-shadow: 
    300px 0 0 0 #fff, 
    0 300px 0 0 #fff, 
    300px 300px 0 0 #fff,
    0 40px 0 -20px #fff,
    0 60px 0 -20px #fff,
    0 80px 0 -20px #fff,
    0 100px 0 -20px #fff,
    0 120px 0 -20px #fff,
    0 140px 0 -20px #fff,
    0 160px 0 -20px #fff,
    0 180px 0 -20px #fff,
    0 200px 0 -20px #fff,
    0 220px 0 -20px #fff,
    0 240px 0 -20px #fff,
    0 260px 0 -20px #fff,
    300px 40px 0 -20px #fff,
    300px 60px 0 -20px #fff,
    300px 80px 0 -20px #fff,
    300px 100px 0 -20px #fff,
    300px 120px 0 -20px #fff,
    300px 140px 0 -20px #fff,
    300px 160px 0 -20px #fff,
    300px 180px 0 -20px #fff,
    300px 200px 0 -20px #fff,
    300px 220px 0 -20px #fff,
    300px 240px 0 -20px #fff,
    300px 260px 0 -20px #fff;
  content: "";
  display: block;
  height: 50px;
  left: -25px;
  position: absolute;
  top: -25px;
  width: 50px;
}




.ribbon {  
  width:    110px;
  height:   110px;
  display:  block;
  position: absolute;
  overflow: hidden;
  right:    0px;
  top:      0px;
}

.ribbon span {
  width: 150px;
  height: 34px;
  top: 20px;
  right: -40px;
  position: absolute;
  display: block;
  background: #FF0000;  
  font-family: arial narrow;
  font-size: 14px;
  color:white;
  text-align: center;
  line-height: 34px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
}


.discount {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
  box-shadow: 0 14px 28px rgb(0 0 0 / 25%), 0 10px 10px rgb(0 0 0 / 22%);
  background: #f2ff6d;
  margin-top: 15px;
  position: relative;
  display: inline-block;
  
  width: auto;
  height: 30px;
  line-height: 32px;
  font-size: 16px;
  font-weight: bold;
  color: #000;
  text-align: center;
  border-radius:4px;
  padding:0 15px;
  transform: rotate(-5deg);
}
.discount:after {
  content: " ";
  height: 22px;
  width: 22px;  
  background: #f2ff6d;
  position: absolute;
  top:4px;
  left:-9px;
  border-radius:4px;
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);  
}
.discount:before {
  content: "";
  width: 7px;
  height: 7px;
  background: #323232;
  position: absolute;
  top: 12px;
  left: 0px;
  z-index: 1;
  border-radius: 10px;
}

.tiempoOferta {
  font-size: 12px;
  color: #000;
  text-align: center;
  position: absolute;
  top:  4px;
  left: 35px;
}


.discount del {
    color: #bebebe;
    text-decoration: none;
    position: relative;    
    font-weight: 100;
}
.discount del:before {
      content: " ";
      display: block;
      width: 100%;
      border-top: 1px solid #bebebe;;
      height: 4px;
      position: absolute;
      bottom: 5px;
      left: 0;
      transform: rotate(-11deg);
    }
.discount del:after {
      content: " ";
      display: block;
      width: 100%;
      border-top: 1px solid #bebebe;;
      height: 4px;
      position: absolute;
      bottom: 5px;
      left: 0;
      transform: rotate(11deg);
    }


.precioFin {
    font-size: 18px;
    font-weight: bolder;

}

.flag-discount {
    border-radius: 0px 0 0 0px;
    color: #fff;
    display: block;
    float: left;    
    padding: 5px 20px 5px 10px;
    background: #93274f;
    font-size: 20px;
    font-weight: 400;
    position: relative;
}
.flag-discount::before,
.flag-discount::after {
    content: "";
    position: absolute;
    left: 100%;
    width: 0;
    height: 0;
    border-style: solid;
    display: block;
}
.flag-discount::before {
    top: 0;
    border-width: 22px 15px 0 0;
    border-color: #93274f transparent transparent transparent;
}
.flag-discount::after {
    bottom: 0;
    border-width: 0 15px 22px 0;
    border-color: transparent transparent #93274f transparent;
}


.unilinea-xs, .unilinea-sm {  
  text-align: right;
  padding-right: 10px;
  padding-top: 5px;
  width: 100%;
}

.grupo-panel {
  background: #fff;
  border-radius: 2px;
  display: inline-block;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
  width: 100%;
  padding: 10px;
  margin-top: 10px;
  margin-bottom: 10px;
}

.sin_margen {
  padding-right: 0px;
  padding-left: 0px;
  margin-left: 0px;
  margin-right: 0px;
}

.loader {  
    
    position: relative;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 1;
}

.cargando {
    position: fixed;
    height: 100vh;
    width: 100%;
    background-color: #FFF;
    /*opacity: 0.9;*/
    z-index: 9000;
    
}

.rotate {
  animation: rotate 2s linear infinite;
}

@keyframes rotate {
  100% {
    transform: rotate(1turn);
  }
}


.anuncio {

  border-radius: 25px;
  padding: 10px;
  background: #fff;  
  box-shadow: 0 0 5px 5px rgb(191 191 191 / 50%);

  

  margin-bottom: 20px;
}

.ck.ck-balloon-panel:not(.ck-toolbar-container) {
  z-index: 11001;
}

body {
    --ck-z-default: 10001;
    --ck-z-modal: calc( var(--ck-z-default) + 999 );
}

/* scroll */

::-webkit-scrollbar-track
{
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.4);
  background-color: #F5F5F5;
}

::-webkit-scrollbar
{
  width: 10px;
  background-color: #F50000;
}

::-webkit-scrollbar-thumb
{
  border-radius: 6px;
  background-color: #cec8ba; 
  background-image: -webkit-linear-gradient(45deg,
                                            rgba(255, 255, 255, .2) 25%,
                        transparent 25%,
                        transparent 50%,
                        rgba(255, 255, 255, .2) 50%,
                        rgba(255, 255, 255, .2) 75%,
                        transparent 75%,
                        transparent)
}

.editor {
  border: 1px solid #ccc !important;
  border-radius: 4px;
}

.editor:focus {
  border-color: #66afe9 !important;
  /*margin-top: 46px;*/
  box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%) !important;
}




/*--------------------------------------------------------------
# Services
--------------------------------------------------------------*/
.services .icon-box {
  padding: 30px;
  position: relative;
  overflow: hidden;
  margin: 0  0 40px 0;
  background: #fff;
  box-shadow: 0 10px 29px 0 rgba(68, 88, 144, 0.1);
  transition: all 0.3s ease-in-out;
  border-radius: 15px;
  text-align: center;
  border-bottom: 3px solid #fff;
}

.services .icon-box:hover {
  transform: translateY(-5px);
  border-color: #ef7f4d;
}

.services .icon i {
  font-size: 48px;
  line-height: 1;
  margin-bottom: 15px;
  color: #ef7f4d;
}

.services .title {
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 18px;
}

.services .title a {
  color: #111;
}

.services .description {
  font-size: 15px;
  line-height: 28px;
  margin-bottom: 0;
}


/*--------------------------------------------------------------
# Contacto
--------------------------------------------------------------*/
.contacto .icon-box {
  padding: 10px;
  position: relative;
  overflow: hidden;
  margin: 0  0 30px 0;
  background: #fff;
  box-shadow: 0 5px 15px 0 rgba(68, 88, 144, 0.1);
  transition: all 0.3s ease-in-out;
  border-radius: 15px;
  text-align: center;
  border-bottom: 3px solid #fff;
}

.contacto .icon-box:hover {
  /*transform: translateY(-5px);*/
  border-color: #ef7f4d;
}


.contacto .icon i  {
    position: absolute;
    line-height: 1;
    color: #fff;
    background: #ef7f4d;
    padding: 15px;
    top: 0px;
    min-width: 62px;
    left: -5px;
    /*height: calc(100% + 20px);*/
    /* height: 100%; */
    border-radius: 15px 0px 0px 15px;
}

.contacto .icon span {
    position: absolute;
    line-height: 1;
    color: #fff;
    background: #ef7f4d;
    padding: 15px;
    top: 0px;
    
    left: -5px;
    /*height: calc(100% + 20px);*/
    /* height: 100%; */
    border-radius: 15px 0px 0px 15px;
}  

/*
.contacto .icon i  {
    
    line-height: 1;
    color: #fff;
    background: #ef7f4d;
    padding: 15px;
    top: 0px;

    left: 15px;

    
    border-radius: 15px 0px 0px 15px;
}

.contacto .icon span {
    position: inherit;
    line-height: 1;
    color: #fff;
    background: #ef7f4d;
    padding: 15px;
    top: 0px;

    left: 15px;
    height: calc(100% - 30px);
    border-radius: 15px 0px 0px 15px;
}
*/

.contacto .title {
  font-weight: 700;
  /*
  margin-bottom: 15px;
  margin-top: 5px;
  */
  font-size: 16px;
  padding-left: 50px;
}

.contacto .title a {
  color: #111;
}

.contacto .description {
  font-size: 15px;
  line-height: 28px;
  margin-bottom: 0;
}


/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section {
  padding: 60px 0;
}

/*
.section-bg {
  background-color: #fef8f5;
}
*/

.section-title {
  text-align: center;
  padding-bottom: 30px;
}

.section-title h2 {
  font-size: 24px;
  font-weight: 700;
  padding-bottom: 0;
  line-height: 1px;
  margin-bottom: 15px;
  color: #239cd6;
}

.section-title p {
  padding-bottom: 15px;
  margin-bottom: 15px;
  position: relative;
  font-size: 32px;
  font-weight: 700;
  color: #4e4039;
}

.section-title p::after {
  content: '';
  position: absolute;
  display: block;
  width: 60px;
  height: 2px;
  background: #eb5d1e;
  bottom: 0;
  left: calc(50% - 30px);
}



/*--------------------------------------------------------------
# Contact Us
--------------------------------------------------------------*/
.contact .info {
  border-top: 3px solid #eb5d1e;
  border-bottom: 3px solid #eb5d1e;
  padding: 30px;
  background: #fff;
  width: 100%;
  box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.12);
}

.contact .info .icono {
  font-size: 20px;
  color: #eb5d1e;
  float: left;
  width: 44px;
  height: 44px;
  background: #fdf1ec;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
  transition: all 0.3s ease-in-out;
}

.contact .info h4 {
  padding: 0 0 0 60px;
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 5px;
  color: #7a6960;
}

.contact .info p {
  padding: 0 0 10px 60px;
  margin-bottom: 20px;
  font-size: 14px;
  
}

.contact .info .email p {
  padding-top: 5px;
}

.contact .info .social-links {
  padding-left: 60px;
}

.contact .info .social-links a {
  font-size: 18px;
  display: inline-block;
  background: #333;
  color: #fff;
  line-height: 1;
  padding: 8px 0;
  border-radius: 50%;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
  margin-right: 10px;
}

.contact .info .social-links a:hover {
  background: #eb5d1e;
  color: #fff;
}

.contact .info .email:hover i, .contact .info .address:hover i, .contact .info .phone:hover i {
  background: #eb5d1e;
  color: #fff;
}

.contact .php-email-form {
  width: 100%;
  border-top: 3px solid #eb5d1e;
  border-bottom: 3px solid #eb5d1e;
  padding: 30px;
  background: #fff;
  box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.12);
}

.contact .php-email-form .form-group {
  padding-bottom: 8px;
}

.contact .php-email-form .validate {
  display: none;
  color: red;
  margin: 0;
  font-weight: 400;
  font-size: 13px;
}

.contact .php-email-form .error-message {
  /*display: none;*/
  color: #fff;
  background: #ed3c0d;
  text-align: left;
  padding: 15px;
  font-weight: 600;
}

.contact .php-email-form .error-message br + br {
  margin-top: 25px;
}

.contact .php-email-form .sent-message {
  /*display: none;*/
  color: #fff;
  background: #18d26e;
  text-align: center;
  padding: 15px;
  font-weight: 600;
}

.contact .php-email-form .loading {
  /*display: none;*/
  background: #fff;
  text-align: center;
  padding: 15px;
}

.contact .php-email-form .loading:before {
  content: "";
  display: inline-block;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin: 0 10px -6px 0;
  border: 3px solid #18d26e;
  border-top-color: #eee;
  -webkit-animation: animate-loading 1s linear infinite;
  animation: animate-loading 1s linear infinite;
}

.contact .php-email-form input, .contact .php-email-form textarea {
  border-radius: 0;
  box-shadow: none;
  font-size: 14px;
}

.contact .php-email-form input {
  height: 44px;
}

.contact .php-email-form textarea {
  padding: 10px 12px;
}

.contact .php-email-form button[type="submit"] {
  background: #eb5d1e;
  border: 0;
  padding: 10px 24px;
  color: #fff;
  transition: 0.4s;
  border-radius: 4px;
}

.contact .php-email-form button[type="submit"]:hover {
  background: #ef7f4d;
}

@-webkit-keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


/*---------------------------------------------------------*/

.etiqueta {
  padding-left: 5px;
  padding-right: 5px;
}

.filaCero {
    margin-right: 0px;
    margin-left: 0px;
}

.espacio-inf-amplio {

	margin-bottom: 40px;
	box-shadow: 0 5px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
}
.aiudaa {

	margin-left: 10px;
	color:#1887B7;
}

.enlaces {

	position: absolute;
    bottom: 0px;
    right: 5px;
    padding: 0px;
	
}


.info-block
{
    border-right:5px solid #E6E6E6;margin-bottom:25px
}
.info-block .square-box
{
    width:100px;min-height:110px;margin-right:22px;text-align:center!important;background-color:#676767;padding:20px 0
}
.info-block.block-info
{
    border-color:#ff0000;
}
.info-block.block-info .square-box
{
    background-color:#20819e;color:#FFF
}


.panel-heading {
    padding: 15px 5px 15px 5px;
    min-height: 50px;
}   


.pagination>li {
    display: inline-block;
}
.btnPaginacion {
	background-color: #dedede !important;	
}

.pagination>li>a, .pagination>li>span { 
	padding: 6px 12px;
    margin-left: -1px; 
}

.celda-tabla {
	border-color: #cee9ff;
    border-width: 1px;
    border-style: solid;	
}	

.titulo_colores {
	color: #1887B7;
	font-size: 18px;
  font-family: Helvetica;
}	


.h2, h2 {
    font-size: 26px;
}

.img-thumbnail {
     border: 0px;
}

@media (min-width: 768px) {
  .row.equal {
    display: flex;
    flex-wrap: wrap;
  }
}


.grid0 > li {

	 /*min-height: 415.5px;*/

}


li > h4 {
    
    max-height: 80px;
    min-height: 80px;
}

.label {
	font-size: medium;
}

.margen_corto {
	padding-right: 5px;
    padding-left: 5px;
}

*{
	margin:0px;
	padding:0px;
	list-style: none;
	text-decoration: none;
	font-family: 'Ubuntu' ;
}

ul, ol{
	padding:0px;
}

a:visited, a:link, a:focus, a:hover, a:active{
	list-style: none;
	text-decoration: none;
	/*font-size: 16px;*/
}

.barraSuperior{
	transition: background-color 0.5s ease;
	background: #777;
}

.barraSuperior a{
	color:#fff;
}

.backColor, .backColor a{
	transition: background-color 0.5s ease;
	background:#777;
	color:#fff;
}

.backColorOut, .backColorOut a{
	transition: background-color 0.5s ease;
	background:#777;
	color:#fff;
}

.fondoBreadcrumb{
	margin-bottom:0px;
	background: rgba(0,0,0,0);
}

/*=============================================
REDES SOCIALES
=============================================*/

.redSocial{
	width:30px;
	height:30px;
	text-align: center;
	line-height:30px;

}

/*HOME*/

.homeBlanco{
	color:white;
}

.homeNegro{
	color:black;
}

.homeColor{
	color:white;
	background:#46639f;
}

/*FACEBOOK*/

.facebookBlanco{
	color:white;
}

.facebookNegro{
	color:black;
}

.facebookColor{
	color:white;
	background:#46639f;
}

/*YOUTUBE*/

.youtubeColor{
	color:white;
	background:#d6513e;
}

.youtubeBlanco{
	color:white;
}

.youtubeNegro{
	color:black;
}

/*TWITTER*/

.twitterColor{
	color:white;
	background:#0ab2e6;
}

.twitterBlanco{
	color:white;
}

.twitterNegro{
	color:black;
}

/*GOOGLE PLUS*/

.google-plusColor{
	color:white;
	background:#d71617;
}

.google-plusBlanco{
	color:white;
}

.google-plusNegro{
	color:black;
}

/*INSTAGRAM*/

.instagramColor{
	color:white;
	background:linear-gradient(45deg, #fca925, #ee1d5f,  #6350a2);

}

.instagramBlanco{
	color:white;
}

.instagramNegro{
	color:black;
}

/*=============================================
ERROR 404, VERIFICAR
=============================================*/

.error404. .verificar{
	color:#333;
}

/*=============================================
SCROLL UP
=============================================*/
#scrollUp{
	bottom: 20px;
	right: 20px;
	width: 50px;
	height: 50px;
	background: url(../img/plantilla/flecha.jpg);
}


/*=============================================
CAMBIAR IMG AL PASAR MOUSE
=============================================*/
.swap-on-hover {
	margin:  0 auto;	
}

.swap-on-hover img {  	
  margin: 0 auto;
	overflow: hidden;
}

.swap-on-hover .swap-on-hover__front-image {
  left:0px;
  right:0px;  
  margin:auto;
  padding-left: 15px;
  padding-right: 15px;
  /*z-index: 50;*/
  transition: opacity .5s linear;
  cursor: pointer;
	position: absolute;
}

.swap-on-hover:hover > .swap-on-hover__front-image{
  	opacity: 0;
}


/*=============================================
ESCRITORIO GRANDE (LG revisamos en 1366px en adelante)
=============================================*/

@media (min-width:1200px){

	.col-lg-0{
		display: none;
	}

	.error404 h1{
		font-size:300px;
		text-shadow:8px 8px 1px #dadada;
	}

	.verificar h3{
		margin-top:30px;
		font-size:100px;
		text-shadow:4px 4px 1px #dadada;
	}

}

/*=============================================
ESCRITORIO MEDIANO O TABLET HORIZONTAL (MD revisamos en 1024px)
=============================================*/

@media (max-width:1199px) and (min-width:992px){

	.col-md-0{
		display: none;
	}

	.error404 h1{
		font-size:200px;
		text-shadow:6px 6px 1px #dadada;
	}

	.verificar h3{
		margin-top:30px;
		font-size:100px;
		text-shadow:4px 4px 1px #dadada;
	}

}

/*=============================================
ESCRITORIO PEQUEÑO O TABLET VERTICAL (SM revisamos en 768px)
=============================================*/

@media (max-width:991px) and (min-width:768px){

	.col-sm-0{
		display: none;
	}

	.error404 h1{
		font-size:150px;
		text-shadow:4px 4px 1px #dadada;
	}

	.verificar h3{
		margin-top:30px;
		font-size:100px;
		text-shadow:4px 4px 1px #dadada;
	}

}

/*=============================================
MOVIL (XS revisamos en 320px)
=============================================*/

@media (max-width:767px){

	.col-xs-0{
		display: none !important;
	}

  .unilinea-xs {
      text-align: left;
      padding-top: 0px;
  }

	.error404 h1{
		font-size:75px;
		text-shadow:2px 2px 1px #dadada;
	}

	.verificar h3{
		margin-top:30px;
		font-size:50px;
		text-shadow:2px 2px 1px #dadada;
	}
	
	.texto-din {
		font-size:12px;
	}
	
	.pagination>li>a, .pagination>li>span { 
		padding: 6px 8px;
		margin-left: -1px; 
	}



	.swap-on-hover .swap-on-hover__back-image {
 		opacity: 0;	

	}

}


@media (max-width:992px){

 .unilinea-sm {
      text-align: left;
      padding-top: 0px;
  }

}



/*
a:hover,a:focus{
    outline: none;
    text-decoration: none;
}
*/
.tab .nav-tabs{
    background: #fff;
}
.tab .nav-tabs li{
    text-align: center;
    margin-right: 3px;
}
.tab .nav-tabs li a{
    font-size: 15px;
    font-weight: 600;
    color: #22272c;
    padding: 15px;
    background: #eee;
    margin-right: 0;
    border-radius: 0;
    border: none;
    border-radius: 10px 10px 0px 0px;
    /*text-transform: uppercase;*/
    position: relative;
    transition: all 0.5s ease 0s;
}


.tab .nav-tabs li.active a {
    background: #e16b47;
    color: #fff;
    border: none;
}

.tab .tab-content{
    font-size: 15px;
    color: #3d3537;
    line-height: 30px;
    padding: 15px 20px;
    border: 3px solid #e16b47;
}
.tab .tab-content h3{
    font-size: 20px;
    font-weight: bold;
    margin-top: 0;
}
@media only screen and (max-width: 480px){
    .tab .nav-tabs li{ width: 100%; }
}




.parpadea {
  
  animation-name: parpadeo;
  animation-duration: 2s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;

  -webkit-animation-name:parpadeo;
  -webkit-animation-duration: 2s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
}

@-moz-keyframes parpadeo{  
  0% { opacity: 5.0; }
  50% { opacity: 0.0; }
  100% { opacity: 5.0; }
}

@-webkit-keyframes parpadeo {  
  0% { opacity: 3.0; }
  50% { opacity: 0.0; }
   100% { opacity: 3.0; }
}

@keyframes parpadeo {  
  0% { opacity: 3.0; }
   50% { opacity: 0.0; }
  100% { opacity: 3.0; }
}