.mont-L {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
}
.mont-R {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}
.mont-M {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}
.mont-SB {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}
.owl-carousel .owl-item{
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
}
html{
    overflow-x: hidden;
}
body {
    overflow-x: hidden;
    min-height: 100vh;
}
main {
    flex: 1 0 auto;
}
header,
footer {
    flex: 0 0 auto;
}
header{
    width: 100%;
    padding-top: 0;
    position: fixed;
    z-index: 2;
    backdrop-filter: blur(4px);
}
footer{
    padding-block: 2rem;
}
a{
    text-decoration: none;
}
hr{
    color: #0033A1;
    border-top: 0.15rem solid;
    opacity: 1;
    padding-bottom: 2rem;
}
button{
    background-color: transparent;
    border: none;
}
.vihe{
    min-height: 100vh;
}
.text-justify{
    text-align: justify;
}
.cursor:hover{
    cursor: pointer;
}
#portada{
    background-color: #662E80;
    margin: 0;
    padding-top: 3rem;
}
#aprender{
    background: url("img/fondo1.png");
}
#sabiasque{
    background: url("img/fondo2.png");
}
#blog{
    background: url("img/fondo3.png");
}
#aprender, #sabiasque, #blog{
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 100px;
}
#tips, #dolor{
    background-color: white;
    padding-top: 100px;
}
.azulino{
    color: #00B2E3;
}
.azulinoF{
    color: #263B96;
}
.gris{
    color: #636466;
}
.grisF{
    color: #414042;
}
.nav{
    font-size: 0.6rem;
}
.pfoot:hover{
    cursor: pointer;
    border: 1px solid #0033A1;
    border-radius: 20px;
    padding: 0.5rem;
    color: #0033A1;
}
.bord{
    border: 2px solid white;
    border-radius: 50%;
    width: 220px;
    height: 220px;
}
.bord2{
    border: 2px solid #00b2e3;
    border-radius: 50%;
    width: 300px;
    height: 300px;
}
.bord:hover, .bord2:hover{
    cursor: pointer;
    background: rgb(6,174,135);
    background: linear-gradient(150deg, rgba(6,174,135,1) 20%, rgba(22,142,202,1) 35%, rgba(107,40,123,1) 55%, rgba(244,67,25,1) 90%);
}
.bord2:hover p{
    color: white;
}
.card{
    --bs-card-border-width: 0;
    --bs-card-bg: transparent;
}
.card-img-top{
    background-color: transparent;
}
.card-body{
    background-color: #e91c24;
}
.box{
    position: relative;
}
.cerrar, .cerrar2{
    position: absolute;
    top: 0;
    right: 0;
    max-width: 15%;
}
.cerrar:hover, .cerrar2:hover{
    cursor: pointer;
}
.imgdolor img:hover{
  opacity: 0;
  transition: opacity 300ms;
}
.imgtipos{
  display: inline-block;
  position: relative;
  z-index: 0;
}
.textodolor{
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 1px solid white;
    border-radius: 20px;
    background-color: rgba(255, 255, 255, 0.3);
    padding-inline: 2rem;
    position: absolute;
    top: 12%;
    left: 0;
    z-index: -1;
    margin: 0;
    height: 15rem;
}
.textodolor p{
    font-size: 0.6rem;
}
.dentro{
    background-color: rgb(255, 255, 255);
    border-radius: 100px;
    padding: 0.5rem 1rem;
}
.afuera{
    background: rgb(6,174,135);
    background: linear-gradient(150deg, rgba(6,174,135,1) 20%, rgba(22,142,202,1) 35%, rgba(107,40,123,1) 55%, rgba(244,67,25,1) 90%);
    border-radius: 100px;
    padding: 5px;
}
.carou{
    transform: scale(0.8);
}
.center .carou{
    transform: scale(1);
}
.carou p{
    display: none;
}
.center .carou > p{
    display: block;
    margin-top: 2rem;
}
.imgtip{
    position: relative;
    transform-style: preserve-3d;
    width: 60%;
    padding: 2rem 1.5rem;
    border: 4px solid #00B2E3;
    border-radius: 40% 0 40% 40%;
}
.center .imgtip::before{
    content: "";
    position: absolute; 
    inset: 0px;
    background: linear-gradient(150deg, rgba(6,174,135,1) 20%, rgba(22,142,202,1) 35%, rgba(107,40,123,1) 55%, rgba(244,67,25,1) 90%);
    filter: blur(0px);
    transform: translate3d(30px,30px,-1px);
    border-radius: inherit;
    pointer-events: none;
}
.center .imgtip{
    background-color: #00B2E3;
    box-shadow: 20px 20px 0px 0px linear-gradient(150deg, rgba(6,174,135,1) 20%, rgba(22,142,202,1) 35%, rgba(107,40,123,1) 55%, rgba(244,67,25,1) 90%);
}
.cls-1 {
    fill: none;
    stroke: #0c809b;
    stroke-miterlimit: 10;
    stroke-width: 3.5px;
}
.cls-2 {
  fill: none;
  stroke: #0c809b;
  stroke-miterlimit: 10;
  stroke-width: 3.5px;
}
.cls-3 {
  fill: #0c809b;
}
.center .cls-1,
.center .cls-2{
    stroke: white;
}
.center .cls-3{
    fill: white;
}
.dolorhov:hover{
    cursor: pointer;
}
.dolorhov:hover p{
    color: #263B96;
    border-bottom: 2px solid #263B96;
}
.dolorhov:hover img{
    filter: drop-shadow(0px 0px 30px #263b96);
}
#Dolor11Car .owl-prev{
    position: absolute;
    top: 55%;
    left: 5%;
}
#Dolor11Car .owl-next{
    position: absolute;
    top: 55%;
    right: 5%;
}
#Dolor12Car .owl-prev{
    position: absolute;
    top: 55%;
    left: 5%;
}
#Dolor12Car .owl-next{
    position: absolute;
    top: 55%;
    right: 5%;
}
.active{
    color: #00b2e3 !important;
    font-weight: bold;
    padding-bottom: 1rem;
    border-bottom: 4px solid #00b2e3;
}
.refer, .refer2{
    border-radius: 40px 40px 40px 0;
    padding: 2rem;
    background-color: transparent;
    font-family: "Montserrat", sans-serif;
}
.refer{
    border: 2px solid white;
}
.refer2{
    border: 2px solid #00b2e3;
}
@media (min-width: 992px) {
    header{
        padding-top: 1.5rem;
    }
    .nav{
        font-size: 1rem;
    }
    #portada{
        padding-top: 2rem;
    }
    .textodolor{
        height: 22rem;
    }
    .textodolor p{
        font-size: 0.8rem;
    }
    .cerrar, .cerrar2{
        max-width: 5%;
    }
}