.pagina{
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: rgb(151, 195, 253);
    color: white;
    font-family: 'Roboto', sans-serif;
} 

.sfondo{
    background-image: url(../imm/background/background_day.png);
    padding-bottom: 50px;
}

.palazzo{
    width: 80%;
    margin-top: 96px;
}

.tetto{
    padding-top: 10px;
}

.tetto_copertura{
    display: flex;
    justify-content: center;
    background-image: url(../imm/tetto.png);
    background-position: center;
    background-repeat: repeat-x;
    background-size: 248px 232px;
    padding-top: 5px;
    /*padding-bottom: 5px;*/
    clip-path: polygon(15% 0%, 0% 90%, 0% 100%, 100% 100%, 100% 90%, 85% 0%);
}

.facciata{
    background-image: url(../imm/background/paper.jpg);
    height: 100%;
    /* border-image: url(../imm/0_.png) 100 / 10px; */
}

/* Full screen*/
.cross{
    width: 100%;
    height: 100%;
    background-image: url(../imm/cross1.png);
    background-size: 150px 150px;
    background-position: center;
    background-repeat: no-repeat;
}

.finestra_tonda{
    border-radius: 100%;
    width: 125px;
    height: 125px;
    margin-top: 75px;
    margin-bottom: 25px;
    padding: 0px;
    background-image: url(../imm/0_.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 125px 125px;
    border: 10px solid black;
    transition: background-size .5s;
}

.finestra_tonda:hover{
    background-size: 250px 250px;
    border-color: black;
}

.finestra{
    margin-top: 40px;
    margin-bottom: 40px;
    margin-left: 20px;
    margin-right: 20px;
    width: 250px;
    height: 300px;
    color: white;
    background-size: 250px 300px; 
    background-color: transparent;
    border-color: transparent;
    /* background-image: url(../imm/fin2.jpg); */
    background-position: center;
    background-repeat: no-repeat;
}

.finestra:hover{
    color: transparent;
    background-color: transparent;
    border-color: transparent;
    text-decoration: none! important;
}

/* Tablet */
@media screen and (max-width: 767px) {
    .tetto_copertura{
        background-size: 171px 160px;
    }

    .cross{
        width: 100%;
        height: 100%;
        background-image: url(../imm/cross.png);
        background-size: 120px 120px;
        background-position: center;
        background-repeat: no-repeat;
    }
    
    .finestra_tonda{
        margin-top: 45px;
        margin-bottom: 10px;
        width: 100px;
        height: 100px;
        background-size: 100px 100px;
        border: 5px solid black;
    }
    
    .finestra_tonda:hover{
        background-size: 200px 200px;
    }
    
    .finestra{
        margin-top: 20px;
        margin-bottom: 20px;
        margin-left: 5px;
        margin-right: 5px;
        width: 150px;
        height: 180px;
        background-size: 150px 180px;
    }
}

/* Smartphone */
@media screen and (max-width: 570px) {
    .tetto_copertura{
        background-size: 126px 125px;
    }

    .cross{
        width: 100%;
        height: 100%;
        background-image: url(../imm/cross1.png);
        background-size: 80px 80px;
        background-position: center;
        background-repeat: no-repeat;
    }
    
    .finestra_tonda{
        margin-top: 35px;
        margin-bottom: 10px;
        width: 75px;
        height: 75px;
        background-size: 75px 75px;
        border: 5px solid black;
    }
    
    .finestra_tonda:hover{
        background-size: 150px 150px;
    }
    
    .finestra{
        margin-top: 20px;
        margin-bottom: 20px;
        margin-left: 10px;
        margin-right: 10px;
        width: 125px;
        height: 150px;
        background-size: 125px 150px;
    }

    .testo{
        font-size: 2rem;
    }
}

/* medium */
@media screen and (max-width: 362px) {
    .finestra{
        margin-top: 20px;
        margin-bottom: 20px;
        margin-left: 5px;
        margin-right: 5px;
        width: 83px;
        height: 100px;
        background-size: 83px 100px;
    }
    
    .testo{
        font-size: 1.5rem;
    }
}

/* small */
@media screen and (max-width: 348px) {
    .finestra{
        margin-left: 25px;
        margin-right: 25px;
    }

}
@media screen and (max-width: 332px) {
    .finestra{
        margin-left: 20px;
        margin-right: 20px;
    }

}
@media screen and (max-width: 332px) {
    .finestra{
        margin-left: 15px;
        margin-right: 15px;
    }

}
@media screen and (max-width: 282px) {
    .finestra{
        margin-left: 10px;
        margin-right: 10px;
    }

}
@media screen and (max-width: 257px) {
    .finestra{
        margin-left: 5px;
        margin-right: 5px;
    }

}