:root { 

    --col_background :white;
    --col_footer : #065DA8;
    --col_header : #065DA8;
    --col_primario: #065DA8;
    --col_primario2: #065DA8;
    --col_secundario: #065DA8;    
    --col_boton:  #009881;
    --col_boton_video:  #065DA8;;
    --col_boton_texto:white;
    --col_boton_more_info: #065DA8;
    --col_boton_env:  #54918e;

    --title_font : 'Roboto';
    --text-font : 'Open Sans';
    --menu-font : 'Open Sans';
}

.container-fluid, .container{ position: relative;}
    /**Testimonials */
    .card-testimonio {
        position: relative;
        display: flex;
        width: 350px;
        flex-direction: column;
        min-width: 0;
        word-wrap: break-word;
        background-color: #fff;
        background-clip: border-box;
        border: 1px solid #d2d2dc;
        border-radius: 11px;
        -webkit-box-shadow: 0px 0px 5px 0px rgb(249, 249, 250);
        -moz-box-shadow: 0px 0px 5px 0px rgba(212, 182, 212, 1);
        box-shadow: 0px 0px 3px 0px rgb(161, 163, 164)
    }

    .profile {
        margin-top: 5px;
        text-align: left;
    }

    .profile-pic {
        width: 58px
    }

    .cust-name {
        font-size: 18px
    }

    .cust-profession {
        font-size: 10px
    }

    .items {
        width: 90%;
        margin: 0px auto;
        margin-top: 25px
    }

    .slick-slide {
        margin: 10px
    }


    .card-header { 
        border-bottom: 1px solid white!important;
    }
    
    .card-footer { 
        background-color:white;
        border-top: none;
    }

    .card-precio-1{
        max-width: 21rem;
        float:right;
        min-height: 250px;
    }

    .card-precio-2{
        max-width: 21rem;
        float:left;
        min-height: 250px;
    }

    .bg-blue { 
        background-color: var(--col_secundario)!important;
    }
    html {
        scroll-behavior: smooth;
    }
    
    body {
        background-color: var(--col_background);
         margin-bottom:350px; 
    }
    
    h4.card-title {
        position: absolute;
        top: -16px;
    }
    
    a { 
        color: #333;    
    }
    
    a:hover {
        color: var(--col_primario);
    }
    
    .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { 
        font-family: var(--title_font);
    }
    
    /* .modal-content{ 
        width: 320px!important;
    } */

    .btn.focus, .btn:focus {
        outline: 0;
        box-shadow: none!important;
    }
    
    .btn-cita{
        border: 1px solid var(--col_boton);
        color: var(--col_boton);
        font-weight: 500;
    }

    .btn-video{
        border:1px solid var(--col_boton_video);
        color: var(--col_boton_video);
        font-weight: 500;
    }
    .btn-more-info { 
        border:1px solid var(--col_boton_video);
        color: var(--col_boton_more_info);
        font-weight: 500;
    }
    .btn-reservar{
        border:1px solid var(--col_boton_video);
        color: var(--col_boton_video);
        font-weight: 500;
    }
    .home_button:hover {
        opacity: 1;
    }

    .home_button {
        border-radius:5px;
        opacity: 1;
        padding: 27px 20px; 
        color: white;
        border: none;
        margin: 15px 0px 1px 15px;
        max-width: 322px;
        width:100%;
        height:auto;
        float: left;
        text-align: center;
        z-index: 1;
    }
    .home_button {
        background-image: none!important;
        background-color: #07BBB2;
    }
    .home_button:focus{
        outline: none;
    }
    .icon_container_1     { float:left; text-align:left; margin-bottom: 7px; } 
    .icon_container_1 img { width:60px; float:left;}
    .icon_container_1 span{ width:275px; float:left; margin-left:10px;     font-size: 15px;    margin-top: 5px;}

    .bg-white{ 
        background-color: white;
    }

    #nav, #logo { 
        transition: 0.4s; 
        padding:0;
    }

    /* nav {
        box-shadow: 1px 2px 3px #eee;
        
    } */
    .swal2-title{
        font-size:1.6em!important;

    }
    .nav-link { 
        font-family: var(--menu-font);
        color: var(--col_primario)!important;
        font-size: 17px;
     
    }
    .navbar-brand { 
        margin-right:0px;
    }
    .navbar-brand img { width:90%;}
    .activo  { 
        color:var(--col_primario);
    }

    .fab, .far {
        font-weight: 400;
        margin-top: 10px;
        font-size: 20px;
        margin-right: 10px;
    }
    .fonxo {  
        min-height: 500px;
        background-color: #f8f9fa; 
    }
    .footer { 
        width: 100%;
        padding-right: 15px;
        padding-left: 15px;
        margin-right: auto;
        margin-left: auto;
        z-index:-1; 
        background:var(--col_footer) !important; 
        color:white;
    }
   
    .btn-cerrar {
        color:var(--col_secundario);
    }
    .btn-cerrar:hover {
        color:white;
        background:var(--col_secundario);
    }
    .btn-registrate{
        color:white;
        border-color: var(--col_secundario);
    }
    .btn-registrate:hover{
        color:white;
        background:#2fb2c5;
    }
    .nav-tabs {
        border:none;
    }
    .nav-tab > .nav-link.active {
        background:var(--col_secundario);
        color:white!important;
    }
    .nav-tab {
        background:#f9f9f9;
        
    }
    .nav-tab > .nav-link {
            color:grey!important;
            border: none;
    }

    .tab-content {
        border: 2px solid var(--col_secundario);
        padding: 20px;
    }

    .btn-login{
        border-radius:5px;
        color: white;
        background: var(--col_secundario)!important;
        border: var(--col_secundario)!important;        
        font-family: var(--menu-font);
    }

    .btn-login:hover{
        color:white;
        background:var(--col_secundario);
        border:var(--col_secundario);
    }

    .card-subtitle{
        font-size: 18px;
    }
    .card-title {
        margin-bottom: 30px;
        font-size:30px;
    }
    #cajacookies {
        box-shadow: 0px 0px 3px 1px darkgrey;
        background-color: white;
        color: black;
        padding: 10px;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 0px;
        position: fixed;
        bottom: 0px;
        width:100%;
        z-index: 99999;
        height: auto;
    }
    #accordion .card-body {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        min-height: 1px;
        margin-left: 15px;
    }
    #accordion h5 {
        background: #f9f9f9;
        padding: 10px 0;
    }
    #accordion button {
        color:#333;
        text-align: left;
    }
    #accordion .card-header {
        padding: .2rem 0rem;
    }
    #accordion .card-body {
        padding:0 1.25rem;
    }
    ul.msp2 {
        padding: 0;
        display: flex; 
    }
    i.mr-2.fas.fa-question-circle {
        color: #1655A0;
    }
    ul.msp2 > li {
        display: block;
        border: 1px solid #eee; 
        
        font-size: 13px;
        position: relative;
        margin: 3px 5px 3px 0;
        padding: 3px 20px 3px 5px;
        
        max-width: 100%;
        border-radius: 3px;
        background-color: #eeeeee;
        color: #333;
        line-height: 13px;
        cursor: default;
        float: left;
        font-size:10px;
    }
    .dropdown-item.active, .dropdown-item:active {
        color: #fff;
        text-decoration: none;
        background-color: #1655A0;
    }
 

    /* Add Zoom Animation */
    .animate {
        -webkit-animation: animatezoom 0.6s;
        animation: animatezoom 0.6s
    }

    @-webkit-keyframes animatezoom {
        from {-webkit-transform: scale(0)}
        to {-webkit-transform: scale(1)}
    }

    @keyframes animatezoom {
        from {transform: scale(0)}
        to {transform: scale(1)}
    }
    .gradient-bar {
        color: white;
        height: 50px;
        width: 100%;
        background: linear-gradient(to right, #095DA9, #009A83);
      }
    .top_mensaje
    {
        background-color: #48A935;
        text-align: center;
        padding: 10px;
        color:white;
    }
    .input-group {
        width:95%;
    }  
    .text-danger{
        padding: 6px 10px;
        margin: 0px; 
        font-size: 15px;
        font-weight: bold;
    }
    .allzero {
        margin:0;
        padding:0;

    }
    .pregunta {
        float: left;
        width: 100%;
        margin-bottom: 10px;
    }

    .preguntaHR {
        width: 100%;
        float: left;
    }

    .respuesta {
        margin-right: 10px;
        float:left;
        width:100%;
    }
    .card{ 
        border:none;
    }
    .card-header {
        background-color: transparent;
        border:none;
    } 
    .btn {
       
       border:none!important;
       padding:10px 15x!important; 
      } 

    .datepicker-input {
        width: 150px !important;
    }
    .pretty-radio-buttons .radio {
        float: left;
        margin-right: 25px;
    }

    .sponsors { 
        background-color: #111111;
        height: 70px;
        padding: 5px;
        color:#eee;
    }
    .sponsors img {
        height:60px;
    }
    .navbar-nav > li {
        float: left;
        margin: 0 10px;
        padding: 0 10px;
    }
    .nav-link {
        display: block;
        padding: .5rem 0.6rem!important;
    }
    .activo{
        
        font-weight: bold;
        height: 40px;
    }
    .numeric {
        width: 100px !important;
        text-align: center;
    }

    .field-icon {
    float: right;
    margin-left: -25px;
    margin-top: -25px;
    position: relative;
    z-index: 2;
    }

    /* home */
    .explicacion { 
        background: white;
        position: absolute;
        width: 97%;
        height:auto;
        min-height: 470px;
        box-shadow: 0px 0px 4px #eee; 
        opacity: 0;
           display:none;
           -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
           -moz-animation: fadein 1s; /* Firefox < 16 */
            -ms-animation: fadein 1s; /* Internet Explorer */
             -o-animation: fadein 1s; /* Opera < 12.1 */
                animation: fadein 1s;
        z-index: 2;
    }
    
    @keyframes fadein {
        from { opacity: 0; }
        to   { opacity: 1; }
    }
    
    .explicacion img {
        width: 100%;
    }
    .texto_specialist { 
        padding: 20px;
        text-align: justify;
    }
    .pie_explicacion { 
        text-align: center;
        padding-bottom:25px;
    
    }
    .custom_boton { 
        background: var(--col_secundario);
        width: 230px;
        color: white;
        padding: 6px 12px!important;
        border-radius: 3px;
        text-decoration: none;
    }
    a.custom_boton:hover {
        text-decoration: none;
        color: white;
        font-weight: 500;
    }
    #loadingDiv, #loadingDiv_Header {
        position: fixed;
        top: 0;
        width: 100%;
        height: 100%;
        background: #eee;
        z-index: 99998;
        opacity:0.9;
    }
    .ip-logo {
        position: absolute;
        left: 0;
        width: 100%;
        cursor: default; 
        pointer-events: none; 
        z-index: 99999999;
        margin-left: auto;
        margin-right: auto;
        width: 50px;
        height: 50px;
        right: 0;
        top: 50%;
    } 

    .la-raya:after {
        background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgb(165, 165, 165), rgba(0, 0, 0, 0));
        background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
        background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
        background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#000000', GradientType=1);
        position: absolute;
        left: 0;
        right: 0;
        height: 1px;
        width: 100%;
        content: "";
        bottom: 0;
    }

    *, *:after, *:before {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }


     .profesional-de-portada img {
        margin: auto;
        text-align: center;
    }
    .profesional-de-portada  .fa-info-circle{
        width:35px;
        background-color:#f1f1f1;
        border-radius:100px;
        color:black;
        height: 35px;
        padding: 10px;
    
    }
    .profesional-de-portada  .fa-video{
        width:35px;
        background-color:#f1f1f1;
        border-radius:100px;
        color:black;
        height: 35px;
        padding: 10px;
    }

 /**Mainsite styles */
 .boton-corporativo {
    width: 200px;
    height: 200px;
    background-color: #ffffff;
    border-radius: 130px;
    box-shadow: 5px 0 10px rgba(0, 0, 0, 0.2);
    /* Sombra solo en el lado derecho */
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px;
    cursor: pointer;
  }

  .boton-corporativo:hover {
    box-shadow: 5px 0 10px rgba(0, 0, 0, 0.5);
    text-decoration: none;
  }

  .imagen {
    height: 100px;
  }
  
  .l2{
    color: black;
  }
  .texto {
    margin-top: 10px;
    line-height: 25px;
  }

  .separacion {
    margin-right: 45px;
    margin-left: 45px;
  }

  .only-logo-mainsite {
    height: 130px;
    padding: 10px 0 !important;
  }

  #cajacookies {
    display: none;
  }

  .grecaptcha-badge {
    visibility: hidden;
  }

  .bt_wp {
    background-color: #4dc247;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
    border-radius: 50%;
    border: 0;
    position: fixed;
    bottom: 20px;
    top: auto;
    right: 20px;
    z-index: 999999;
  }

  .bt_wp svg {
    width: 50px;
    height: 50px;
    padding: 7px 0px;
    fill: white;
    vertical-align: middle;
  }

  footer a {
    list-style: none;
    display: inline-block;
  }

  footer a:hover {
    color: white !important;
  }

  .footer-link a {
    color: white;
  }

  .footer-link i.fa {
    margin-right: 8px;
  }
  .content-link i.fa{
    margin-right: 8px; 
  }
  .content-text {
    text-align: justify;
    color: #5f6368;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: .1px;
    line-height: 28px;
    text-rendering: optimizeLegibility;
  }
  .bg-grey-50 {
    background-color: #f8f9fa;
  }
  .no-spaces-container-fluid{
    padding:0;
    overflow:hidden;
  }
  .taller .content-text p{
    min-height: 170px;
  }
  .circle {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    font-weight: bold;
    margin: 5px; /* Ajusta el margen según tus preferencias */
  }
  .color-green{
    color:#009881;
  }
  .orange{
    background-color: #D09A38;
  }
  .blue{
    background-color: #079783;
  }
  .bordered-blue {
    border-bottom: 2px solid #5BC4F1;
    border-right: 2px solid #5BC4F1;
  }
  .custom_card:not(:first-child):after {
    height: 100%;
    left: -30px;
    top: 0;
    width: 1px;
    background-color: #dadce0;
    content: "";
    position: absolute;
  }
  .taller .content-text{
    padding-left:60px;
  }
  .img-app-descarga{
    max-width: 430px;
    width: 100%;
    margin-top: -58px;
  }
