
:root{
    --color1:#790D16;
    --color2:#E5D3AF;
    --color3:#F5EFE1;
    --color4:#AEC4D4;
    --color5:#f80000;
    --color6: grey;
}
tr{
    padding-top: 5px;
    padding-bottom: 5px;
}
a:hover{
    color: var(--color5);
    background-color: var(--color6);
}

@media (max-width: 768px) {
    header img{
        display: none;
    }
    body{
        margin-left: 15px;
        margin-right: 15px;
        margin-bottom: 0;
        padding-bottom: 0;
        color: var(--color3);
        background-color: var(--color4);
        font-family: 'Times New Roman', Times, serif;
    }
    div>h1{
        width: calc(100%-100px);
        padding-left: 50px;
        padding-right: 50px;
    }
    input{
        margin-top: 0;
    }
    p{
        font-weight: bold;
    }
    select{
        width: 80%;
        font-weight: 600;
    }
    td>a{
        list-style: none;
        color: var(--color1);
    }
    textarea{
        width: 90%;
        height: 25px;
    }
    table{
        width: 95%;
        
    }
    caption{
        caption-side: top;
        text-align: left;
        border: 1;
        border-radius: 7px;
        border-color: var(--color3);
        color: var(--color3);
        font-weight: bolder;
        padding: 15px 55px 15px 13px;
        background-color: var(--color1);
        margin: 0 90% 0 0;
    }
    .caja{
        background-color: var(--color2);
        padding: 30px 20px 30px 20px;
        border-radius: 15px 0 15px 0;
    }
    .ini{
        background-color: var(--color1);
    }
    .b{
        color: var(--color1);
    }
    header>div>h1{
        font-size: 20px;
    } 
    header>div>h1>a{
        text-decoration: none;
        color: var(--color3);
    }
    body>footer>h1>a{
        color: var(--color3);
        font-size: 15px;
        text-decoration: none;
        margin-top: 20px;
        padding: 0;
        
    }
    a{
        font-weight: bolder;
    }
    body>footer{
        margin-bottom: 0;
    }
    .cap_auto{
        text-align: center;
        margin: 30px 10px 0 10px;
    }
    .rojo{
        color: var(--color1);
    }
    form>a{
        margin-top: 20px;
        color: var(--color1);
    }
    td>img{
        width: 80px;
        height: 80px;
        margin-left: 40%;
    }
    .blanco{
        background-color: var(--color3);
    }
    .gorda{
        font-weight: bolder;
    }   
    .video{
        margin-left: 20px;
        margin-right: 20px;
    }
    button{
        background-color: var(--color2);
        color: var(--color1);
        height: 36px;
        font-weight: bolder;
        border-radius: 11px;
    }
    .emp{
        margin-left: 25px;
    }
    table{
        border-collapse: collapse;
    }
}

@media (min-width:769px){
    table{
        border-collapse: collapse;
    }
    body{
        
        color: var(--color3);
        background-color: var(--color4);
        font-family: 'Times New Roman', Times, serif;
    }
    div>h1{
        width: calc(100%-100px);
        padding-left: 50px;
        padding-right: 50px;
    }
    input{
        margin-top: 0;
    }
    select{
        width: 80%;
        font-weight: 600;
    }
    td>a{
        list-style: none;
        color: var(--color1);
    }
    textarea{
        width: 90%;
        height: 25px;
    }
    table{
        width: 95%;
        
    }
    caption{
        caption-side: top;
        text-align: left;
        border: 1;
        border-radius: 7px;
        border-color: var(--color3);
        color: var(--color3);
        font-weight: bolder;
        padding: 15px 55px 15px 13px;
        background-color: var(--color1);
        margin: 0 90% 0 0;
    }
    .caja{
        background-color: var(--color2);
        padding: 30px 20px 30px 20px;
        border-radius: 15px 0 15px 0;
    }
    .ini{
        background-color: var(--color1);
    }
    .b{
        color: var(--color1);
    }
    header>div>h1{
        font-size: 20px;
    } 
    header>div>h1>a{
        text-decoration: none;
        color: var(--color3);
    }
    body>footer>h1>a{
        color: var(--color3);
        font-size: 15px;
        text-decoration: none;
        margin-top: 20px;
        padding: 0;
        
    }
    body>footer{
        margin-bottom: 0;
    }
    .cap_auto{
        text-align: center;
        margin: 30px 10px 0 10px;
    }
    .rojo{
        color: var(--color1);
    }
    form>a{
        margin-top: 20px;
        color: var(--color1);
    }
    td>img{
        width: 80px;
        height: 80px;
        margin-left: 40%;
    }
    .blanco{
        background-color: var(--color3);
    }
    .gorda{
        font-weight: bolder;
    }   
    button{
        background-color: var(--color2);
        color: var(--color1);
        height: 36px;
        font-weight: bolder;
        border-radius: 11px;
    }

}