/* Général */
body{
	background-color: white;
	margin: 0;
	padding: 0;
	font-family: Arial;
	font-size: 0.9em;
}
a{ text-decoration: none;}
a:hover{ cursor: default;}

/* Divs */
div{ width: 100%; text-align: center; }

 /*Menu en haut */
.tabs{ width: 100%; height: 50px; z-index: 1000; background-color: rgba(51, 87, 138, 1.0); }
.tabopen{ border-bottom: 5px white solid; background-color: rgba(51, 87, 138, 1.0); }
.tab{
	float: left;
	width: 33.3% !important;
	height: 60% !important;
	padding-top:15px;
	color: white;
	text-align: center;
}

#OffreDuMoment{}
#SuiviIntervention input{ margin-top: 0.2em; }
#Footer{ position: absolute; bottom: 0; background-color: white;/*	box-shadow: 0px 0px 15px 2px rgba(0, 0, 0, 0.7);*/ }
table{ width: 100%; }
#date{ max-width: 8.125em; min-width: 4.063em; }
td{ border-bottom: solid 1px #aaa; padding-bottom: 0.625em; padding-top: 0.625em; text-align: left; }

/* Zone scroll messages suivi intervention */
#communication{
	height: 19em;
	overflow: auto;
	overflow-y:scroll;
}
::-webkit-scrollbar {-webkit-appearance: none;}
::-webkit-scrollbar:vertical {width: 8px;}
::-webkit-scrollbar-thumb {background-color: rgba(0, 0, 0, 0.3);border-radius: 10px;border: 2px solid #ffffff;}
::-webkit-scrollbar-track {border-radius: 10px;  background-color: #ffffff; }

input[type=text], input[type=password], input[type=button], input[type=submit], input[type=number]{
	text-align: center;
	border: solid 1px #aaa;
	outline: none;
	border-radius: 4px;
}

input[type=submit]{
	background-color: #e74c3c;
	border: none;
	color: white;
}

input[type=button]{
	margin-top: 0.5em;
	background-color: #2980b9;
	border: none;
	color: white;
}









/* SMARTPHONES */
@media screen and (max-width: 480px){ /*body{ background-color: green; } */
	#Footer img{
	/*	width: 18em;*/
	width: 94%;
		height: auto;
	}
	#Footer p{
		font-size: 1em;
		margin-top: -0.5em;
		bottom: 0;
		margin-bottom: 0;
	}

	#Parrainage input[type=submit]{
		margin-top: 0.5em;
	}

	#OffreDuMoment img{ margin-top: 1em;}
}


