
html {
font-size: 100%;
font-family: 'Open Sans', sans-serif;
font-style: normal;
font-weight: 400;
text-align:left;
line-height:1em;
}

/* orientation iOS font-size fix */
@media (orientation: landscape) and (max-device-width: 768px) {
	html,
	body {
		-webkit-text-size-adjust: 100%;
	}
}

.spe li  {
    list-style-type: none; /* on annule la puce par défaut */
    background-image: url(../images/pictos/flechen.png); /* on affiche l'image souhaitée */
    background-repeat: no-repeat; /* on annule la répétition par défaut */
    background-position: left center; /* on positionne où l'on veut */
    padding-left: 40px; /* pour éviter la superposition du contenu */
	text-align:left;
}

.spe ul {
	padding-left:-50px;
}

ul {
	font-family: 'Roboto', sans-serif;
	margin-left:18px;
	line-height:1em;
}	

p {
text-align:left;
}

h1 {
font-family: Proxima Nova, sans-serif;
font-size:180%;
font-style: normal;
font-weight: 400;
text-align:left;
	color: #000;
}

h2 {
font-family: Proxima Nova, sans-serif;
font-size:135%;
font-style: normal;
font-weight: 400;
text-align:left;
line-height:0.9em;
	color: #000;
}

h2_plus{
font-family: 'Open Sans', sans-serif;
font-size:160%;
font-style: normal;
font-weight: 400;
text-align:left;
line-height:0.9em;
	ccolor: #000;
}


h3 {
font-family: 'Montserrat', sans-serif;
font-size:100%;
font-style: normal;
font-weight: 700;
text-align:left;
line-height:0.9em;
}
 
h4 {
font-family: 'Open Sans', sans-serif;
font-size:105%;
font-style: normal;
font-weight: 400;
text-align:left;
line-height:0.7em;
}



.image-clignote  {
   animation-duration: 10s;
   animation-name: clignoter;
   animation-iteration-count: 2;
   transition: none;
}

@keyframes clignoter {
  100%   { color:orange; }
  50%   {color:white; }
  100% { color:orange; }
}

.anitext {
  display:inline-block;
  overflow:hidden;
  white-space:nowrap;
	
font-weight:400;
font-size:44px;
	padding: 20px 5px 20px 0;
	color:#fff;
}

.anitext:first-of-type { 
  animation: showup 10s;
}

.anitext:last-of-type {
  width:0px;
  animation: reveal 10s;
}

.anitext:last-of-type span {
  margin-left:-355px;
  animation: slidein 10s;
}

.majuscule {
  text-transform: uppercase;
	color: red;
	font-style: italic;
}

@keyframes showup {
    0% {opacity:0;}
    20% {opacity:1;}
    80% {opacity:1;}
    100% {opacity:0;}
}

@keyframes slidein {
    0% { margin-left:-600px; }
    20% { margin-left:-600px; }
    35% { margin-left:0px; }
    100% { margin-left:0px; }
}

@keyframes reveal {
    0% {opacity:0;width:0px;}
    20% {opacity:1;width:0px;}
    30% {width:300px;}
    80% {opacity:1;}
    100% {opacity:0;width:300px;}
}




hr {
background-color: #000;
height: 1px;
border: 0;
	opacity: 75%
}

.underline {
  position: relative;
}

.underline::before {
  content: '';
  position: absolute;
  height: 2px;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: black;
  transform-origin: bottom left;
  transform: scaleX(1);
  transition: transform 0.3s ease-in-out;
}

.underline:hover::before {
  transform: scaleX(0);
  transform-origin: bottom right;
}

.underline2 {
    position: relative;
}

.underline2::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -3px;
    width: 60%;
    height: 2px;
    opacity: 0;
    background-color: #000;
    transform: translate(-50%, 0);
    transition: all 0.3s ease-in-out;
}

.underline2:hover::after {
    width: 100%;
    opacity: 1;
}
.underline3 {
    position: relative;
}

.underline3::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -3px;
    width: 60%;
    height: 2px;
    opacity: 0;
    background-color: #694b96;
    transform: translate(-50%, 0);
    transition: all 0.3s ease-in-out;
}

