/* tout est fait main, sauf les transitions sous les liens */



body {
	background-color: #fffae4;
	font-family: 'Roboto', sans-serif;
	color : #24435a;
}

div.prout {
	font-size: 2em;
	color : #1b1b1b;
}

p {
	font-size: 1.5em;
}

.description{
	
	text-align: justify;
}
small {
	font-size : 0.5em;
	text-align: center;
}


h1 {
	font-size : 4em;
	color: #14456f;
	text-align: center;
}

h2 {
	font-size: 3em;
	color: #14456f;
	text-align: center;
}
h3 {
	font-size: 2em;
	color:  #14456f;
	font-style: italic;
}

div.banniere {
	height: 100px;
	background-image: url("../img/dessin.png");
	background-position: center;
}
.container {
    width: 100%;
    
}

.centered-element{
    margin-left: 20%;
    margin-right: 20%;
    padding: 2%;

}

.title{
	border-radius: 35em 35em 0.5em 0.5em;
	margin-left: 20%;
    margin-right: 20%;
    padding: 2%;
    background-color: #ffd586;
}

a {
	color: #14456f ;
	
}

a:link {
	text-decoration: none;
	  background:
    radial-gradient(circle closest-side, currentColor 80%, transparent) bottom var(--p1, -7px) left 50% /100% var(--p, 12px) no-repeat,
    linear-gradient(currentColor 0 0) bottom 4px left 50%/var(--d, 0%) 3px no-repeat;
  transition: 0.5s;
}

a:visited {

}

a:hover {
		color : #eac992;
	  --d: 100%;
  --p: 3px;
  --p1: 4px;
}
footer {
	text-align: center;
	font-size: 0.5em;
	color: #e7ab43;
	font-style: italic;
}
img{
	width: 50%;
}