* {
    list-style-type: none;
    box-sizing: border-box;
    text-decoration: none;
}


body {
    font-family: 'Amiamie', Arial Rounded MT Bold;
    line-height: 1.3em;
    background-color: lightgray;
    overflow-x: hidden;
}



.cv-contact-tel{
    display: none;
}

@font-face {
    font-family: 'Amiamie';
    src: url(fonts/Amiamie-RegularRound.woff);
}

a {
    color: black;
}

h1 {
    font-size: 40px;
}

a h1:hover {
    text-shadow: 10px 10px 10px rgb(255, 108, 221);
}

h2 {
    font-size: 30px;
    margin-top: 29vh;
}

h3 a:hover {
    text-shadow: 10px 10px 10px rgb(255, 108, 221);
}

h3 {
    font-size: 25px;
    line-height: 1.3em;
    margin-bottom: -7vh;
}

p {
    font-size: 14px;
    line-height: 1.3em;

}
.pdf{
    text-decoration: underline;
    cursor: pointer;
}



/*bouton typo/edition */
button {
    border: none;
    background: none;
    font-family: 'Amiamie', Arial Rounded MT Bold;
    cursor: pointer;
}

button p {
    font-size: 25px;
}

/*infos à gauche*/
.infos {
    position: fixed;
    width: 24%;
    margin-left: 10px;

}

.navbar {
    z-index: 1;
    position: fixed;
    margin-left: 24%;
}

.navbar p {
    padding-left: 19vw;
}

.navbar p:hover {
    text-shadow: 10px 10px 10px rgb(255, 108, 221);
}

.container-projets {
    width: 73%;
    float: right;

}

.ascii {
    position: absolute;
    z-index: 1;
    white-space: pre;
    font-family: "Woven";
    animation: 1.2s infinite alternate linear anim-index;
    animation-timing-function: ease-in-out;
    font-size: 7px;
    line-height: 1.2em;
}
img {
    margin-top: 10vh;
    width: 100%;
    position: relative;
    filter: drop-shadow(5px 5px 5px darkgrey);
}

.woven{
    position: absolute;
    z-index: 1;
    left: 120vh;
    top: 50vh;
    font-family: "Woven";
    animation: 1.2s infinite alternate linear anim-index;
    animation-timing-function: ease-in-out;
    font-size: 50px;
}

.img-ordi{
    display: block;
}

.img-tel{
    display: none;
}

@keyframes anim-index {
    from {
        font-variation-settings: 'weav'900;
    }

    to {
        font-variation-settings: 'weav'1;
    }
}

@font-face {
    font-family: "Woven";
    src: url(./fonts/Woven.ttf);
}

.ordi{
    display: none;
    font-size: 15px;
    line-height: 1.3em;
    margin-top: 1vh;
}

/* scrollbar */
/* width */
::-webkit-scrollbar {
    width: 20px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;

}

/* Handle */
::-webkit-scrollbar-thumb {
    background: rgb(255, 108, 221);
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: blue;
}

@media screen and (max-width: 600px) {

body{
    width: 97%;
}

.container-projets{
    width: 100%;
    z-index: 1;
}

.navbar{
    display: none;
}

.infos{
    width: 100%;

}

h3{
    font-size: 23px;

}

h2{
    margin-top: 8vh;
}
p{
    margin-top: 15vh;
}

.ascii{
    top: 20vh;
}

img{

    top: 20vh;
    margin-bottom: 20vh;
}

.ordi{
    display: block;
}

.image-index{
    margin: 0 1vh 13vh 1vh;
    width: 100%;
    height: 100%;
}

.img-ordi{
    display: none;
}

.img-tel{
    display: block;
    margin-bottom: 30vh;
}

.cv-contact-ordi{
display: none;
}

.cv-contact-tel{
    display: block;

}

}

@media screen and (max-width: 900px) {

    body{
        width: 97%;
    }
    
    .container-projets{
        width: 100%;
        z-index: 1;
    }
    
    .navbar{
        display: none;
    }
    
    .infos{
        width: 100%;
    
    }
    
    h3{
        font-size: 23px;
    
    }
    
    h2{
        margin-top: 8vh;
    }
    p{
        margin-top: 15vh;
    }
    
    .ascii{
        top: 20vh;
    }
    
    img{
    
        top: 20vh;
        margin-bottom: 20vh;
    }
    
    .ordi{
        display: block;
    }
    
    .image-index{
        margin: 0 1vh 13vh 1vh;
        width: 100%;
        height: 100%;
    }
    
    .img-ordi{
        display: none;
    }
    
    .img-tel{
        display: block;
        margin-bottom: 30vh;
    }
    
    .cv-contact-ordi{
    display: none;
    }
    
    .cv-contact-tel{
        display: block;
    
    }
    
    }