/**
* CSS
* 
* @version 2.0
* @author Vaska 
*
* There are also some obscure rules in base.css
*/

body {
	font-size: 13px;
	font-family: 'News Cycle', sans-serif;
	background: #fff;
	color: #000;
	line-height: 1.3em;
	/* font-weight: 300; */
}

/* link scheme */
/* you can customize links further down the page too */
a:link,a:visited,a:active { text-decoration: none; color: #333; }
a:hover { color:#000; }
a img { border: none; }

/* general styles */
small { font-size: 9px; }
code { font-family: monospace; }
blockquote { padding-left: 9px; }

/* headings */
h1 { font-size: 13px; margin-bottom: 1em; font-weight: bold; }
h2 { font-size: 20px; margin-bottom: 1em!important; font-weight: bold; }
h3 { font-size: 20px; margin-bottom: 1em; }
h4 { font-size: 13px; margin-bottom: 1em; }

/* paragraph width */
#index p { margin-bottom: 1em; }
#exhibit p, code, blockquote { width: auto; margin-bottom: 1em; /* line-height: 1.3em; */ text-align:justify;}

/* highlighter style - maybe you want to change colors? */
.highlight { background: #ccff00; color: #000; }

/* never adjust the margin or padding here unless you seriously know what you are doing */
/* think #index .container and #exhibit .container for only padding adjustments */
#index { width: 225px; background: #fff; /* line-height: 1.3em; */ z-index:8100;transition:left ease .5s;padding-left:10px;padding-top:100px;}
#exhibit { margin: 25px 0 0 245px; transition:margin ease .5s;}

/* styling the index */
ul { list-style: none; margin: 0; }
ul.section { margin-bottom: 0.5em!important; }
ul.subsection {  }

/* the follow rules for index are not required */
/* they are mostly for complex customization */
/* for tag display */
#index ul#all_tags { list-style-type: none; margin-bottom: 1em; }
#index ul#all_tags li { display: inline; margin-right: 3px; }
#index ul#all_tags li a {  }

/* active section title */
span.active_section_title,
span.active_section_title a { color:#333; }

/* active exhibit title parts */
li.active a:link, li a.active, li.active a:hover, li a.active, li.active a:active, li a.active, 
li.active a:visited, li a.active, li span.active, ul.section li.active a:link, 
ul.section li.active a:hover, ul.section li.active a:active, ul.section li.active a:visited
{ color:#000; padding:0 0 0 0px;}
li.active a:before{content:'>\00a0';display:inline-block;}

/* additional #index options */
#index ul li .password a { /* background: url(../img/locked.gif) right center no-repeat; padding-right: 18px; */ }

/* the "new" indicator */
#index ul li sup { color: #0c0; font-weight: bold; text-transform: uppercase; font-size: 8px; vertical-align: top; }
/* end styling for index */

/* links styles only for the #index region */
#index a:link {  } 
#index a:hover {  } 
#index a:active {  } 
#index a:visited {  }

/* links styles only for the #exhibit region */
#exhibit a:link {  } 
#exhibit a:hover {  } 
#exhibit a:active {  } 
#exhibit a:visited {  } 

/* this is where you adjust your paddings for #index and #exhibit together */
.container { padding: 25px; }

/* this is where you pad them separately */
#index .container {  }
#exhibit .container { padding-top:90px; overflow-x:auto; height: calc(100vh - 140px); }



/* LAURENT */
.bot{
	position: absolute;
	bottom:90px;
	width: 100%;
    text-align: center;
	margin-left: -10px;
	font-size:10px;
}
.slidebot{
	position: absolute;
    bottom: 0px;
    width: 100%;
    margin-left: -10px;
	font-size:10px;
}


#panel {
display:none;
}
#panel p{
width:100%;
text-align:justify;
line-height:140%;
margin-bottom:8px;
}
.btn-slide{
width:100%;
}

#fancyclose{
	float:right;
	font-size:60%;
	font-weight:normal;
	display:inline-block;
	cursor:pointer;
}
#fancyclose:hover{
	text-decoration:underline;
}


#changement_version {
	margin-top:30px;
	text-align:center;
	font-size:14px;
	text-transform:	uppercase;
}

/* MENU */
ul {
	list-style: none;
	margin: 0; padding: 0;
	text-align: left;
}
ul {
	/*margin-bottom: 300px;*/
	border: 0px solid #222;
}
ul > li {
	position: relative;
}

ul > li > span {
	display: block;
	outline: 0;
	padding: .7em 1em;
	text-decoration: none;
	color: #333;
}
ul > li > ul > li > a{
	color:#555;
	display:block;
	padding:0;
	transition: padding ease-in 0.2s;
}
ul > li > ul > li > a:hover{
	display:block;
	padding:0 0 0 10px;
	transition: padding ease-in 0.2s;
}

