* { margin: 0; } /* Reset des margins de la page */

h1 { font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif; font-size: 24px; font-style: normal; font-variant: normal; font-weight: 700; line-height: 26.4px; } h3 { font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: 700; line-height: 15.4px; } p { font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 20px; } blockquote { font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif; font-size: 21px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 30px; } pre { font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: 400; line-height: 18.5714px; }

body { font-family: 'Calibri'; font-size:1.2em; } /* FONT SUR LE BODY */
.block1, .block2, .block3 {  padding: 20px 100px 20px 100px;  } /* Padding dans les block */
.block1{ background-color: #ffffff}  /*BLOCK1 */
.block2{ background-color: #34495e; color: #fcfcfc; } /* BLOCK2 */
.block3{ background-color: #f2f2f2; }  /* BLOCK3 */
.row{ display: flex; flex-wrap: wrap;} 
.width80{ width: 80%; margin: auto; }
.center { text-align: center; margin: auto;}
.div5 {flex:5%; }
.div20{ flex: 20%; } 
.div25{ flex: 25%; } 
.div30{ flex: 30%; } 
.div50{ flex: 50%; } 
.div70{ flex: 70%; } 
.img100 { width: 100%; }
.img75 { width: 75%; } 
.img50 { width: 50%; } 
.img30 { width: 30%; } 
.img25{ width: 25%; } 

.img100p{ width: 100px; }
.img200p{ width: 200px; }
.img300p{ width: 300px; }
.img400p{ width: 400px; }
.img500p{ width: 500px; }

/* 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; } 
.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; }
.options th { padding-top: 12px; padding-bottom: 12px; text-align: left; background-color: #0af; color: white; }
.options td a{ color: dodgerblue; } 

/* FOOTER */
.footer { margin-top: -20px; text-align: center; margin: auto; } 
.block-footer { background-color: white; } 

/* TITLE */
h1, h2, h3 {  margin: 10px;}
h1 { font-size: 45px; line-height: 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: none; }
a:active {  color: dodgerblue;}

/* PARAGRAPHE */
p { padding: 10px;}

/* BOUTON */

.boutonDownload, .boutonCard {
    font-weight: bold;
    color: white;
    background-color: #3898d4;
    padding: 10px;
    width: 200px;
    border-radius: 8px;
    text-align: center;
}

.boutonDownload:hover, .boutonCard:hover  {
        background-color: skyblue;
        transform: scale(1.1);
}

/* BLOG */
.titleBlog1 { color: dodgerblue; } 
.titleBlog2 { color: dodgerblue; } 
.noUnderline { text-decoration: none; } 
.noUnderline:hover { text-decoration: underline dodgerblue; } 
.paragraphe { padding: 10px; } 

/* CONTACT */
.border:hover { border: 1px solid black; border-radius: 5px; padding: 10px; }


/* ECRAN TELEPHONE */
@media screen and (max-width: 700px) {
  .row { flex-direction: column; } 
  .block1, .block2, .block3 {  padding: 20px 10px 20px 10px;  }
}

/* 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: #34495e;
	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 #34495e;
	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: #cbcbcc;
	border-bottom: 1px solid #34495e;
	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: #34495e;
  border-top: 1px solid #34495e;
}

/* BOX demande de demo*/

.alert {
  color: black;
  margin-bottom: 15px;
  display: flex;
  width: 50%;
  padding: 25px;
  background: #f2f2f2;
  border: 1px solid #D8D8D8;
  border-radius: 4px;
  box-shadow: 0 1px 10px 0 rgba(0,0,0,0.25);
  margin: 20px;
 
}

.alert-btn {
float: right;
position:sticky;
right : 10px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
width: 100px;
padding: 1%;
background: #34495e;
border-bottom: 1px solid #34495e;
color: #fff;
border-radius: 8px;
height: 50px;
text-align: center;
}
/* The close button */
.closebtn {
  margin-right: 15px;
  color: black;
  font-weight: bold;
  float: left;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

/* When moving the mouse over the close button */
.closebtn:hover {
  color: white;
}
 .alert {
  position: -webkit-sticky ;
  position: sticky; bottom: 10px;
 }
.alert {
  opacity: 1;
  transition: opacity 0.6s; /* 600ms to fade out */
}