.underline3:hover::after {
    width: 100%;
    opacity: 1;
}

.underline2w {
    position: relative;
}

.underline2w::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -3px;
    width: 60%;
    height: 2px;
    opacity: 0;
    background-color: #FFF;
    transform: translate(-50%, 0);
    transition: all 0.3s ease-in-out;
}

.underline2w:hover::after {
    width: 100%;
    opacity: 1;
}
.margin_minus0 {
margin-left:0px;
}

.margin_minus20 {
margin-left:-20px;

}

.margin_plus20 {
margin-left: 100px;

}

.margin_minus20_top {
margin-left:-20px;
margin-top: 0px;
margin-bottom: 0px;
}
.margin_minus2020 {
margin-left:-20px;
	line-height: 18px;
}

.margin_minus20_lhplus {
margin-left:0px;
line-height:1.3em;
}

.margin_minus30 {
margin-left:-30px;
}

.margin_minus40 {
margin-left:-40px;
}

.padding_40 {
padding-left:40px;
padding-right:40px;
}

.padding_40_top {
padding-left:40px;
padding-right:40px;
padding-top:40px;
}

.lineheigt_20 {
line-height: 16px;
	}
.size_95 {
font-size:95%;
}
.size_90 {
font-size:90%;
}

.size_80 {

	
	text-transform: uppercase;
}
.size_70 {
font-size:70%;
}

.font_white {
	color:#FFF;
}
.legendes {
font-family: 'Roboto', sans-serif;
opacity:0.3;
	width: 100%;
	font-size: 70%;
}

.gris {
filter: grayscale(1);
	}
.rond {
	
	display: block;
	background-color: rgba(51,51,51,1);   
	width: 13px;
	height: 13px;
	border-radius: 10px;
}
.lettrineo {
  font-family: Helvetica, Arial, 'sans-serif';
  font-size:100px;
	margin-left: -10px;
	margin-right: 0px;
	margin-top:30px;
	margin-bottom: -25px;
	position: relative;
	float:left;
	font-style: italic;

}
.lettrinef{
  font-family: Helvetica, Arial, 'sans-serif';
  font-size:100px;
	margin-left: -25px;
	margin-top:35px;
	position: relative;
	float:right;
	font-style: italic;

}
blockquote {
    /* une paire de guillemets */

    quotes:" " " ";
	font-style: italic;
	font-size: 100%;
	margin-left: 0px;
	line-height: 15px;
	margin-bottom: 0px;
	
}

blockquote::before {
    content: open-quote;
	font-size: 100%;
	opacity: 1;



}
blockquote::after {
    content: close-quote;
	font-size: 200%;
	opacity: 0.5;
}

#socialbar{
  font-size: 20px;
	margin: 0px;	
transition: all 0.5s linear;
	
}


.icon-bar {
  position: fixed;
	float: right;
	z-index: 998;
  top: 85px;
	right:57px;
	color: #000;
}


.icon-bar a {
  display: block;
  text-align: center;
  padding: 10px;
	float: left;
	border: 0px solid white;
	background-color: rgba(0,0,0,0.0);
	margin: 1px;
	color: #000;
}

.icon-bar a:hover {

	color: #000;
}


#twitter {
  color: rgba(255,255,255,0.5);
}

#linkedin {
   color: rgba(255,255,255,0.5);
}

#youtube {
  color: rgba(255,255,255,0.5);
}

#home {
   color: rgba(255,255,255,1);
	font-size: 14px;
	border: 1px solid #fff;
	padding: 5px;
	margin-top: 4px;
	margin-left: 4px;
}





#itemmenu,
#itemmenu0,
#itemmenu1,
#itemmenu2,
#itemmenu3,
#itemmenu4,
#itemmenu5
{

transition: all 0.5s linear;
}


#topfleche {

transition: all 0.5s linear;
	opacity: 1;
	width: 40px;
	height: auto;
}
.etoile {
display: inline-block;
	font-size: 160%;
-webkit-transform:rotate(-12deg);
	transform: rotate(-12deg);
}

