/*

Le Principe d'Incertitude Website

Author: Melanie Rattier


*/

/* Police
-------------------------------------------------- */
/*@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 300;
  src: url(../fonts/sourcesanspro-300.woff) format('woff');
}*/

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/sourcesanspro-400.woff) format('woff');
}

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  src: url(../fonts/sourcesanspro-600.woff) format('woff');
}

@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 400;
  src: url(../fonts/sourcesanspro-400-italic.woff) format('woff');
}

/* Reset
-------------------------------------------------- */
*, *:before, *:after {
  margin: 0;
  padding: 0;
  border: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, main, nav, section, summary {
  display: block;
}

/* Pix
--------------------------------------------------*/
img {
  display: block;
  max-width: 100%;
}

/* Links
-------------------------------------------------- */
a {
  color: #000;
  text-decoration: none;
  transition: color .3s, background .3s, border .3s;
}

a:hover {
  color: #000;
}

/* Clearfix
-------------------------------------------------- */
.cf:after {
  content: "";
  display: table;
  clear: both;
}

/* Site
-------------------------------------------------- */
html {
  height: 101%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  font-family: "Source Sans Pro", Sans-Serif;
  margin: 0 auto;
  font-size: 1.25em;
  line-height: 1.5em;
  padding: 1.5em;
  max-width: 45em;
  background: #fff;
  color: #222;
}


strong /* Markdown **strong** or __strong__ */
    {
font-weight: 600;
    }


/* Header
-------------------------------------------------- */

@media screen and (min-width: 801px) {

.header {
  margin-bottom: 3em;
}
.logo {
  display: block;
  margin-bottom: 1.5em;
}
.logo img {
  width: 8em;
}
.logo {
  float: left;
}

}


@media screen and (max-width: 800px) and (min-width: 561px) {

.header {
  margin-bottom: 1em;
}
.logo {
  display: block;
  margin-bottom: 0em;
  width: 100%;
}
.logo img {
  width: 8em;
}
.logo {
  float: left;
}

}



@media screen and (max-width: 560px) {

.header {
  margin-bottom: 0em;
}
.logo {
  display: block;
  margin-bottom: 0em;
}
.logo img {
  width: 8em;
}
.logo {
  float: left;
}

}



/* Horizontal Navigation
-------------------------------------------------- */



@media screen and (min-width: 801px) {

  .lang_menu a,
  .menu a {
    display: block;
    color: #222;
    font-size: 0.6em;
    padding: .35em 0;
    font-weight: 400;
  }
  .lang_menu a:hover,
  .menu a:hover {
    color: #3399FF;
  }
  .lang_menu .active,
  .menu .active {
    color: #3399FF;
  }
  .lang_menu li,
  .menu li {
    list-style: none;
  }
  .lang_menu > li,
  .menu > li {
    position: relative;
  }
  body {
    padding: 3em;
  }
  .menu {
    float: left;
    margin-left: 5em;
  }
  .menu > li {
    float: left;
  }
  .menu > li > a {
    padding: 1.8em 0.8em;
    border: 0;
  }
  .lang_menu {
    float: right;
  }
  .lang_menu > li {
    float: right;
  }
  .lang_menu > li > a {
    padding: 1.8em 0em 1.8em 0.8em;
    border: 0;
  }

}


@media screen and (max-width: 800px) and (min-width: 561px) {

  .lang_menu a,
  .menu a {
    display: block;
    color: #222;
    font-size: 0.6em;
    padding: .35em 0;
    font-weight: 400;
  }
  .lang_menu a:hover,
  .menu a:hover {
    color: #3399FF;
  }
  .lang_menu .active,
  .menu .active {
    color: #3399FF;
  }
  .lang_menu li,
  .menu li {
    list-style: none;
  }
  .lang_menu > li,
  .menu > li {
    position: relative;
  }
  body {
    padding: 3em;
  }
  .menu {
    float: left;
    margin-left: 0em;
  }
  .menu > li {
    float: left;
  }
  .menu > li > a {
    padding: 1.8em 0.8em;
    border: 0;
  }
  .lang_menu {
    float: right;
    margin-right: 0em;
  }
  .lang_menu > li {
    float: right;
  }
  .lang_menu > li > a {
    padding: 1.8em 0em 1.8em 0.8em;
    border: 0;
  }

}


@media screen and (max-width: 560px) {

  .menu a {
    display: block;
    color: #222;
    font-size: 0.6em;
    padding: .35em 0;
    font-weight: 400;
  }
  .lang_menu a {
    display: block;
    color: #222;
    font-size: 0.55em;
    padding: .35em 0;
    font-weight: 400;
  }
  .lang_menu a:hover,
  .menu a:hover {
    color: #3399FF;
  }
  .lang_menu .active,
  .menu .active {
    color: #3399FF;
  }
  .lang_menu li,
  .menu li {
    list-style: none;
  }
  .lang_menu > li,
  .menu > li {
    position: relative;
  }
  body {
    padding: 1.5em;
  }
  .menu {
    float: left;
    margin-left: 0em;
    margin-bottom: 1em;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
  }
  .menu > li {
    float: left;
  }
  .menu > li > a {
    padding: 0em 0.8em;
    border: 0;
  }
  .lang_menu {
    float: left;
    margin-left: 1em;
    margin-top: 0.3em;
    margin-bottom: 2em;
  }
  .lang_menu > li {
    float: top;
    margin-bottom: -0.5em;
  }
  .lang_menu > li > a {
    padding: 0em 0.8em;
    border: 0;
  }

}



/* Vertical Navigation
-------------------------------------------------- */

@media screen and (min-width: 561px) {

.vert_menu2 a
.vert_menu1 a {
  display: block;
  color: #222;
}
.vert_menu1 a {
  font-size: .6em;
  line-height: 2.5em;
}
.vert_menu2 a {
  font-size: .55em;
  line-height: 2em;
}
.vert_menu2 a:hover,
.vert_menu1 a:hover {
  color: #3399FF;
  text-decoration: none;
}
.vert_menu2 .active,
.vert_menu1 .active {
  color: #3399FF;
}
.vert_menu1 li {
  list-style: none;
}
.vert_menu2 li {
  list-style: none;
  margin-top: -0.5em;
}
.vert_menu2 > li,
.vert_menu1 > li {
  position: relative;
}
.vert_menu1 > li > a {
  padding: 0em 0;
  font-weight: 400;
}
.vert_menu2 > li > a {
  padding: 0em 2em;
  font-weight: 400;
}

  .vert_menu1 {
    float: left;
    margin-top: -.4em;
  }
  .vert_menu1 > li {
    float: bottom;
  }
  .vert_menu1 > li > a {
    padding: 0em 0.8em;
    border: 0;
  }

}

@media screen and (max-width: 560px) {

.vert_menu2 a
.vert_menu1 a {
  display: block;
  color: #222;
}
.vert_menu1 a {
  font-size: .55em;
  line-height: 2em;
}
.vert_menu2 a {
  font-size: .5em;
  line-height: 2em;
}
.vert_menu2 a:hover,
.vert_menu1 a:hover {
  color: #3399FF;
  text-decoration: none;
}
.vert_menu2 .active,
.vert_menu1 .active {
  color: #3399FF;
}
.vert_menu1 li {
  list-style: none;
}
.vert_menu2 li {
  list-style: none;
  margin-top: -0.5em;
}
.vert_menu2 > li,
.vert_menu1 > li {
  position: relative;
}
.vert_menu1 > li > a {
  padding: 0em 0;
  font-weight: 400;
}
.vert_menu2 > li > a {
  padding: 0em 2em;
  font-weight: 400;
}

  .vert_menu1 {
    float: left;
    margin-top: -.5em;
    padding: 0 0 0.8em 0;
    border-bottom: 1px solid #ddd;
  }
  .vert_menu1 > li {
    float: bottom;
  }
  .vert_menu1 > li > a {
    padding: 0em 0.8em;
    border: 0;
  }
  .vert_menu1 {
    width: 100%;
    margin-bottom: 1em;
  }

}


/* Calendar
-------------------------------------------------- */

.calendar {
  font-size: 0.6em;
  font-weight: 400;
  width: 100%;
  line-height: 1.6em;
  text-align: justify;
}


.calendar b1 {
  color: #3399FF;
  font-weight: 600;
  margin-right: .5em;
}

.calendar b2 {
  font-weight: 600;
  margin-right: .5em;
}

.calendar b3 {
  margin-left: .1em;
}


/* Press
-------------------------------------------------- */

.press_menu c {
   font-weight: 600;
}
.press_menu li {
  list-style: none;
  margin-bottom: 1.5em;
}
.press_menu > li {
  position: relative;
}
.press_menu:after {
   margin-bottom: 2em;
}

@media screen {

  .press_menu {
    float: left;
    margin-left: 0em;
  }
  .press_menu > li {
    float: bottom;
  }

}


/* Headings
-------------------------------------------------- */
h1 {
  font-size: .6em;
  line-height: 2em;
  font-weight: 600;
  margin-bottom: .5em;
}

h2 {
  font-size: 1em;
  line-height: 2em;
  font-weight: 600;
  margin-bottom: 2em;
  color: #848484;
}

h3 {
  font-size: 1em;
  line-height: 2em;
  font-weight: 600;
  margin-bottom: .5em;
}

h4 {
  font-size: 1.125em;
  font-weight: 600;
  line-height: 1.5em;
  margin-bottom: .5em;
  color: red;
}

h1 a, h2 a, h3 a, h4 a {
  color: inherit;
  border: 0 !important;
}


/* Main
-------------------------------------------------- */


@media screen and (min-width: 801px) {

.main {
  padding-bottom: 1.5em;
  margin-left: 13.4em;
}

}

@media screen and (max-width: 800px) and (min-width: 561px) {

.main {
  padding-bottom: 1.5em;
  margin-left: 9em;
}

}

@media screen and (max-width: 560px) {

.main {
  padding-bottom: 1.5em;
  margin-left: 0em;
}

}


.main hr {
  margin: .6em 0;
  height: 1px;
  background: #ddd;
  width: 30%;
}

.main p,
.main figure,
.main ul,
.main ol {
  margin-bottom: 1.2em;
  margin-top: 0em;
}
.main a {
  border-bottom: 1px solid #ddd;
}
.main a:hover {
  border-color: #222;
}
.main .active {
  border-color: #222;
}


/* Text blocks */
.text,
.text_contact {
  font-size: 0.63em;
  font-weight: 400;
  line-height: 1.8em;
  text-align: justify;
}
.text ul,
.text ol {
  margin-left: 1em;
}
.text_project {
  font-size: 0.63em;
  font-weight: 400;
  width: 100%;
  line-height: 1.8em;
  text-align: justify;
}
.production_text_project {
  font-style: italic;
  font-size: 0.63em;
  font-weight: 400;
  width: 100%;
  line-height: 1.8em;
  text-align: justify;
}
.image {
  margin-bottom: 0.8em;
}
.logos {
  width: 100%;
  margin-top: 2em;
}

/* Footnotes */
.footnotes {
  font-size: 0.9em;
  line-height: 1.7em;
  margin-left: 1.2em;
  margin-top: -0.8em;
  margin-bottom: 2.5em;
}

.footnotes p {
  margin-bottom: 0.5em;
}

.footnotes hr {
  margin: .6em 0;
  height: 1px;
  background: #ddd;
  width: 103%;
  margin-left: -1.2em;
}

@media screen and (min-width: 801px) {

.text_contact,
.text {
  width: 64%;
}

}

@media screen and (max-width: 800px) and (min-width: 561px) {

.text {
  width: 100%;
}
.text_contact {
  width: 150%;
  margin-left: -13em;
}

}

@media screen and (max-width: 560px) {

.text_contact,
.text {
  width: 100%;

}

}


/* Gallery
-------------------------------------------------- */

.gallery {
  width: 101%;
  overflow: hidden;
  padding: 15px 0;
}
.gallery ul {
  width: 101%;
}
.gallery li {
  float: left;
  list-style: none;
  width: 30%;
  margin-right: 3%;
  margin-bottom: 3%;
  line-height: 0;
}
.gallery li a {
  border: 0;
}

.gallery-image {
  display: block;
  height: auto;
  margin: 0 0 20px 0;
}

.gallery-image.landscape {
  width: 100%;
  max-width: 100%;
}

.gallery-image.portrait {
  width: 70%;
  max-width: 70%;
}


/*
 :::  Fluid video ratio via Kirbytext
-------------------------------------------------- */
.video {
  position: relative;
  padding-bottom: 56.25%;
  height: auto;
  overflow: hidden;
}
  .video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }


