﻿main{
	flex-direction: column; 
}

h1.mention{
	margin-top: 10px;
	font-family:"Cinzel", Arial, sans-serif;
	font-size : 168%;
}

h1.mention, h2, h3 {
	text-align:center;
}

article.droite div.coordonnees h3{
	margin-top:5px;
	margin-bottom:3px;
}

section
{	
	height: 80%; width: 95%;
	display:flex;
	display:-o-flex;
	display:-webkit-flex;
	display:-ms-flex;
	flex-direction: row;
	justify-content:space-around;
	min-height:500px;
	margin: auto;
	margin-top: 10px;
}

article
{
    display:flex;
    display:-o-flex;
	display:-webkit-flex;
	display:-ms-flex;
    -webkit-flex-direction:column;
    -o-flex-direction:column;
    justify-content:stretch;
	width:40%;
	background-color:#ccc;
	border-radius:15px;
	background:#CCC;
}

h2 
{
	display:block;
	width:100%;
	margin-bottom: 18px;
	padding-top: 30px;
	font-size : 168%;
	color:black;
	background-color:rgba(253, 254, 170,0.8);
	border-radius:15px 15px 0 0;
	flex:.5;	
}

.coordonnees
{
	display:flex;
	display:-o-flex;
	display:-webkit-flex;
	display:-ms-flex;
	-webkit-flex-direction:column;
	-o-flex-direction:column;
	-webkit-justify-content:center;
	align-content:center;
	width:100%;
	height:100%;
	border-radius: 0 0 15px 15px;
	background-color: #CCC;
	flex:3;
}

p
{
	width: 80%;
	margin:0 auto;
	padding:auto;
}

p.marge
{
	margin-top: 10px;
}
address
{
	width: 80%;
	margin:0 auto;
}

.gras
{
	font-weight:bold;
}

@media (max-width: 640px){
	main{
		top: 15vh;
	}

	section#tableau{
		margin-top: 46%;
		-webkit-flex-direction:column;
	}

	article{
		width: 90%;
		margin-top: 4%; 
		margin-left: auto; margin-right: auto;
		padding-bottom: 10px;
	}

	article.droite{
		padding-bottom: 15vh;
	}

}
