@font-face {
  font-family: 'Titillium';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/Titillium-Light.otf');
}
@font-face {
  font-family: 'Titillium';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/Titillium-Regular.otf');
}
@font-face {
  font-family: 'Titillium';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/Titillium-Bold.otf');
}
* { margin: 0; padding: 0; }
html{
	height:100%;
}
body {
	background-image:url('../img/FONDINFOGEO28.jpg');
	background-size: cover;
	background-attachment: fixed;
}
#head-border-top {
    background-image: linear-gradient(90deg, #32b9c8,#a0328c);
    height: 6px;
}

#login-box {
	background-color: #fff;
	padding: 25px 30px;
	text-align:left;
	margin: 110px auto 0;
}
#login-box h1 {
	font-family: "Titillium";
	font-weight: 400;
	font-size: 46px;
	color: #34b8c7;
	text-align: center;
}
#login-box form {
	margin-top:20px;
	margin-bottom:20px;
}
#logo{
	margin:0 auto;
	max-width: 100%;
}

#banniere{
	margin:0 auto;
	max-width: 100%;
}

#logo_IG{
	margin:0 auto;
	max-width: 33%;
}
#header {
	text-align: center; /* Centre le contenu inline comme img ou p */
	position: relative;
}

/* Cette règle force l’image à se centrer même si elle est bloquée par des styles conflictuels */
#main-logo {
	display: block !important;
	margin-left: auto !important;
	margin-right: auto !important;
	float: none !important;
	max-width: 300px; /* Ajuste la taille si nécessaire */
	height: auto;
}




.txt{
	font-family: "Titillium";
	text-align: center;
	padding: 25px;
	font-weight: 600;
	font-size: 18px;
	color: #34b8c7;
	max-width: 520px;
	margin: auto;
	text-transform: uppercase;
}
.button1{
	background-color: #34b8c7;
	color: #fff;
	width: 100%;
	display: block;
	max-width: 475px;
	margin: 15px auto;
	padding: 8px 15px 12px;
	text-align: center;
	font-size: 32px;
	text-decoration: none;
	font-family: "Titillium";
	text-transform: uppercase;
	font-weight: 600;
	box-sizing: border-box;
}
.button2{
	background-color: #34b8c7;
	color: #fff;
	width: 100%;
	display: block;
	max-width: 320px;
	margin: -10px auto 45px;
	padding: 10px 15px;
	text-align: center;
	font-size: 20px;
	text-decoration: none;
	font-family: "Titillium";
	text-transform: uppercase;
	box-sizing: border-box;
}
.button1:hover,.button2:hover{
	background-color: #005e95;
}

#info{
	font-family: "Titillium";
	color: #34b8c7;
	text-align: center;
	font-size: 20px;
}
#renseignement{
	font-family: "Titillium";
	color: #34b8c7;
	text-align: center;
	font-size: 18px;
	font-style: italic;
	margin-top: 45px;
}

a{
	text-decoration: underline;
	text-underline-offset: 3px;
	color: #34b8c7;
}

#admin-div{
	text-align: center;
	margin-top: 35px;
}
a#admin-href{
	color: #FFF;
	text-decoration:none;
	cursor:pointer;
    padding: 1em;
}
a#admin-href:visited{
	color: #FFF;
}
.input-group-addon {
	font-family:"Titillium";
	font-weight:600;
	font-size:16px;
    color: #FFF;
    background-color: #34b8c7;
    border: 1px solid #666666;
    -moz-border-radius: 13px 0 0 13px;
	-khtml-border-radius: 13px 0 0 13px;
	-webkit-border-radius: 13px 0 0 13px;
    border-radius: 13px 0 0 13px;
}
input.form-control, select.form-control{
	border: 1px solid #666666;
	border-left:0;
	-moz-border-radius: 0 13px 13px 0;
	-khtml-border-radius: 0 13px 13px 0;
	-webkit-border-radius: 0 13px 13px 0;
    border-radius: 0 13px 13px 0;
}
.btn-primary {
	font-family:"Titillium";
	font-weight:600;
	font-size:16px;
	-moz-border-radius: 13px;
	-khtml-border-radius: 13px;
	-webkit-border-radius: 13px;
    border-radius: 13px;
    background-color: #34b8c7;
    border-color: #34b8c7;
}
.btn-primary:hover{
	background-color: #33b6c8;
	border-color: #33b6c8;
}
#container-footer{
	text-align:center;
	padding-top: 150px;
}
#footer{
	position:relative;
}
#footer .icon-vague{
	display: inline-block;
	background: url('../img/icon-vague.png') no-repeat center center;
	width:15px;
	height:9px;
}
#footer .icon-phone{
	display: inline-block;
	background: url('../img/icon-phone.png') no-repeat center center;
	width:11px;
	height:13px;
}
#footer-adresse{
	font-family:"Titillium";
	font-weight:300;
	background: #ba2e90;
	border-radius: 150px 0 150px 0;
	padding: 10px 50px;
	text-align: center;
	color: #FFF;
	display:inline-block;
	margin:0 auto;
	position:relative;
	font-size: 15px;
}
#background-footer{
	width: 50%;
	height: 108px;
	position: absolute;
	left: 50%;
	bottom: 30px;
	background-image: url('../img/background-footer.png');
	background-position: center left;
}


@media (min-width: 1200px){
	#login-box{
		max-width:48em;
	}
}
@media (min-width: 992px) and (max-width: 1199px) {
    #login-box{
		max-width:50em;
	}
}
@media (min-width: 768px) and (max-width: 991px) {
     #login-box{
		max-width:50em;
	}
}
@media (max-width: 767px) {
	#logo-top{
		margin:0 auto;
	}
	#background-content{
		background-image:none;
	}
	#login-box{
		max-width: 90%;
		box-sizing: border-box;
	}
	#txtouverture {
		padding: 20px 0px;
		font-size: 17px;
	}
	#container-footer{
		padding-top: 50px;
	}
	#background-footer{
		display:none;
	}

	#login-box {
		padding: 20px;
	}

	.txt{
		max-width: 100%;
	}
}