@font-face { 
	font-family: 'Console'; 
	src: url('fonts/Console.ttf') format("truetype"); 
	font-weight: normal;
	font-style: normal;
}
@font-face { 
	font-family: 'Determination'; 
	src: url('fonts/DeterminationMonoWebRegular-Z5oq.ttf') format("truetype"); 
	font-weight: normal;
	font-style: normal;
} 
@font-face { 
	font-family: 'Insight_Sans'; 
	src: url('fonts/Insight_Sans_SSi.ttf') format("truetype"); 
	font-weight: normal;
	font-style: normal;
} 
@font-face { 
	font-family: 'Monofonto'; 
	src: url('fonts/monofonto.otf') format("truetype"); 
	font-weight: normal;
	font-style: normal;
} 

html
{
	background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='100%25' width='100%25'%3E%3Cdefs%3E%3Cpattern id='doodad' width='10' height='10' viewBox='0 0 40 40' patternUnits='userSpaceOnUse' patternTransform='rotate(135)'%3E%3Crect width='100%25' height='100%25' fill='rgba(255, 255, 255, 1)'/%3E%3Cpath d='M-10 30h60v16h-60zM-10-10h60v16h-60' fill='rgba(26, 32, 44, 1)'/%3E%3Cpath d='M-10 10h60v20h-60zM-10-30h60v20h-60z' fill='rgba(0, 0, 0, 1)'/%3E%3C/pattern%3E%3C/defs%3E%3Crect fill='url(%23doodad)' height='200%25' width='200%25'/%3E%3C/svg%3E ");
	background-repeat: no-repeat;
 	background-size: cover;
 	min-height: 100%;
 	font-family: 'Insight_Sans', sans-serif;
}

.title-wrapper {
    position: relative;
 	overflow: visible; /* Permet à l'image de "déborder" */
}

.line {
	background-color: #000;
	border-color: black;
	border-width: 1px;
	width: 95%;
}

.main-block {
	position: relative;
    width:50%;
    margin-left:auto;
    margin-right: auto;
    padding: 10px;
    margin-top: 300px;
    background: #fff;
    border-top: 1px solid #000;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    grid-template-columns: 50% auto;
}

h1 {
	width: 100%;
	display: inline-block;
    position: relative;
}

.BMO {
  position: absolute;
  margin-top: -42%; /* fait dépasser vers le haut */
  margin-left: 50%;
  z-index: 1;
}

.paragraph {
	margin-left: 1em;
	margin-right: 1em;
}