html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,figure,footer,header,hgroup,menu,nav,section,menu,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
ol,ul{list-style:none}
article,aside,figure,footer,header,hgroup,nav,section{display:block}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:700}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted #000;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
table{font-size:inherit;font:100%}
html{-webkit-font-smoothing:antialiased;overflow-y:scroll}
input[type=text],textarea,select{outline:none}
label,input[type=button],input[type=submit],button{cursor:hand;cursor:pointer}
a:hover,a:active{outline:none}
.ie7 img{-ms-interpolation-mode:bicubic}
pre{padding:15px;white-space:pre;white-space:pre-wrap;white-space:pre-line;word-wrap:break-word}
*{padding:0;margin:0}
img{max-width:100%;vertical-align:middle;height:auto;width:auto;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
*{outline:0}
*{box-sizing:border-box}
body,html{height:100%;width:100%}
body{background:#fff;font-family:"Roboto",sans-serif;font-optical-sizing:auto;font-weight:400;font-style:normal;color:#151515}
header{display:grid;grid-gap:40px;padding:80px 40px}
header p{margin:0 0 0 50%;width:50%;text-align:left}
header h1{margin:0 0 0 40%;width:60%;text-align:left}
section{position:relative;background:#fff;border-radius:40px 40px 0 0;padding:80px 40px 120px}
.profil{padding:0}
article{max-width:1400px;margin:0 auto;display:grid;grid-gap:40px}
.content{display:grid;grid-gap:20px}
img{width:100%;border-radius:40px;overflow:hidden;position:relative}
.profil img{border-radius:40px 40px 0 0}
.radius{z-index:2;margin-top:-40px}
strong{padding:1px 20px;font-size:26px;font-weight:500;display:inline-flex;background:#151515;text-decoration:none;align-items:center;border-radius:9999px;border-width:1px;border-color:transparent;color:#fff}
h1{font-size:76px;line-height:1em;font-weight:800}
h2{font-size:48px;font-weight:800;text-align:center}
.hidden{display:none}
h3{font-size:38px;font-weight:800;text-align:center}
p{font-size:28px;line-height:1.3em;text-align:center}
a.link{font-style:italic;text-decoration:none;color:#151515}
a.link:hover{font-style:italic;text-decoration:underline;color:#151515}
a.contact{text-decoration:none;color:#151515}
a.contact:hover{text-decoration:underline;color:#151515}
.bg-red{background:#F43E4A}
.bg-orange{background:#FF9742}
.bg-yellow{background:#FFCA3C}
.bg-green{background:#3ABD6F}
.bg-blue{background:#26ADE4}
.bg-purple{background:#806DC6}
.bg-gray{background:#efefef}
.keywords{display:flex;flex-wrap:wrap;justify-content:center;grid-gap:20px}
.keywords span{padding:10px 20px;font-size:28px;font-weight:500;display:inline-flex;align-items:center;border-radius:9999px;border-width:1px;border-color:transparent;color:#151515}
.column{display:grid;grid-template-columns:1fr 1fr;grid-gap:40px}
.column > div{color:#fff;align-content:flex-start;background:#151515;display:grid;grid-gap:20px;border-radius:40px;padding:40px;text-align:center}
footer{position:relative;padding:80px 40px;border-radius:40px 40px 0 0;background:#151515}
footer > p{max-width:1400px;font-size:19px;color:#efefef;margin:0 auto}
.slider{position:relative;background:#151515;width:100%;border-radius:40px;overflow:hidden}
.slider input{display:none}
.slides{position:relative;width:100%}
.slide{position:relative;width:100%;opacity:0;transition:opacity .6s ease-in-out}
#slide1:checked ~ .slides .slide,#slide2:checked ~ .slides .slide,#slide3:checked ~ .slides .slide,#slide4:checked ~ .slides .slide,#slide5:checked ~ .slides .slide,#slide6:checked ~ .slides .slide{position:absolute;top:0;left:0}
#slide1:checked ~ .slides .slide:nth-child(1),#slide2:checked ~ .slides .slide:nth-child(2),#slide3:checked ~ .slides .slide:nth-child(3),#slide4:checked ~ .slides .slide:nth-child(4),#slide5:checked ~ .slides .slide:nth-child(5),#slide6:checked ~ .slides .slide:nth-child(6){position:relative;opacity:1;z-index:2}
.slide img{width:100%;height:auto;display:block}
.slide figcaption{position:absolute;padding:40px;bottom:0;left:0;right:0;text-align:left;z-index:2}
.slide figcaption span { background:#fff; padding:5px 20px; border-radius:9999px; border-width:1px;border-color:transparent;font-size:28px;font-weight:500; color:#151515} 
.navigation{position:absolute;bottom:47px;right:40px;display:flex;gap:10px;z-index:3}
.navigation label{width:20px;height:20px;border-radius:50%;background:#ffffff80;cursor:pointer}
#slide1:checked ~ .navigation label[for="slide1"],#slide2:checked ~ .navigation label[for="slide2"],#slide3:checked ~ .navigation label[for="slide3"],#slide4:checked ~ .navigation label[for="slide4"],#slide5:checked ~ .navigation label[for="slide5"],#slide6:checked ~ .navigation label[for="slide6"]{background:#fff}
@media only screen and (max-width : 890px) {
header{grid-gap:20px;padding:20px}
header p{margin:0 auto;width:100%;text-align:center}
header h1{margin:0 auto;width:100%;text-align:center}
section{position:relative;background:#fff;border-radius:20px 20px 0 0;padding:40px 20px 50px}
footer{padding:20px;border-radius:20px 20px 0 0}
article{max-width:100%;grid-gap:20px}
h1{font-size:68px}
h2{font-size:44px}
h3{font-size:34px}
p{font-size:24px}
.column{grid-template-columns:1fr;grid-gap:20px}
.column > div{grid-gap:20px;border-radius:20px;padding:20px}
strong{padding:1px 20px;font-size:22px }
img{border-radius:20px }
.profil img{border-radius:20px 20px 0 0}
.keywords{grid-gap:20px}
.keywords span{padding:10px 20px;font-size:24px}
.radius{margin-top:-20px}
.slider{border-radius:20px;}
.slide figcaption{padding:20px}
.slide figcaption span { padding:5px 10px; font-size:24px} 
.navigation{bottom:27px;right:20px}
.navigation label{width:20px;height:20px}
}
@media only screen and (max-width : 590px) {
header{grid-gap:10px;padding:10px}
header p{margin:0 auto;width:100%;text-align:center}
header h1{margin:0 auto;width:100%;text-align:center}
section{position:relative;background:#fff;border-radius:10px 10px 0 0;padding:10px 10px 20px}
footer{padding:10px;border-radius:10px 10px 0 0}
article{max-width:100%;grid-gap:10px}
h1{font-size:56px}
h2{font-size:38px}
h3{font-size:28px}
p{font-size:18px}
.column{grid-template-columns:1fr;grid-gap:10px}
.column > div{grid-gap:10px;border-radius:10px;padding:10px}
strong{padding:1px 10px;font-size:16px }
img{border-radius:10px }
.profil img{border-radius:10px 10px 0 0}
.content {grid-gap: 10px}
.keywords{grid-gap:10px}
.keywords span{padding:10px;font-size:18px}
.radius{margin-top:-10px}
.slider{border-radius:10px;}
.navigation{bottom:17px;right:10px}
.slide figcaption{padding:10px}
.slide figcaption span { padding:1px 10px; font-size:18px} 
.navigation label{width:10px;height:10px}
.slider .slides { aspect-ratio: 1 / 1; position: relative;overflow: hidden}
.slider .slide {inset: 0}
.square-mobile {aspect-ratio: 1 / 1;height: 100%;object-fit: cover}
}