* { margin: 0; } /* Reset des margins de la page */
body { font-family: 'Open Sans', sans-serif; } /* FONT SUR LE BODY */
.block1, .block2, .block3 {    padding: 20px 20px 20px 20px; } /* Padding dans les block */
.block1{ background-color: #E5E0ED; } /*BLOCK1 */
.block2{ background-color: #8E9FBB; } /* BLOCK2 */
.block3{ background-color: #FFFFFF; } /* BLOCK3 */
.row{ display: flex; flex-wrap: wrap;} /* CONTAINER BLOCK */
.width80{ width: 80%; margin: auto; }
.center { text-align: center;}
.div25{ flex: 25%; } /* Quatres colonnes à 25% */
.div30{ flex: 30%; } /* Trois colonnes à 30% */
.div50{ flex: 50%; } /* Deux colonnes à 50% */
.div70{ flex: 70%; } /* Une colonne à 30 %, une colonne à 70% */
.img100 { width: 100%; } /* IMAGE 100 */
.img75 { width: 75%; } /* IMAGE 75 */
.img50 { width: 50%; } /* IMAGE 50 */
.img25{ width: 25%; } /* IMAGE 25 */
/* TABLEAU */
.options { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; border-collapse: collapse; width: 100%; }
.options td, .options th { border: 1px solid #ddd; padding: 8px; } /* BORDURE */
.options tr:nth-child(even) { background-color: #f2f2f2; } /* UNE LIGNE SUR DEUX */
.options tr:nth-child(odd) { background-color: white; }
.options tr:hover { background-color: #ddd; }/* QUAND ON PASSE LA SOURIS DESSUS */
.options th { padding-top: 12px; padding-bottom: 12px; text-align: left; background-color: #0af; color: white; }/* ENTETE DU TABLEAU */
.options td a{ color: dodgerblue; } /* LIEN DANS TABLEAU */
/* FOOTER */
.footer { margin-top: -20px; text-align: center; margin: auto; } /* FOOTER */
.block-footer { background-color: white; } /* background du footer */
/* TITLE */
h1, h2, h3 {  margin: 10px;}
h1 { font-size: 45px; } /* tous les gros titre (h1) */
h2 { font-size: 35px; } /* tous les gros titre (h2) */
/* LISTE */
ul { list-style: none; }
/* Lien */
a { text-decoration: none; }
a:link { color: dodgerblue;}
a:visited {  color: dodgerblue;}
a:hover { color: dodgerblue; text-decoration: underline;}
a:active {  color: dodgerblue;}
/* PARAGRAPHE */
p { padding: 10px;}
/* BOUTON */
.boutonDownloadSmall { font-weight: bold; color: white; background-color: #3898d4; padding: 10px; border: 1px solid #3898d4; width: 100px; margin: auto; border-radius: 15px; text-align: center; }
.boutonDownloadSmall2 { font-weight: bold; color: white; background-color: #3898d4; padding: 10px; border: 1px solid #3898d4; width: 120px; margin: auto; border-radius: 15px; text-align: center; }
.boutonDownload { font-weight: bold; color: white; background-color: #3898d4; padding: 10px; border: 1px solid #3898d4; width: 200px; border-radius: 15px; text-align: center; }
.boutonDownload:a { color: white; }
/* BLOG */
.titleBlog1 { color: dodgerblue; } /* gros titre du blog */
.titleBlog2 { color: dodgerblue; } /* moyen titre du blog */
.noUnderline { text-decoration: none; } /* lien du blog, pas de soulignement */
.noUnderline:hover { text-decoration: underline dodgerblue; } /* lien du blog, on souligne en bleu au passage de la souris */
.paragraphe { padding: 10px; } /* padding sur les paragraphes du blog */
/* CONTACT */
.border:hover { border: 1px solid black; border-radius: 5px; padding: 10px; }
/* VIGNETTE */
.cards { display: flex; flex-wrap: wrap; align-items: stretch; padding: 0; margin: 0; list-style: none; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; justify-content: space-around; }
.card { flex: 0 0 200px; margin: 10px; border: 1px solid #ccc; box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.3); width: 300px; height: 250px; background-color: white; padding: 10px; text-align: center; border-radius: 10px; }
.card .text { padding: 0 20px 20px; }
.card img { max-width: 100%; }
.centered { text-align: center; margin-left: auto; margin-right: auto; }
/* FORMULAIRE DE CONTACT */
.form-style-6{ font: 95% Arial, Helvetica, sans-serif; max-width: 1000px; margin: auto; padding: 16px; background:#3AA6E6; border-radius: 8px; }
.form-style-6 h1{
	background: #3AA6E6;
	padding: 20px 20px;
	font-size: 140%;
	font-weight: 300;
	text-align: center;
	color: #fff;
	margin: -16px -16px 16px -16px;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.form-style-6 input[type="text"], .form-style-6 input[type="email"], .form-style-6 textarea, .form-style-6 select
{
	outline: none;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	width: 100%;
	background: white;
	margin-bottom: 1%;
	border: 1px solid deepskyblue;
	padding: 1%;
	color: black;
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    border-radius: 8px;
}
.form-style-6 input[type="submit"], .form-style-6 input[type="button"]{
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	width: 100%;
	padding: 1%;
	background: deepskyblue;
	border-bottom: 1px solid deepskyblue;
	border-top-style: none;
	border-right-style: none;
	border-left-style: none;
	color: #fff;
    border-radius: 8px;
}
.form-style-6 input[type="submit"]:hover, .form-style-6 input[type="button"]:hover{
  outline: none;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  width: 100%;
  background: #FFF;
  border: 1px solid;
  background: deepskyblue;
  border-top: 1px solid deepskyblue;
}
/* ECRAN TELEPHONE */
@media screen and (max-width: 700px) {
  .row { flex-direction: column; } /* ARTICLE / BLOCK */
}
