// Divers
body
	background #68C4EF
section
	width 455px
	height 380px
	position absolute
	left 50%
	top 50%
	margin-left -227.5px
	margin-top -190px
	
// Partie iceberg
.iceberg
	position relative    
	
	// Triangle vers le haut
	width 0 
	height 0 
	border-left 185px solid transparent
	border-right 185px solid transparent
	border-bottom 185px solid
	// Fin des lignes du triangle
	
	// Décale tout les icebergs inclus dans un autre iceberg,
	// pour que les petits triangles se chevauchent joliement
	> .iceberg
		margin-left: -100px
	
	&::before, &::after
		// Necessaire, sans quoi le pseudo-element n'apparait pas
		content ''
		
		// Nous mettons nos éléments à la bonne hauteur
		position absolute
		top 185px
		
		// Nécessaire pour que le ::after ne passe pas devant iceberg-2
		z-index: -1
		
		// Triangle vers le bas
		width 0
		height 0
		border-left 95px solid transparent
		border-right 95px solid transparent
		border-top 95px solid
		// Fin des lignes du triangle
	
	// Nous déplaçons un des deux éléments, sans quoi ils seraient supperposés
	&::before
		left -185px
	
// Les différents icebergs
.exemple
	color: blue
	margin-bottom: 100px
	&::before
		color: red
	&::after
		color: yellow
		
.iceberg-1
	animation float 2s ease-in-out infinite alternate
	// Couleur de l'element principal
	color: #C7C8CA
	&::before, &::after 	
		// Couleur de la partie basse
		color: #3680a4
		
.iceberg-2
	color: white
	animation: float2 2s ease-in-out infinite alternate
	animation-delay: 0.5s
	&::before, &::after
		color: #89CFF3

// Partie animation
@keyframes float
	0% 
		transform translateY(0px)
	100%
		transform translateY(15px)
		
@keyframes float2
	0% 
		transform translateY(-5px)
	100%
		transform translateY(5px)