/* Général */
body {
    font-family: 'Manrope', "sans-serif";
    font-size: 1em;
}

a {
    color:#242424;
    font-family:"Manrope", "sans-serif";
    text-decoration:none;
}

a:hover {
    text-decoration:underline;
}

h1 {
    font-size:3.5em;
    color:s#A5B4FC;
}

h3 {
    text-align: center;
}

p {
    font-size: 1.1em;
}

/*Navigateur*/

nav {
    display: flex;
    justify-content: space-between;
    padding:0 2% 1% 2%;
}

.nav {
    display:flex;
    width: 20%;
    justify-content: space-around;
}

/* Première section de chaque page*/
.background {
    background-color: #1F2039;
    border-top: 1px solid #1F2039;
    border-bottom: 1px solid #1F2039;
    padding-left: 2%;
    color:white;
}

/*Propriétés bouton*/
.button {
    background: linear-gradient(to right, #8E86B5, #ACAEED);
    font-family: "Montserrat", "sans-serif";
    color: white;
    border-radius: 50px;
    padding: 1% 3% 1% 3%;
    border:none;
}

.button:hover {
    text-decoration:none;
    background: linear-gradient(#696484, #8788BA)
}

/*Footer*/

footer {
    display: flex;
    justify-content: space-between;
    padding:1% 2% 0 2%;
}

.icone:hover  {
    opacity:0.5;
}

/* Nav + footer*/
.logo:hover {
    opacity:0.5;
}

@media screen and (max-width: 960px) {
    nav {
        flex-direction: column;
        align-items: center;
    }

    .nav {
        width: 100%;
    }

    .background, .form_back {
        padding: 3% 5% 3% 5%;
    }

    .accueil {
        flex-direction: column;
    }
    
    .accueil h1 {
        font-size: 250%;
    }

    .photo_accueil {
        order: 1;
    }
    
    .presentation {
        width: 100%;
        order: 2;
        text-align: center;
    }


    .sec_project img{
        display: flex;
        width: 100%;
        padding-bottom: 4%;
    }

    form {
        display:inline;
    }

    .block_propos {
        width: 100%;
        padding: initial;
    }

    .contenu {
        border: none;
    }

    .tableau {
        display:none;
    }

    .paysages, .portraits {
        grid-template-columns: 1fr;
    }

    .paysages img {
        padding-bottom: 2%;
    }
    }