body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    background-color: #fd4a21;
}

input:focus, textarea:focus, select:focus {
    outline: none;
}

a {
    text-decoration: none;
    cursor: pointer;
}

#content {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#list-projects {
    position: absolute;
    top: 10%;
    left: 10%;
    right: 10%;
    bottom: 10%;
    display: grid;
    grid-template-columns: 25% 25% 25% 25%;
    grid-template-rows: 33,33% 33,33% 33,33%;
}

.item-projects {
    display:flex;
    align-items:center;
    justify-content:center;
    -webkit-transition: -webkit-transform 0.25s; 
    transition: transform 0.25s; 
}

.item-projects:hover {
    -webkit-transform: scale(1.2, 1.2); 
    transform: scale(1.2, 1.2); 
}

.img-projects {
    width: 100%;
}

.back-button {
    height: 2vw;
    position: absolute;
    top: 2vw;
    left: 2vw;
    -webkit-transition: -webkit-transform 1s; 
    transition: transform 1s; 
}

.back-button:hover {
    -webkit-transform: rotate(360deg); 
    transform: rotate(360deg); 
}

@media only screen and (orientation: portrait) {
    
    #list-projects {
        grid-template-columns: 33.33% 33.33% 33.33%;
        grid-template-rows: 25% 25% 25% 25%;
    }

    .back-button {
        height: 3vh;
        top: 3vh;
        left: 3vh;
    }
}