/*    Code pour la page Calcul Taux     */
/*  Fait le 25/06/2021 par Paulo Silva  */
/*           https://paulo.lu           */

/* **** **** **** **** **** **** **** **** **** **** **** **** **** */
/*     Début code section pour le formulaire calcul mensualité      */
/* **** **** **** **** **** **** **** **** **** **** **** **** **** */

.divcalcform {
/*	position: relative;*/
	width: 560px; /*auto;*/
	height: auto;
	margin-top: 0px;
	margin-left: auto; /*24.3%;*/
	margin-right: auto; /*30.7%;*/
	padding: 10px 7px 10px;
	line-height: 1.7;
	background-color: #e9e9e9;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius: 10px;
/*	border: 1px solid #666 !important;*/
	border: double #0000FF;
/*	-webkit-box-shadow: 0px 0px 0px 5px rgba(169, 169, 169, 0.7);*/
/*	-moz-box-shadow: 0px 0px 0px 5px rgba(169, 169, 169, 0.7);*/
/*	-ms-box-shadow: 0px 0px 0px 5px rgba(169, 169, 169, 0.7);*/
/*	box-shadow: 0px 0px 0px 5px rgba(169, 169, 169, 0.7);*/
}

@media only screen and (max-width: 600px) {
	.divcalcform {
/*	float: none;*/
	width: auto; /*99.99999%; /**/
	margin-top: 0px;
	margin-left: 24px; /*auto; /**/
	margin-right: 24px; /*auto; /* and (max-width: 992px)*/
/*	padding-left: 0px;
	padding-right: 0px;
	background-color: red;*/
  }
}

@media only screen and (min-width: 600px) {
	.divcalcform {
/*	float: none;*/
	width: auto; /*99.99999%;*/
	margin-top: 0px;
	margin-left: 25%; /*0px; /*auto;*/
	margin-right: 25%; /*0px; /*auto; and (max-width: 992px)
	background-color: green;*/
  }
}

@media only screen and (min-width: 768px) {
	.divcalcform {
/*	float: none;*/
	margin-top: 0px;
	margin-left: 25%;
	margin-right: 25%;
	width: 49.99999%;
  }
}

/* zone de texte, en-tête, boutons de navigation et box photo des pages photo au hasard */
@media only screen and (min-width: 992px) {
	.divcalcform {
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	width: 99.99999%;
  }
}

.colorfieldset {
	-webkit-background-clip: fieldset;
	-webkit-text-fill-color: transparent;
	background-image: -webkit-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet);
  }

/* Colonne milieu plus large*/
.colonnemilieucalc {
  float: none;
  width: 69.9999%;
  margin-left: auto;
  margin-right: auto; /* /* 33.333% 25%; */
/*  background-color: #green; /* #f1f1f1; */
/*  padding-left: 20px;/**/
}

/* écran tablette portrait et smartphone large */
@media only screen and (max-width: 600px) {
   .colonnemilieucalc {
    float: none;/* */
    width: 99.9999%;
	margin-left: auto;
	margin-right: auto;
/*	background-color: green;*/
  }
}

/* écran tablette portrait et smartphone large */
@media only screen and (min-width: 600px) {
   .colonnemilieucalc {
    float: none;/* */
    width: 89.9999%;
	margin-left: auto;
	margin-right: auto;
/*	background-color: green;*/
  }
}

@media only screen and (min-width: 750px) and (max-width: 930px) {
	.colonnemilieucalc {
    float: none;/* */
    width: auto; /* 89.9999%;*/
	margin-left: auto;
	margin-right: auto;
  }
}
	
@media only screen and (min-width: 931px) {
   .colonnemilieucalc {
    float: none; /**/
    width: 79.999%; /* auto; /* 79.9999%;*/
	margin-left: auto;/* 5%; */
	margin-right: auto; /* 5%; */
/*	background-color: orange;*/
  }
}

@media only screen and (min-width: 1200px) {
   .colonnemilieucalc {
    float: none; /**/
    width: 69.999%; /* auto; /* 79.9999%;*/
	margin-left: auto;/* 5%; */
	margin-right: auto; /* 5%; */
/*	background-color: orange;*/
  }
}

