﻿.box {
    /*font-family: 'Comic Sans MS', cursive, sans-serif !important;
    font-family: 'Annie Use Your Telescope' !important;*/
    margin: 20vh auto 0 auto;
    padding: 0;
    width: 50%;
    height: 463px;
    min-width: 300px;
    box-shadow: 0px 0px 20px 7px #000;
    /*background-image: url(/images/pizarron.jpg);*/
    background-repeat: no-repeat;
    background-color: #FFF;
    background-size: cover;
    border-radius: 5px;
    color: #00806d;
}
.box-back {
    background-color: transparent;
    border-radius:0;
    /*padding: 20px;*/
}
    .box-back div {
        display: block;
        margin:20px 0;
        text-align: center;
    }
    .box-back span, .box-back a {
        text-transform: uppercase;
        padding: 20px;
        color: #00806d;
        text-align: center;
    }
.box-header span{
    font-size: 3em;
}
.box-body span {
    font-size: 2em;
}
a.btnvolver {
    margin-top:30px;
    color: #FFFFFF;
    text-decoration: none;
    font-size: 2em;
    border-radius: 10px;
    padding: 5px 10px;
    text-transform: uppercase;
    cursor: pointer;
    background-color: #00806d;
    border: solid 3px #00806d;
}
    a.btnvolver:hover,
    a.btnvolver:active,
    a.btnvolver:focus {
        text-decoration: none;
        background-color: rgb(255,255,255);
        color: #00806d;
    }
@media (max-width: 1366px) {
    .box {
        width: 70%;
    }
}
@media (max-width: 1200px) {
    .box {
        width: 80%;
    }
}
@media (max-width: 900px) {
    .box {
        width: 90%;
        margin: 20vh 0 0 2%;
    }
    .box-header span{
        font-size: 4em;
    }
    .box-body span {
        font-size: 2em;
    }
}
@media (max-width: 767px) {    
    .box-header span{
        font-size: 2.5em;
    }
    .box-body span {
        font-size: 1.3em;
    }
}
@media (max-width: 620px) {    
    .box {
        /*margin: 10vh auto 0 auto;
        width:400px;*/        
        width: 96%;
        /*margin: 20vh auto 0 auto;*/
    }
}
@media (max-width: 480px) {    
    /*.box {
        margin: 10vh auto 0 auto;
        width:300px;
    }*/
    .box-header span{
        font-size: 2.5em;
    }
    .box-body span {
        font-size: 1.5em;
    }
}
@media (max-width: 375px) {
    body {
        font-size: 80%;
        /*min-width:350px;*/
    }
}