body{
    color:#fff;
    font-family: "Walter Turncoat", cursive;
    font-size: 16px;
}
body:after{
    content:"";
    position:fixed; /* stretch a fixed position to the whole screen */
    top:0;
    height:110vh; /* fix for mobile browser address bar appearing disappearing */
    left:0;
    right:0;
    bottom: 0;
    z-index:-1; /* needed to keep in the background */
    background: url(pizarra2.jpg) center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
h2{font-family: 'Fredericka the Great', cursive; font-size: 30px; text-shadow:2px 2px 3px #999999;}
a{text-decoration: none;}
a:hover{text-decoration: underline;}
table{font-size: 20px; min-width: 80%;}
table thead th{text-align: left; font-size: 26px; padding: .8em 10px; border-bottom: 1px outset #fff; width: 30%;}
table tbody td{padding: 1em 10px; border-bottom: 1px outset #fff; width: 30%; letter-spacing:2px;}
table tbody td span+span:before{content:'/';}
table .troff{display: none !important;}

.filtro{width:40%;}
.filtro input{width:85%; border: none; outline: none; vertical-align: baseline; font-size:30px; font-style: italic;}
.filtro .mdi{font-size: 30px; width:15%;}

.manita{cursor: pointer;}

@media(max-width:1100px){
    .filtro{width:60%;}
    table{min-width: 100%;}
}
@media(max-width:800px){
    .filtro{width:90%;}
}
@media(max-width:680px){
    table{width: 100%;}
    table thead tr{display:block; border-bottom:1px outset #fff;}
    table thead th{display:inline; padding: .8em 0;border-bottom: 0;}
    table thead th:after{content:','; display: inline; padding: 0 5px 0 2px;}
    table thead th:last-child:after{content: '';}
    table tbody tr{display:block; border-bottom:1px outset #fff; padding:1em 0;}
    table tbody td{display:inline; border-bottom: 0; padding: 0;}
    table tbody td:after{content:','; display: inline; padding-right: 3px;}
    table tbody td:last-child:after{content:'';}
}