@charset "UTF-8";
/* CSS Document */

/******************************/
/*  HTML, BODY                */
/******************************/

	/* Force le scroll vertical à être présent */
	html {
		overflow-y: scroll;
		overflow: -moz-scrollbars-vertical;
	}


	/* Mise à 0 pour tous les navigateurs */
	html, body {
		padding: 0px;
		margin: 0px;
	}

	/* Couleur de fond et centrage du site */
	body {
		background-color: #C0C0C0;
		text-align: center;
		}

	/* Formatage du caractère par défaut */
	body, table {
		font-size: 13px;
		font-family: Arial, Helvetica, sans-serif;
		color: #000000;
		}

	@font-face {
		font-family: 'albaregular';
		src: url('design/fonts/alba-webfont.eot');
		src: url('design/fonts/alba-webfont.eot?#iefix') format('embedded-opentype'),
			 url('design/fonts/alba-webfont.woff') format('woff'),
			 url('design/fonts/alba-webfont.ttf') format('truetype'),
			 url('design/fonts/alba-webfont.svg#albaregular') format('svg');
		font-weight: normal;
		font-style: normal;
	}

/******************************/
/*  STRUCTURE                 */
/******************************/

	/* position de l'entier du site */
	#Global {
		position: relative;
		margin: 0 auto; /* centre #global sur la page */
		width: 950px;
		text-align: left; /* Annule l'alignemnt défini dans body qui centre #global */
		}

	#Global #Top{
		background: #d1e6f8 url("design/structure/wse_top_background.png") no-repeat right;
		}
	#Global #Top .top-logo{
		width:55%;
		padding-left:15px;
		padding-top:15px;
		padding-bottom:15px;
		}

	#Ville {
		position: absolute;
		top: 10px;
		right: 10px;
		color: #309497;
		z-index: 2;
		font-size: 15px;
		font-weight: bold;
	}

	#Lang {
		position: absolute;
		top: 15px;
		right: 10px;
		color: #309497;
		z-index: 2;
	}

	#Lang a , #Lang a:visited, #Lang a:active, #Ville a, #Ville a:visited, #Ville a:active {
		color: #309497;
		text-decoration: none;
	}

	#Lang a:hover, #Lang a:focus, #Ville a:hover, #Ville a:focus {
		color: #86C4C2;
		text-decoration: none;
	}

	#Lang .SelectedLang {
		color: #A93B8F;
		text-decoration: none;
	}
	.wrapper{
		width:100%;
	}
	#Contenu {
		height:auto;
		background: url(design/structure/wse_background.jpg) repeat-y;
		padding-top:10px;
	}
	#PageLeft {
		float: left;
		width: 120px;
		padding-top: 8px;
		padding-left: 15px;
		padding-right: 15px;
	}

	#PageMain {
		float: left;
		width: 500px;
	}

	#PageMainContenu {
		width: 470px;
		padding-top: 8px;
		padding-left: 15px;
	}

	#PageRight {
		float: left;
		width: 270px;
		padding-top: 8px;
		padding-left: 10px;
	}
	.spacer{
		clear:both;
		}
	#Footer {
		background-color: #309497;
		clear: both;
		height: 20px;
		text-align: center;
		padding-top: 5px;
		color: #FFFFFF;
	}

	#Footer a, #Footer a:visited, #Footer a:active {
		color: #FFFFFF;
		text-decoration: none;
	}

	#Footer a:hover, #Footer a:focus {
		color: #FFFFFF;
		text-decoration: underline;
	}


/******************************/
/*  MENU                     */
/******************************/

	#Menu {
		width: 100%;
		height: 27px;
		background-color: #e58ec1;
		-webkit-box-shadow: 0px 15px 11px -7px rgba(0,0,0,0.47);
		-moz-box-shadow: 0px 15px 11px -7px rgba(0,0,0,0.47);
		box-shadow: 0px 15px 11px -7px rgba(0,0,0,0.47);
	}

	/*****************************/
	/**   Paramètres généraux  **/
	/****************************/

	/* Mis à zéro des listes */


	#navMenu, #navMenu ul, #navMenu li {
		padding: 0;
		margin: 0;
		list-style: none;
	}

	#navMenu {
		width: 100%;
	}

	/*Placement du Menu */
	#navMenu li {
		display: inline-block;
		cursor: pointer;
	}

	#navMenu li a:hover {
		text-decoration: none;
	}

	#navMenu li:hover ul, #navMenu li.sfhover ul {
		text-decoration: none;

	}

	#navMenu li a, #navMenu li a:visited {
		display: block;
		height: 22px;
		overflow: hidden;
		font-family: 'albaregular', Arial, Helvetica, sans-serif;
		text-decoration: none;
		font-size: 15px;
		font-weight: normal;
		text-transform: uppercase;
		padding: 5px 8px 0 8px;
		border-right: #A93B8F solid 2px;
		color: #A93B8F;
	}

	#navMenu li a:hover, #navMenu li a:focus {
		background: #61c5c3;
		color: #01969a;
	}

	#navMenu li.Selected a, #navMenu li.Selected a:visited, #navMenu li.Selected a:hover, #navMenu li.Selected a:focus {
		background: #01969a;
		color: #FFF;
	}