table {
	border: 2px solid;
	-webkit-border-radius: 12px;	
	-moz-border-radius: 12px;
	border-radius: 12px;
	cellspacing: 15px;
	margin-left: auto;
	margin-right: auto;
  }

/* tableau responsive */
@media only screen and (max-width: 600px) {
	table {
	margin-left: 0px;
	margin-right: 0px;
  }
}

tr  {
	margin-top: 5px;
	padding: 12px;
  }

td  {
	border: 1px solid;
	-webkit-border-radius: 6px;	
	-moz-border-radius: 6px;
	border-radius: 6px;
	text-align: center;
  }

.tableaux1  {
	display:inline-block;
	width: auto; /*100%; /* auto;
	vertical-align:top;
	margin-top: 0px; /*auto; */
	margin-bottom: 15px;
	margin-left: auto; /*10px; /*-5px;*/
	margin-right: auto; /*10px;*/
	padding-bottom: 0px;
  }

/* tableau responsive */
@media only screen and (max-width: 600px) {
	.tableaux1 {
	width: auto; /*100%;/**/
	margin-left: auto; /*0px;*/
	margin-right: auto; /*0px;*/
	padding-left: 0px;
	padding-right: 0px;
  }
}

.tableaux2  {
	display:inline-block;
/*	vertical-align: middle;  changé le 13/02/2023 top;/**/
	margin-top: 0px;
	margin-right: 10px; /*-5px;*/
	padding-top: 15px;
	padding-bottom: 14px;
  }

/* tableau responsive */
@media only screen and (max-width: 600px) {
	.tableaux2 {
/*	margin-left: -12px;*/
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: -5px;
	padding-top: 0px;
	padding-bottom: 20px;
  }
}

/* tableau responsive */
@media only screen and (min-width: 600px) {
	.tableaux2 {
	display:inline-block;
/*	vertical-align: middle;  changé le 13/02/2023 top;/*top;/**/
	margin-top: 0px;
	margin-right: 0px; /* -5px; changé le 11/02/2023 */
	padding-top: 15px;
	padding-bottom: 14px;
  }
}

/* tableau responsive */
@media only screen and (min-width: 768px) {
	.tableaux2 {
	display:inline-block;
/*	vertical-align: middle;  changé le 13/02/2023 top;/*top;/**/
	margin-top: 0px;
	margin-left: 10px; /* ajouté le 13/02/2023 */
	margin-right: 10px; /* -5px; changé le 11/02/2023 */
	padding-top: 15px;
	padding-bottom: 14px;
  }
}

#mensualite1 {
	width: 70%;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
/*	line-height: 20px;  ajouté le 13/02/2023 */
/*	text-align: center;
	vertical-align: middle;*/
	border: #0000ff double;
	background-color: #FFFFFF;
	padding-top: 0px; /* changé le 13/02/2023 3px;*/
	padding-bottom: 0px;
/*	padding-top: 4px; 0px;*/
/*	padding-bottom: 0px; 4px; /*5px;*/
	margin-top: 5px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	-webkit-border-radius: 4px;	
	-moz-border-radius: 4px;
	border-radius: 4px;
  }

#mensualite2 {
	width: 70%;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
/*	line-height: 20px;  ajouté le 13/02/2023 */
/*	text-align: center;
	vertical-align: middle;*/
	border: #0000ff double;
	background-color: #FFFFFF;
	padding-top: 0px; /* changé le 13/02/2023 3px;*/
	padding-bottom: 0px;
/*	padding-top: 4px; 0px;*/
/*	padding-bottom: 0px; 4px; /*5px;*/
	margin-top: 5px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	-webkit-border-radius: 4px;	
	-moz-border-radius: 4px;
	border-radius: 4px;
  }

#mensualite3 {
	width: 70%;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
/*	line-height: 20px;  ajouté le 13/02/2023 */
/*	text-align: center;
	vertical-align: middle;*/
	border: #0000ff double;
	background-color: #FFFFFF;
	padding-top: 0px; /* changé le 13/02/2023 3px;*/
	padding-bottom: 0px;
