/* Partes comunes a todo el documento */
:root {
    --dark: #333333;
    --light: white;
    --light-blue: #99ccff;
    --mobile: 1080px;
}

@font-face {
    font-family: JuliaMono;
    src: url("/fonts/JuliaMono-RegularLatin.woff2") format("woff2");
    text-rendering: optimizeLegibility;
    font-style: normal;
}

html {
    font-family: JuliaMono;
    background-color: #333333;
    color: white;
    margin: 0 10% 0 10%;
}

@media only screen and (max-width:1080px) {
    html {
        margin: 0;
    }
}

p {
    text-indent: 40px;
}

hr {
    border: 1px dashed var(--light);
}

blockquote {
    font-style: italic;
    border-left: 5px solid var(--light);
    padding-left: 20px;
    margin: 0;
}

/* Cosas de encabezado y pie de página */
header, footer {
    text-align: center;
}

@keyframes arcoiris {
    04% { color: #FF00CC }
    08% { color: #FF00CC }
    12% { color: #EE34D2 }
    16% { color: #50BFE6 }
    20% { color: #AAF0D1 }
    24% { color: #66FF66 }
    28% { color: #FFFF66 }
    32% { color: #FFFF66 }
    36% { color: #FFCC33 }
    40% { color: #FF9933 }
    44% { color: #FF9966 }
    48% { color: #FF6037 }
    52% { color: #FF355E }
    56% { color: #FF355E }
    60% { color: #FD5B78 }
    64% { color: #FF6037 }
    68% { color: #FF9933 }
    72% { color: #FFCC33 }
    76% { color: #FFFF66 }
    80% { color: #FFFF66 }
    84% { color: #CCFF00 }
    88% { color: #AAF0D1 }
    92% { color: #50BFE6 }
    96% { color: #FF6EFF }
    100% { color: #FF00CC }
}

footer a {
    font-style: italic;
    animation: arcoiris 5s linear infinite alternate;
}

/* */


h1 a {
    color: white;
    text-decoration: none;
}

a {
    color: var(--lgblue);
}

a:hover {
    font-style: italic;
}

nav li {
    display: inline;
}

nav a {
    color: white;
    text-decoration: none;
}

table, th, td {
    border: 1px solid white;
    border-collapse: collapse;
}

table {
    width: 50%;
    margin-left: auto;
    margin-right: auto;
}

img {
    max-width: 100%;
}

/* figures */
.fig-right {
    margin: auto;
    display: block;
    text-align: center;
    max-width: 100%;
    float: right;
    clear: both;
    padding: 10px;
}

.fig-right img {
    max-width: 500px;
}

figcaption {
    display: block;
    font-style: italic;
}