@media screen and (max-width: 480px) and (min-height: 840px){
/*	body{
		background-color: #aaa;
	} 
*/	#OffreDuMoment img{  width: 95%; height: auto; }
	#Parrainage img{ width: 95%; height: auto; }
	#SuiviIntervention img{width: 95%; height: auto;}
	input[type=number], input[type="text"], input[type="password"], input[type=number]{min-width: 20em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 20em; height: 2em; }
	.scrollparrainage{ height: 50em; overflow: auto; overflow-y: scroll; }
}
@media screen and (max-width: 480px) and (min-height: 800px) and (max-height: 839px){
/*	body{
		background-color: #bbb;
	} 
*/	#OffreDuMoment img{  width: 95%; height: auto; }
	#Parrainage img{ width: 95%; height: auto; }
	#SuiviIntervention img{width: 95%; height: auto;}
	input[type=number], input[type="text"], input[type="password"]{min-width: 20em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 20em; height: 2em; }

	.scrollparrainage{ height: 45em; overflow: auto; overflow-y: scroll; }
}
@media screen and (max-width: 480px) and (min-height: 730px) and (max-height: 799px){
/*	body{
		background-color: #ccc;
	}
*/	#OffreDuMoment img{  width: 95%; height: auto; }
	#Parrainage img{ width: 95%; height: auto; }
	#SuiviIntervention img{width: 95%; height: auto;}
	input[type=number], input[type="text"], input[type="password"]{min-width: 20em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 20em; height: 2em; }
	.scrollparrainage{ height: 40em; overflow: auto; overflow-y: scroll; }
}
@media screen and (max-width: 480px) and (min-height: 700px) and (max-height: 729px){
/*	body{
		background-color: #ddd;
	} 
*/	#OffreDuMoment img{  width: 95%; height: auto; }
	#Parrainage img{ width: 95%; height: auto; }
	#SuiviIntervention img{width: 95%; height: auto;}
	input[type=number], input[type="text"], input[type="password"]{min-width: 20em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 20em; height: 2em; }
	.scrollparrainage{ height: 38em; overflow: auto; overflow-y: scroll; }

	#Footer p{
		font-size: 0.9em;
	}
}
@media screen and (max-width: 480px) and (min-height: 670px) and (max-height: 699px){
/*	body{
		background-color: #eee;
	} 
*/	#OffreDuMoment img{  width: 95%; height: auto; }
	#Parrainage img{ width: 95%; height: auto; }
	#SuiviIntervention img{width: 95%; height: auto;}
	input[type=number], input[type="text"], input[type="password"]{min-width: 20em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 20em; height: 2em; }
	.scrollparrainage{ height: 36em; overflow: auto; overflow-y: scroll; }
	#Footer p{
		font-size: 0.9em;
	}
}
@media screen and (max-width: 480px) and (min-height: 640px) and (max-height: 669px){
/*	body{
		background-color: #fff;
	} 
*/	#OffreDuMoment img{  width: 95%; height: auto; }
	#Parrainage img{ width: 95%; height: auto; }
	#SuiviIntervention img{width: 95%; height: auto;}
	input[type=number], input[type="text"], input[type="password"]{min-width: 20em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 20em; height: 2em; }
	img{
		max-width: 28em;
	}
	.scrollparrainage{ height: 34em; overflow: auto; overflow-y: scroll; }
	#Footer p{
		font-size: 0.9em;
	}
}
/*Résolution du wiko */
@media screen and (max-width: 480px) and (min-height: 610px) and (max-height: 639px){
/*	body{
		background-color: yellow;
	} */
	#OffreDuMoment img{  width: 95%; height: auto; }
	#Parrainage img{ width: 95%; height: auto; }
	#SuiviIntervention img{width: 95%; height: auto;}
	input[type=number], input[type="text"], input[type="password"]{width: 20em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{width: 20em; height: 2em; }
	img{
		max-width: 26em;
	}
	.scrollparrainage{ height: 31.5em; overflow: auto; overflow-y: scroll; }
	#Footer p{
		font-size: 0.9em;
	}
}

@media screen and (max-width: 480px) and (min-height: 600px) and (max-height: 609px){
/*	body{
		background-color: brown;
	} */
	#OffreDuMoment img{  width: 83%; height: auto; }
	#Parrainage img{ width: 85%; height: auto; }
	#SuiviIntervention img{width: 85%; height: auto;}
	input[type=number], input[type="text"], input[type="password"]{min-width: 20em; height: 2em; margin-top: 0.15em; }
	input[type="submit"], input[type=button]{min-width: 20em; height: 2em;}
	.scrollparrainage{ height: 30em; overflow: auto; overflow-y: scroll; }
	#Footer p{
		font-size: 0.9em;
	}
}

@media screen and (max-width: 480px) and (min-height: 576px) and (max-height: 599px){
/*	body{
		background-color: orange;
	} */
	#OffreDuMoment img{  width: 82%; height: auto; }
	#Parrainage img{ width: 95%; height: auto; max-width: 20em; }
	#SuiviIntervention img{width: 85%; height: auto;}
	input[type=number], input[type="text"], input[type="password"]{width: 20em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{width: 20em; height: 2em; }
	.scrollparrainage{ height: 30em; overflow: auto; overflow-y: scroll; }
	#Footer img{
		width: 75%;
	}
	#Footer p{
		font-size: 0.9em;
	}
}

