/* Definición de la fuente personalizada 'varela' */
@font-face {
    font-family: 'varela';
    src: url('/media/fonts/VarelaRound-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'rubik';
    src: url('/media/fonts/Rubik-VariableFont_wght.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* Aplicar la fuente 'varela' específicamente a h1 y h2 */
h1, .blue-landing {
    color: rgb(69,88,108) !important;
}

body, h1, h2, h3, h4, h5, h6, p, span, .font-body {
    font-family: 'varela', sans-serif !important;
    font-weight: 300 !important;
}

/* Mantener el resto de estilos existentes */
body:not(.device-xs) .price-block:first-child {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}

body:not(.device-xs) .price-block:last-child {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    border-left: 1px solid #EEE;
}

.price-block-wrap {
    border-radius: 6px;
    box-shadow: 0 10px 40px rgba(14,72,119, 0.2);
}

#op-plan-subscription-from button,
#op-plan-subscription-from input {
    border-radius: 6px;
}

.price-block {
    background-color: #FFF;
    transition: all .3s ease;
}

    .price-block:hover,
    .price-block.checked {
        background-color: #F8F9FA;
    }


.op-plan-subscription-from-processing .form-process {
    display: block;
    top: 0;
    left: 0;
    cursor: default;
}

.price-tenure {
    font-size: 16px;
    color: #AAA !important;
    text-transform: none;
    font-weight: 400;
}

.menu-link {
    font-family: 'rubik', sans-serif !important;
}

.button, .menu-link {
    text-transform: none !important;
}

.gradient-green-blue2, .h-gradient-green-blue2:hover {
    background-image: -webkit-linear-gradient(to right, #86bf60, #66a5ac) !important;
    background-image: linear-gradient(to right, #86bf60, #66a5ac) !important;
}

.active-step {
    background-color: #1ABC9C !important;
    color: #FFF;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
    border-color: #1ABC9C !important;

    position:absolute;
        top:20px;
        left:20px;
}

.media-box {
    border: 1px solid #E5E5E5;
    height: 600px
}

.fbox-media {
    padding: 40px;
    background-color: #fff;
    height: 250px!important;
    border-radius: 0 0 5px 5px;
}

.fbox-content h3 {
    text-transform:none;
}


.primary-menu .menu-container .menu-link {
     padding-left: 0px; 
     font-size: 16px; 
     letter-spacing: 0px; 
}

.menu-item:hover > .menu-link, .menu-item.current > .menu-link {
    color: #59BA41;
}

.menu-item {
    margin-right: 15px;
}

.header-size-custom #logo img {
    height: 100px;
}