/*************
Custom Template
**************/
.bg-blue {
    background: #001D4A !important;
}
.bg-blue-2 {
    background: #00409f !important;
}
.bg-green {
    background: #00B861;
}
.bg-parkinson-1 {
    background: url(../images/parkinson/Iconos_Parkinson_Yoga.png) center center;
    background-size: contain;
    background-repeat: no-repeat;
}
.bg-parkinson-2 {
    background: url(../images/parkinson/Iconos_Parkinson_baile.png) center center;
    background-size: contain;
    background-repeat: no-repeat;
}
.bg-parkinson-3 {
    background: url(../images/parkinson/Iconos_Parkinson_chikung.png) center center;
    background-size: contain;
    background-repeat: no-repeat;
}
.bg-parkinson-4 {
    background: url(../images/parkinson/Iconos_Parkinson_fisioterapia.png) center center;
    background-size: contain;
    background-repeat: no-repeat;
}
.bg-parkinson-5 {
    background: url(../images/parkinson/Iconos_Parkinson_consulta_psicologica.png) center center;
    background-size: contain;
    background-repeat: no-repeat;
}
.bg-parkinson-6 {
    background: url(../images/parkinson/Iconos_Parkinson_consulta_gerontologica.png) center center;
    background-size: contain;
    background-repeat: no-repeat;
}
.bg-parkinson-7 {
    background: url(../images/parkinson/Iconos_Parkinson_cuota.png) center center;
    background-size: contain;
    background-repeat: no-repeat;
}
.bg-parkinson-8 {
    background: url(../images/parkinson/Iconos_Parkinson_telefono.png) center center;
    background-size: contain;
    background-repeat: no-repeat;
}
.bg-red {
    background-color: #e32845;
    border: 1px solid #e32845;
}
.border-green {
    border: 1px solid #00B861;
}
.c-black {
    color: #000000 !important;
}
.c-blue {
    color: #001D4A !important;
}
.c-blue-2 {
    color: #00409f !important;
}
.c-blue-3 {
    color: #022c6b !important;
}
.c-gray {
    color: #666666 !important;
}
.c-green {
    color: #005F67;
}
.c-green-2 {
    color: #036268 !important;
}
.c-green-3 {
    color: #00B861 !important;
}
.c-orange {
    color: #ff8000 !important;
}
.c-orange-2 {
    color: #da4a10 !important;
}
.c-red {
    color: #dc3545!important;
}
.c-whats {
    color: #25d366;
}
.c-white {
    color: #ffffff !important;
}
.card-text {
    min-height: 215px;
    font-size: 2rem;
    padding-top: 10%;
    margin-bottom: 30px !important;
}
.cur-pointer {
    cursor: pointer;
}
.display-block {
    display: block !important;
}
.display-inline-block {
    display: inline-block !important;
}
/* https://isotropic.co/tool/hex-color-to-css-filter/ */
.filter-white {
    filter: invert(100%) sepia(100%) saturate(2%) hue-rotate(334deg) brightness(108%) contrast(101%);
}
.filter-blue {
    filter: invert(8%) sepia(50%) saturate(4424%) hue-rotate(208deg) brightness(95%) contrast(102%);
}
.fs-075 {
    font-size: 0.75rem !important;
}
.fs-08 {
    font-size: 0.8rem !important;
}
.fs-09 {
    font-size: 0.9rem !important;
}
.fs-1 {
    font-size: 1.0rem !important;
}
.fs-1_25 {
    font-size: 1.25rem !important;
}
.h-40 {
    height: 40px !important;
}
.url-link:hover {
    color: #033682 !important;
    font-weight: bold;
}
.ico-parkinson {
    display: inline-block;
    width: 80px;
    height: 80px;
    margin-right: 10px;
}
.image-banner {
    position: relative;
    width: 100%;
    padding-top: 0;
    margin-top: 0;
    height: 450px;
}
.imagen-parkinson-1 {
    position: absolute;
    width: 35%;
    overflow: hidden;
    top: 0;
    left: -10%;
    
}
.zoom {
    transition: transform .2s; /* Animation */
}
.zoom:hover {
    transform: scale(1.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  }
.imagen-parkinson-2 {
    position: absolute;
    width: 45%;
    overflow: hidden;
    top: -7%;
    right: 0;
}
.imagen-parkinson-3 {
    position: absolute;
    width: 35%;
    overflow: hidden;
    top: 24%;
    right: 40%;
}
.imagen-parkinson-4 {
    position: absolute;
    width: 45%;
    overflow: hidden;
    top: 42%;
    left: -20%;
}
.imagen-parkinson-5 {
    position: absolute;
    width: 45%;
    overflow: hidden;
    top: 52%;
    right: 0;
}
.list-alfa {
    list-style: lower-alpha !important;
}
.list-circle {
    list-style: disc !important;
    list-style-position: inside !important;
}
.list-circle-2 {
    list-style: circle !important;
    list-style-position: inside !important;
}
.list-none {
    list-style: none !important;
}
.list-roman {
    list-style: upper-roman !important;
}
.list-roman-2 {
    list-style: lower-roman !important;
}
.contact-and-address .contact-and-address-content .contact-card:hover {
    background-color: #b5c8f8;
}
.mb-152 {
    margin-bottom: 152px !important;
}
.mb-10 {
    margin-bottom: 10px;
}
.mb-20 {
    margin-bottom: 20px;
}
.mt-10 {
    margin-top: 10px;
}
.mt-20 {
    margin-top: 20px;
}
.pad-all-5 {
    padding: 10%;
}
.page-banner-area {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
    padding-top: 0px;
    padding-bottom: 10px;
    min-height: 480px;
}
.pl-20 {
    padding-left: 20px;
}
.pos-rel {
    position: relative;
}
.separate {
    padding: 17px;
}
.text-bold {
    font-weight: 700;
}
.text-center {
    text-align: center !important;
}
.text-justify {
    text-align: justify !important;
}
.text-left {
    text-align: left !important;
}
.text-right {
    text-align: right !important;
}
.texto-vertical {
    writing-mode: vertical-lr;
    transform: rotate(180deg);
}
select {
    background-image: url(../images/icons/flecha.png);
    background-repeat: no-repeat;
    background-position: right center;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
}
/* */
.single-academics-card2 .academic-content .academic-top-content {
    position: relative;
    padding-left: 0px;
}
.sin-pago {
    color: #ffffff;
}
.sin-pago:hover {
    color: #ebd517;
}

/* Magazine */
.container-magazine {
    height: 80vh;
    width: 90%;
    margin: 20px auto;
    border: 2px solid #001D4A;
    box-shadow: 0 0 5px #001D4A;
}
.fullscreen {
    background-color: #333;
}


/* WhatsApp */
.wa-content {
    z-index: 9999;
    position: fixed;
    right: 1.5%;
    bottom: 18%;
}

/* Solicitar Información */
.more-info {
    background: #00B861;
    color: #ffffff;
    cursor: pointer;
    padding: 32px 12px;
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    font-size: 1.3rem;
    z-index: 9999;
    position: fixed;
    right: 0;
    top: 31%;
}

/* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card {
    perspective: 1000px; /* Remove this if you don't want the 3D effect */
    height: 400px;
  }
  
  /* This container is needed to position the front and back side */
  .flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.8s;
    transform-style: preserve-3d;
  }
  
  /* Do an horizontal flip when you move the mouse over the flip box container */
  .flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
  }
  
  /* Position the front and back side */
  .flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden; /* Safari */
    backface-visibility: hidden;
  }
  
  /* Style the front side (fallback if image is missing) */
  .flip-card-front {
    background-color: #ffffff;
    color: #f7e224;
  }
  .card_image::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: rgba(17, 29, 94, 0.8);
}
  
  /* Style the back side */
  .flip-card-back {
    background-color: #00409f;
    color: #ffffff;
    transform: rotateY(180deg);
  }