@media screen and (max-width: 480px) and (min-height: 550px) and (max-height: 575px){
/*	body{
		background-color: #aaa;
	} */
	#OffreDuMoment img{  width: 80%; height: auto; }
	#Parrainage img{ width: 95%; height: auto; max-width: 20em; }
	#SuiviIntervention img{width: 80%; height: auto;}
	input[type=number], input[type="text"], input[type="password"]{width: 20em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{width: 20em; height: 2em; }
	.scrollparrainage{ height: 28em; overflow: auto; overflow-y: scroll; }
	#Footer img{
		width: 75%;
	}
	#Footer p{
		font-size: 0.9em;
	}
}

@media screen and (max-width: 480px) and (min-height: 0px) and (max-height: 545px){
/*	body{
		background-color: red;
	} */
	#OffreDuMoment img{  width: 95%; height: auto; }
	#Parrainage img{ width: 95%; height: auto; }
	#SuiviIntervention img{width: 95%; height: auto;}
	input[type=number], input[type="text"], input[type="password"]{width: 20em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{width: 20em; height: 2em; }
	.scrollparrainage{ height: 28em; overflow: auto; overflow-y: scroll; }
	#Footer img{
		width: 75%;
	}
	#Footer p{
		font-size: 0.9em;
	}
}

/* Iphone 4 */
@media screen and (max-width: 320px) and (max-height: 480px){
/*	body{
		background-color: green;
	}*/
	#OffreDuMoment img{width: 90%; height: auto; margin-top: 0.3em;}
	#Parrainage img{width: 90%; height: auto; margin-top: 0.3em;}
	#SuiviIntervention img{width: 90%; height: auto; margin-top: 0.3em;}

	input[type=number], input[type=text], input[type=password]{width: 20em; height: 1.5em; margin-top: 0.2em;}
	input[type=submit], input[type=button]{width: 20em; height: 2em;}
	.scrollparrainage{ height: 29.5em; overflow: auto; overflow-y: scroll;}
	
	#Footer{display: none;}
}


/*
@media screen  and (orientation: landscape){
	#Footer{
		display: none;
	}
}



*/











/* PETITES TABLETTES */
@media screen and (min-width: 481px) and (max-width: 899px){
/*	body{
		background-color: yellow;
	}*/
	#Footer{ height: auto; }
	#Footer img{ width: 19em;}
	#Footer p{margin-top: -0.5em; font-size: 1em;}
	img{
		width: 90%;
		max-width: 35em;
		height: auto;
	}
	#Parrainage input[type=submit]{
		margin-top: 0.5em;
	}
}
@media screen and (min-width: 481px) and (max-width: 899px) and (min-height: 920px){
/*	body{background-color: red;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 45em; overflow: auto; overflow-y: scroll; }

}
@media screen and (min-width: 481px) and (max-width: 899px) and (min-height: 815px) and (max-height: 919px){
/*	body{background-color: darkred;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 45em; overflow: auto; overflow-y: scroll; }
}
@media screen and (min-width: 481px) and (max-width: 899px) and (min-height: 775px) and (max-height: 814px){
/*	body{background-color: blue;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 42em; overflow: auto; overflow-y: scroll; }
}
@media screen and (min-width: 481px) and (max-width: 899px) and (min-height: 745px) and (max-height: 774px){
/*	body{background-color: darkblue;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 40em; overflow: auto; overflow-y: scroll; }
	img{width: 90%; max-width: 33em; height: auto;}
}
@media screen and (min-width: 481px) and (max-width: 899px) and (min-height: 685px) and (max-height: 744px){
/*	body{background-color: orange;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 36em; overflow: auto; overflow-y: scroll; }
	img{width: 90%; max-width: 30em; height: auto;}
}
@media screen and (min-width: 481px) and (max-width: 899px) and (min-height: 655px) and (max-height: 684px){
/*	body{background-color: green;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 34em; overflow: auto; overflow-y: scroll; }
	img{width: 90%; max-width:28em; height: auto;}
}
@media screen and (min-width: 481px) and (max-width: 899px) and (min-height: 655px) and (max-height: 684px){
/*	body{background-color: green;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 34em; overflow: auto; overflow-y: scroll; }
	img{width: 90%; max-width:28em; height: auto;}
}
@media screen and (min-width: 481px) and (max-width: 899px) and (min-height: 600px) and (max-height: 654px){
/*	body{background-color: lightgreen;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 30em; overflow: auto; overflow-y: scroll; }
	img{width: 90%; max-width:25em; height: auto;}
}
@media screen and (min-width: 481px) and (max-width: 899px) and (min-height: 570px) and (max-height: 599px){
/*	body{background-color: darkgreen;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 28em; overflow: auto; overflow-y: scroll; }
	img{width: 90%; max-width:23em; height: auto;}
}
@media screen and (min-width: 481px) and (max-width: 899px) and (min-height: 540px) and (max-height: 569px){
/*	body{background-color: brown;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 26em; overflow: auto; overflow-y: scroll; }
	img{width: 90%; max-width:21em; height: auto;}
}
@media screen and (min-width: 481px) and (max-width: 899px) and (min-height: 540px) and (max-height: 569px){
/*	body{background-color: brown;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 26em; overflow: auto; overflow-y: scroll; }
	img{width: 90%; max-width:21em; height: auto;}
}
@media screen and (min-width: 481px) and (max-width: 899px) and (max-height: 539px){
/*	body{background-color: turquoise;}
*/	input[type=number], input[type="text"], input[type="password"]{min-width: 20em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 20em; height: 2em; }
	.scrollparrainage{ height: 25em; overflow: auto; overflow-y: scroll; }
	img{width: 90%; max-width:21em; height: auto;}
}