.etoilecolor {
display: inline-block;
	font-size: 170%;
-webkit-transform:rotate(-12deg);
	transform: rotate(-12deg);
	color: #555;
}


.etoilemenu {

	font-size: 110%;
-webkit-transform:rotate(-12deg);
	transform: rotate(-12deg);
	display: none;
}


#table_spon { 
  width: 100%;
  font-family: 'Open Sans', sans-serif;
  font-size:0.95em;
  border-collapse: separate;
  padding: 5px 0px 5px 0px;
}
/* Zebra striping */
#table_spon tr { 
  background: rgba(67,59,121,0.0); 
  color: white;
}
#table_sponth { 
  background: rgba(67,59,121,0.0); 
  color: rgba(0,0,0,1); 
  font-weight: 400; 
  text-transform: none;
  padding: 10px 10px 5px 10px; 
  border-bottom: 0px solid #ccc; 
}
#table_spon td { 
  padding: 4px 4px 4px 0px; 
  border-top: 1px solid rgba(0,0,0,0.20); 
  color: rgba(0,0,0,1); 
}

#table_expo { 
  width: 100%;
  font-family: 'Open Sans', sans-serif;
  font-size:0.90em;
  border-collapse: separate;
  padding: 5px 0px 5px 0px;
}


/* Zebra striping */
#table_expo tr { 
  background: rgba(67,59,121,0.0); 
  color: white;
}
#table_expo th { 
  background: rgba(67,59,121,0.0); 
  color: rgba(0,0,0,1); 
  font-weight: 400; 
  text-transform: none;
  padding: 10px 10px 5px 0px; 
  border-bottom: 0px solid #ccc; 
	border-top: 1px solid rgba(0,0,0,0.4);  
}
#table_expo td { 
  padding: 4px 4px 4px 5px; 
  border-top: 1px solid rgba(0,0,0,0.40); 
  color: rgba(0,0,0,1); 
}

#table_expo_2 { 
  width: 100%;
  font-family: 'Open Sans', sans-serif;
  font-size:0.95em;
  border-collapse: separate;
  padding: 5px 0px 5px 0px;
}
/* Zebra striping */
#table_expo_2 tr { 
  background: rgba(67,59,121,0.0); 
  color: white;
}
#table_expo_2 th { 
  background: rgba(0,0,0,0.0); 
  color: rgba(0,0,0,0.8); 
  font-weight: 400; 
  text-transform: none;
  padding: 7px 10px 5px 0px; 
  border-top: 1px solid rgba(0,0,0,0.4);  
}
#table_expo_2 td { 
  padding: 4px 4px 4px 0px; 
  border-top: 1px solid rgba(0,0,0,0.40); 
  color: rgba(0,0,0,1); 
}#table_expo { 
  width: 100%;
  font-family: 'Open Sans', sans-serif;
  font-size:0.90em;
  border-collapse: separate;
  padding: 5px 0px 5px 0px;
}


/* Zebra striping */
#table_expo tr { 
  background: rgba(67,59,121,0.0); 
  color: white;
}
#table_expo th { 
  background: rgba(67,59,121,0.0); 
  color: rgba(0,0,0,1); 
  font-weight: 400; 
  text-transform: none;
  padding: 10px 10px 5px 0px; 
  border-bottom: 0px solid #ccc; 
	border-top: 1px solid rgba(0,0,0,0.4);  
}
#table_expo td { 
  padding: 4px 4px 4px 5px; 
  border-top: 1px solid rgba(0,0,0,0.40); 
  color: rgba(0,0,0,1); 
}

#table_expo_2 { 
  width: 100%;
  font-family: 'Open Sans', sans-serif;
  font-size:0.95em;
  border-collapse: separate;
  padding: 5px 0px 5px 0px;
}
/* Zebra striping */
#table_expo_2 tr { 
  background: rgba(67,59,121,0.0); 
  color: white;
}
#table_expo_2 th { 
  background: rgba(0,0,0,0.0); 
  color: rgba(0,0,0,0.8); 
  font-weight: 400; 
  text-transform: none;
  padding: 7px 10px 5px 0px; 
  border-top: 1px solid rgba(0,0,0,0.4);  
}
#table_expo_2 td { 
  padding: 4px 4px 4px 0px; 
  border-top: 1px solid rgba(0,0,0,0.40); 
  color: rgba(0,0,0,1); 
}

