@import url('https://fonts.googleapis.com/css?family=Open+Sans');

html, body {
	padding:0;
	margin:0;
}
body {
	background:#fdfdfd;
}
*{
	font-family: 'Open Sans', sans-serif;
	font-size:13px;
}


a {
	text-decoration:none;
	color:#DB9128;
}
.contenu p {
	line-height:22px;
}

h1 {
	font-size:16px;
}
h1, h2 {
	text-transform:uppercase;	
}
h1.home {
	text-align:center;
	margin-top:100px;
	font-size:22px;
	color:#565757;
}
h2 {
	color:#DB9128;
}
h3.spacing {
	margin-top:50px;
}
strong {
	color:#DB9128;

}
main {
	margin:30px 0;
	min-height:calc(100vh - 343px);
}
header {
	background:#DB9128;
	overflow:hidden;
}
.wrapper {
	max-width:1080px;
	padding:0 20px;
	margin:0 auto;
}
header .logo-container {
	margin-top:20px;
	margin-bottom:20px;
}

header .logo-container img {
	width:110px;

}
header .baseline {
	font-size:24px;
	font-style:italic;
	color:#FFF;
	margin-left:20px;
	margin-top:32px;
}
header .baseline, header .logo-container {
	float:left;
}
header .login {
	float:right;
	text-align:right;
	color:#FFF;
	padding-top:20px;
}
header .login a {
	color:#FFF;
}
header .logout a {
	display:block;
	padding:5px 0;
	font-size:10px;
}
header .login i {
	font-size:16px;
	padding-right:5px;
}
header .login .user-name {
	font-size:17px;
	font-style:italic;
}
header .login .user-id {
	font-size:13px;
	font-style:italic;
}
header .login .user-id span {
	font-weight:bold;
}
header #menu-toggle {
	display:none;
}
footer {
	background:#F2F2F2;
	padding:10px 0;
	font-size:12px;
}
footer .infos {
	float:left;
	max-width:35%;
}
footer .infos p {
	font-size:12px;
}
footer .menu-footer {
	float:right;
	max-width:65%;
}
.menu-footer ul li {
	float:left;
	list-style:none;
	padding-right:10px;
}
.menu-footer ul li a {
	color:#4a4a4a;
	font-size:12px;
}
.menu-footer ul li a:hover {
	color:#000;
}
.menu-footer ul li:last-child {
	padding-right:0;
}


.wrapper::after {
	content: '';
    display: block;
    clear: both;
}




.contenu {
	margin:50px 0;
}
.contenu ul {
	margin-top:20px;

}

.contenu ul li, .contenu ol li {
	margin-top:20px;
}
.contenu ul li ul {
	margin-top:10px;

}
.formError {
	background:#d61e38;
	padding:5px;
	color:#fff;
}
.contenu ul.listeVilles, .contenu ul.listeRues, .contenu ul.listeBiens {
	text-transform:capitalize;
}

ul#attestations li {
	min-height:35px;
}

.contenu ul li {
	padding:0 5px;
}
.contenu ul li a {
	text-decoration:none;
}


.logo {
	text-align:center;
	margin-bottom:30px;
	margin-left:auto;
	margin-right:auto;
	max-width:600px;
	width:95%;
}
.logo img {
	border:0;
	width:100%;
}

.button {
	padding:6px 10px;
	background:#FFF;
	border:solid 3px #DB9128;
	border-radius:2px;
	cursor:pointer;
	display:inline-block;
	margin-bottom:5px;
	margin-top:30px;
	margin-left:0;
	font-size:13px;
	font-weight:bold;
	color:#DB9128;
	text-decoration:none;
	-webkit-transition : all 300ms ease-in-out;
    -moz-transition : all 300ms ease-in-out;
    -o-transition : all 300ms ease-in-out;
    transition : all 300ms ease-in-out;
}
a.button:first-child {
	margin-left:0;
}
.button span {
	margin-right:5px;
}
.button:hover {
	color:#666;
	border-color:#666;
}

.loginForm {
	display:block;
	width:300px;
	margin:50px auto 80px auto;
}

form label {
	font-size:13px;
	margin-bottom:8px;
	margin-top:8px;
	color:#777;
	display:block;
}

