:root {
    /* ---------------- Background ---------------- */
    /* Paquete 1 */
    --color-bg-salmon01: #E97783;
    --color-bg-salmon02: #CF4545;
    --color-bg-salmon03: #b74569;
    /* Paquete 2 */
    --color-bg-orange01: #F0A33D;
    --color-bg-orange02: #E65C36;
    /* Paquete 3 */
    --color-bg-gold01: #EFC45B;
    --color-bg-gold02: #EE943A;
    --color-bg-green01: #5bb8b2;
    /* ------------ Color - Background ------------ */
    /* Paquete 1 */
    --color-text-salmon01: #E97783;
    --color-text-salmon02: #CF4545;
    --color-text-salmon03: #b74569;
    /* Paquete 2 */
    --color-text-orange01: #F0A33D;
    --color-text-orange02: #E65C36;
    /* Paquete 3 */
    --color-text-gold01: #EFC45B;
    --color-text-gold02: #EE943A;
    /* ------------------- Color ------------------ */
    /* Colores para texto */
    --color-text-yellow01: #f8edad;
    --color-text-yellow02: #e2f960;
    --color-text-salmon: #f0133e;
    --color-text-blue: #003b4b;
}

/* ---------------- Background ---------------- */
.color-bg-salmon01 {
    background-color: var(--color-bg-salmon01);
}

.color-bg-salmon02 {
    background-color: var(--color-bg-salmon02);
}

.color-bg-salmon03 {
    background-color: var(--color-bg-salmon03);
}

.color-bg-salmon03:hover, .color-bg-salmon03:focus {
    background-color: var(--color-bg-salmon02);
}

.color-bg-orange01 {
    background-color: var(--color-bg-orange01);
}
.color-bg-orange01:hover, .color-bg-orange01:focus {
    background-color: var(--color-bg-orange02);
}

.color-bg-orange02 {
    background-color: var(--color-bg-orange02);
}

.color-bg-gold01 {
    background-color: var(--color-bg-gold01);
}
.color-bg-gold01:hover, .color-bg-gold01:focus {
    background-color: var(--color-bg-gold02);
}

.color-bg-gold02 {
    background-color: var(--color-bg-gold02);
}

.color-bg-green01 {
    background-color: var(--color-bg-green01);
}

/* ------------ Color - Background ------------ */
.color-text-salmon01 {
    color: var(--color-text-salmon01);
}

.color-text-salmon02 {
    color: var(--color-text-salmon02);
}

.color-text-salmon03 {
    color: var(--color-text-salmon03);
}

.color-text-orange01 {
    color: var(--color-text-orange01);
}

.color-text-orange02 {
    color: var(--color-text-orange02);
}

.color-text-gold01 {
    color: var(--color-text-gold01);
}

.color-text-gold02 {
    color: var(--color-text-gold02);
}

/* ------------------- Color ------------------ */
.color-text-yellow01 {
    color: var(--color-text-yellow01);
}

.color-text-yellow02 {
    color: var(--color-text-yellow02);
}

.color-text-salmon {
    color: var(--color-text-salmon);
}

.color-text-blue {
    color: var(--color-text-blue);
}

@font-face {
    font-family: "OpenSans";
    src: url("../fonts/Raleway-Medium.ttf"),
        url("../fonts/Raleway-Light.ttf") format("truetype"),
        url("../fonts/Raleway-Regular.ttf") format("truetype"),
        url("../fonts/Raleway-SemiBold.ttf") format("truetype"),
}

body {
    font-family: "OpenSans", sans-serif;
}

a {
    color: black;
}

.fontSize33 {
    font-size: 33px;
}

.fontSize14 {
    font-size: 14px;
}

.fontSize20{
    font-size: 27px;
}