* {
  scrollbar-width: 19px;
  scrollbar-color: #3e8a28 lightgreen;
}
*::-webkit-scrollbar {
  width: 19px;
}
*::-webkit-scrollbar-track {
  background: lightgreen;
}
*::-webkit-scrollbar-thumb {
  background-color: #3e8a28;
  border-radius: 25px;
  border: 3px solid lightgreen;
}
html {
	margin: 0;
	text-align: center;
	vertical-align: middle;
}
body {
	padding-top: 50px;
	height: 100%;
	width: 100%;
	background-color: #183e28;
	color: white;
    font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Georgia, sans-serif;
	font-size:17px;
	background-image:url('/images/fond.png');
    background-repeat: repeat;
    background-position: right top;
    background-attachment: fixed;
}
body:after {
    content: url(/images/patience.gif);
    display: none;
}
p, h1, h2, h3 {
    font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Georgia, sans-serif;
}
.navbar-inverse{
	background-color: #000066;
}
#mentions-legales{
	text-align:left;
}
#langues{
	text-align:right;
	padding-right: 42px;
	border-top:1px solid #ffffff ;
}
a:link { color: bisque;}
a:visited { color: bisque;}
a:hover { color: burlywood;}


a.type7,
a.type7:focus,
a.type7:hover {
 box-shadow:inset 0 -0.3rem 0 greenyellow;
 word-wrap:break-word;
}

a.type8:link { color: #fff; text-decoration: none; font-weight: 900;}
a.type8:visited { color: #fff; text-decoration: none; font-weight: 900;}
a.type8:hover { color: #ccc; text-decoration: none; font-weight: 900;}
a.type9:link { color: #fff; text-decoration: none}
a.type9:visited { color: #fff; text-decoration: none}
a.type9:hover { color: #ccc; text-decoration: underline}
a.type10:link { color: chartreuse; text-decoration: none}
a.type10:visited { color: chartreuse; text-decoration: none}
a.type10:hover { color: #ccc; text-decoration: underline}
#cookieChoiceInfo a:link { color: teal; text-decoration: none}
#cookieChoiceInfo a:visited { color: teal; text-decoration: none}
#cookieChoiceInfo a:hover { color: black; text-decoration: none}
#cookieChoiceInfo a:link {
    color: unset;
    text-decoration: none;
}
#cookieChoiceDismiss{
	background-color: deepskyblue;
    margin-left: 15px;
    padding: 6px 8px;
    font-weight: 700;
}
.no-wrap { white-space: nowrap; }
.mdc-button{
	background: black;
    color: chartreuse;
}
.mdc-button__label{
	font-weight: 900;
	font-size:14px;
}
img{
	border: 0px;
}
#titreSection, #section, #nSujets{
	font-family:Comic sans ms,chicago,geneva;
	padding-left: 4px;
	color:black;
	background-color:#e4e6a3;
	border-color: black;
	border-width: 1px;
	border-style: solid solid none solid;
	/*min-height: 100vh;*/
}
#titreSection{
	background-color:#e4ff00;
}
#section, #nSujets{
	padding-bottom: 32767px; 
	margin-bottom: -32767px;
}
#nSujets{
	clear: left;
}
#bienvenue{
	font-family:Comic sans ms,chicago,geneva;
	border:2px solid #aae; 
	background:#e77; 
	color:black;
}
.material-icons {margin:10px}


/***** frm style *****/
#frmErreur{
	color: red;
	display:inline-block;
	position:absolute; 
	overflow:hidden; 
	z-index:-1;
}
#frmCorp1, #frmCorp2, #frmCorp3{
	margin-top: 29px;
	width:100%;
	text-align:center;
	padding-top:10px;
}
#frmListe{
    list-style-type: none;
	margin:0;
}
#frmListe li{
	padding-bottom:10px;
}
#frmListe label{
	display:inline-block;
	padding-left:20px;
	width:130px;
}
#frmImplication{
	text-align:left;
	font-size:18px; 
	width:85%;
	padding-left:20%;
}
/***** frm style *****/

