@media (max-width:600px) {
    main{
        overflow-y: scroll;
        overflow-x: hidden;
    }
    #follower{
        display: none;
    }
    #menu{
        width: 100vw;
        height: 30vh;
        flex-direction: column;
        background-color: white;
        position: fixed !important;
        bottom: 0px;
        padding: 0 0 5vh 0;
        visibility: hidden;
        top: unset;
    
    }
    #menu ul{
        flex-direction: column;
        width: 100%;
        height: 70%;
    }
    #menu ul > *{
        width: 50vw !important;
        font-size: 1.8vh;
        height: fit-content;
    }
    #menu ul li a {
        position: absolute;
        width: 50vw !important;
        height: 2vh;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    #menu .contourVert {
        display: none;
    }

    #reseaux {
        flex-direction: row;
        align-items: center;
        justify-content: center;
        font-size: 1.5vh; 
        gap: 5vw;
    }
    .mobilieM{
        display: block;
    }
    #menu svg {
        display: none;
    }
    

    #home{
        flex-direction: column-reverse;
        
    }
    #home h2{
        margin-top: 1vh;
        font-size: 1.8vh;
    }
  
    #croixMobile{
        display: block;
        position: fixed;
        right: 5vw;
        bottom: 7vh;
        height: 7vh;
        width: 7vh;
        border-radius: 20vh;
        z-index: 200000;
        visibility: visible;
        transform: rotate(90deg);
        transform-origin: center;
        background-color: var(--vert);
        border: 0px solid transparent;
        font-size: 2.5vh;

        
    }
    #croixMobile::before{
        content: '|||';
    }

    .mOpen{
        visibility: visible !important;

    }
   
    body:has(.mOpen) #croixMobile::before {
        content: '';
    }
    body:has(.mOpen) #croixMobile::after {
        content: '\2715';
    }

    #home {
        margin-top: 3vh;
        height: 100vh;
    }
    #hometel{
        width: 100vw;
        height: fit-content;
        mix-blend-mode: multiply;
        margin: -15vh;
    }
    #foottel{
        width: 80vw;
        height: fit-content;
    }
    
    #descriptionComp{
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: flex-start;
        height: fit-content;
    }
    #descriptionComp .content {
        columns: 1;
        height: fit-content !important;
        font-size: 2vh;
        line-height: 2.4vh;
        position: absolute;
        top: 0;
        left: 15vw;
        width: 70vw;


    }
    #comp{
        height: 100vh;
        width: 100vw;
        display: flex;
        flex-direction: column;
        align-items: center;
    
    }
    #imgComp{
        position: relative;
        width: 100vw;
        height: auto;
    }
    #imgComp img {
        display: inherit;
        position: relative;
        width: 100%;
        height: auto;
        object-fit: cover;
      }
    
    #compContour{
        grid-template-rows: unset !important;
    }

    .open{
        height: fit-content !important;
    }
    .imMembre{
        display: block;
        left: 10vw;
        position: relative;
        width: 80vw;
        z-index: 1;
    }
    .membre .slug{
        margin-top: -5vh;
        z-index: 2;
        position: relative;
    }
    .membreBio{
        font-size: 1.4vh;
        line-height: 1.8vh;
    }
    .membreBio .texte{
        columns: 1;
        position: relative;
    }
    #agenda{
        padding-top: 2vh;
    }
    #agenda ul:first-of-type{
        margin-top: 5vh;
    }
    #agenda li{
        height: 5vh;
        width: 90vw;
        grid-template-columns: 40vw 30vw 30vw;
        grid-template-rows: 1fr;
        font-size: 1.3vh;
        padding: 1vh 0;
    }
    .titlePlace{
        grid-column: 2/3;
        grid-row: 1/2;
        font-size: 0.7vh;
        align-self: flex-end;
        margin-bottom: 0.2vh;
    }
    .typeEv{
        grid-column: 2/3;
        grid-row: 1/2;
        font-size: 0.7vh;
        align-self: flex-start;
        margin-top: 0.2vh;
        
    }
    #years {
        display: none;
    }
    footer{
        height: 100vh;
        background-color: var(--vert) !important;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    #filet{
        display: none;
    }
    footer>* {
        font-size: 2vh !important;
        align-self: center !important;
    }
    footer span{
        height: 3vh;
    }
    footer a{
        height: 3vh;
    }
    #fNom, #fAdresseMail, #fCredits{
        display: flex;
        flex-direction: column;
        width: 100vw;
        height: fit-content;
        align-items: center;
        justify-content: flex-start;
        gap: 1vh;
    }
    #fNom{
        margin-top: 5vh;
    }
    #fCredits{
        position: absolute;
        bottom: 10vh;
    }
    
    .tiret, .addM{
        display: none;
    }
   
    #follower {
        display: none !important;
    }
    .creaPres{
        height: fit-content;
        width: 100vw;
        padding: 1vh 10vw;
        columns: 1;
        column-gap: 0;
        font-size: 1.7vh;
        line-height: 4vw;
        z-index: 3;
        position: relative;
    }

    .mob{
        display: block;
        position: relative;
    }

  
    .imcrea{
        display: none;
        width: 60vw;
        left: 20vw;
        position: relative;
        margin-top: 10vh;
        margin-bottom: 5vh;
    }
    .preview{
        display: none;
    }
    .diapo {
        height: 30vh;
    }
    .diapo img {
        position: absolute;
        width: 100vw;
        object-fit: cover;
    }
    .creaCredits{
        display: grid;
        grid-template-columns: repeat(3, 32vw);
        column-gap: 1vw;
        padding: 0 1vw;
    }
    .creaCredits p{
        font-size: 2.5vw;
        line-height: 3vw;
        margin: 0.5vh;
        width: 47vw;
        padding: 1.7vh;
        border-radius: 7vw;
    }
    .creaCredits p:nth-child(n+1){
        grid-column: 1/2;
        justify-self: flex-start;
        
    }
    .creaCredits p:nth-child(n+2){
        grid-column: 3/4;
        justify-self: flex-end;
    }
    .creaCredits p:nth-child(n+1):last-of-type{
        grid-column: 2/3;
        justify-self: center;
    }
    .textCrea {
        display: none;
    }

    .mobileM{
        display: block;
    }


}
@media (min-width:1300px){
    #menu svg text {
        font-size: 14px;
    }
    #follower{
        width: 300px;
        height: 300px;
    }
    #descriptionComp .content{
        font-size: 1.2vw;
    }
    #compContour{
        font-size: 1.2vw;
        line-height: 1vw;
    }
    #years {
        gap: 0vw;
    }
    #years svg text {
        font-size: 1vw;
    }
}


@media (min-width:2000px){
    #menu svg text {
        font-size: 16px;
    }
    #follower{
        width: 400px;
        height: 400px;
    }
    #descriptionComp .content{
        font-size: 1vw;
    }
    #compContour{
        font-size: 1vw;
        line-height: 1vw;
    }
    

    
}