﻿@font-face {
    font-family: "century Gothic";
    src: url(font/GOTHIC.TTF);
}
@font-face {
    font-family: "century Gothic";
    src: url("font/GOTHICB.TTF");
    font-weight: bold;
}

@font-face {
    font-family: "century Gothic";
    src: url("font/GOTHICI.TTF");
    font-style: italic, oblique;
}

@font-face {
    font-family: "century Gothic";
    src: url("font/GOTHICBI.TTF");
    font-weight: bold;
    font-style: italic, oblique;
}


	body {
		
	}






	.forgottenPassword {
		color: #3b5998;
	}

	.headerWrapper {
		width: 100%;
	}

	/* Header supérieur de la page de connexion (Fond Bleu) */
	.loginHeader {
		width: 100%;
		height: 255px;
		background-image: url(Images/back.jpg);
		overflow: hidden;
		background-size: cover !important;
	}

	/* Logo à droite */
	.logo {
		width: 313px;
		height: 200px;
		margin-right: 25px;
		margin-top: 25px;
		position: relative;
		float: right;
		background-repeat: no-repeat;
	}

	/* Premières ligne du texte du header */
	.loginHeaderText {
		color: #FFFFFF;
		font-family: "century Gothic";
		font-size: 25px;
		padding-left: 50px;
		padding-top: 50px;
		float: left;
	}

	/* Deuxième bloc de texte du header (Dans le bleu)*/
	.loginHeaderTextInfos {
		font-family: "century Gothic";
		font-size: 12px;
		color: #FFFFFF;
		width: 400px;
		float: left;
	}

	/* Espace pricipal (blanc) */
	.mainDiv {
		width: 100%;
		padding: 0px;
		border: 1px ridge black;
	}

	/* Espace Principal */
	.mainTable {
		padding: 0px;
		margin: 0px;
		width: 100%;
	}

	/* Partie gauche de l'écran sous le header */
	.leftTableMain {
		width: 60%;
		vertical-align: top;
		padding-left: 40px;
	}

	/* Partie droite de l'écran sous le header (Il contient le formulaire de connexion*/
	.rightTableMain {
		padding: 10px;
		margin: 10px;
	}

	.borderTable {
		width: 100%; /*border:ridge #C0C0C0 1px;*/
	}

	/* Titre du formulaire de connexion */
	.connexionText {
		padding: 10px;
		color: #000000;
		font-family: "century Gothic";
		font-size: 25px;
		border-bottom: ridge #C0C0C0 1px;
		width: 285px;
	}

	

	/* Texte situé à gauche des inputBox du formulaire de connexion User / Password */
	.loginText {
		padding-left: 10px;
		color: #000000;
		font-family: "century Gothic";
		font-size: 18px;
		text-align: right;
	}

	.passwordText {
		padding-left: 10px;
		color: #000000;
		font-family: "century Gothic";
		font-size: 18px;
		text-align: right;
		vertical-align: top;
		padding-top: 6px;
	}

	.mainText {
		position: relative;
		top: -10px;
	}




	@-moz-document url-prefix() {
		.passwordText {
			padding-left: 10px;
			color: #000000;
			font-family: "century Gothic";
			font-size: 18px;
			text-align: right;
			vertical-align: top;
			padding-top: 3px;
		}
	}

	/* Bouton de connexion */
	.connexionButton {
		font-family: "century Gothic";
		font-size: 18px;
	}

	/* Cellule du titre du formulaire de connexion */
	.connexionTd {
		border-bottom: ridge #C0C0C0 1px;
		width: 350px;
		text-align: center;
		padding: 10px;
	}

	/* Pied de page */
	.footer {
		height: 130px;
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 1;
		width: 100%;
	}

	/* Tableau du pied de page */
	.footerTable {
		width: 100%;
		/*background-color: #FFFFFF;*/
	}

	/* Partie gauche du tableau de pied de page */
	.footerTableLeft {
		width: 264px;
		padding-left: 30px;
		margin-bottom: 10px;
	}

	/* Partie droite du tableau de pied de page */
	.footerTableRight {
		font-family: "century Gothic";
		font-size: 12px;
		padding-left: 32px;
		/*padding-top: 60px;*/
	}

	/* Texte rouge d'erreur de connexion */
	.errorLoginText {
		color: Red;
		font-family: "century Gothic";
		font-size: 12px;
	}

	.archiveDiv {
		width: 250px;
		float: left;
		padding-top: 5px;
		padding-right: 10px;
	}

	.archiveAccessible {
		width: 32px;
		height: 32px;
		z-index: 1000;
		float: left;
		position: relative;
		left: 26px;
		top: 30px;
	}

	.errorOnArchive {
		background-image: url(Images/bullet_error.png);
		background-size: 24px;
		background-repeat: no-repeat;
		background-position: 0px 10px;
		width: 24px;
		height: 64px;
		z-index: 1000;
		float: left;
		position: relative;
		left: 26px;
		top: 24px;
	}

	.maintenanceOnArchive {
		background-image: url(Images/bullet_maintenance.png);
		background-size: 24px;
		background-repeat: no-repeat;
		background-position: 0px 10px;
		width: 24px;
		height: 64px;
		z-index: 100; /* à 1000 cela passe au dessus de la barre de naviguation lorsqu'elle descend */
		float: left;
		position: relative;
		left: 26px;
		top: 24px;
	}

	.archiveIcon {
		float: left;
		margin-right: 10px;
		position: relative;
		left: -32px;
		top: 10px;
	}

	.archiveLabel {
		margin-top: 10px;
		position: relative;
		left: -32px;
	}

	.archiveName {
		padding-top: 0px;
		font-weight: bold;
	}

	.archiveDescription {
		font-style: italic;
		height: 20px;
		text-overflow: ellipsis;
		-o-text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
	}

	.blueLink {
		color: #15ADFF;
	}

	.contentPageRubTitle {
		padding-top: 28px;
		padding-left: 00px;
		font-size: 25px;
		font-family: "century Gothic";
		color: #000000;
		text-shadow: 0.8px 0.8px 0px #CDCDCD;
		letter-spacing: 1px;
	}

	.contentPageRubSubTitle {
		padding-left: 00px;
		font-size: 15px;
		font-family: "century Gothic";
		color: #373737;
		letter-spacing: 1px;
		font-style: italic;
	}

	#openAccessArchives {
		padding-left: 10px;
	}

	.connexionTd .but {
		color: #000000;
		font: bold 12px Helvetica, Arial, sans-serif;
		text-decoration: none;
		padding: 7px 12px;
		position: relative;
		display: inline-block;
		text-shadow: 0 1px 0 #fff;
		-webkit-transition: border-color .218s;
		-moz-transition: border .218s;
		-o-transition: border-color .218s;
		transition: border-color .218s;
		background: #f3f3f3;
		background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		border: solid 1px #dcdcdc;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		margin-right: 10px;
	}

		.connexionTd .but:hover {
			color: #333;
			border-color: #999;
			-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
			box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
		}

		.connexionTd .but:active {
			color: #000;
			border-color: #444;
		}

	.connect-google {
		color: #000000;
		font: bold 12px Helvetica, Arial, sans-serif;
		text-decoration: none;
		padding: 7px 12px;
		position: relative;
		display: inline-block;
		text-shadow: 0 1px 0 #fff;
		-webkit-transition: border-color .218s;
		-moz-transition: border .218s;
		-o-transition: border-color .218s;
		transition: border-color .218s;
		background: #f3f3f3;
		background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		background: url(images/auth/google.png) 10px 5px no-repeat #f3f3f3;
		border: solid 1px #dcdcdc;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		margin-right: 10px;
		padding-left: 30px;
	}

		.connect-google:hover {
			color: #333;
			border-color: #999;
			-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
			box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
		}

		.connect-google:active {
			color: #000;
			border-color: #444;
			font: bold 12px Helvetica, Arial, sans-serif;
			text-decoration: none;
			padding: 7px 12px;
			position: relative;
			display: inline-block;
			text-shadow: 0 1px 0 #fff;
			-webkit-transition: border-color .218s;
			-moz-transition: border .218s;
			-o-transition: border-color .218s;
			transition: border-color .218s;
			background: #f3f3f3;
			background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
			background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
			background: url(images/auth/google.png) 10px 5px no-repeat #f3f3f3;
			border: solid 1px #dcdcdc;
			border-radius: 2px;
			-webkit-border-radius: 2px;
			-moz-border-radius: 2px;
			margin-right: 10px;
			padding-left: 30px;
		}

	.connect-custom {
		color: #000000;
		font: bold 12px Helvetica, Arial, sans-serif;
		text-decoration: none;
		padding: 7px 12px;
		position: relative;
		display: inline-block;
		text-shadow: 0 1px 0 #fff;
		-webkit-transition: border-color .218s;
		-moz-transition: border .218s;
		-o-transition: border-color .218s;
		transition: border-color .218s;
		background: #f3f3f3;
		background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		background: url(images/auth/custom.png) 5px 2px no-repeat #f3f3f3;
		border: solid 1px #dcdcdc;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		margin-right: 10px;
		padding-left: 35px;
	}

		.connect-custom:hover {
			color: #333;
			border-color: #999;
			-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
			box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
		}

		.connect-custom:active {
			color: #000;
			border-color: #444;
			font: bold 12px Helvetica, Arial, sans-serif;
			text-decoration: none;
			padding: 7px 12px;
			position: relative;
			display: inline-block;
			text-shadow: 0 1px 0 #fff;
			-webkit-transition: border-color .218s;
			-moz-transition: border .218s;
			-o-transition: border-color .218s;
			transition: border-color .218s;
			background: #f3f3f3;
			background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
			background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
			background: url(images/auth/custom.png) 5px 2px no-repeat #f3f3f3;
			border: solid 1px #dcdcdc;
			border-radius: 2px;
			-webkit-border-radius: 2px;
			-moz-border-radius: 2px;
			margin-right: 10px;
			padding-left: 35px;
		}



	#connectButton {
		z-index: 1000;
	}

	@media (max-width: 790px) {
		body {
			width: 100%;
		}

		.headerWrapper {
			text-align: center;
		}

		.logo {
			width: 153px;
			height: 100px;
			background-size: 150px;
			background-repeat: no-repeat;
			margin-left: 0;
			margin-right: 0;
			width: 100%;
			/*background-position-x: 45%;*/
			background-position: center;
		}

		.loginHeaderText {
			padding-top: 120px;
			height: 60px;
			overflow: hidden;
			width: 100%;
			padding-top: 20px;
			padding-left: 0px;
		}

		.loginHeader {
			height: 220px;
		}

		.contentPageRubTitle {
			top: 250px;
			position: relative;
		}

		.contentPageRubSubTitle {
			top: 250px;
			position: relative;
		}

		#openAccessArchives {
			top: 250px;
			position: relative;
		}

		.connexionText {
			position: absolute;
			left: 40px;
			top: 250px;
			width: 80%;
		}

		.connexionTable {
			position: absolute;
			left: 40px;
			top: 320px;
			width: 85%;
		}

		.leftTableMain {
			width: 100%;
		}

		.footer {
			height: 110px;
			/*top: 500px;*/
			left: 0;
			z-index: 1;
			width: 100%;
		}

		.footerTableRight {
			font-family: "century Gothic";
			font-size: 12px;
			padding-top: 0px;
		}




		.mainText {
			position: relative;
			top: -25px;
			left: 20px;
		}
	}

	@keyframes blink {
		0% {
			opacity: 1;
		}

		50% {
			opacity: 0;
		}

		100% {
			opacity: 1;
		}
	}

	@-webkit-keyframes blink {
		0% {
			opacity: 1;
		}

		50% {
			opacity: 0;
		}

		100% {
			opacity: 1;
		}
	}

	.blink {
		animation: blink 2s;
		-webkit-animation: blink 2s;
		animation-iteration-count: infinite;
		-webkit-animation-iteration-count: infinite;
	}


	.buttonDomMobile {
		color: #000000;
		font: bold 12px Helvetica, Arial, sans-serif;
		text-decoration: none;
		padding: 7px 12px;
		position: relative;
		display: inline-block;
		text-shadow: 0 1px 0 #fff;
		-webkit-transition: border-color .218s;
		-moz-transition: border .218s;
		-o-transition: border-color .218s;
		transition: border-color .218s;
		background: #f3f3f3;
		background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		border: solid 1px #dcdcdc;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		margin-right: 10px;
	}

		.buttonDomMobile a {
			text-decoration: none;
			color: black;
		}