/***** button style *****/
a.boutton_c:link { color: #fff; text-decoration: none}
a.boutton_c:visited { color: #fff; text-decoration: none}
a.boutton_c:hover { color: #000; text-decoration: none}
[class^="icone-"], [class*=" icone-"] {
	display: inline-block;
	width: 20px;
	height: 20px;
	line-height: 20px;
	vertical-align: text-top;
	background-position: 0px 0px;
	background-repeat: repeat;
	margin-top: 0px;
}
.button-group i.icone-connexion{
	background-image: url('../images/20x20/Connect Test_01.png');
}
.button-group a:active i.icone-connexion{
	background-image: url('../images/20x20/Connect Test_02.png');
}
.button-group i.icone-appliquer{
	background-image: url('../images/20x20/save_01.png');
}
.button-group a:active:not(.disabled) i.icone-appliquer{
	background-image: url('../images/20x20/save_02.png');
}
.boutton_c{
	background:rgba(100%,100%,100%,0.8);
	border: 1px solid #bababa;
	padding: 3px 10px;
	margin-right:15px;
	position:relative;
	left:19px;
}
.boutton_c i{
	width:20px;
	height:20px;
	margin-top: 0px;
	margin-right:5px;
	background-position: 0px 0px;
}
.boutton_c l{
	box-shadow:0px 0px 0px 0px rgba(200,200,200,1);
}
.boutton_c:focus{
	background:rgba(100%,100%,100%,0.8);
	border: 1px solid #ffffff;
}
.boutton_c:hover{
	background:-webkit-linear-gradient(top, #ffffff 0%,#b2d6fb 100%);
	border: 1px solid #b2d6fb;
	opacity:.8; 
	cursor:pointer;
	box-shadow:0px 0px 0px 0px rgba(200,200,200,1);
}
.boutton_c:active{
	background:#3c8cb5;
	border: 1px solid #4aa2c3;
	box-shadow: inset 0 2px 3px 0px rgb(42,109,156);
	color:#ffffff;
	transition: all 0.5 ease;
}
/***** button style *****/



/*
	###############################################
	############## Autres styles #################
	###############################################
*/

.left{float:left; width:33%;}
#image1 > div{
	font-size:18px;
	margin:0px;
}
#image2 > div{
	font-size:18px;
	margin:0px;
}
#image3 > div{
	font-size:18px; 
	margin:0px;
}

@import url('https://fonts.googleapis.com/css2?family=Londrina+Solid:wght@900&display=swap');
  
.navbar-brand{
	font-family: 'Londrina Solid', sans-serif;
	color: #fff;
	letter-spacing: 5px;
	text-align: center;
	margin-top: 0px;
	margin-bottom: 0px;
	text-shadow: 1px 1px 0 #ccc, 2px 2px 0 #ccc, 3px 3px 0 #444, 4px 4px 0 #444;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}
.degrade {
	background-image: linear-gradient(90deg, #487B26, #276f73); 
	background-size:100% 100%;
	background-repeat:no-repeat;
	background-position:0px 0px;
}

a.navbar-brand:link { color: #fff; text-decoration: none}
a.navbar-brand:visited { color: #fff; text-decoration: none}
a.navbar-brand:hover { color: #fff; text-decoration: none}

/*
	###############################################
	########### Style cadre index1 ############
	###############################################
*/
#frmCol{
	padding-left:0px;
	padding-right:0px;
	overflow:hidden;
}
#frm{
	background-image:url('/images/form-index1-A.png');
	background-size: auto auto;
	background-repeat: no-repeat;
	background-position: top center;
	min-height: 900px;
	margin-right:5px;
}
.pageTitre{
	margin-top: 29px;
	width:100%;
	text-align:center;
	padding-top:30px;
	padding-left: 130px;
}

.pageTitreH1{
	font-size: 28px;
	display:inline-block;
	width:155px; 
	margin-left: 9px;
	word-wrap: break-word;
	overflow-wrap: break-word;
	position: relative;
	left: 10px;
}
.pageLigne{
	border: none;
	background: whitesmoke;
	padding: 3px 3px;
	-webkit-border-radius: 3px;
	width: 150px;
}
.texte{
	text-align:center;
	margin-left: 40px;
	display:inline-block;
	font-size: 21px;
	color:aliceblue;
	max-height: 999px; /* bug taille de police android chrome 126 non testé dans ipad*/
}
.center{text-align:center;}
#image0{
	width:100%; 
	margin: 0 auto;
}
#image1{
	width: 198px;
	margin: 0 auto;
}
#image2{
	width: 66px;
	margin: 0 auto;
}
#image3{
	width: 165px;
	margin: 0 auto;
}
#image4{
	width: 66%;
}

#frmIntrication{
	text-align:left;
	width:88%;
	height:640px;
	padding-left:20%;
	padding-right:0%;
	font-size:18px; 
	padding-top:20px;
}

#frmIncitation{ /* out */
	padding-left:9%;
	padding-right:9%;
	font-size:18px;
	padding-bottom:20px;
}






/*

@media only screen and (min-width : 424px) {
	#frmCol{
		padding-left:15px;
		padding-right:15px;
	}
}


@media (min-width: 768px) {
	#titreSection{
		margin-left:0px;
		margin-right:0px;
	}
	.container {
		width: 750px;
	}
}

@media (min-width: 992px) {
	.container {
		width: 970px;
	}
	#nSujets{
		clear: none;
	}
}



*/

/*
	###############################################
	########### Espaces intercalaires  ############
	###############################################
*/
#nobr{ display:none; }
@media only screen and (min-width: 328px) and (max-width:423px){
	#nobr{ display:inline-block; }
}



