:root{--clair:#FFF;--sombre:#000;--froid:#00456b;--chaud:#f56425;--decalage:200px;--trait:10px}html,body{padding:0;margin:0;font-family:Raleway,sans-serif;font-weight:400;font-size:14px}h1{font-size:36px;font-weight:100}h2{font-size:28px;margin:10px 0}h3{font-size:24px;font-weight:100}h4{font-size:21px;font-weight:400}a{text-decoration:none;transition:all .3s ease}*{box-sizing:border-box}main{width:100vw;height:100vh;display:flex;flex-flow:column nowrap}main>header{display:flex;flex-flow:column nowrap;position:absolute;width:400px;top:150px;left:calc(50% - 200px);text-align:center}main>header>h1,main>header>h2{margin:10px 0}main>header img{width:100%}main>header h1{margin:10px 0}main>header nav{width:100%;background-color:var(--clair);margin-top:15px;padding:10px 20px;display:flex;flex-flow:row nowrap;justify-content:space-around;align-items:center}main>header nav a{display:flex;flex-flow:column nowrap;margin:0 5px}main>header>article{margin-top:20px;width:100%;padding:0 15px 20px;background-color:var(--clair);flex-flow:column nowrap}main>section{width:100vw;height:100vh;display:flex;flex-flow:row nowrap}router-outlet+*{display:flex;flex-flow:row nowrap}router-outlet+*>section{width:50vw;height:100vh;display:flex;background-repeat:no-repeat;background-position-y:50%;margin:auto;flex-flow:column nowrap}router-outlet+*>section:nth-child(1){background-image:url("./media/blue-marble-patterned-wallpaper-background-QQ4CYNG3.jpg");background-position-x:100%;border-left:var(--trait) solid var(--froid);border-right:var(--trait) solid var(--froid);padding-right:var(--decalage)}router-outlet+*>section:nth-child(2){background-image:url("./media/fire-cloud-space-background-3WN42IUK.jpg");background-position-x:0%;border-left:var(--trait) solid var(--chaud);border-right:var(--trait) solid var(--chaud);padding-left:var(--decalage)}router-outlet+*>section>*{margin:auto;transition:all .4s ease;background-color:var(--clair);width:85%}article{overflow:hidden;display:flex;flex-flow:column nowrap;transition:all .3s ease}main section article{height:0}main section article>*{margin:0;padding:10px 15px}main>section header h2{border:1px dotted;text-align:center;padding:15px;margin:15px;cursor:pointer;position:relative;display:flex;align-items:center;font-weight:100}main>section header h2:after{content:"+";font-size:60px;position:absolute;right:5px;transition:transform .4s ease}.tourne h2:after{transform:rotate(45deg)}main article ul{margin-top:10px;padding:5px 20px 20px}main article ul>li{list-style:disc;margin-left:25px;background-color:var(--clair)}main>footer{position:absolute;width:40vw;bottom:10px;left:30vw;background-color:var(--clair);padding:15px;display:flex;align-items:center;justify-content:center;font-size:12px;text-transform:uppercase}main>section>section>div:hover{width:90%}main>footer>*{margin:0 10px}main>header a:hover,main>footer>a:hover{transform:scale(1.1);background-color:var(--chaud);color:var(--clair);padding:10px 15px}form{width:100%}form>div{display:flex;flex-flow:row nowrap;justify-content:space-around;padding:20px}fieldset{border:none}input,textarea,label{padding:10px;font-family:Raleway,sans-serif;width:100%}button,a.submit{padding:10px 15px;transition:all .3s ease;color:var(--clair);border:none;font-family:Raleway,sans-serif;text-transform:uppercase;cursor:pointer}button[type=submit],a.submit{background-color:var(--chaud)}button[type=reset]{background-color:var(--froid)}button:hover,a.submit:hover{background-color:var(--clair);color:var(--sombre);border:1px dashed var(--sombre)}.pop{position:absolute;display:none}.show{display:flex}.chaud{color:var(--chaud);border-color:var(--chaud)}.froid,.froid a{color:var(--froid);border-color:var(--froid)}.material-symbols-outlined{font-family:Material Symbols Outlined;font-weight:400;font-style:normal;font-size:24px;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr}@media screen and (max-width:980px){main{flex-direction:column;overflow-y:auto}main>header,main>footer{position:static;width:100vw}main>header article{margin:0;padding-bottom:0}main>header h3{margin:0}main>header article img{margin:auto;max-width:75%}main>header nav{margin:0}main>section{height:fit-content}main>section>section article{width:100vw}main>section{width:100vw;flex-direction:column}main article>div{margin:auto;width:80%}router-outlet+*{display:flex;flex-flow:column nowrap}router-outlet+*>section{width:100%;height:fit-content;padding:10px!important}router-outlet+*>section>*{width:100%}}