@charset "UTF-8";
/* CSS Document */


*, ::before, ::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body { display: flex; flex-direction: column; background-position: center; background-repeat: no-repeat; margin: 0; padding: 0; height: 100vh; background-color: #F3F2EC; color: black; font-family: "Runda", sans-serif; font-style: normal; }

/* attributs curseur */
.cursor {width: 40px; height: 40px; cursor: none; position: absolute; animation: Anim1 1s infinite alternate; pointer-events: none;}
.cursor::before {content:''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 30px; height: 30px; background: #111111; border-radius: 50%;}
.expand {animation: Anim2 .5s; background: #111111;}
@keyframes Anim1 {from {transform: scale(1);} to {transform: scale(0.8);}}
@keyframes Anim2 {0%{transform: scale(1)} 50%{transform: scale(1.2)} 100%{transform: scale(1);opacity:0;}
}

/* attributs sections */

.box {position: absolute; top: 50%; transform: translateY(-50%);}
.texte {font-size: 18px; line-height: 1.5em; font-weight: 400;}
.texte:after {content: ''; display: block; position: absolute; bottom:0px; width: 0%; left: 0px; height:1.5px; transition: 0.25s cubic-bezier(0.72,-0.01, 0.19, 0.92); background: #111111;}
.texte:hover:after {width: 100%;}

.header {display: flex; justify-content: center; align-items: center; height: 34vh; min-height: 34vh; background-color: #F3F2EC;}

a {text-decoration: none; color: black; display: inline; position: relative;}

/* écrans mobiles */
@media all and (max-device-width: 720px)
{
	body {overflow-y: auto; overflow-x: hidden}
	p1 {font-size: 28px}
	.texte{display: none;}
	.cursor{display: none}
}

@supports (-webkit-touch-callout: none) {
  body {min-height: -webkit-fill-available;}
}


a:hover {
  cursor: none;
}
.cursor {cursor: none}