html, body {
    margin:0px;
    padding:0px;
    background:black;
}
body {
    width:100vw;
    height:100vh;
}

div#main {
    display:flex;
    justify-content: center;
    align-items: center;
    width:100%;
    height:100%;
}

.entry#museum {
    background: url("images/museum.jpg");
}
.entry#trezoros-video {
    background: url("images/trezoros.jpg");
}
#main .entry {
    width:100%;
    max-width:50%;
    height:100%;
    
    display:block;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    transition: all 0.22s;

}
#main .entry .content {
    width:100%;
    height:100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    color:white;
    flex-direction: column;
    transition: all 0.22s;
}
#main .entry#museum .content {
    background-color:#AA002244;
}
#main .entry#trezoros-video .content {
    background-color:#2255AA44;
}
#main .entry#museum:hover .content {
    background-color:#AA0022AA;
}
#main .entry#trezoros-video:hover .content {
    background-color:#2255AAAA;
}

.entry .content:hover a {
    transform: scale(1.2);
}
.content a {
    transition: all 0.3s;
    color:white;
    font-family: sans-serif;
    font-size:2rem;
    text-decoration: none;
    background-color: #000C;
    padding:15px;
}
a sub {
    font-size:10pt;

}
#main .entry .content p, #main .entry .content sub {
    max-width: 80%;
    background-color: #000000CC;
    padding: 5px;
}

@media screen and (max-width:1023px) {
    #main {
        flex-direction: column;
    }
    #main .entry {
        max-width: 100%;
    }
    #main .entry .content p, #main .entry .content sub {
        display: none;
    }
}