*
{
	box-sizing: border-box;
}

html, body, table, td, th, option, select, input, textarea, ul, li, div
{
	font-family: "Titillium Web", verdana, arial, helvetica, sans-serif;
	font-size: medium;
	color: #263A45;
}

::placeholder
{
	font-style: italic;
}

#body
{
	margin: 0px;
	padding: 0px;
	height: 100%;
	width: 100%;
	overflow: auto;
}

.main
{
	padding: 1em;
}


.titreContainer
{
	width: 100%;
	background-color: #263A45;
	text-align: center;

	display: flex;
	flex-direction: row;
	justify-content: center;

	/*border: solid 1px red;*/
}

.titre
{
	width: 100%;
	min-width: 240px;
	max-width: 640px;
	height: 2em;
	line-height: 2em;
	text-align: right;
	font-weight: bold;
	font-size: larger;
	padding-left: 0.5em; /*100px;*/
	padding-right: 0.5em;
	color: white;
	background-color: #263A45;
	background-position: 0.5em center;
	background-repeat: no-repeat;
	background-size: 1.6em 1.6em;
	background-image: url(../../favicons/android-chrome-192x192.png);

	/*border: solid 1px blue;*/
}

#titre_confirm
{
	max-width: 320px;
}

.anepasmontrer
{
	display: none;
}

.label_error
{
	color: red;
}

#formContent, #formButtons
{
	display: flex;
	flex-direction: row;
	justify-content: center;
	margin-top: 0.5em;

	/*border: solid 1px green;*/
}

@media all and (max-width: 479px)
{
	.formTable
	{
		/*display: table;*/
	}

	.formRow
	{
		/*display: table-row;*/
		margin-top: 0.75em;
	}

	.formCell, .formCellLabel, .formCellInput
	{
		/*display: table-cell;*/
		/*padding: 2px;*/
	}

	.formCellLabel
	{
		font-size: smaller;
	}
}

@media all and (min-width: 480px)
{
	.formTable
	{
		display: table;
	}

	.formRow
	{
		display: table-row;
	}

	.formCell, .formCellLabel, .formCellInput
	{
		display: table-cell;
		padding: 2px;
	}

	.formCellLabel
	{
		padding-right: 1em;
		font-size: smaller;
	}
}


#form_login
{
	width: 10em;
}

#form_password1, #form_password2
{
	width: 10em;
}

#form_prenom
{
	width: 10em;
}

#form_nom
{
	width: 10em;
}

#form_mail
{
	width: 12em;
}

#form_maths
{
	width: 4em;
}

#errorDiv
{
	position: absolute;
	background-color: transparent;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	text-align: center;
}

#errorDiv21
{
	display: inline-block;
	background-color: transparent;
	text-align: left;
	vertical-align: middle;
	height: 100%;
	width: 0px;
}

#errorDiv22
{
	max-width: 95%;
	display: inline-block;
	background-color: rgba(255, 255, 128, 1);
	box-shadow: 3px 3px 5px #AAAAAA;
	padding-left: 5px;
	padding-right: 5px;
	border: solid red 2px;
	border-radius: 5px;
	text-align: left;
	vertical-align: top;
	margin-top: 100px;
}

ul.errors
{
	margin: 0.5em;
	padding-left: 1em;
}


.bouton
{
	cursor: pointer;
	text-transform: uppercase;
	font-weight: bold;
	height: 3em;
	line-height: 3em;
	background-color: transparent;
	padding-left: 1em;
	padding-right: 1em;
	border: none;
}

.bouton:hover
{
	background-color: #DDDDDD;
}

.boutonOk
{
	color: #10AA10;
}

.confirmText, .introText, .registerText
{
	margin: 0 auto;
	text-align: justify;
	text-justify: inter-word;
	width: 100%;
	min-width: 240px;
	max-width: 640px;

	/*border: solid 1px red;*/
}

.separator
{
	padding-bottom: 1em;
	margin-bottom: 1em;
    border-bottom: solid 1px #869AA5;
}




#form_code
{
	width: 4em;
}

#prenomCell
{
	max-width: 20em;
	text-align: justify;
}

#nomCell
{
	max-width: 20em;
	text-align: justify;
}

#nomComment
{
	font-size: smaller;
	font-style: italic;
}

.captchaContainer
{
	width: 100%;
	max-width: 100%;
	overflow-x: auto;

	/*border: solid 1px red;*/
}

.captchaContent
{
	display: flex;
    flex-direction: column;
    justify-content: center;
	align-items: center;
	overflow-x: auto;

	width: 100%;
	min-width: 320px;
	height: 110px;
	min-height: 110px;
	max-height: 110px;
	overflow-x: auto;

	/*border: solid 1px red;*/
}

@font-face {
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 400;
	src: local('Titillium Web'), local('TitilliumWeb-Regular'), url(../../fonts/TitilliumWeb-Regular.ttf);
}
@font-face {
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 700;
	src: local('Titillium WebBold'), local('TitilliumWeb-Bold'), url(../../fonts/TitilliumWeb-Bold.ttf);
}
@font-face {
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 900;
	src: local('Titillium WebBlack'), local('TitilliumWeb-Black'), url(../../fonts/TitilliumWeb-Black.ttf);
}
@font-face {
	font-family: 'Titillium Web';
	font-style: italic;
	font-weight: 400;
	src: local('Titillium WebItalic'), local('TitilliumWeb-Italic'), url(../../fonts/TitilliumWeb-Italic.ttf);
}
@font-face {
	font-family: 'Titillium Web';
	font-style: italic;
	font-weight: 700;
	src: local('Titillium WebBold Italic'), local('TitilliumWeb-BoldItalic'), url(../../fonts/TitilliumWeb-BoldItalic.ttf);
}