* {
	box-sizing: border-box;
	scroll-behavior: smooth;
}
body {
	font-family: 'Open Sans', sans-serif;
	text-align: center;
	line-height: 1.2em;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Indie Flower', cursive;
	line-height: 1.4em;
	color: #3666A2;
}
h3{
	font-family: 'Open Sans', sans-serif;
	font-size: 3.3em;
	font-weight: 700;
	color: #578FC5;
}

/* Containers */
.container {
	margin: 0 auto;
	max-width: 100%;
	width: 100%;
}



/*** mes couleurs: ***/



/***** P H P  E R R O R s ****/
.xdebug-error {
	background-color: 	#400D01 !important;
	border-color: 		#26011B !important;
	color: 				#F1D179 !important;
	font-size: 			1.4em;
	margin: 			auto;
}
.xdebug-error th {
	background-color: 	#400D01 !important;
	padding: 			5px;
}
.xdebug-error th span{
	background-color: 	#400D01 !important;
	color: 				#F1D179 !important;
	font-size: 			large !important;
}
.xdebug-error tr td {
	background-color: 	#59331A !important;
}
footer {
	text-align: center;
}


/*** H e a d e r ***/

header h1{
	width: 100%;
	margin-top: 0;
	background-color: rgba(223, 230, 232, 0.9);
	position: fixed;
	z-index: 2;
	top: 0;
}
header h1 img{
	height: 50px;
	float: left;
	margin: 15px;
}
header h1 * {
	display: inline;
	color: #578FC5;
}
header h1 *:hover {
	color: #3666A2;
	text-decoration: none;
}
header h1 ul li a{
	float: right;
	padding: 15px 5px;
	font-size: 0.8em;
	text-decoration: none;
}


/*** C o u v e r t u r e ***/

#couverture{
	width: 100%;
	margin-top: 80px;
	padding-top: 15%;
	padding-bottom: 12%;
	background: url("../ressources/imgs/isabelle-couverture.jpg") no-repeat center center fixed;
	background-size: cover;
}
#couverture h2{
	font-size: 3em;
	font-weight: 700;
}
#couverture .traits{
	margin-bottom: 150px;
}
#couverture .traits li{
	display: inline;
	font-family: 'Indie Flower', cursive;
	margin: 0px 45px;
	color: #578FC5;
	font-size: 1.5rem;
}
#couverture button{
	padding: 10px 20px;
	border: solid #578FC5;
	color: #578FC5;
	font-weight: 700;
	font-size: 1.2em;
	border-radius: 5px;
	background-color: rgba(250, 250, 250, 0.25);
	cursor: pointer;
}
#couverture button:hover{
	border: solid #3666A2;
	color: #fafafa;
	background-color: rgba(87, 143, 197, 0.85);
}


#presentation{
	margin-top: 12%;
	text-align: left;
	font-weight: 300;
	line-height: 1.8em;
	margin-bottom: 6%;
}
#presentation h3, #realisations h3, #photos h3, #parcours h3, #contact h3, #eta h3{
	text-align: center;
	margin-bottom: 3%;
}
#presentation img{
	width: 100%;
}
#presentation .description{
	margin-top: 25px;
}
#presentation a{
	display: block;
	text-align: right;
	text-decoration: none;
	font-weight: 900;
	color: #578FC5;
}
#presentation a:hover{
	color: #3666A2;
}

#realisations{
	padding-top: 9%;
	padding-bottom: 6%;
	background-color: #DFE6E8;
}
#realisations img{
	width: 100%;
	margin-bottom: 10px;
}
#realisations .col-sm-12{
	padding: 25px;
}
#realisations div a {
	text-decoration: none;
	color: #578FC5;
}
#realisations div a:hover{
	color: #1E4786;
}

#eta {
	margin-top: 9%;
}

#photos{
	margin-top: 9%;
	background-color: #B9C1C4;
}

#photos .carousel{
	width: 50%;
	margin: auto;
}

#parcours{
	margin-top: 12%;
}

#parcours h3{
	padding-top: 6%;
}
#parcours p{
	font-weight: 300;
	text-align: left;
	padding: 0 15px;
}
#parcours p strong{
	font-weight: 700;
}

#contact{
	padding-top: 9%;
	padding-bottom: 6%;
	color: #578FC5;
	background-color: #B9C1C4;
}
#contact i{
	margin-bottom: 30px;
	color: #7aa7d1;
}
#contact p{
	font-size: 1.5em;
	color: #7aa7d1;
}

footer{
	padding: 3% 0 6%;
	background-color: #939EA2;
}
footer i{
	cursor: pointer;
	color: #1E4786;
}
footer p{
	font-size: 0.4em;
	margin-top: 45px;
	color: #DFE6E8;
}


/***** A r t i c l e s ***/

article{
	margin-top: 80px;
}

article h3{
	padding-top: 30px;
	margin-bottom: 90px;
}
article h4, article h5{
	font-size: 2rem;
	margin-bottom: 45px;
}
article p {
	width: 70%;
	margin: 0 auto 30px;
	font-weight: 300;
	color: #B9C1C4;
}
article a{
	text-decoration: none;
	color: #939EA2;
}
article a:hover{
	text-decoration: none;
	color: #5f696d;
}
article iframe{
	margin-bottom: 60px;
	width: 1165px;
	height: 655px;
}





/******** M o b i l e *****/
/*** M e n u ***/

@media only screen and (max-width: 540px){


h1 ul li{
	font-size: 0.7rem;
}
article iframe{
	margin-bottom: 60px;
	width: 100%;
	height: auto;
}
#photos .carousel{
	width: 100%;
	margin: auto;
}
footer i{
	max-height: 30px;
}
}