/*
╭━━━━━━━━━━━╯ KARIMBA-DESIGN ╰━━━━━━━━━━━╮
	
	Feuille de styles 
	
 _________________________________________________________ 
	Mis à jour le 18/03/2014 à 19:34:50 par Y. Guérin
	© KARIMBA-DESIGN > http://www.karimba-design.fr
╰━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━╯
*/


@import url('https://fonts.googleapis.com/css?family=Montserrat:300,500,700');
@font-face {
	font-family: 'Ethnocentric';
	src:  url('fonts/Ethnocentric.ttf.woff') format('woff'),
	url('fonts/Ethnocentric.ttf.svg#Ethnocentric') format('svg'),
	url('fonts/Ethnocentric.ttf.eot'),
	url('fonts/Ethnocentric.eot?#iefix') format('embedded-opentype'); 
	font-weight: normal;
	font-style: normal;
}

body {
	background: #000;
	color: #333;
	font-family: 'Montserrat', Verdana, Arial, sans-serif;
	font-weight: 500;
}
* {box-sizing: border-box;}
strong {font-weight:700;}
a, a:visited {
	color:#9C8F54;
}
a:hover, a:active {
	color:#D9B734;
}
.mainwrapper {overflow: hidden;}

#main {
	position:relative;
	text-align: center;
	background: #FFF;
	margin-top:7.5%;
	-webkit-transition: margin 0.5s ease;
	   -moz-transition: margin 0.5s ease;
	     -o-transition: margin 0.5s ease;
		transition: margin 0.5s ease;
}
header {
	position: absolute;
	background: #000;
	z-index: 10;
	display: table;
	width:100%;
	font-size:0.8em;
}

header h1 {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	width: 30%;
	-webkit-transition: width 0.5s ease;
	   -moz-transition: width 0.5s ease;
	     -o-transition: width 0.5s ease;
	        transition: width 0.5s ease;
}
header h1 a:focus {outline: none;}
header h1 img {
	width: 40%;
	margin: 2.5%;
	-webkit-transition: all 0.5s ease;
	   -moz-transition: all 0.5s ease;
	     -o-transition: all 0.5s ease;
		transition: all 0.5s ease;
}
header h1 a:focus img,
header h1 a:hover img {
	filter: brightness(1.5);
}
header h1 span {display: none;}
header nav {
	display: table-cell;
	text-align: right;
	vertical-align: middle;
	font-weight: 300;
	padding-right:3%;
	-webkit-transition: padding 0.5s ease;
	   -moz-transition: padding 0.5s ease;
	     -o-transition: padding 0.5s ease;
	        transition: padding 0.5s ease;
}
.rtl header nav {text-align: left;padding-left:3%;padding-right:0;font-size: 1.5em;}
header nav li {
	display: inline-block;
	position: relative;
}
.rtl header nav li.languages {
    font-size: 0.75em;
}
@keyframes menuflash {
    from {filter: blur(4px);}
    to {filter: none;}
}

header nav li a {
	display:block;
	padding: 6% 5px;
	color: #FFF;
	-webkit-transition: all 0.5s ease;
	   -moz-transition: all 0.5s ease;
	     -o-transition: all 0.5s ease;
	        transition: all 0.5s ease;
}
header nav li a:visited {
	color: #FFF;
}
header nav li a:hover,
header nav li.selected a {
	color: #D9B734;
}
/*header nav li.selected a {text-decoration: underline;}*/
header nav li a span {
	border: 1px solid transparent;
	padding: 0.5em 0.5em;
}
header nav li a:hover span {margin:0;animation: menuflash 0.3s ease;}

header nav li.partner a span {
	border: 1px solid #D9B734;
	color: #D9B734;
}
header nav li.partner a:hover span {
	color: #000;
	background: #D9B734;
	margin:0;
	animation: none;
}
header nav li.languages a:hover span {
	margin:0;
}

