﻿body {
    font-family: PlusJakartaSans-Italic;
    color: #fff;
}

.dvbase {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background-color: #272727;
}

.columna_base {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 1.25rem;
}

.span_titulos {
    font-family: PlusJakartaSans-ExtraBold;
    padding: 10px;
    text-decoration: underline;
}

.dv_parrafos {
    width: 320px;
    padding: 5px;
    text-align: center;
    hyphens: auto;
}

.dvprrfs_cn_rdmp_blcks {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    padding: 5px;
}

.dvprrfs_cn_rdmp_blcks:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}

/* ---------- COLORIDOS ---------- */

.dvs_colores {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.dv_rojo {
    border: 2px solid #f00;
    box-shadow: 0 0 10px 3px #f00;
}

.dv_naranja {
    border: 2px solid #ff5300;
    box-shadow: 0 0 10px 3px #ff5300;
}

.dv_amarillo {
    border: 2px solid #ff0;
    box-shadow: 0 0 10px 3px #ff0;
}

.dv_verde {
    border: 2px solid #0f0;
    box-shadow: 0 0 10px 3px #0f0;
}

.dv_verde02 {
    border: 3px solid #06402b;
    box-shadow: 0 0 10px 4px #06402b;
}

.dv_azul {
    border: 2px solid #0ff;
    box-shadow: 0 0 10px 3px #0ff;
}

.dv_azul02 {
    border: 2px solid #00f;
    box-shadow: 0 0 10px 3px #00f;
}

.dv_violeta {
    border: 3px solid #4a1d8d;
    box-shadow: 0 0 10px 4px #4a1d8d;
}

.dv_magenta {
    border: 2px solid #f0f;
    box-shadow: 0 0 10px 3px #f0f;
}

.dv_rosado {
    border: 3px solid #ff69b4;
    box-shadow: 0 0 10px 4px #ff69b4;
}

/* ---------- COLORIDOS ---------- */

/* ---------- lnkcolor ---------- */

.lnkcolor01:hover {
    background-color: #f00;
    color: #fff;
}

.lnkcolor02:hover {
    background-color: #0f0;
    color: #000;
}

.lnkcolor03:hover {
    background-color: #00f;
    color: #fff;
}

.lnkcolor01 {
    background-color: #FFA500;
}

.lnkcolor02 {
    background-color: #4CAF50;
}

.lnkcolor03 {
    background-color: #2196F3;
}

.lnkcolor_prrf_red {
    background-color: #f00;
}

    .lnkcolor_prrf_red:hover {
        background-color: #000;
        color: #fff;
    }

.lnkcolor_prrf_green {
    background-color: #0f0;
    color: #000;
}

.lnkcolor_prrf_green:hover {
    background-color: #000;
    color: #fff;
}

/* ---------- lnkcolor ---------- */

.dv_hj {
    cursor: pointer;
    width: 320px;
    height: 180px;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: top center;
}

    .dv_hj:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 15px rgba(0, 0, 0, 0.3);
    }

.roadmap_blocks {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
    color: #000;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    padding: 5px;
}

    .roadmap_blocks:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
    }

.lnkmidcolor {
    color: #fff;
}