/******************************/
/*  CONTENU                 */
/******************************/


	/******************************/
	/*  Remise à 0                */
	/******************************/
	form, img, ul, li, h1, h2, h3, h4, p, table {
		padding: 0px;
		margin: 0px;
		border: 0px;
	}

	/* Alignement des listes à l'intérieur de la div */
	ul, li {
		margin-left: 1em;
	}

	/* Annule les définitions de float */
	.spacer {
		clear: both;
	}

	.Fixed {
		/*position: fixed; */
		vertical-align: top;
	}

	.Right {
		float: right;
	}

	.Left {
		float: left;
	}

	/******************************/
	/*  Titre et paragraphes       */
	/******************************/

	h1 {
		margin: 0;
		padding: 0;
		margin-bottom: 15px;
		font-family: 'albaregular', Arial, Helvetica, sans-serif;
		color: #A93B8F;
		font-size: 24px;
		font-weight: normal;
	}

	h2 {
		border-bottom: #A93B8F solid 2px;
		font-size: 15px;
		font-weight: bold;
		padding-bottom: 2px;
		margin-bottom: 10px;
	}

	h3 {
		color: #A93B8F;
		font-size: 15px;
		font-weight: bold;
	}

	p {
		margin-bottom: 30px;
		line-height: 20px;
	}

	ul {
		margin-top: 5px;
		margin-bottom: 30px;
		line-height: 20px;
	}

	li {
		margin-bottom: 5px;
	}

	.Legende {
		margin-top: 10px;
		font-size: 11px;
		font-style: italic;
		line-height: normal;
		text-align: right;
	}

	.MenuLeft {
		color: #A93B8F;
		font-size: 15px;
		text-align: right;
		margin-bottom: 15px;
		width: 120px;
	}

	.MenuLeft a, .MenuLeft a:visited, .MenuLeft a:active {
		text-decoration: none;
		color: #A93B8F;
	}

	.MenuLeft a:hover, .MenuLeft a:focus {
		text-decoration: none;
		color: #309497;
	}

	.MenuRight {
		width: 270px;
	}

	.Color {
		color: #A93B8F;
		font-weight: bold;
	}

	.Jaune {
		color: #FF9900;
		font-weight: bold;
	}

	.Rouge {
		color: #CC0000;
		font-weight: bold;
	}

	.Vert {
		color: #309497;
		font-weight: bold;
	}

	.Center {
		text-align: center;
	}

	.Tab {
		width: 100%;
		margin-bottom: 30px;
	}

	.Tab td {
		vertical-align: bottom;
		margin-bottom: 5px;
	}

	#top {
		float: right;
		margin: 5px;
	}

	/******************************/
	/*  Liens                 */
	/******************************/

	a, a:visited, a:active  {
		text-decoration: underline;
		color: #000000;
		}

	a:hover, a:focus {
		text-decoration: none;
		color: #309497;
		}


	h1 a, h1 a:visited, h1 a:active  {
		text-decoration: none;
		color: #A93B8F;
		margin: 0;
		}

	h1 a:hover, h1 a:focus {
		text-decoration: none;
		color: #309497;
		}


	/******************************/
	/*  images                     */
	/******************************/

	img {
		border: 0px;
	}

	.ImgJustifie {
		margin-left: -15px;
	}

	.Atelier img {
		float: left;
		width: 100px;
	}

	.ImgNews {
		float: left;
		margin-right: 10px;
	}

	/******************************/
	/*  Formulaires               */
	/******************************/

	input, select, textarea {
		width: 100%;
		border: #A93B8F 1px solid;
		background-color: #FFFFFF;
		padding: 2px;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
	}

	.btnEnvoyer {
		width: 75px;
	}

	.FormLargeurLablel {
		width: 75px;
	}

	.tabFormulaire td {
		padding-bottom: 10px;
	}

	/******************************/
	/*  Messages d'erreurs        */
	/******************************/
	.MessageErreur, .MessageOk, .MessageConfirm {
		padding: 5px;
		margin: 5px;
		font-weight: bold;
		font-size: 16px;
		border-style: dashed;
		border-width: 1px;
	}

	.MessageErreur a, .MessageOk a, .MessageConfirm a {
		color: #FFFFFF;
	}

	.MessageErreur {
		background-color: #EBCCCC;
		border-color: #9D0000;
		color: #9D0000;
	}

	.MessageOk {
		background-color: #CFE1CC;
		border-color: #0E6600;
		color: #0E6600;
	}

	.MessageConfirm {
		background-color: #CCCCEF;
		border-color: #0000FF;
		color: #0000FF;
	}

	.FieldError {
		background-color: #FFFF99;
		border: #990000 dotted 1px;;
	}