/* ORDINATEURS */
@media screen and (min-width: 900px){ /*body{ background-color: red; } */
	#Parrainage input[type=submit]{
		margin-top: 0.5em;
	}
}
@media screen and (min-width: 900px) and (min-height: 820px){
/*	body{background-color: darkred;} */
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 45em; overflow: auto; overflow-y: scroll; }
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}
}
@media screen and (min-width: 900px) and (min-height: 770px) and (max-height: 819px){
/*	body{background-color: red;} */
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 42em; overflow: auto; overflow-y: scroll; }
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}
}
@media screen and (min-width: 900px) and (min-height: 730px) and (max-height: 769px){
/*	body{background-color: yellow;} */
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 39em; overflow: auto; overflow-y: scroll; }
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}
	#OffreDuMoment img{width: 30em; height: auto;}
	#Parrainage img{ width: 30em; height: auto; }
}
@media screen and (min-width: 900px) and (min-height: 680px) and (max-height: 729px){
/*	body{background-color: darkgray;} */
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 35em; overflow: auto; overflow-y: scroll; }
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}
	#OffreDuMoment img{width: 29em; height: auto;}
	#Parrainage img{ width: 29em; height: auto; }
	#SuiviIntervention img{ width: 29em; height: auto; }
}
@media screen and (min-width: 900px) and (min-height: 650px) and (max-height: 679px){
/*	body{background-color: gray;} */
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 33em; overflow: auto; overflow-y: scroll; }
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}
	#OffreDuMoment img{width: 27em; height: auto;}
	#Parrainage img{ width: 27em; height: auto; }
	#SuiviIntervention img{ width: 27em; height: auto; }
}
/* Passage sur 2 colonnes pour le parrainage */
@media screen and (min-width: 900px) and (max-height: 649px){
/*	body{background-color: lightgray;} */
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}

	#Parrainage{ display: inline-block;}
	#OffreDuMoment img{width: 27em; height: auto;}
	#Parrainage img{ width: 27em; height: auto; float: left; margin-left: 10%;}
	#SuiviIntervention img{width: 27em; height: auto;}
	#formulaireParrainage{float: right; margin-right: 10%; margin-top: 10em;}
}

