/* 
UNITÉS
	1em 	taille typo en px
	rem 	proportion typo du body
	px 
	% 		pourcentage du parent
	vw 		100vw = largeur de l'écran
	vh		100vh= hauteur de l'écran 
*/ 

/* 
MARGES
	margin 	marge extérieure
	padding	marge intérieure 

	compacté : 4 valeurs (sens aiguille d'une montre)
	= personnalise les marges de chaque coté d'un élément 
	ex : padding:  20px 22px 35px 34px	haut droite bas gauche

	BORDURES
		border : type taille couleurs
		border-top : bordure specifique 
		border-radius : angles ronds 

		astuce : mettre les bordures aux 4 et annulées celles non-voulues
		ex : boder-bottom : none
*/ 

/* 
LISTES
	ul	liste 
	li 	élément de liste 
	list-style personnalisation de la puce
	list-style-type 	style de puce
	liste-style-image:  url(../dossier/nomficher);	mettre une image comme puce
*/ 

/* 
BLOCKS D'ÉLEMENTS HTML 
	div 	création d'une boîte (grouper)
	span 	créer boite dans boite sans retour à la ligne 

CIBLAGES 
	div h2 	ciblage des H2 dans les div
	div ul li cible les li dans les ul dans les div 

	.class h2 	les H2 qui sont dans la classe
	h2.class 		plus spéfiques, tous les H2 qui ont cette classe 
	.class span 	cibler sous boite 
*/ 


/* 
DÉCLARER TYPOS
	transformer dossier typo en woff 
	webfont générator = transfonter
*/ 


html, body {
	font-size: 12px; /* permet de définir la valeur de 1rem dans le reste de la feuille de style... */
}
body {
	font-family: Arial, Helvetica, sans-serif;
	/*font-family: 'Courier New',Courier,monospace;*/	
	background-color:#000000;
	color:black;
	margin: 0; padding: 0;
    width:100%; height:100%;
}

*, *:before, *:after {/* TOUS les éléments de la page... */
    box-sizing: border-box; /* règle les ennuis de padding */
    outline:none; /* pas de cadre de sélection */
}

p {
	font-size: 1em;
	colors: white; 

}

#col {
  column-count: 2;
}

.LABEURBL {
	font-family: PP Neue Machina Inktrap Light ;
	font-size: 16px ;
	margin-left: 15vw ;
	color: #FFFF;
	line-height: 16px ;
}

.TITRE1 {
	font-family: 'Blatant';
	font-size: 60px;
	color : #FFFFFF;
	margin-left: 15vw;
}

.TITRE2 {
	font-family: Cactus Jack Alternate;
	font-size: 70px;
	color: #FFFFFF;
	margin-left: 15vw;
	line-height: 0px;
}

.TITRE3 {
	font-family: PP Neue Machina Inktrap;
	font-size: 18px;
	color: #FFFFFF;
	margin-left: 15vw;
	line-height: 18px;
}


/* liens */ 
a {
  outline: none;
  text-decoration: none;
  width: 19.5%;
  margin-right: 2px;
  text-align: left;
  line-height: 10px;
  color: #30332E;
  padding-left: 5px;
  padding-right: 5px;
}

a:link, a:visited, a:focus {
  background: #CCB8CC;
}

a:hover {
  background: whitesmoke;
}

a:active {
  background: #30332E;
  color: #CCB8CC;
}



div {
  display: flex;
  justify-content: space-between;
  margin-left: 15vw;
}