/******************************/
/*  Pages                     */
/******************************/

	/******************************/
	/*        Accueil             */
	/******************************/
    .placeCounter {
        background:#e58ec1;
        margin:15px;
        padding:3px 0 3px 0;
        text-align:center;
        -webkit-border-radius:20px;
        -moz-border-radius: 20px;
        border-radius: 20px;
    }
    .placeCounter .counter-wrapper {
        margin-top:0;
    }
    .counter-wrapper .digit-delimiter {
        margin-left:0;
        display:none; /* Cacher la virgule */
    }
    .placeCounter .text_before, .placeCounter .text_after {
        margin:10px;
        font-weight:bolder;
    }

	/******************************/
	/*  Initiations/Ateliers       */
	/******************************/

	.Atelier {
		clear: both;
		margin-bottom: 35px;
	}

	.TexteAtelier {
		float: right;
		width: 350px;
	}

	/******************************/
	/*  Horaires                  */
	/******************************/

	.TabHoraires td {
		border: 1px solid #CCCCCC;
		border-collapse: collapse;
	}

	.TabHoraires {
		border-collapse: collapse;
	}


	/******************************/
	/*  Sponsors                  */
	/******************************/

	#Sponsors {
		text-align: center;
	}

	#Sponsors p {
		margin-bottom: 0;
	}

	#Sponsors img {
		margin-bottom: 30px;
	}

	#Sponsors a, #Sponsors a:visited, #Sponsors a:hover {
		text-decoration: none;
	}

	.Sponsors {
		margin-bottom: 30px;
	}

	/******************************/
	/*  Photos                    */
	/******************************/

	.TabAlbums {
		width: 100%;
	}

	.TabAlbums td {
		padding: 10px;
	}

	.TabAlbums td.Titre {
		padding: 0px;
	}

	.TabAlbums td.Image {
		width: 50px;
	}


	.TabAlbums img {
		border: #FFFFFF solid 2px;
	}

	.GalerieHover {
		background-color: #ECD2E5;
		text-decoration: none;
		color: #000000;
		cursor: pointer;
	}

	.GaleriePhoto .Navigation, .GaleriePhoto .Images {
		width: 100%;
		text-align: center;
	}

	.GaleriePhoto img {
		border: #FFFFFF solid 2px;
	}

	.GaleriePhoto .Titre {
		font-weight: bold;
	}

	.GaleriePhoto .Navigation td {
		width: 33%;
		padding-bottom: 5px;
	}

	.GaleriePhoto .Images td {
		padding: 5px;
	}

	.TabGaleries {
		width: 100%;
		text-align: left;
	}

	.TabGaleries td.Image {
		width: 65px;
	}

	.GaleriePhoto a, .GaleriePhoto a:visited, .GaleriePhoto a:hover, .GaleriePhoto a:focus, .GaleriePhoto a:active {
		text-decoration: none;
		color: #000;
	}

	.gal_logo {
		float: right;
	}


/*************************/
/** Liste des inscrites **/
/*************************/

.Spacer {
	clear: both;
}

ul.Pagination li {
	margin: 5px;
	padding: 0;
	float: left;
	border: 1px solid #F6D3E7;
	width: 20px;
	text-align: center;
	cursor: pointer;
}

