@import url(form.css);

::-moz-selection {
color:black;
background:#ddeecc;
}
::selection {
color:black;
background:#ddeecc;
}
html{
 	background-color: #dddddd; 
}

body{
 	background:#dddddd url(../../../../data/winterbraids15-data/images/wbbodybkg.png) repeat-x;	  
  	background:-moz-linear-gradient( #0A2D3F,#0A2D3F, #dddddd);
  	background:-webkit-gradient(linear, left top, left bottom, from(#0A2D3F), to(#dddddd), color-stop(0.7, #dddddd)); /* Webkit */
  	filter: progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#0A2D3F,endColorstr=#dddddd,GradientType=0);
   	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#0A2D3F,endColorstr=#dddddd,GradientType=0)";
  	background-image: -o-linear-gradient(#0A2D3F, #0A2D3F, #dddddd);
	margin:0px;
	min-height: 600px; 
	font-family: Helvetica, Arial, sans-serif;
	font-size: 0.85em;
	color: #555555;
}
 	
h1{
	font-family: 'Walter Turncoat', 'Lucida Grande', Helvetica, Arial, sans-serif;
	font-weight:normal;
	text-align:center;
	margin-bottom:10px;
	font-variant: small-caps;
}

h1>em{
	font-size:0.65em;
		font-style: italic;
}

h2{
	font-family: 'Walter Turncoat', Helvetica, Arial, sans-serif;
	font-weight:normal;
	font-size:1.5em;
	padding-left:20px;
}

hr{
	margin-top:40px;
	margin-bottom:30px;
	width:500px;
}

#banXV{
	width:1000px;
	height:130px;
	background:url(../../../../data/winterbraids15-data/images/wb2selB-XV.png);	
	margin-right:auto;
	margin-left:auto;
}
strong{
	color: #eeeeee;
  	font-family: Helvetica, Arial, sans-serif;
  	font-style: italic;
  	font-size: 1.45em;
  	margin-left: 60px;
}
#nav{
	display: flex;
  	justify-content: space-between;
 	background: #0A2D3F;
	margin:auto;
	width:1000px;
	height:50px;
	font-family: 'Walter Turncoat', Arial, sans-serif;
	font-size: 1.25em;	  	  	
}

/* Ajout ABL: Affichage des titres si css ou images désactivées*/
#nav h2 {
	position: absolute; 
	z-index: 10;
	line-height: 40px;
	margin-top: 1px;
	}

 #nav a{
 	display : inline-block;
 	margin : 15px 5px;
 	padding: 0 10px;
 	line-height: 40px;
 	color: #eeeeee;
 	text-decoration:none;
  	border-radius: 5px; 
  	-moz-border-radius: 5px; 
  	-WebKit-border-radius: 5px;
 }
 
  #nav a:hover{
   	background: #3F5B69;
    opacity: 0.8;
  }


.access h1{
	position: absolute; 
	z-index: -1;
	top: 20px;
	margin-left: 25%;
	text-align:center;
	}

.access h2{
	position: absolute; 
	z-index: -1;
	top: 60px;
	margin-left: 23%;
	}
p{
	font-size : 1em;
	text-align : justify;
}
p>em{
	font-weight: bold;
}
a {
	letter-spacing :1.5px;
	text-decoration:none;
	color: #4169E1;
}
a:hover, a:focus {
	text-decoration:underline;
	color: #4169E1;
}


