body {
    font-family: 'FiraCode Nerd Font', 'Liberation Sans', sans-serif;
    background-color : rgb(15, 2, 36);
    margin: 50px;
}

header {
    font-size: 30px;
    color: rgb(42, 7, 100);
    background-color: rgb(29, 197, 240);
    text-align: center;
    margin-left: -50px;
    margin-right: -50px;
    margin-top: -50px; 
    padding: 20px;
}

h1 {
    font-size: 60px;
    color: rgb(98, 224, 247);
}

h2 {
    font-size: 30px;
    color: rgb(71, 215, 121);
}

h3 {
    font-size: 25px;
    color: rgb(35, 236, 78);
}

p, table {
    font-size: 16px;
    text-align: justify;
    color: rgb(221, 218, 218);
    line-height: 1.6;
}

a {
    color: rgb(55, 202, 228)
}

code {
    color: chartreuse;
    font-size: 14px;
}

li {
    color: rgb(221, 218, 218);
}

/* Texto de plantillas */

.aviso::before, .advertencia::before, .importante::before, .notice::before {
    font-weight: bold;
    white-space: pre;
}

.aviso::before {
    content: "AVISO:\A\A";
}

.notice::before {
    content: "NOTICE:\A\A";
}

.advertencia::before {
    content: "ADVERTENCIA:\A\A";
}

.importante::before {
    content: "IMPORTANTE:\A\A";
}

/* Fin de texto de plantillas */

/* Estilos generales de plantillas */

.aviso, .advertencia, .importante, .notice {
    padding: 10px;
    border-radius: 5px;
    font-size: 17px;
    text-align: center;
}

.aviso, .notice {
    background-color: orange;
    a {
        color: rgb(7, 61, 97);
    }
}

.advertencia {
    background-color: red;
}

.importante {
    background-color: rgb(15, 156, 15);
}

/* Fin de estilos generales de plantillas */

.categoria {
    margin-bottom: 30px;
}

footer {
    background-color: rgb(87, 87, 87);
    padding: 10px;
    text-align: center;
    margin-left: -50px;
    margin-right: -50px;
    margin-bottom: -50px;
    a {
        text-decoration: none;
        font-size: 40px;
    }
    p {
        text-align: center;
    }
}