/*
	###################################
	########### Style logo ############
	###################################
*/
.navbar-brand{ font-size: 20px; }
@media only screen and (min-width : 365px) {
	.navbar-brand{ font-size: 27px; }
}
@media only screen and (min-width : 375px) {
	.navbar-brand{ font-size: 28px; }
}
@media only screen and (min-width : 409px) {
	.navbar-brand{ font-size: 30px; }
}
@media only screen and (min-width : 420px) {
	.navbar-brand{ font-size: 30px; }
}
@media only screen and (min-width : 446px) {
	.navbar-brand{ font-size: 35px; }
}
@media only screen and (min-width : 456px) {
	.navbar-brand{ font-size: 35px; }
}
/*
	###############################################
	########### Césures Google Chrome  ############
	###############################################
*/
@media (min-width: 320px) {
	#frm{
		background-image:url('/images/form-index1-A.png');
		background-size: auto auto;
	}
	.texte{
		width:270px;
		padding: 0px 5px;
	}
	.pageLigne{
		width: 144px; 
		position: relative;
		left: 8px;
	}	
	.pageTitre{
		padding-top:30px;
	}
	.pageTitreH1{
		margin-left: 19px;
		width: 150px;
	}
}

@media (min-width: 375px) { /* Redmi Go Android 8.1 */
	#frm{
		background-image:url('/images/form-index1-B.png');
		background-size: auto auto;
	}
	.texte{
		width:330px;
		padding: 0px 10px;
	}
	.pageLigne{
		width: 203px; 
		position: relative;
		left: 8px;
	}	
	.pageTitre{
		padding-top:30px;
	}
	.pageTitreH1{
		margin-left: 19px;
		width: 203px;
		font-size: 36px;
	}
}

@media (min-width: 425px) {
	#frm{
		background-image:url('/images/form-index1-C.png');
		background-size: auto auto;
	}
	.texte{
		width:386px; /*380px*/
	}
	.pageLigne{
		width: 264px; 
		padding-left: 3px;
		left: 0px;
	}	
	.pageTitre{
		padding-top:30px;
	}
	.pageTitreH1{
		width: 254px; 
		font-size: 36px;
	}

	#image1{
		width: 258px;
		margin: 0 auto;
	}
	#image2{
		width: 86px;
		margin: 0 auto;
	}
	#image3{
		width: 215px;
		margin: 0 auto;
	}
	#image4{
		width: 86%;
	}
}

@media only screen and (min-width : 576px) { /*Césures BootStrap*/
}

@media (min-width: 768px) {
	.container {
		width: 750px;
	}
	#frm{
		background-image:url('/images/form-index1-D.png');
		background-size: auto auto;
		min-height: 750px;
	}
	.texte{
		width:660px;
	}
	.pageLigne{
		width: 524px; 
		margin-left:60px;
	}	
	.pageTitre{
		padding-top:30px;
	}
	.pageTitreH1{
		width:100%; 
		font-size: 36px;
	}
	#image0{
		height:260px; 
		width:650px; 
		margin: 0 auto;
		padding-left: 44px;
	}
	#image1{
		float: left; 
		width: 258px;
	}
	#image2{
		float: left; 
		width: 86px;
	}
	#image3{
		float: left; 
		width: 215px;
	}
	#image4{
		width: 86%;
	}
	#image2 > div{
		margin-top:44px;
	}
}

@media only screen and (min-width : 992px) { /*Césures BootStrap*/
	.container {
		width: 970px;
	}
	/*#frmIncitation{ padding-left:9%; padding-right:9%; }*/
	.pageLigne{
		width: 524px; 
		margin-left:170px;
	}	
	.pageTitre{
		padding-top:30px;
	}
	.pageTitreH1{
		width:100%; 
		font-size: 36px;
	}
	#image0{
		height:260px; 
		width:650px; 
		margin: 0 auto;
		padding-left: 0px;
	}
	#image1{
		float: left; 
		width: 300px;
	}
	#image2{
		float: left; 
		width: 100px;
	}
	#image3{
		float: left; 
		width: 250px;
	}
	#image4{
		width: 100%;
	}
	#image2 > div{
		margin-top:44px;
	}
}

@media (min-width: 1024px) {
	#frm{
		background-image:url('/images/form-index1-E.png');
		background-size: auto auto;
	}
	.texte{
		margin-top: 10px;
		width:860px;
	}
	.pageLigne{
		width: 687px; 
		margin-left:89px;
	}
	.pageTitre{
		padding-top:30px;
	}
	.pageTitreH1{
		width:100%; 
		font-size: 36px;
	}
	#frmCorp1, #frmCorp2, #frmCorp3{
		margin-top: 0px;
	}
}
@media only screen and (min-width : 1200px) { /*Césures BootStrap*/
	.container {
		width: 1170px;
	}
	/*#frmIncitation{ padding-left:20%; padding-right:20%; }*/
	.pageLigne{
		width: 687px; 
		margin-left:199px;
	}	
}








/*
@media only screen and (min-width : 380px) {
	#frmIncitation{ padding-left:20%; padding-right:20%; }
}
@media only screen and (min-width : 510px) {
	#frmIncitation{ padding-left:9%; padding-right:9%; }
}
*/