/* On screens that are more than 1400px */
@media screen and (min-width: 1400px) {   
    .altezza{
        height:660px;
    }  
}

/* On screens that are 1400px or less */
@media screen and (max-width: 1400px) {   
    .altezza{
        height:570px;
    }   
}

/* On screens that are 1200px or less */
@media screen and (max-width: 1200px) {  
    #bloccoTitoli {
        padding-left: 0rem;  
    }

    .bio{
        font-size: 17px;       
    }

    .altezza{
        height: 546px;    
    }
}

/* On screens that are 992px or less, */
@media screen and (max-width: 992px) {  
    a{
        font-size:1rem ;
    }

    h1{
        font-size: 2.5rem;
        padding-top: 0.4rem;
    }

    h2{
        font-size: 1.5rem;
    }

    #bloccoTitoli {
        padding-left: 0rem;
    }

    .bio{
        font-size: 1rem;
        
    }
    .altezza{
        height: 462px;
    }

}
  
/* On screens that are 768px or less */
@media screen and (max-width: 767px) { 
    #bloccoTitoli {
        padding-bottom: 1rem;        
    }

    #dev{       
        transform: translateX(0%);
        transform: scale(90%);
        padding: 0.5rem !important;
        margin: 0rem 0 0rem 0 !important;
    }

    h1{
        font-size: 1.5rem;
        padding-top: 1rem;
    }

    #freccia{
        transform: rotate(-45deg);
    }

    .bio{
        font-size: 1.4rem;      
    }
}

/* On screens that are 475px or less */
@media screen and (max-width: 476px) {      
    .bio{
        font-size: 1rem;       
    }

    h4{
        font-size: 1.2rem;
    }

    .card-text{
        font-size: 1rem;
    }
}

/* On screens that are 375px or less */
@media screen and (max-width: 400px) {      
    .bio{
        font-size: 0.8rem;       
    }   
}