ul.Pagination li:hover {
	background-color: #F6D3E7;
	border: 1px solid #ffffff;
}
ul.Pagination {
	list-style-type: none;
	margin-top: 0px;
	margin-bottom: 20px;
}

ul.Participantes {
	margin-bottom: 10px;
}

li.Date {
	color: #FCF4F9;
	font-size: 100px;
	position: absolute;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	list-style: none;
	margin-top: -50px;
	margin-left: 240px;
	letter-spacing: -3px;

}

.Hidden {
	display: none;
}

/* Vidéos */

.video-container {
	display: none;
	margin-bottom: 20px;
}
.video-container p {
	margin-bottom: 2px;
}
.video-element {
	position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
#loadMore{
	text-align: center;
	cursor: pointer;
	text-transform: uppercase;
}
#loadMore:hover{
	text-decoration: underline;
}
.video-element iframe,
.video-element object,
.video-element embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

div#PageRight div.fb-like{
		display:none;
		}
/** RESPONSIVE UPGRADE 2015 **/

#Global{
	width:100%;
	max-width:950px;
	}
#Global #Top img{
	width:100%;
	height:auto;
	}

/** RESPONSIVE STRUCTURE **/

@media screen and (max-width:950px){
	div#Contenu{
		background: #FFF;
		width:98%;
		padding:0 1%;
		}
	div#Contenu div#PageLeft{
		display:none;
		}
	div#Contenu div#PageMain{
		width:70%;
		padding:0;
		}
	div#Contenu div#PageMain.fullSize{
		width:96%;
		padding:0 2%;
		}
	div#Contenu div#PageMain div#PageMainContenu{
		width:97%;
		padding:2% 0;
		}
	div#Contenu div#PageRight{
		width:28%;
		padding-left:2%;
		}
	div#Contenu div#PageRight.empty{
		display:none;
		}

	/* Facebook Like Update for small screens */
	div#PageRight iframe.bigLike{
		display:none;
		}
	div#PageRight div.fb-like{
		display:block;
		text-align:center;
		}
	div#slider.nivoSlider{
		img.ImgJustifie{
			width:100%
			height:auto;
			margin: 0 auto;
			}
	}
	div.home-element{
		width:100%;
	}
	div.home-element img{
		width:100%;
		height:auto
		margin:0 auto;
		}
	.GaleriePhoto .Images td{
		padding:0;
    	padding: 2%;
}
}

@media screen and (max-width:768px){
	/** MENUS **/
	div#Menu{
		height:auto;
		}
	ul#navMenu li{
		width:20%;
		text-align:center;
	}
	ul#navMenu li a{
		border-bottom: 1px solid #A93B8F;
		}
	ul#navMenu li:nth-child(5n+0) a{
		border-right: none;
		}


	}
@media screen and (max-width:650px){
	/** MENUS **/
	div#Menu{
		height:auto;
		}
	ul#navMenu li{
		width:100%;
		text-align:center;
	}
	ul#navMenu li a{
		border:0;
		}
	ul#navMenu li a{
		border-bottom: 1px solid #A93B8F;
		}
	ul#navMenu.responsive-menu-closed li{
		display:none;
		}
	ul#navMenu.responsive-menu-closed li.Selected{
		display:block;
		}
	div#Contenu div#PageMain{
		width:96%;
		padding:0 2%;
		text-align:center;
		}
	div#Contenu div#PageMain div#PageMainContenu{
		width:98%;
		padding:3% 1%;
		}
	div#Contenu div#PageRight{
		width:98%;
		padding:1% 1%;
		}
	div#Contenu div#PageRight p{
		text-align:center;
		}
	div#Contenu div#PageRight .MenuRight{
		width:100%;
		text-align:center;
		}
	div#Contenu div#PageMain div#PageMainContenu div.Atelier{
		width:100%;
		text-align:justify;
		}
	div#Contenu div#PageMain div#PageMainContenu div.Atelier .atelier-img{
		display:inline-block;
		width:26%;
		padding:0 2%;
		}
	div#Contenu div#PageMain div#PageMainContenu div.Atelier .atelier-img img{
		float:none;
		display:inline-block;
		width:100%;
		margin:auto;
		}
	div#Contenu div#PageMain div#PageMainContenu div.Atelier .TexteAtelier{
		display:inline-block;
		width:66%;
		padding:0 2%;
		}

	div#Footer{
		height:auto;
		}


	}