.socius-img img {
    width: 230px;
}
/* scroll arrow */


.scroll-indicator {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  animation: bounce 1s infinite;
}

.arrow {
  width: 30px;
  height: 30px;
  border: solid #009881;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(45deg);
}
  /* Agrega una clase para hacer el fade out */
.scroll-indicator.fade-out {
  opacity: 0;
}

@keyframes bounce {
0%, 20%, 50%, 80%, 100% {
  transform: translateY(0);
}
40% {
  transform: translateY(-10px);
}
60% {
  transform: translateY(-5px);
}
}

/* Opcional: Agregar una clase para ocultar el indicador */
.scroll-indicator.hidden {
    display: none;
}

.circle-content{

}
.custom_card .custom_card-text {
    text-align: left;
}

@media only screen and (max-width: 767px) {
    /* 2023 */
    /* Estilos para pantallas pequeñas aquí */
    .custom_card .custom_card-text {
        text-align: none;
    }
    
    .mbl-l .custom_card-text {
        text-align:left!important;
    }

    .mbl-r .circle-content {
        display: flex;
        justify-content: end;
    }

    .mbl-l .circle-content {
        display: flex;
        justify-content: start;
    }
    .mbl-r .custom_card-text {
        text-align:right!important;
    }
    
    .taller .content-text {
        padding-left: 5px;
        padding-right: 5px;
    }

    img#logo {
        width:100%!important;        
        height:auto;
    }
    .colum-section{
        margin-top: 25px;
      }
    .separacion{
        margin:0 10px 0 0;
    }

    .boton-corporativo{
        border-radius:20px;
    }
    .content-text {
        text-align: left!important;
    }
