/*
   Copyright, 2025. Jaime E. Villate
   Version: 2025-07-25
   License: public domain: use it and modify it as you wish
   Based on the HTML and CSS tutorials at https://www.w3schools.com
*/
* {box-sizing: border-box; }
body {
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 0.8em;
    background: white;
    margin: 0;
}
.languagebtn, .sectionsbtn {
    background-color: #dee7f5;
    padding-left: 5px;
    padding-right: 5px;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    height: 2.5em;
    border: 1px solid #d4d4d4;
    border-radius: 4px;
    cursor: pointer;
}
.languagebtn span, .sectionsbtn span {
    display: none;
}
.language, .sections {
    position: relative;
    display: inline-block;
}
.language { float: right; }
.sections { float: left; }
.language-content, .sections-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 10em;
    text-align: left;
    box-shadow: 0px 0.3em 0.6em 0px rgba(0,0,0,0.2);
    z-index: 1;
}
.language-content {
    right: 0;
}
.sections-content {
    left: 0;
}
.language-content a, .sections-content a {
    color: black;
    padding: 5px 10px;
    text-decoration: none;
    display: block;
}
.language-content a:hover, .sections-content a:hover {
    background-color: #a4b7d8;
    color: #3333aa;
}
.language:hover .language-content, .sections:hover .sections-content {
    display: block;
}
.language:hover .languagebtn, .sections:hover .sectionsbtn {
    background-color: #546284;
    color: #bbccff;
}
.header {
    padding: 10px;
    text-align: center;
    background: white;
}
.header h1 {font-size: 50px; }
.card {
    background-color: white;
    padding: 10px;
    margin-top: 10px;
}
.footer {
    padding: 20px;
    text-align: center;
    background: #a4b7d8;
    margin-top: 20px;
}
img.contract {
    max-width:100%;
    height:auto;
    display: block
}
img.contract2 {
    max-width:80%;
    height:auto;
    display: block
}
img.center {
    margin-left: auto;
    margin-right: auto;
    display: block
}
pre.maxima {
    border: 1px solid #334669;
    padding: 0.7em;
    line-height: 2.6ex;
    font-family: "Courier New", "DejaVu Sans Mono", monospace;
    width: auto;
    word-wrap: break-word;
    background-color: #fdf6e3;
    border-radius: 0.7ex;
}
table.bordered {border-collapse:collapse;}
table.bordered td, th {
    border:1px solid black;
    padding:0.5em;
}
a { text-decoration: none }
a:link {
    color: #00f
}
a:visited {color: #a0a }
a:hover, span.button:hover {
    background-color: #555753;
    color: #cdf;
}
pre, tt, code { font-family: "Courier New", "DejaVu Sans Mono", monospace }
.spacious li { padding-bottom: 0.6em; }
.spacious dd { padding-bottom: 1em; }
span.maxlabel { color: #d00}
span.maxinput { color: blue}
blockquote.letter {
    background-color: white;
    padding: 1em;
    margin: 0;
    border: 1px solid #99c;
    font-style:normal
}

@media screen and (min-width: 480px) {
    body {
        font-size: 1em;
        background: #dee7f5;
        padding: 20px;
    }
    .languagebtn, .sectionsbtn {
        font-size: 1em;
    }
    .languagebtn span, .sectionsbtn span {
        display: inline;
    }
    .card {
        max-width: 640px;   
        padding: 15px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 20px;
    }
    .header, .footer {
        max-width: 1000px;
        padding: 15px;
        margin-left: auto;
        margin-right: auto;
    }
}
@media (prefers-color-scheme: dark) {
    body { background: #444 }
    .languagebtn, .sectionsbtn {
        border: 1px solid #333;
        background-color: #555753;
        color: #bcf
    }
    .language-content, .sections-content { background-color: #555 }
    .header {
        background: #666;
        color: #ffe
    }
    .card {
        background-color: #444;
        color: #eee
    }
    .footer {
        background: #2e3436;
        color: #aaa
    }
    pre.maxima { color: #2e3436 }
    a:link {
        color: #9df;
    }
    a:visited {color: #9fd }
    a:hover, span.button:hover {
        background-color: #ddd;
        color: #55f;
    }
    blockquote.letter {
        background-color: #666;
        border: 1px solid black;
    }
}
