html {
	font-size: 62.5%;
}
:root {
}
body {
	overflow-x: hidden;
	margin: auto;
	width: fit-content;
}
figure {
	overflow: hidden;
}
script, style {
	display: none;
}
pre {
	margin: 10px 0px;
}
section {
	justify-self: center;
	margin: 50px 20px;
}


/*
	grid
*/

#infos           { grid-area: infos;   }
#title_area      { grid-area: title;   }
#cv              { grid-area: cv;      }
#projects        { grid-area: projects;}
#mouse_1         { grid-area: mouse_1; }
#mouse_2         { grid-area: mouse_2; }
#mouse_3         { grid-area: mouse_3; }
#mouse_4         { grid-area: mouse_4; }
#banner_1        { grid-area: banner_1;}
#banner_2        { grid-area: banner_2;}
#banner_3        { grid-area: banner_3;}
#banner_4        { grid-area: banner_4; display: none;}
#banner_5        { grid-area: banner_5; display: none;}
#banner_6        { grid-area: banner_6; display: none;}
#banner_7        { grid-area: banner_7; display: none;}
#banner_8        { grid-area: banner_8; display: none;}

#body {
	/*
	*/
	display: grid;
	grid:
    ' .         title     .        ' auto
    ' .         mouse_1   .        ' auto
    ' banner_1  banner_1  banner_1 ' auto
    ' .         projects  .        ' auto
    ' .         mouse_2   .        ' auto
    ' banner_2  banner_2  banner_2 ' auto
    ' .         cv        .        ' auto
    ' .         mouse_4   .        ' auto
    ' banner_3  banner_3  banner_3 ' auto
    ' .         infos     .        ' auto
    ' .         mouse_3   .        ' auto
	  / 1fr       auto      1fr      ;
}