.fontbg {
	
		color:#000;
		padding-left: 5px;
	font-family: "Open Sans", sans-serif;
	font-size:1.05em;
	font-style:italic;
	line-height:1.2em;
}

.numberbooth {
	font-size: 120%; 
display: block;
	position: absolute; 
color: #CCC;
	margin-left: auto; 
	margin-right: auto; 
}

@media only screen and (max-width: 480px)  {

	h1 {
font-family: 'Open Sans', sans-serif;
font-size:150%;
font-style: normal;
font-weight: 400;
text-align:left;
line-height:1em;
	color: #000;
}
	
	h2 {
font-family: 'Open Sans', sans-serif;
font-size:125%;
font-style: normal;
font-weight: 400;
text-align:left;
line-height:0.9em;
	color: #000;
}
	#table_expo, #table_spon {
		font-size: 50%;
	}
	.text_none {
	display:none;
	}
	
.lettrineo {
  font-family: Helvetica, Arial, 'sans-serif';
  font-size:90px;
	margin-left: -10px;
	margin-right: 0px;
	margin-top:30px;
	margin-bottom: -25px;
	position: relative;
	float:left;
	color:rgba(0,0,0,0.6); 
	font-style: italic;

}
.lettrinef{
  font-family: Helvetica, Arial, 'sans-serif';
  font-size:90px;
	margin-left: 5px;
	margin-top:35px;
	position: relative;
	float:right;
color:rgba(0,0,0,0.6);  
	font-style: italic;

}
blockquote {
    /* une paire de guillemets */

    quotes:" " " ";
	font-style: italic;
	font-size: 100%;
	margin-left: 0px;
	line-height: 15px;
	color:rgba(0,0,0,0.6); 
}

blockquote::before {
    content: open-quote;
	font-size: 100%;
	opacity: 1;



}
blockquote::after {
    content: close-quote;
	font-size: 200%;
	opacity: 1;
}

	.numberbooth {
	font-size: 100%; 
display: block;
	position: absolute; 
		margin-top: -20px;

	margin-left: auto; 
	margin-right: auto; 
}
}

@media only screen and (min-width: 480px) and (max-width: 768px)  {

	#table_expo, #table_spon {
		font-size: 70%;
	}
	
	



}

@media all and (max-width: 1280px) {
	
		.underline2::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -3px;
    width: 60%;
    height: 2px;
    opacity: 0;
    background-color: white;
    transform: translate(-50%, 0);
    transition: all 0.3s ease-in-out;
}
	
	.underline3::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -3px;
    width: 60%;
    height: 2px;
    opacity: 0;
    background-color: black;
    transform: translate(-50%, 0);
    transition: all 0.3s ease-in-out;
}
	#socialbar{
display: none;
	
}
	#socialbar_footer{
  font-size: 25px;
	margin: 0px;	
transition: all 0.5s linear;
	
}


.icon-bar_footer {
  position: relative;

	z-index: 998;
  top: 0px;

	
}


.icon-bar_footer a {
  display: block;
  text-align: center;
  padding: 10px;
color: #777;
	float: left;
	border: 0px solid white;
	background-color: rgba(0,0,0,0.0);
	margin: 1px;
}

.icon-bar_footer a:hover {

	color: #000;
}


.twitter_footer {
  
}

.linkedin_footer {

}

.youtube_footer {

}

.home_footer {

}
.padding_40 {
padding-left:20px;
padding-right:20px;
}

.padding_40_top {
padding-left:20px;
padding-right:20px;
padding-top:20px;
}



.spe li  {
 background-image: url(); /* on affiche l'image souhaitée */
 padding-left:0px;
 margin-left:-20px;
}

.spe li:before {
    content: "→ "; /* caractère UTF-8 */
}



.etoilemenu {
display: none;
}
	

	
}

@media all and (min-width: 1280px) {
	
#socialbar_footer{
 display: none;
	
}}
	