/*	padding-top: 4px; 0px;*/
/*	padding-bottom: 0px; 4px; /*5px;*/
	margin-top: 5px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	-webkit-border-radius: 4px;	
	-moz-border-radius: 4px;
	border-radius: 4px;
  }

#mensualite4 {
	width: 70%;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
/*	line-height: 20px;  ajouté le 13/02/2023 */
/*	text-align: center;
	vertical-align: middle;*/
	border: #0000ff double;
	background-color: #FFFFFF;
	padding-top: 0px; /* changé le 13/02/2023 3px;*/
	padding-bottom: 0px;
/*	padding-top: 4px; 0px;*/
/*	padding-bottom: 0px; 4px; /*5px;*/
	margin-top: 5px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	-webkit-border-radius: 4px;	
	-moz-border-radius: 4px;
	border-radius: 4px;
  }

#nouveaucalcul {
	width: 100%;
	height: auto;
	margin: auto;
	padding: 0px;
	text-align: center;
  }
 
/* ***************************************************************************** */
/*   Voir à la fin du fichier les codes pour .boutonnavcalc et .boutonnouvcalc   */
/*   pour mettre le symbole de la calculatrice avant le texte "Nouveau calcul"   */
/* ***************************************************************************** */

.boutonnavcalc {
	display: block;
	background-color: #DDDDDD;
	border: none;
	width: 100%;
	height: auto;
	padding-top: 5px;
	padding-bottom: 6px;
	text-decoration: none;
	font: 14px Verdana, sans-serif;
	letter-spacing: 1px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
	-webkit-transition: background-color 0.4s;
	-moz-transition: background-color 0.4s;
	-ms-transition: background-color 0.4s;
	transition: background-color 0.4s;
	-webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	-ms-transition-duration: 0.4s;
	transition-duration: 0.4s;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-ms-border-radius: 8px;
	border-radius:  8px;
	cursor: pointer;
	outline: none;
  }
 
.boutonnouvcalc {
	width: 80%;
	height: auto;
	text-align: center;
	margin-top: 15px;
	margin-bottom: 15px;
	margin-left: auto;
	margin-right: auto;
/*	padding-left: 0px;
	padding-right: 0px;*/
	padding-top: 5px;
	padding-bottom: 6px;
	color: #0000FF !important;
	background-color: #DDDDDD;
	border: 2px solid #1F85E0 !important;
	outline: none;
  }

.boutonnouvcalc:hover {
	background-color: #608FE8;
	padding-top: 5px;
	padding-bottom: 6px;
	color: white !important;
	-webkit-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.18);
	-moz-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.18);	
	-ms-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.18);
	box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.18);
	outline: none;
  }

input[type=text] {
	width: 75%;
	height: 70%;
	margin-top: 5px;
	padding: 5px;
	color: #000000;
	text-align: center;
	font-family: Verdana, "DejaVu Sans", "Bitstream Vera Sans", Geneva, sans-serif;
	font-size: 1rem;
	border: 1px solid #ccc;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	-ms-border-radius: 7px;
	border-radius: 7px;
	resize: none;
	outline: none;
  }

input[type=text]:focus {
	background-color: #E1F1F9;
  }

input[type=tel] {
	width: 75%;
	height: 30px;
	margin-top: 5px;
	padding: 5px;
	color: #000000;
	text-align: center;
	font-family: Verdana, "DejaVu Sans", "Bitstream Vera Sans", Geneva, sans-serif;
	font-size: 0.95rem;
	border: 1px solid #ccc;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	-ms-border-radius: 7px;
	border-radius: 7px;
	resize: none;
	outline: none;
  }

input[type=tel]:focus {
	background-color: #E1F1F9;
  }

label {
	height: 14px;
	line-height: 14px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 7px;
	padding: 10px 10px 10px 10px;
/*	padding: 10px 0px;*/
	text-align: center;
	display: inline-block;
	outline: none;
  }

::-moz-placeholder {
	opacity: 0.3;
	text-align: center;
	vertical-align: middle;
  }

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	vertical-align: middle;
  }

placeholder {
	color: #FF0000;
	text-align: center;
	vertical-align: middle;
  }