header nav li.languages img {
	width: 1.5em;
	height:auto;
	vertical-align: middle;
	margin-top: -0.2em;
}
@keyframes menuopen {
    from {
	-ms-transform: translate(0, -10em);
	-webkit-transform: translate(0, -10em);
	transform: translate(0, -10em);
    }
    to {
	-ms-transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0);
    }
}
@keyframes menuclose {
    from {
	-ms-transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0);
    }
    to {
	-ms-transform: translate(0, -10em);
	-webkit-transform: translate(0, -10em);
	transform: translate(0, -10em);
    }
}
@keyframes menuopenfix {
    from {height:0;}
    to {height:auto;}
}
@keyframes menuclosefix {
    from {height:auto;}
    to {height:0;}
}
header nav li div.sousmenu {
	position: absolute;
	width: 150%;
	right:-25%;
	height: 0;
	text-align: left;
	overflow: hidden;
	z-index: 20;
	animation: menuclosefix 0.4s ease-in;
}
header nav li:hover div.sousmenu {
	height: auto;
	animation: menuopenfix 0s ease-in;
}
header nav li.partner div.sousmenu {width: 120%;right:-10%;top: 2.7em;}
header nav li.languages div.sousmenu {width: 240%;top: 2.1em;}
.rtl header nav li.languages div.sousmenu {right:auto;left:0;}
header nav li ul {
	background: #000;
	border: 1px solid #D9B734;
}
header nav li ul li {display: block;}
header nav li ul li a,
header nav li.selected ul li a {
	display: block;
	background: #D9B734;
	border-top:1px solid #000;
	color: #000;
	font-weight: 700;
	padding: 0.5em 0.4em;
	text-align: center;
}
header nav li ul li.selected a {color: #000;}
header nav li.languages .sousmenu li a img {
	position: absolute;
	top:0.9em;
	left:0.5em;
	-webkit-transition: all 0.3s ease;
   -moz-transition: all 0.3s ease;
     -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
}
header nav li.languages .sousmenu li a:hover img {
	top:0.8em;
	left:0.35em;
	width: 1.8em;
}
header nav li.languages ul li a,
header nav li.languages.selected ul li a {
    padding: 0.5em 0.4em 0.5em 2.2em;
}


@media only screen and (min-width : 501px) and (min-height : 501px) {
	.scrolled-top-1 header {position: fixed;}
	.scrolled-top-1 header nav {padding-right:1%;}
	.rtl.scrolled-top-1 header nav {padding-left:1%;padding-right:0;}
	.scrolled-top-1 header h1 {width:10%;}
	.scrolled-top-1 header h1 img {
		width: 89px;
		margin: 5px;
	}
	.scrolled-top-1 header nav li.languages div.sousmenu {right:0;}
	.scrolled-top-1 .rtl header nav li.languages div.sousmenu {right: auto;left: 0;}
	.scrolled-top-1 #main {margin-top:100px;}


	header nav li ul {
		-ms-transform: translate(0, -10em);
		-webkit-transform: translate(0, -10em);
		transform: translate(0, -10em);
		animation: menuclose 0.2s ease-in;
	}
	header nav li:hover ul {
		-ms-transform: translate(0, 0);
		-webkit-transform: translate(0, 0);
		transform: translate(0, 0);
		animation: menuopen 0.3s ease-out;
	}
	header nav li ul li a {
		-webkit-transition: color 0.3s ease;
		   -moz-transition: color 0.3s ease;
		     -o-transition: color 0.3s ease;
			transition: color 0.3s ease;
	}
	header nav li ul li a:visited {color: #000;}
	header nav li ul li:first-child a {border:none;}
	header nav li ul li a:hover {
		color: #D9B734;
		background: #000;
	}
	header nav li.languages ul li a[dir="rtl"],
	header nav li.languages.selected ul li a[dir="rtl"] {
		font-size: 1.25em;
		padding: 0.2em 0.32em 0.2em 1.76em;
	}
	header nav li.languages ul li a[dir="rtl"] img,
	header nav li.languages.selected ul li a[dir="rtl"] img {
		font-size: 0.8em;
	}
}

aside {
	position: fixed;
	right:0;
	top:50%;
	margin-top:-96px;
	width: 48px;
	height:192px;
	zoom:0.75;
	z-index: 20;
}
.rtl aside {
	right:auto;
	left:0;
}
footer {
	position: relative;
	z-index: 9;
}
footer .contacts {
	display:table;
	width:100%;
	background: #FFF;
	padding: 4% 2%;
	-webkit-box-shadow:0px -2px 10px rgba(0,0,0,0.1);
	   -moz-box-shadow:0px -2px 10px rgba(0,0,0,0.1);
		box-shadow:0px -2px 10px rgba(0,0,0,0.1);
}
footer .contacts li {
	display: table-cell;
	width: 32%;
	text-align: center;
	vertical-align: middle;
}
footer .contacts li.mobile {display:none;}
footer .contacts li h4 {
	font-weight: 700;
	color: #000;
	font-size: 1.4em;
	margin-bottom: 0.4em;
}
.rtl footer .contacts li h4 {
	font-size: 1.6em;
}
footer .contacts li.logo img {width:70%; height:auto;}
footer .contacts li a,
aside a {
	display: inline-block;
	margin: 3px;
	width: 48px;
	height: 48px;
	text-indent: -10000px;
	background: #9C8F54 url(../img/footer-logos-social.png) no-repeat 0 0;
	-webkit-transition: all 0.3s ease;
	   -moz-transition: all 0.3s ease;
	     -o-transition: all 0.3s ease;
	        transition: all 0.3s ease;
}
aside a {
	display:block;
	position: relative;
	background-color: #F00;
	margin:0;
	width: 200px;
	left: 0;
	font-size: 20px;
	font-weight: 500;
	color: #FFF;
	text-indent: 0;
	padding: 0 5px 0 58px;
	line-height: 48px;
	-webkit-transition: all 0.5s ease;
	   -moz-transition: all 0.5s ease;
	     -o-transition: all 0.5s ease;
		transition: all 0.5s ease;
}
.rtl aside a {
	padding: 0 58px 0 5px;
}
aside a:visited {color: #FFF;}
aside a:hover {
	background-color: #000;
	color: #FFF;
	left:-152px;
}
.rtl aside a:hover {
	left:152px;
}
footer .contacts li a:hover {
	background-color: #000;
	-ms-transform: matrix(1.1,-0.04,0.04,1.1,0,0);
	-webkit-transform: matrix(1.1,-0.04,0.04,1.1,0,0);
	transform: matrix(1.1,-0.04,0.04,1.1,0,0);
}
footer .contacts li a.facebook,
aside a.facebook {background-position: 0 0;}
footer .contacts li a.twitter,
aside a.twitter {background-position: 0 -48px;}
footer .contacts li a.instagram,
aside a.instagram {background-position: 0 -96px;}
footer .contacts li.contact a,
aside a.contact {background-position: 0 -144px;}

.rtl aside a.facebook {background-position: right 0;}
.rtl aside a.twitter {background-position: right -48px;}
.rtl aside a.instagram {background-position: right -96px;}
.rtl aside a.contact {background-position: right -144px;}

footer nav {
	padding: 1em 1em 1.1em;
	background: #9C8F54;
	color: #FFF;
	font-size:0.8em;
	font-weight:300;
	text-align: center;
	letter-spacing: 0.05em;
}
footer nav li {
	display:inline-block;
	margin: 0 0.3em;
}
footer nav li a {
	display:block;
	color: #FFF;
	text-decoration: underline;
	padding: 0.1em 0.3em 0.1em 1em;
	border-left:1px solid #FFF;
}
.rtl footer nav li a {border-right:1px solid #FFF;border-left:none;padding: 0.1em 1em 0.1em 0.3em;font-size: 1.2em;}
footer nav li a:visited {
	color: #FFF;
}
footer nav li a:hover,
footer nav li a:visited:hover {
	color: #000;
	text-decoration: underline;
}

#main {
	
}

.more {
	display:inline-block;
	font-weight: 700;
	padding: 0.4em 5em 0.3em;
	margin:0.5em 0;
	color: #9C8F54;
	border: 1px solid #9C8F54;
	cursor: pointer;
	-webkit-transition: all 0.3s ease;
	   -moz-transition: all 0.3s ease;
	     -o-transition: all 0.3s ease;
		transition: all 0.3s ease;
}

@media only screen and (min-width : 501px) {
	.more:hover,
	.more:focus {
		color: #000;
		background: #9C8F54;
	}
}

hr {
	width: 7%;
	padding-top: 0.4%;
	background: #9C8F54;
	border: none;
	margin: 0.5em auto;
}


.KFormHTMLContent {
	position: relative;
	padding: 0px;
	font-size: 12px;
	*zoom: 1;
}
.KFormHTMLContent.mce-content-body {
	padding:10px;
}

.KFormHTMLContent:before, .KFormHTMLContent:after { content: ""; display: table; }
.KFormHTMLContent:after { clear: both; }

@media only screen and (min-width : 1100px) {header {font-size: 0.9em;}}
@media only screen and (min-width : 1250px) {header {font-size: 1.1em;}}
@media only screen and (min-width : 1400px) {header {font-size: 1.2em;}}
@media only screen and (min-width : 1550px) {header {font-size: 1.3em;}}
@media only screen and (max-width : 750px) {footer .contacts li h4 {font-size:1.2em;} #main {margin-top:9.5%;}}
@media only screen and (max-width : 620px) {header {font-size: 0.8em;} footer .contacts li h4 {font-size:1em;} footer .contacts li a {zoom: 0.75;} #main {margin-top:14.5%;}}
@media only screen and (max-width : 500px),only screen and (max-height : 500px) {
	#main {margin-top:0;}
	aside {display:none;}
	header {
		min-height: 70px;
		position: relative;
		z-index: 30;
	}
	header div.burger {
		display: block;
		position: absolute;
		width: 50px;
		height: 50px;
		top: 50%;
		right: 5%;
		margin-top: -25px;
		-webkit-border-radius: 8px;
		   -moz-border-radius: 8px;
			border-radius: 8px;
		border: 1px solid #D9B734;
		-webkit-transition: all 0.3s ease;
		   -moz-transition: all 0.3s ease;
			 -o-transition: all 0.3s ease;
				transition: all 0.3s ease;
	}
	header div.burger .line {
		display: block;
		position: absolute;
		left:7px;
		width: 36px;
		height: 6px;
		background: #D9B734;
		-webkit-border-radius: 5px;
		   -moz-border-radius: 5px;
			border-radius: 5px;
	}
	header div.burger .line1 {top:9px;}
	header div.burger .line2 {top:20px;}
	header div.burger .line3 {top:31px;}
	header.opened div.burger {
		top: 46px;
	}
	header h1 {
		display:block;
		width: 70%;
	}
	.rtl header h1 {margin-right: 30%;}
	header nav {
		display:none;
		text-align: left;
		padding: 5% 0;
		font-size: 1.3em;
	}
	.rtl header nav {
		text-align: right;
	}
	header nav li {display:block;}
	header nav li a {padding: 10px;}
	header nav li div.sousmenu,
	header nav li.partner div.sousmenu,
	header nav li.languages div.sousmenu {
		position: relative;
		top:0;
		width: 100%;
		right:auto;
		height:auto;
		animation:none;
		padding-bottom: 5%;
	}

	header nav li ul {
		transform: none;
		animation: none;
		border:none;
	}
	header nav li ul li a,
	header nav li ul li a:visited {
		padding: 10px 10px 10px 40px;
		text-align: left;
		font-size: 0.8em;
		font-weight: 300;
		background: transparent;
		color: #FFF;
		border:none;
	}
	.rtl header nav li ul li a,
	.rtl header nav li ul li a:visited {
		text-align: right;
	   padding: 10px 40px 10px 10px;
	}
	
	header nav li ul li.selected a {color: #D9B734;}
	header nav li.selected ul li.selected a {color: #FFF;}
	header nav li.languages div.sousmenu a {padding: 10px 10px 10px 80px;}
	.rtl header nav li.languages div.sousmenu a {padding: 10px 80px 10px 10px;}
	header nav li.languages div.sousmenu a img,
	header nav li.languages div.sousmenu a:hover img {
		left:53px;
		top:15px;
		width: 1.5em;
	}
	.rtl header nav li.languages div.sousmenu a img,
	.rtl header nav li.languages div.sousmenu a:hover img {
		left:auto;
		right: 48px;
	}
	footer .contacts {
		width: 100%;
	}
	footer .contacts li,
	footer .contacts li.mobile {
		display:block;
		width: 100%;
		margin-bottom: 10%;
	}
	footer .contacts li.desktop {display:none;}
	footer .contacts li h4 {font-size:1.4em;}
	footer .contacts li a {zoom: 1;}
	footer nav {padding-bottom: 2em;}
	footer nav li {
		display: block;
		margin: 0.6em;
	}
	footer nav li a,
	.rtl footer nav li a {
		border: none;
		padding: 0em;
	}
}



/* ╰━┅┉┈  © KARIMBA-DESIGN - www.karimba-design.fr  ┈┉┅━╯ /*