@media screen and (min-width: 900px) and (max-height: 635px){
/*	body{background-color: orange;} */
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}

	#Parrainage{ display: inline-block;}
	#OffreDuMoment img{width: 26em; height: auto;}
	#Parrainage img{ width: 26em; height: auto; float: left; margin-left: 10%;}
	#SuiviIntervention img{width: 26em; height: auto;}
	#formulaireParrainage{float: right; margin-right: 10%; margin-top: 10em;}
}
@media screen and (min-width: 900px) and (max-height: 617px){
/*	body{background-color: orange;} */
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}

	#Parrainage{ display: inline-block;}
	#OffreDuMoment img{width: 25em; height: auto;}
	#Parrainage img{ width: 25em; height: auto; float: left; margin-left: 10%;}
	#SuiviIntervention img{width: 25em; height: auto;}
	#formulaireParrainage{float: right; margin-right: 10%; margin-top: 10em;}
}
@media screen and (min-width: 900px) and (max-height: 600px){
/*	body{background-color: yellow;} */
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}

	#Parrainage{ display: inline-block;}
	#OffreDuMoment img{width: 24em; height: auto;}
	#Parrainage img{ width: 24em; height: auto; float: left; margin-left: 10%;}
	#SuiviIntervention img{width: 24em; height: auto;}
	#formulaireParrainage{float: right; margin-right: 10%; margin-top: 10em;}
}
@media screen and (min-width: 900px) and (max-height: 582px){
/*	body{background-color: #aaa;} */
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}
	#Parrainage{ display: inline-block;}
	#OffreDuMoment img{width: 23em; height: auto;}
	#Parrainage img{ width: 23em; height: auto; float: left; margin-left: 10%;}
	#SuiviIntervention img{width: 23em; height: auto;}
	#formulaireParrainage{float: right; margin-right: 10%; margin-top: 10em;}
}
@media screen and (min-width: 900px) and (max-height: 565px){
/*	body{background-color: #bbb;}*/
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}

	#Parrainage{ display: inline-block;}
	#OffreDuMoment img{width: 22em; height: auto;}
	#Parrainage img{ width: 22em; height: auto; float: left; margin-left: 10%;}
	#SuiviIntervention img{width: 22em; height: auto;}
	#formulaireParrainage{float: right; margin-right: 10%; margin-top: 10em;}
}
@media screen and (min-width: 900px) and (max-height: 550px){
/*	body{background-color: #ccc;}*/
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}

	#Parrainage{ display: inline-block;}
	#OffreDuMoment img{width: 21em; height: auto;}
	#Parrainage img{ width: 21em; height: auto; float: left; margin-left: 10%;}
	#SuiviIntervention img{width: 21em; height: auto;}
	#formulaireParrainage{float: right; margin-right: 10%; margin-top: 10em;}
}
@media screen and (min-width: 900px) and (max-height: 535px){
/*	body{background-color: #ddd;}*/
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}

	#Parrainage{ display: inline-block;}
	#OffreDuMoment img{width: 20em; height: auto;}
	#Parrainage img{ width: 20em; height: auto; float: left; margin-left: 10%;}
	#SuiviIntervention img{width: 20em; height: auto;}
	#formulaireParrainage{float: right; margin-right: 10%; margin-top: 10em;}
}

/* formulaire colonne pour les petites largeurs*/
@media screen and (min-width: 900px) and (max-width: 1280px){
	#Parrainage{ display: inline-block;}
	#Parrainage img{ float: left; margin-left: 10%;}
	#formulaireParrainage{float: right; margin-right: 20%; margin-top: 10em; width: 20%;}
}

/*Correction bug formulaire grosse hauteur mais petite largeur */
@media screen and (min-width: 900px) and (max-width: 1280px) and (min-height: 770px) {
/*	body{background-color: purple;}*/
	input[type=number], input[type="text"], input[type="password"]{min-width: 23em; height: 2em; margin-top: 0.2em; }
	input[type="submit"], input[type=button]{min-width: 23em; height: 2em; }
	.scrollparrainage{ height: 42em; overflow: auto; overflow-y: scroll; }
	#Footer{ height: auto; }
	#Footer img{ width: 20em;}
	#Footer p{margin-top: -0.5em;}

	#Parrainage{ display: block;}
	#Parrainage img{ width: auto; margin-left: auto; margin-right: auto;margin-left: 1em;}
	#formulaireParrainage{float: right; margin-right: 20%; margin-top: 10em; width: 20%;}

}

@media screen and (width: 1440px) and (height: 900px){
	#Parrainage{display: inline-block;}
	#Parrainage img{float: left; margin-left: 10%;}
	#formulaireParrainage{float: right; margin-right: 20%; margin-top: 10em; width: 20%;}
}