input[type=submit] {
	-webkit-appearance: none;
	background-color: #1B77CB;
	color: white;
	height: 38px;
	line-height: 38px;
	font-size: 14px; /* ajouté le 12_02_2023 */
	padding: 0px 10px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	border-radius: 4px;
	border: none;
	cursor: pointer;
	float: right;
	outline: none;
  }

input[type=submit]:hover {
	-webkit-appearance: none;
	background-color: #4B95E7;
	outline: none;
  }

input[type=reset] {
	-webkit-appearance: none;
	background-color: #4B95E7;
	color: white;
	text-decoration: none;
	height: 25px;
	vertical-align: middle;
	padding: 0px 10px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	border-radius: 4px;
	border: none;
	cursor: pointer;
	float: left;
	outline: none;
  }

input[type=reset]:hover {
	-webkit-appearance: none;
	background-color: #89BAEF;
	text-decoration: none;
	outline: none;
  }

.conteneurform {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	border-radius: 5px !important;
	padding-top: 5px;
	padding-bottom: 10px;
	padding-left: 5px;
	padding-right: 5px;
	outline: none;
  }

.clearfix::after {
	content: "";
	display: table;
	clear: both;
  }

/* formulaire responsive */
@media only screen and (max-width: 600px) {
	input[type=submit] {
	background-color: #005CB9;
	width: 49.99999%;
	height: 42px;
	font-size: 13px;
	margin-top: 0px;
  }
}

/* formulaire responsive */
@media only screen and (max-width: 600px) {
	input[type=submit]:hover {
	background-color: #4B95E7;
	width: 49.99999%;
	height: 42px;
	margin-top: 0px;
  }
}

/* formulaire responsive */
@media only screen and (max-width: 600px) {
	input[type=reset] {
/*	background-color: #005CB9;
	width: 49.99999%;
	height: 42px; */
	font-size: 12px;
/*	margin-top: 0px;*/
  }
}

/* div(s)texte... responsives */
@media only screen and (max-width: 992px) {
	.divtexteimage4, .divtexteimage5 {
	margin-top: 10px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	width: 99.99999%;
  }
}

/* **** **** **** **** **** **** **** **** **** **** **** */
/*      Fin code pour le formulaire calcul mensualité     */
/* **** **** **** **** **** **** **** **** **** **** **** */


/* ******************************************************************************* */
/*                 Codes pour .boutonnavcalc et .boutonnouvcalc                    */
/*    pour mettre le symbole de la calculatrice avant le texte "Nouveau calcul"    */
/* ******************************************************************************* */

/* ***************************************************************************
.boutonnavcalc {
	display: inline-table-cell;
	background-color: #DDDDDD;
	border: none;
	vertical-align: middle;
	width: 100%;
	height: auto;
	line-height: 20px;
	padding-top: 3px;
	padding-bottom: 7px;
	text-decoration: none;
	font: 14px Verdana, sans-serif;
	letter-spacing: 1px;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: auto;
	margin-right: 0px;
	-webkit-transition: background-color 0.4s;
	-moz-transition: background-color 0.4s;
	-ms-transition: background-color 0.4s;
	transition: background-color 0.4s;
	-webkit-transition-duration: 0.4s;
	-moz-transition-duration: 0.4s;
	-ms-transition-duration: 0.4s;
	transition-duration: 0.4s;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	-ms-border-radius: 12px;
	border-radius: 12px !important;
	cursor: pointer;
	outline: none;
  }
 
.boutonnouvcalc {
	width: 90%;
	height: auto;
	line-height: 20px;
	margin-top: 15px;
	margin-bottom: 15px;
	margin-left:auto;
	margin-right: auto;
	padding-top: 3px;
	padding-bottom: 7px;
	color: #0000FF !important;
	background-color: #DDDDDD;
	border: 2px solid #1F85E0 !important;
	outline: none;
  }

.boutonnouvcalc:hover {
	background-color: #608FE8;
	padding-top: 3px;
	padding-bottom: 7px;
	color: white !important;
	-webkit-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.18);
	-moz-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.18);	
	-ms-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.18);
	box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.18);
	outline: none;
  }
  
********************************************************************************/