.card-img-top {
    max-height: 400px;
    object-fit: cover;
}
.card-img-overlay {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: rgba(17, 29, 94, 0.5);
}
.card-title {
    position: absolute;
    bottom: 6%;
    right: 6%;
    text-align: left;
    color: #f7e224;
}
.card {
    border: none;
    background: transparent;
}


/* modal info oferta educativa */
#form_info_oferta {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}
#form_info_oferta_movil {
    position: relative;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}
.info-oferta {
    position: absolute;
    background: rgba(255, 255, 255, 0.7);
    width: 50%;
    height: 100%;
    right: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    color: var(--bs-modal-color);
    pointer-events: auto;
    background-clip: padding-box;
    border: var(--bs-modal-border-width) solid var(--bs-modal-border-color);
    border-radius: var(--bs-modal-border-radius);
    outline: 0;
}
.info-oferta-movil {
    position: relative;
    background: rgba(255, 255, 255, 0.7);
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    color: var(--bs-modal-color);
    pointer-events: auto;
    background-clip: padding-box;
    border: var(--bs-modal-border-width) solid var(--bs-modal-border-color);
    border-radius: var(--bs-modal-border-radius);
    outline: 0;
}
.info-dialog {
    width: 100%;
    height: 100%;
    padding: 10px;
}

.info-oferta-content {
    width: 100%;
    height: 100%;
    padding: 10px;
}

.info-oferta-header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    padding: var(--bs-modal-header-padding);
    border-bottom: var(--bs-modal-header-border-width) solid var(--bs-modal-header-border-color);
    border-top-left-radius: var(--bs-modal-inner-border-radius);
    border-top-right-radius: var(--bs-modal-inner-border-radius);
}

.info-oferta-body {
    position: relative;
    flex: 1 1 auto;
    padding: var(--bs-modal-padding);
}

.info-oferta-footer {
    display: flex;
    flex-shrink: 0;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    padding: calc(var(--bs-modal-padding) - var(--bs-modal-footer-gap)* .5);
    background-color: var(--bs-modal-footer-bg);
    border-top: var(--bs-modal-footer-border-width) solid var(--bs-modal-footer-border-color);
    border-bottom-right-radius: var(--bs-modal-inner-border-radius);
    border-bottom-left-radius: var(--bs-modal-inner-border-radius);
}