/* fin  2023 */

    body {
        font-size: 0.8rem; 
        margin-bottom:500px; 
    }
	h1,h2{
        font-size:23px;
        margin-top:4px;
    }

	.card-precio-1{
		width: 100%;
		max-width: 100%;
		float:none;
	}
	.card-precio-2{
		width: 100%;
		max-width: 100%;
		float:none;
	}	

	#accordion .card-body {
		margin-left: 0px;
	}

	.profesional-de-portada{
		text-align: center;
		padding-bottom: 20px!important;
		border-bottom:  1px solid #f9f9f9;
		border-radius:  0;
		margin-bottom:  30px!important;
	}
	.titulo_portada{
		font-size: 25px;
	}
	.sponsors {
		height:40px;
	}
	.sponsors img {
		height:30px;
	}

	.cajacookies { margin-left:0!important;}
	
	
	.navbar-toggler{ float: right;}
	.navbar-brand { display:contents;}
	.fonxo { background-color: #f8f9fa;}
	.dropdown-item{text-align: right; font-weight: bold;}
	.dropdown-menu {
		position: initial;
		right: 0;
		float: right;
		border: none;
	}
	.activo { border-bottom:none!important;}
	a.home_button{
		margin: 10px 0px;
		
	}
	
	.box-explicacion { border-bottom: 1px solid #eee; }
	.center-mobile { text-align: center;}
	.icon_container_1 span{
		width:260px;
	}

	.fc .fc-toolbar-title { display:none!important;} /**date time in calendar*/
}

    @media (max-width: 991.98px) {
        .titulo_portada{
            font-size: 25px;
        }
        .fc .fc-toolbar-title { display:none!important;} /**date time in calendar*/
        .fonxo { background-color: white;}
         
        li.nav-item { 
            /* width:100%;  */
            text-align:right;
        }
        .btn-outline-secondary { 
            border:none; 
            margin-left:5px;
        }     
        .btn-registrate { 
            border:none; 
            padding-left:8px;
        }    
        
        a.home_button{
            margin: 10px 0px;
        }
        .box-explicacion { border-bottom: 1px solid #eee!important; }
    }