ul > li > ul {
	counter-reset: items;
	/*height: 0;
	overflow: hidden;
	background: #fafafa;*/
	color: #777;
	font-size: 1em;
	margin-top:2px!important;
	max-height: 300px;
	overflow-y: auto;
	padding-bottom: 20px;
}

ul.section:nth-child(3) {
	margin-bottom: -20px!important;
}

ul > li > ul:after{
	content:" ";
	display:block;
	background: rgb(255,255,255);
	background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
	position:absolute;
	height: 20px;
    width: 100%;
    bottom: 0;
    left: 0;
}

ul > li > ul > li {
	counter-increment: items;
	padding: .5em 1.3em;
	border-bottom: 0px dotted #DDD;
}
/*ul > li > ul:after {
	content: counter(items);
	font-size: 0.75em;
	@include inline-block;
	position: absolute;
	right: 10px;
	top: 15px;
	background: #fff;
	line-height: 1em;
	height: 1em;
	padding: .6em .8em;
	margin: -.8em 0 0 0;
	color: #888;
	text-indent: 0;
	text-align: center;
	text-shadow:0px 1px 0px rgba(255,255,255, .5);
	font-weight: 500;
	border-radius:50%;
	box-shadow:inset 0px 1px 3px 0px rgba(0, 0, 0, .26), 0px 1px 0px 0px rgba(255, 255, 255, .15);
}

ul > li > ul.subsection:after {
	top:23px;
	right:10px;
	font-size: 0.75em;
	padding: .4em .6em;
	background: #fff;
}
*/
ul.section li ul li{
	padding:0.3em 0 0.3em 1.5em;
}
em{
	color:#aaa;
	font-size:12px;
}

.visible{visibility:visible;}
.hidden{visibility:hidden;}

#texte{
	background:rgba(255,255,255,0.95);
	z-index:9998;
	height:100%;
	padding:20px;
	overflow-y:auto;
	font-size:15px;
	text-align:justify;
	line-height:20px;
}

#texte  * {
	margin:0 auto;
	max-width:800px;
}


.arrow-up {
	width: 0; 
	height: 0; 
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	
	border-top: 10px solid #555;
	border-bottom:10px solid transparent;
	
	margin:10px auto 10px auto;
	
	cursor:pointer;
}
.isDown {
	border-top: 10px solid transparent;
	border-bottom: 10px solid #555;
	
	margin:-10px auto 20px auto;
}
.arrow-up:after{
	content:'share';
	font-size:12px;
	margin-left:-13px;
	margin-top:-2px;
	display:block;
}
.isDown:after{
	content:'share';
	font-size:12px;
	margin-left:-13px;
	margin-top:10px;
	display:block;
}

#social{
	position:fixed;
	bottom:20px;
	left:0;
	width:210px;
	height:24px;
	margin:0 0 10px 5px;
	padding:0;
	text-align:center;
	transition:left ease .5s;
}

#social a{
	background:transparent url('../img/social_icons.png') no-repeat;
	display:inline-block;
	outline:none;
	height:24px;
	width:24px;
	margin:0 1px;
	opacity:0.8;
	/*transition:all linear 0.1s;*/
}

#social a:hover{
	opacity:1;
	background-position-y:-24px!important;
	/*transition:all linear 0.1s;*/
}

#social a.mail{
	background-position: -24px 0;	
}
#social a.twitter{
	background-position: 0 0;	
}
#social a.linkedin{
	background-position: -48px 0;	
}
#social a.facebook{
	background-position: -72px 0;	
}
#social a.tumblr{
	background-position: -96px 0;	
}
#social a.corpo{
	background-position: -120px 0;	
}


.ui-tooltip {
	padding: 4px;
	position: absolute;
	z-index: 9999;
	max-width: 300px;
	background:rgba(0,0,0,0.8);
	color:white;
	opactiy:0.8;
	/*border-radius:5px;*/
}
.ui-tooltip1 {
	padding: 4px;
	position: absolute;
	z-index: 9999;
	max-width: 300px;
	/*background:#639ca0!important;*/
	background:rgba(0,0,0,0.8);
	color:white;
	opactiy:0.8;
	/*border-radius:5px;*/
}

.margintop{
	margin-top:180px;
	/*margin-top:130px;*/
}

.iframecontainer{
	margin:0px;padding:0px;overflow:hidden;position:absolute;top:0;left:0;height:100%;width:100%;	
}