form input[type=text], form input[type=password], form textarea, form select, form input[type=tel], form input[type=email], form input[type=date] {
	padding:8px;
	margin:3px 0 10px 0;
	width:calc(100% - 20px);
}
form input.date {
	padding:8px;
	margin:3px 0 10px 0;
}
form input, form textarea {
	border:1px solid #EEE;
}
form input[type=checkbox] {
	margin-top:4px;
	margin: 10px 10px 10px 0;
}

form input[type=radio] {
	width:12px;
	margin-right:10px;
	margin-bottom:5px;
	margin-top:5px;
}


form input[type=checkbox].activite_sportive_enseignee {
	margin-bottom:0;
	margin-top:30px;
}



.label-file {
    cursor: pointer;
	background-image:url(../images/doc-pj.png);
	background-repeat:no-repeat;
	background-size:30px 40px;
	padding-left:40px;
	min-height:40px;
	line-height:40px;
	margin:30px 0 5px 0;
}

.label-file:hover {
    color: #DB9128;
}


form textarea {
	max-width:calc(100% - 26px);
}
form input[type=tel] {
	width:50%;
}
form select#selectionDep {
	width:100%;
}

form#selectDpt {
	width:40%;
}


.loginForm a.button {
	width:calc(100% - 20px);
	text-align:center;
	background:#DB9128;
	color:#FFF;
	border:none;
	padding:10px;
	margin-top:15px;
}

.required, .asterisque {
	color:#DB9128;
}

.contrat {
	text-align:center;

}
.contrat a.button {
	width:calc(100% - 26px);
}
span.montant {
	font-weight:bold;
	color:#DB9128;
}
.redirection, .message {	
	border:solid 3px #DB9128;
	font-size:18px;
	color:#DB9128;
	padding:20px 0;
	text-align:center;
	margin-top:40px;
}

input.half {
	width:50% !important;
}

hr {
	margin: 45px 0;
	border: 1px solid #eee;
}


.contrats {
	display:inline;
	font-weight:bold;
	color:#6d6d6d;
}

.contrat span {
	display:block;
	width:100%;
}

fieldset {
	border:0;
	padding:0;
	float:left;
	margin:0;
	width:100%;
}


.col {
	width:calc(50% - 10px);
	padding:0;
}
.col.maidais {
	width:calc(50% - 30px) !important;

}
.col.gauche {
	float:left;
}
.col.droite {
	float:right;
}

.clear {
	clear:both;
}



ul.liste, ul.descript {
	padding-left:0;
}
ul.liste .export {
	background:url(../images/excel-picto.png);
	background-size:32px 32px;
	margin-top:15px;
	height:32px;
	width:32px;
	display:block;
	padding:0;
	text-indent:-999px;
	overflow:hidden;
	float:left;
}
ul.liste li {
	list-style-type:none;
	background:#FFF;
	padding:12px;
	border:solid 1px #c5c5c5;
	margin-bottom:10px;
	min-height:36px;
}

ul.liste li form {
	height:30px;
}
ul.liste li form, ul.liste li form input[type="submit"], ul.liste li form .button {
	display:inline-block;
	margin-top:0;
	float:right;
	
}
ul.liste li .date,ul.liste li .label_liste {
	display:block;
	font-size:12px;
}

ul.descript li {
	list-style-type:none;
	margin-bottom:10px;
}

form .hidden {
	display:none;
}


.activite_sportive_details, .activite_sportive_enseignee_details {
	padding-left:30px;
}

.alertDialBox {
	background:#333;
	width:440px;
	height:120px;
	text-align:center;
	color:#FFF;
	padding:30px;
	position:fixed;
	top:calc(50% - 110px);
	left:calc(50% - 250px);
}
.alertDialBox a {
	display:inline-block;
	padding:10px;
	margin:30px 20px;
	cursor:pointer;
	color:#FFF;
}
.alertDialBox a.oui {
	background:#00BB00;
}

.alertDialBox a.non {
	background:#BB0000;
}


/* Moteur de recherche instantanée */