/* MailChimp Form Embed Code - Slim - 08/17/2011
-------------------------------------------------- */


#mc_embed_signup form {display:block; position:relative; text-align:left; padding:20px 0 10px 0%}

@media screen and (max-width: 800px) and (min-width: 561px) {

#mc_embed_signup form {display:block; position:relative; text-align:left; padding:20px 0 10px 0%; margin-left: -8.5em;}

}

#mc_embed_signup h2 {font-weight:bold; padding:0; margin:15px 0; font-size:1.4em;}

#mc_embed_signup input {border:1px solid #aaa; /* -webkit-appearance:none; */ color:#424242;}

#mc_embed_signup input[type=checkbox]{-webkit-appearance:checkbox;}

#mc_embed_signup input[type=radio]{-webkit-appearance:radio;}

#mc_embed_signup input:focus {border-color:#777; color: #777;}

#mc_embed_signup .button {clear:both; background-color: #ccc; border: 0 none; border-radius:0px; color: #FFFFFF; cursor: pointer; display: inline-block; font-size:0.6em; font-weight: 400; height: 25px; line-height: 25px; margin: 0 5px 10px 0; padding:0; text-align: center; text-decoration: none; vertical-align: top; white-space: nowrap; width: auto; font-family: 'Source Sans Pro';}

#mc_embed_signup .button:hover {background-color:#aaa;}

#mc_embed_signup .small-meta {font-size: 11px;}

#mc_embed_signup .nowrap {white-space:nowrap;}

#mc_embed_signup .clear {clear:none; display:inline;}

#mc_embed_signup label {display:block; font-size:.6em; padding-bottom:5px; font-weight: 400;}

#mc_embed_signup input.email {display:block; padding:4px 0; margin:0 4% 10px 0; text-indent:5px; width:23.5em; min-width:130px;   font-family: 'Source Sans Pro';}

#mc_embed_signup input.button {display:block; width:12em; margin:0 0 10px 0; min-width:90px;}

#mc_embed_signup div#mce-responses {float:left; top:-1.4em; padding:0em .5em 0em .5em; overflow:hidden; width:90%;margin: 0 5%; clear: both;}

#mc_embed_signup div.response {margin:1em 0; padding:1em .5em .5em 0; font-weight:bold; float:left; top:-1.5em; z-index:1; width:80%;}

#mc_embed_signup #mce-error-response {display:none;}

#mc_embed_signup #mce-success-response {color:#529214; display:none;}

#mc_embed_signup label.error {display:block; float:none; width:auto; margin-left:1.05em; text-align:left; padding:.5em 0;}