.fancylike-left{
	background:transparent;position: absolute;top: 0;left: 0;bottom: 25px;width: calc(50% - 112.5px);margin-left: 225px;
}
.fancylike-left:hover{
	cursor: url(../fancybox/cursors/left.png), auto;
}
.fancylike-right{
	background:transparent;position: absolute;top: 0;right: 0;bottom: 25px;width: calc(50% - 112.5px);
}
.fancylike-right:hover{
	cursor: url(../fancybox/cursors/right.png), auto;
}

.corpolink a{
	color:#aaa;
}
.switch{
	position:absolute;
	bottom:290px;
}
.switchresp{
	position:absolute;
	bottom:40px;
	margin-left:35px;
}




/**
 *
 * slippry v1.4.0 - Responsive content slider for jQuery
 * http://slippry.com
 *
 * Authors: Lukas Jakob Hafner - @saftsaak
 *          Thomas Hurd - @SeenNotHurd
 *
 * Copyright 2016, booncon oy - http://booncon.com
 *
 *
 * Released under the MIT license - http://opensource.org/licenses/MIT
 */
/* kenBurns animations, very basic */
@-webkit-keyframes left-right {
  0% {
    -webkit-transform: translateY(-20%) translateX(-10%);
            transform: translateY(-20%) translateX(-10%); }
  100% {
    -webkit-transform: translateY(0%) translateX(10%);
            transform: translateY(0%) translateX(10%); } }
@-o-keyframes left-right {
  0% {
    -o-transform: translateY(-20%) translateX(-10%);
       transform: translateY(-20%) translateX(-10%); }
  100% {
    -o-transform: translateY(0%) translateX(10%);
       transform: translateY(0%) translateX(10%); } }
@keyframes left-right {
  0% {
    -webkit-transform: translateY(-20%) translateX(-10%);
         -o-transform: translateY(-20%) translateX(-10%);
            transform: translateY(-20%) translateX(-10%); }
  100% {
    -webkit-transform: translateY(0%) translateX(10%);
         -o-transform: translateY(0%) translateX(10%);
            transform: translateY(0%) translateX(10%); } }
@-webkit-keyframes right-left {
  0% {
    -webkit-transform: translateY(0%) translateX(10%);
            transform: translateY(0%) translateX(10%); }
  100% {
    -webkit-transform: translateY(-20%) translateX(-10%);
            transform: translateY(-20%) translateX(-10%); } }
@-o-keyframes right-left {
  0% {
    -o-transform: translateY(0%) translateX(10%);
       transform: translateY(0%) translateX(10%); }
  100% {
    -o-transform: translateY(-20%) translateX(-10%);
       transform: translateY(-20%) translateX(-10%); } }
@keyframes right-left {
  0% {
    -webkit-transform: translateY(0%) translateX(10%);
         -o-transform: translateY(0%) translateX(10%);
            transform: translateY(0%) translateX(10%); }
  100% {
    -webkit-transform: translateY(-20%) translateX(-10%);
         -o-transform: translateY(-20%) translateX(-10%);
            transform: translateY(-20%) translateX(-10%); } }
/* added to the original element calling slippry */
.sy-box.sy-loading {
  background: url("/img/sy-loader.gif") 50% 50% no-repeat;
  -webkit-background-size: 32px 32px;
          background-size: 32px;
  min-height: 40px; }
  .sy-box.sy-loading .sy-slides-wrap, .sy-box.sy-loading .sy-pager {
    visibility: hidden; }

/* element that wraps the slides */
.sy-slides-wrap {
  position: relative;
  height: 100%;
  width: 100%; }
  .sy-slides-wrap:hover .sy-controls {
    display: block; }

/* element that crops the visible area to the slides */
.sy-slides-crop {
  height: 100%;
  width: 100%;
  position: absolute;
  overflow: hidden; }

/* list containing the slides */
.sy-list {
  width: 100%;
  height: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute; }
  .sy-list.horizontal {
    -webkit-transition: left ease;
         -o-transition: left ease;
            transition: left ease; }
  .sy-list.vertical {
    -webkit-transition: top ease;
         -o-transition: top ease;
            transition: top ease; }

/* single slide */
.sy-slide {
  position: absolute;
  width: 100%;
  z-index: 2; }
  .sy-slide.kenburns {
    width: 140%;
    left: -20%; }
    .sy-slide.kenburns.useCSS {
      -webkit-transition-property: opacity;
           -o-transition-property: opacity;
              transition-property: opacity; }
      .sy-slide.kenburns.useCSS.sy-ken:nth-child(1n) {
        -webkit-animation-name: left-right;
             -o-animation-name: left-right;
                animation-name: left-right;
        -webkit-animation-fill-mode: forwards;
             -o-animation-fill-mode: forwards;
                animation-fill-mode: forwards; }
      .sy-slide.kenburns.useCSS.sy-ken:nth-child(2n) {
        -webkit-animation-name: right-left;
             -o-animation-name: right-left;
                animation-name: right-left;
        -webkit-animation-fill-mode: forwards;
             -o-animation-fill-mode: forwards;
                animation-fill-mode: forwards; }
  .sy-slide.sy-active {
    z-index: 3; }
  .sy-slide > img {
    margin: 0;
    padding: 0;
    display: block;
    width: 100%;
    border: 0; }
  .sy-slide > a {
    margin: 0;
    padding: 0;
    display: block;
    width: 100%; }
    .sy-slide > a > img {
      margin: 0;
      padding: 0;
      display: block;
      width: 100%;
      border: 0; }