@media (prefers-color-scheme: dark) {

	body {
		margin: 0px;
		padding: 0px;
		font-family: "century Gothic"; /*Helvetica,Arial,sans-serif;*/
		font-size: 12px;
		/*background: url(images/backgroundFull.jpg) no-repeat center center fixed;*/
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		width: 100%;
	}






	.forgottenPassword {
		color: #aaaeb5;
	}

	.headerWrapper {
		width: 100%;
	}

	/* Header supérieur de la page de connexion (Fond Bleu) */
	.loginHeader {
		width: 100%;
		height: 255px;
		background-image: url(Images/backDark.jpg);
		overflow: hidden;
		background-size: cover !important;
	}

	/* Logo à droite */
	.logo {
		width: 313px;
		height: 200px;
		margin-right: 25px;
		margin-top: 25px;
		position: relative;
		float: right;
		background-repeat: no-repeat;
	}

	/* Premières ligne du texte du header */
	.loginHeaderText {
		color: #FFFFFF;
		font-family: "century Gothic";
		font-size: 25px;
		padding-left: 50px;
		padding-top: 50px;
		float: left;
	}

	/* Deuxième bloc de texte du header (Dans le bleu)*/
	.loginHeaderTextInfos {
		font-family: "century Gothic";
		font-size: 12px;
		color: #FFFFFF;
		width: 400px;
		float: left;
	}

	/* Espace pricipal (blanc) */
	.mainDiv {
		width: 100%;
		padding: 0px;
		border: 1px ridge black;
	}

	/* Espace Principal */
	.mainTable {
		padding: 0px;
		margin: 0px;
		width: 100%;
	}

	/* Partie gauche de l'écran sous le header */
	.leftTableMain {
		width: 60%;
		vertical-align: top;
		padding-left: 40px;
	}

	/* Partie droite de l'écran sous le header (Il contient le formulaire de connexion*/
	.rightTableMain {
		padding: 10px;
		margin: 10px;
	}

	.borderTable {
		width: 100%; /*border:ridge #C0C0C0 1px;*/
	}

	/* Titre du formulaire de connexion */
	.connexionText {
		padding: 10px;
		color: #000000;
		font-family: "century Gothic";
		font-size: 25px;
		border-bottom: ridge #C0C0C0 1px;
		width: 285px;
	}

	#passwordText, #loginText {
		border: 1px solid #DDD;
		background: transparent;
		padding: 3px;
		font-family: "century Gothic"; /*Helvetica,Arial,sans-serif;*/
		font-size: 14px;
		color: white !important;
	}

		#passwordText:focus, #loginText:focus {
			outline: none;
			-webkit-box-shadow: 0 0 5px rgba(0,0,0,.3);
			-moz-box-shadow: 0 0 5px rgba(0,0,0,.3);
			-o-box-shadow: 0 0 5px rgba(0,0,0,.3);
			box-shadow: 0 0 5px rgba(0,0,0,.3);
			margin: 2px;
			border: 1px solid #5897fb;
			height: 20px;
		}

	/* Texte situé à gauche des inputBox du formulaire de connexion User / Password */
	.loginText {
		padding-left: 10px;
		color: #ffffff;
		font-family: "century Gothic";
		font-size: 18px;
		text-align: right;
	}

	.passwordText {
		padding-left: 10px;
		color: #ffffff;
		font-family: "century Gothic";
		font-size: 18px;
		text-align: right;
		vertical-align: top;
		padding-top: 6px;
	}

	.mainText {
		position: relative;
		top: -10px;
	}




	@-moz-document url-prefix() {
		.passwordText {
			padding-left: 10px;
			
			font-family: "century Gothic";
			font-size: 18px;
			text-align: right;
			vertical-align: top;
			padding-top: 3px;
		}
	}

	/* Bouton de connexion */
	.connexionButton {
		font-family: "century Gothic";
		font-size: 18px;
	}

	/* Cellule du titre du formulaire de connexion */
	.connexionTd {
		border-bottom: ridge #C0C0C0 1px;
		width: 350px;
		text-align: center;
		padding: 10px;
	}

	/* Pied de page */
	.footer {
		height: 130px;
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 1;
		width: 100%;
	}

	/* Tableau du pied de page */
	.footerTable {
		width: 100%;
		/*background-color: #FFFFFF;*/
	}

	/* Partie gauche du tableau de pied de page */
	.footerTableLeft {
		width: 264px;
		padding-left: 30px;
		margin-bottom: 10px;
	}

	/* Partie droite du tableau de pied de page */
	.footerTableRight {
		font-family: "century Gothic";
		font-size: 12px;
		padding-left: 32px;
		/*padding-top: 60px;*/
	}

	.footerTableRight a{
			color:aliceblue;
	}

	/* Texte rouge d'erreur de connexion */
	.errorLoginText {
		color: Red;
		font-family: "century Gothic";
		font-size: 12px;
	}

	.archiveDiv {
		width: 250px;
		float: left;
		padding-top: 5px;
		padding-right: 10px;
	}

	.archiveAccessible {
		width: 32px;
		height: 32px;
		z-index: 1000;
		float: left;
		position: relative;
		left: 26px;
		top: 30px;
	}

	.errorOnArchive {
		background-image: url(Images/bullet_error.png);
		background-size: 24px;
		background-repeat: no-repeat;
		background-position: 0px 10px;
		width: 24px;
		height: 64px;
		z-index: 1000;
		float: left;
		position: relative;
		left: 26px;
		top: 24px;
	}

	.maintenanceOnArchive {
		background-image: url(Images/bullet_maintenance.png);
		background-size: 24px;
		background-repeat: no-repeat;
		background-position: 0px 10px;
		width: 24px;
		height: 64px;
		z-index: 100; /* à 1000 cela passe au dessus de la barre de naviguation lorsqu'elle descend */
		float: left;
		position: relative;
		left: 26px;
		top: 24px;
	}

	.archiveIcon {
		float: left;
		margin-right: 10px;
		position: relative;
		left: -32px;
		top: 10px;
	}

	.archiveLabel {
		margin-top: 10px;
		position: relative;
		left: -32px;
	}

	.archiveName {
		padding-top: 0px;
		font-weight: bold;
	}

	.archiveDescription {
		font-style: italic;
		height: 20px;
		text-overflow: ellipsis;
		-o-text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
	}

	.blueLink {
		color: #15ADFF;
	}

	.contentPageRubTitle {
		padding-top: 28px;
		padding-left: 00px;
		font-size: 25px;
		font-family: "century Gothic";
		color: #b3aaaa;
		letter-spacing: 1px;
	}

	.contentPageRubSubTitle {
		padding-left: 00px;
		font-size: 15px;
		font-family: "century Gothic";
		color: #b3aaaa;
		letter-spacing: 1px;
		font-style: italic;
	}

	#openAccessArchives {
		padding-left: 10px;
	}

	.connexionTd .but {
		color: #000000;
		font: bold 12px Helvetica, Arial, sans-serif;
		text-decoration: none;
		padding: 7px 12px;
		position: relative;
		display: inline-block;
		
		-webkit-transition: border-color .218s;
		-moz-transition: border .218s;
		-o-transition: border-color .218s;
		transition: border-color .218s;
		
		border: solid 1px #dcdcdc;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		margin-right: 10px;
	}

		.connexionTd .but:hover {
			color: #333;
			border-color: #999;
			-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
			box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
		}

		.connexionTd .but:active {
			color: #000;
			border-color: #444;
		}

	.connect-google {
		color: #000000;
		font: bold 12px Helvetica, Arial, sans-serif;
		text-decoration: none;
		padding: 7px 12px;
		position: relative;
		display: inline-block;
		text-shadow: 0 1px 0 #fff;
		-webkit-transition: border-color .218s;
		-moz-transition: border .218s;
		-o-transition: border-color .218s;
		transition: border-color .218s;
		background: #f3f3f3;
		background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		background: url(images/auth/google.png) 10px 5px no-repeat #f3f3f3;
		border: solid 1px #dcdcdc;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		margin-right: 10px;
		padding-left: 30px;
	}

		.connect-google:hover {
			color: #333;
			border-color: #999;
			-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
			box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
		}

		.connect-google:active {
			color: #000;
			border-color: #444;
			font: bold 12px Helvetica, Arial, sans-serif;
			text-decoration: none;
			padding: 7px 12px;
			position: relative;
			display: inline-block;
			text-shadow: 0 1px 0 #fff;
			-webkit-transition: border-color .218s;
			-moz-transition: border .218s;
			-o-transition: border-color .218s;
			transition: border-color .218s;
			background: #f3f3f3;
			background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
			background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
			background: url(images/auth/google.png) 10px 5px no-repeat #f3f3f3;
			border: solid 1px #dcdcdc;
			border-radius: 2px;
			-webkit-border-radius: 2px;
			-moz-border-radius: 2px;
			margin-right: 10px;
			padding-left: 30px;
		}

	.connect-custom {
		color: #000000;
		font: bold 12px Helvetica, Arial, sans-serif;
		text-decoration: none;
		padding: 7px 12px;
		position: relative;
		display: inline-block;
		text-shadow: 0 1px 0 #fff;
		-webkit-transition: border-color .218s;
		-moz-transition: border .218s;
		-o-transition: border-color .218s;
		transition: border-color .218s;
		background: #f3f3f3;
		background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		background: url(images/auth/custom.png) 5px 2px no-repeat #f3f3f3;
		border: solid 1px #dcdcdc;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		margin-right: 10px;
		padding-left: 35px;
	}

		.connect-custom:hover {
			color: #333;
			border-color: #999;
			-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
			box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
		}

		.connect-custom:active {
			color: #000;
			border-color: #444;
			font: bold 12px Helvetica, Arial, sans-serif;
			text-decoration: none;
			padding: 7px 12px;
			position: relative;
			display: inline-block;
			text-shadow: 0 1px 0 #fff;
			-webkit-transition: border-color .218s;
			-moz-transition: border .218s;
			-o-transition: border-color .218s;
			transition: border-color .218s;
			background: #f3f3f3;
			background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
			background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
			background: url(images/auth/custom.png) 5px 2px no-repeat #f3f3f3;
			border: solid 1px #dcdcdc;
			border-radius: 2px;
			-webkit-border-radius: 2px;
			-moz-border-radius: 2px;
			margin-right: 10px;
			padding-left: 35px;
		}



	#connectButton {
		z-index: 1000;
	}

	@media (max-width: 790px) {
		body {
			width: 100%;
		}

		.headerWrapper {
			text-align: center;
		}

		.logo {
			width: 153px;
			height: 100px;
			background-size: 150px;
			background-repeat: no-repeat;
			margin-left: 0;
			margin-right: 0;
			width: 100%;
			/*background-position-x: 45%;*/
			background-position: center;
		}

		.loginHeaderText {
			padding-top: 120px;
			height: 60px;
			overflow: hidden;
			width: 100%;
			padding-top: 20px;
			padding-left: 0px;
		}

		.loginHeader {
			height: 220px;
		}

		.contentPageRubTitle {
			top: 250px;
			position: relative;
		}

		.contentPageRubSubTitle {
			top: 250px;
			position: relative;
		}

		#openAccessArchives {
			top: 250px;
			position: relative;
		}

		.connexionText {
			position: absolute;
			left: 40px;
			top: 250px;
			width: 80%;
		}

		.connexionTable {
			position: absolute;
			left: 40px;
			top: 320px;
			width: 85%;
		}

		.leftTableMain {
			width: 100%;
		}

		.footer {
			height: 110px;
			/*top: 500px;*/
			left: 0;
			z-index: 1;
			width: 100%;
		}

		.footerTableRight {
			font-family: "century Gothic";
			font-size: 12px;
			padding-top: 0px;
		}




		.mainText {
			position: relative;
			top: -25px;
			left: 20px;
		}
	}

	@keyframes blink {
		0% {
			opacity: 1;
		}

		50% {
			opacity: 0;
		}

		100% {
			opacity: 1;
		}
	}

	@-webkit-keyframes blink {
		0% {
			opacity: 1;
		}

		50% {
			opacity: 0;
		}

		100% {
			opacity: 1;
		}
	}

	.blink {
		animation: blink 2s;
		-webkit-animation: blink 2s;
		animation-iteration-count: infinite;
		-webkit-animation-iteration-count: infinite;
	}


	.buttonDomMobile {
		color: #000000;
		font: bold 12px Helvetica, Arial, sans-serif;
		text-decoration: none;
		padding: 7px 12px;
		position: relative;
		display: inline-block;
		text-shadow: 0 1px 0 #fff;
		-webkit-transition: border-color .218s;
		-moz-transition: border .218s;
		-o-transition: border-color .218s;
		transition: border-color .218s;
		background: #f3f3f3;
		background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
		border: solid 1px #dcdcdc;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		margin-right: 10px;
	}

		.buttonDomMobile a {
			text-decoration: none;
			color: black;
		}
}