/*Fin ajout ABL*/
/*
.btn{
	display: block;
	width: 155px;
	height:40px;
	float: left;
	margin-top:108px;
}

.btn:hover{
	background: rgb(155,155,155) ;
    opacity: 0.15;
}

.sep{
	width:11px;
	height:40px;
	display:block;
	float:left;
}
*/
#contenu{
	display:block;
	background:#ffffff url(../../../../data/winterbraids15-data/images/wbcontenubkg.png) repeat-x;	
    background: -moz-linear-gradient( #0A2D3F, #ffffff);
    background:-webkit-gradient(linear, left top, left bottom, from(#0A2D3F), to(#ffffff)); /* Webkit */
  	filter: progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#0A2D3F,endColorstr=#ffffff,GradientType=0);
   	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#0A2D3F,endColorstr=#ffffff,GradientType=0)";
  	background-image: -o-linear-gradient(#0A2D3F, #ffffff);

	margin:auto;
	margin-bottom: 0;
	padding-top:10px;
	width:1000px;
	min-height:500px;
		font-family: 'Helvetica', Arial, sans-serif;
}
#contenu>div{
	display:block;
	min-height: 100 px;
	background:#eeeeee;
  	background: -moz-linear-gradient( #dddddd,#ffffff);
  	background:-webkit-gradient(linear, left top, left bottom, from(#dddddd), to(#ffffff)); /* Webkit */
  	filter: progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#dddddd,endColorstr=#ffffff,GradientType=0);
   	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr=#dddddd,endColorstr=#ffffff,GradientType=0)";
  	background-image: -o-linear-gradient(#dddddd, #ffffff);
	margin : 40px;
		margin-bottom: 0;
	padding: 0 15px;
	border:1px solid #eeeeee;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	box-shadow:0 0 15px #aaaaaa;
	-moz-box-shadow:0 0 15px #aaaaaa;
	-webkit-box-shadow:0 0 15px #aaaaaa;
}


#contenu>div>div{
	display: inline-block;
	min-height: 370px;
	}

.colgauche{
	width: 55%;	
	float: left;
	}
	
.coldroite{
	width: 40%;	
	float: right;
	padding-left: 20px;
	border-left: dotted 2px white;
	z-index: 1;
	}

.right-sidebar {
    display:flex;
	flex-direction: row;
    flex-wrap:wrap;
	align-items:flex-start;
	column-gap: 20px;
}

.right-sidebar > * {
    width:100%;
}

ul.twocols{
	columns: 1;
	-webkit-columns: 1;
	-moz-columns: 1;
	}

@media (min-width:768px) {
	.right-sidebar > *:nth-child(1) {
		width:55%;
	}
	.right-sidebar > *:nth-child(2) {
		width:35%;
		border-left: dotted 2px white;
		z-index: 1;
	}
	ul.twocols{
		columns: 2;
		column-gap: 20px;
		-webkit-columns: 2;
		-moz-columns: 2;
	}
}

#boite_image{
	display: block;
	background : white;
	width: 90%;
 	margin: auto;
 	margin-top: 10px;
	padding-top: 10px; 	
	text-align: center; 	
 	border-radius: 5px; -moz-border-radius: 5px; -WebKit-border-radius: 5px;
	
	}
	
#boite_image a{
	display: block;	
	color: transparent;
	}	

#boite_image img{ 
	position: relative;
	outline: transparent;
	z-index: 10;
	width: 90%;
	margin: 5px;
	padding: 5px;
	z-index: 11;
	}

#boite_image p{
	font-size: 1em;
	font-style:italic;
	text-align: center; 
}


.button_survey {
	-moz-appearance: button;
    -ms-appearance: button;
    -o-appearance: button;
    -webkit-appearance: button;
	appearance: button;
	background-color: -moz-linear-gradient(90deg, #9EBE29, #799F0F);
	background:-webkit-gradient(linear, left top, left bottom, from(#799F0F), to(#9EBE29)); /* Webkit */
	background-image: -o-linear-gradient(#799F0F, #9EBE29);
	border: 1px solid #9EBE29;
	border-radius: 4px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	box-sizing: border-box;
	color: #FFFFFF;
	cursor: pointer;
	font-size: 12px;
	line-height: 1.15;
	overflow: visible;
	padding: 12px 16px;
	text-align: center;
	text-transform: none;
	transition: all 80ms ease-in-out;
	user-select: none;
	-webkit-user-select: none;
	touch-action: manipulation;
	width: fit-content;
}
  
.button_survey:focus {
	outline: 0;
}
  
.button_survey:hover {
	background-color:-moz-linear-gradient(90deg, #4169E1, #0A2D3F);
	background:-webkit-gradient(linear, left top, left bottom, from(#0A2D3F), to(#4169E1));
	background-image: -o-linear-gradient(#0A2D3F, #4169E1);
	border-color: #0A2D3F;
	color: #FFFFFF;
}
  
.button_survey:active {
	background-color: #0039D7;
	border-color: #0039D7;
}
	
td{
	border-style:solid;
	border-width:2px;
	border-color: #F5F5F5;
	background-color: #EEEEEE;
	font-size:12px;
	/*width:500px;*/
	padding:2px;
	/*padding-left:8px;*/
}

li{
	margin:10px;
	padding: 2px;
	list-style: none;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	font-size: 1em;
}
li span{
	font-family:Courier;
	color:#000000;
	font-weight:bold;
}

#footer_repeat{	
	display : block;
	width:1000px;
	margin-right:auto;
	margin-left:auto;
	background: white;	
				color: #aaaaaa;
}

#footer{
	text-align: center;
	width:100%;
	height:94px;
}
#footer div{
	display: inline-block;
		position : relative;
		padding: 0 5px;
	margin: 0 5px;
		}
#footer a{
	position : relative;
	padding: 0 10px;
	margin: 0 5px;

   width: 80px;
}
#footer ul{
	display: block;
	position : relative;
	list-style-type: none;	
	margin: 0;
	margin: 5px 0;
	padding: 0;
	padding-right: 15px;
}
#footer ul li{
	margin:5px
}
#footer ul li a{
	padding: 5px;
	text-decoration : none;
	color: #004D95;
	}
#footer ul li a:hover{	
text-decoration:underline;
	color: #004D95;
 width: 80px;
	}
	
pre{
	padding:10px;
	padding-left:0px;
	margin:10px;
	margin-left:0px;
	width : 300px;
	overflow: auto;
}

#map{
	margin: 20px;
	border: solid 1px #aaa;
 	width: 400px; 
 	height: 300px;
}

#credits{
	position:absolute;
	z-index:-1;
	display: block;
  	width: 1000px;
	height: 30px;
	line-height: 20px;
	font-size: small;
	color: #aaaaaa;
	background: white;
	text-align: center;
	margin: auto;
	border-top: transparent solid 15px;
}
#credits a
	{
	 width: 80px;
	color: #aaaaaa;
	padding:0 15px;
	}
#credits a:hover
	{
color: #4169E1;
	}	
	
.clearer {
  clear: both;
  height: 0px;
}