/* next/ prev buttons, with arrows and clickable area a lot larger than the visible buttons */
.sy-controls {
  display: none;
  list-style: none;
  height: 100%;
  width: 100%;
  position: absolute;
  padding: 0;
  margin: 0; }
  .sy-controls li {
    position: absolute;
    width: 10%;
    min-width: 4.2em;
    height: 100%;
    z-index: 33; }
    .sy-controls li.sy-prev {
      left: 0;
      top: 0; }
      .sy-controls li.sy-prev a:after {
        background-position: -5% 0; }
    .sy-controls li.sy-next {
      right: 0;
      top: 0; }
      .sy-controls li.sy-next a:after {
        background-position: 105% 0; }
    .sy-controls li a {
      position: relative;
      width: 100%;
      height: 100%;
      display: block;
      text-indent: -9999px; }
      .sy-controls li a:link, .sy-controls li a:visited {
        opacity: 0.4; }
      .sy-controls li a:hover, .sy-controls li a:focus {
        opacity: 0.8;
        outline: none; }
      .sy-controls li a:after {
        content: "";
        background-image: url("/images/arrows.svg");
        background-repeat: no-repeat;
        -webkit-background-size: cover;
                background-size: cover;
        text-align: center;
        text-indent: 0;
        line-height: 2.8em;
        color: #111;
        font-weight: 800;
        position: absolute;
        background-color: #fff;
        width: 2.8em;
        height: 2.8em;
        left: 50%;
        top: 50%;
        margin-top: -1.4em;
        margin-left: -1.4em;
        border-radius: 50%; }
  @media only screen and (max-device-width: 600px) {
    .sy-controls {
      display: block; }
      .sy-controls li {
        min-width: 2.1em; }
        .sy-controls li a:after {
          width: 1.4em;
          height: 1.4em;
          margin-top: -0.7em;
          margin-left: -0.7em; } }

/* captions, styled fo the overlay variant */
.sy-caption-wrap {
  position: absolute;
  bottom: 2em;
  z-index: 12;
  left: 50%; }
  .sy-caption-wrap .sy-caption {
    position: relative;
    left: -50%;
    background-color: rgba(0, 0, 0, 0.54);
    color: #fff;
    padding: 0.4em 1em;
    border-radius: 1.2em; }
    .sy-caption-wrap .sy-caption a:link, .sy-caption-wrap .sy-caption a:visited {
      color: #e24b70;
      font-weight: 600;
      text-decoration: none; }
    .sy-caption-wrap .sy-caption a:hover, .sy-caption-wrap .sy-caption a:focus {
      text-decoration: underline; }
  @media only screen and (max-device-width: 600px), screen and (max-width: 600px) {
    .sy-caption-wrap {
      left: 0;
      bottom: 0.4em; }
      .sy-caption-wrap .sy-caption {
        left: 0;
        padding: 0.2em 0.4em;
        font-size: 0.92em;
        border-radius: 0; } }

/* pager bubbles */
.sy-pager {
  clear: both;
  display: block;
  width: 100%;
  margin: 1em 0 0;
  padding: 0;
  list-style: none;
  text-align: center; }
  .sy-pager li {
    display: inline-block;
    width: 1.2em;
    height: 1.2em;
    margin: 0 1em 0 0;
    border-radius: 50%; }
    .sy-pager li.sy-active a {
      background-color: #e24b70; }
    .sy-pager li a {
      width: 100%;
      height: 100%;
      display: block;
      background-color: #ccc;
      text-indent: -9999px;
      -webkit-background-size: 2em 2em;
              background-size: 2em;
      border-radius: 50%; }
      .sy-pager li a:link, .sy-pager li a:visited {
        opacity: 1.0; }
      .sy-pager li a:hover, .sy-pager li a:focus {
        opacity: 0.6; }

/* element to "keep/ fill" the space of the content, gets intrinsic height via js */
.sy-filler {
  width: 100%; }
  .sy-filler.ready {
    -webkit-transition: padding 600ms ease;
         -o-transition: padding 600ms ease;
            transition: padding 600ms ease; }