.typeahead, .tt-query, .tt-hint {

}
.twitter-typeahead {
	display:block !important;
}
.typeahead {
	background-color: #FFFFFF;
}
.typeahead:focus {
	border: 2px solid #0097CF;
}
.tt-query {
	border:1px #DDD solid;
}
.tt-hint {
	color: #999999;
	padding:13px 9px;
}
.tt-dropdown-menu {
	background-color: #FFFFFF;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 8px;
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	margin-top: 12px;
	padding: 8px 0;
	width: 422px;
}
.tt-suggestion {
	font-size: 24px;
	line-height: 24px;
	padding: 3px 20px;
}
.tt-suggestion.tt-is-under-cursor {
	background-color: #0097CF;
	color: #FFFFFF;
}
.tt-suggestion p {
	margin: 0;
} 

/* Moteur de recherche instantanée */


@media screen and (min-width: 1100px) {
	header #menu-mobile{
		display:none !important;
	}
	ul.liste .infos-col {
		float:left;
		width:calc(100% - 300px);
	}
	
	#menu-principal {
		background:#F2F2F2;
		min-height:40px;
		margin-top:30px;
		padding: 0 20px;
	}

	#menu-principal ul {
		padding:0;
		margin:0;
	}
	
	.wrapper::after, #menu-principal ul::after {
		content: '';
		display: block;
		clear: both;
		z-index: 1000;
	}
	
	#menu-principal ul li {
		float:left;
		list-style:none;
		margin-left:10px;
	}
	
	#menu-principal ul li ul {
		display:none;
	}
	#menu-principal ul li:hover ul {
		display:block;
		position:absolute;
		background-color:#DB9128;
	}
	#menu-principal ul li ul li {
		float:none;
	}
	#menu-principal ul li ul li a {
		color:#fff;
		margin:0;
	}
	#menu-principal ul li ul li a:hover {
		color:#000;
	}
	
	#menu-principal ul li a {
		color:#363636;
		font-size:14px;
		font-weight:bold;
		line-height:40px;
		display:inline-block;
		padding:0 15px 0 0;
	}
	#menu-principal ul li:first-child a {
		padding-left:0;
	}
	
	#menu-principal ul li a:hover, #menu-principal ul li a:active {
		color:#DB9128;
	}


}

@media screen and (max-width: 1300px) {
	header .baseline {
		font-size:18px;
	}
}

@media screen and (max-width: 1099px) {
	header .baseline {
		display:none;
	}
	header .logo-container, header img {
		width:180px;
	}
	header #menu-toggle {
		display:inline-block;
		float:left;
		font-size:20px;
		color:#FFF;
		margin-top:15px;
		padding:5px 20px 5px 0;
		cursor:pointer;
	}
	#menu-mobile ul {
		padding:0;
	}
	#menu-mobile ul li {
		list-style:none;
		text-align:center;
		padding:10px 0;
		margin-bottom:2px;
		background:#fff1dd;
	}
	#menu-mobile ul li:last-child {
		margin-bottom:0;
	}
	#menu-mobile ul li a {
		color:#DB9128;
	}
	#menu-principal {
		display:none !important;
	}
	#menu-mobile {
		display:none;
	}
	ul.liste li form, ul.liste li form input[type="submit"], ul.liste li form .button, .button {
		display:block !important;
		
		float:none !important;
		margin:20px 0 10px 0;
	}
	.button {
		width:calc(100% - 25px);
		text-align:center;
	}
	ul.liste li form, ul.liste li form input[type="submit"], ul.liste li form .button {
		width:100%;
	}
	h1.home {
		margin-top:40px;
	}
	footer .infos, footer .menu-footer {
		float:none;
		text-align:center;
		max-width:100%;
	}
	footer .infos::after, footer .menu-footer::after {
		content:"";
		display:block;
		clear:both;
	}
	
	.col.gauche, .col.droite {
		float:none;
		width:100% !important;
		margin-bottom:20px;
	}
	form#selectDpt {
		width:100%;
	}


}
@media screen and (max-width: 480px) {
	.wrapper {
		padding:0 15px;
	}
	header #menu-toggle {
		padding:5px 15px 5px 0;
	}
	header .logo-container {
		margin:0 0 20px 0;
	}
	header .logo-container, header img {
		width:120px;
	}
	.loginForm {
		width:100%;
	}
}
