KyFlo/Assets/css/resp.css

@media screen and (max-width: 600px) {
    
    /*===========GENERAL===========*/
    h1{
        font-size: 3vw;
    }
    body>#bienvenue>h1 {
        font-size: 3vw;
    }
    
    body>#bienvenue>h2 {
        font-size: 2vw;
    }
    button#hautPage{
        display:none;
    }

    /*===========NAVBAR===========*/
    nav{
        position: static;
    }
    nav input[type=text] {
        float: none;
        display: block;
        text-align: left;
        width: 76.5%;
        border: 0.1vw solid black;
        margin: 0;
        padding: 2vw;
        transform: none;
        font-size: 3vw;
    }
    nav a {
        float: none;
        display: block;
        text-align: left;
        width: 100%;
        margin: 0;
        padding: 2vw;
        border: none;
        transform: none;
        font-size: 3vw;

    }
    nav a#kyflo{
        font-size: 8vw;
        text-align: center;
    }
    nav a#panier,
    a.raccourci {
        border: none;
    }
    nav a#panier{
        width: 20%;
        margin-right: -14%;
    }
    nav a#panier:hover{
        margin-right: -14%;
    }
    nav a.raccourci:hover,
    a.raccourci:hover {
        padding: 2vw 2vw;
    }
    nav a#go {
        width: 5%;
        padding: 1vw;
        font-size: 3vw;
        border: 0.1vw solid rgb(0, 0, 0)
    }
    nav a#panier>h3{
        display:none;
    }
    /*===========FLEX CONTAINER===========*/
    .flex-container>div {
        width: 80%;
        margin-left: auto;
        margin-right: auto;
    }
    .flex-container>div>a>img {
        width: 20%;
    }

    .flex-container div:hover img{
        width: 30%;
    }

    .flex-container div.out:hover img{
        width: 20%;
        cursor: not-allowed;;
    }

    #content {
        margin-left: 2vw;
        margin-right: 2vw;
    }

    /*=======QUI SOMMES NOUS======*/
    div#nous .flex-container img{
        width: 30%;
    }

    div#nous .flex-container div{
        width: 40%;
    }

    div#nous .flex-container div#engagements{
        width: 80%;
        border: none;
    }

    /*========FOOTER=========*/

    th {
        font-size: 2.5vw;
    }

    td {
        width: 20%;
        font-size: 2vw;
    }


    /*=====Produits=======*/
    #Produit>h3 {
        font-size: 2.5vw;
    }

    #Carac>h2 {
        font-size: 2.5vw;
        color: lightgrey;
    }
    
}