@charset "utf-8";

span.desc {
  display: none;
}

html { height: 100% }
body {
  font-family: neue-haas-grotesk-text, Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1em;
  position: absolute;
  max-width: 1800px;
  color: #303030;
  min-height: 100%
  /*border: 10px 10px 5px 5px solid;
  border-color:#222;
  margin:0;
  padding: 0;
  width:100%;*/
}




.foot {
  position:absolute;
  min-width:350px;
  /* padding:0 0 2em 0;*/
  bottom: -100px
}


#art_acc, #prod_acc, #lect_acc  {
  padding-top:1em
}

.main {
  width:240px;
  padding-left:1em;
  font-family: neue-haas-grotesk-text, Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  border-bottom: 6px solid #222
}

.row > .i
  padding-bottom: 0.8em;
}

.sub {
  margin-left:0px
}

.content {
  position:relative;
  border: 10px 10px 5px 5px solid;
  border-color:white;
  background-color: #222;
  color:white;
  padding:0 1em 1em 1em;
  max-width:1300px;
}

.content a {
  color: white !important;
  text-decoration: underline !important;
}

.content a:hover {
  line-height: 1.4em;
  text-decoration: underline !important

}

.crop {
  height: 500px
}

.row {
  font-family: neue-haas-grotesk-text, Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.05em;
  margin:0;
  padding:0
}

#head_Production.row, #head_Lecture.row, #head_ATELIER-E.row   {
  padding-top:0.9em;
}




.subline {
  height:6px;
  background-color:#222

}

.subline_white {
  height:1px;
  padding:0;
  margin-bottom: 1.5em;
  background-color:#333

}


/* exceptions for white background carousels */
.black.arrow_l:before, .black.arrow_l:after, .black.arrow_r:before, .black.arrow_r:after, .black.close:before, .black.close:after {
background-color: black !important;
}

.black.arrow_r, .black.arrow_l, .black.close {
  opacity: 0.9 !important;
}


.tabdevide {
  width: 100%;
  height: 30px;
  background-color: white
}

.title {
  padding-top: 0.4em
}

h1 {
  font-size: 2.4em;
  line-height: 1.8em
}

h4 {
    font-size: 1.0em;
    line-height:1.4em;

}

.italic {
  font-style: italic;
}

a:hover span.desc {
  cursor: pointer;
  display: block
}

a, a:visited, a:link {
  color: black;
  text-decoration: none;
}

a:hover, a:active {
  color: black;
  text-decoration: none;
}


.contact,.contact:visited,.contact:link {
  color: black;
  text-decoration: none;
  margin: 0;
  opacity: .8;
  -webkit-opacity: .8;
  -moz-opacity: .8
}

.contact:hover, .contact:active {
  color: black;
  text-decoration: none;
  margin: 0;
  opacity: 1;
  -webkit-opacity: 1;
  -moz-opacity: 1

}





.uppercase {
  text-transform: uppercase;
  letter-spacing: 0.15em
}

.title {
  width:400px;
  float:left
}


.close {
  z-index: 10;
  position: absolute;
  right: 1em;
  top: 1em;
  width: 100px;
  height: 100px;
  opacity: 0.3;
  float:right;
  padding:0
}
.close:hover {
  opacity: 1
}
.close:before, .close:after {
  position: absolute;
  left: 50px;
  content: ' ';
  height: 100px;
  width: 2px;
  background-color: white
}
.close:before {
  transform: rotate(45deg)
}
.close:after {
  transform: rotate(-45deg)
}

/*
.carousel{
float:left
}

*/

.carousel-control {
  background: none !important;
  filter: none !important;
  progid:none !important
 }

.carousel-indicators > li,
.carousel-indicators > li.active{
    background: rgba(200,200,200,0.3);
    border:none
}

.carousel-indicators > li.active {
      background: rgba(200,200,200,1)

}





/*
.carousel-indicators > li,
.carousel-indicators > li.active{
    width: 100px;
    height: 13px;
    background: rgba(200,200,200,0.5);
    border: 0;
    border-radius: 0;
    padding: 0;
    margin:0;

}
.carousel-indicators > li.active {
padding: 0;
    margin:0;

    background: rgba(200,200,200,1);
}
*/



.arrow_blank {
  display: block;
  margin: 0;
  opacity: .8;
  -webkit-opacity: .8;
  -moz-opacity: .8
}

.arrow_blank:hover, .arrow:active  {
  opacity: 1;
  cursor: pointer;
  -webkit-opacity: 1;
  -moz-opacity: 1
}

.arrow_blank:hover:after, .arrow:active:after {
  color: #CCC;
  margin-left: 15px;
  font-style:normal;
  content: '↳'
}



.arrow {
    display: block;
    margin: 0;
    opacity: .8;
    -webkit-opacity: .8;
    -moz-opacity: .8
}

.arrow:hover, .arrow:active  {
    opacity: 1;
    cursor: pointer;
    -webkit-opacity: 1;
    -moz-opacity: 1
}

.arrow:hover:after, .arrow:active:after {
    color: #CCC;
    margin-left: 15px;
    font-style:normal;
    content: '↰'
}

.arrow.collapsed:hover:after, .arrow.collapsed:active:after  {
    color: #CCC;
    cursor: pointer;
    margin-left: 15px;
        font-style:normal;
    content: '↴'
}

.arrow_r {
  z-index: 10;
  position: absolute;
  right: 2em;
  top:50%;
  width: 70px;
  height: 70px;
  opacity: 0.5;
  float:right;
  padding:0
}

.arrow_r:hover {
  opacity: 1
}
.arrow_r:before, .arrow_r:after  {
  position: absolute;
  left: 50px;
  content: ' ';
  height: 70px;
  width: 2px;
  background-color: white
}

.arrow_r:before {
  transform: rotate(45deg)
}

.arrow_r:after {
  transform: rotate(-45deg);
  top:-48px
}

.arrow_l {
  z-index: 10;
  position: absolute;
  left: 2em;
  top:50%;
  width: 70px;
  height: 70px;
  opacity: 0.5;
  float:right;
  padding:0


}

.arrow_l:hover {
  opacity: 1
}
.arrow_l:before, .arrow_l:after  {
  position: absolute;
  right: 50px;
  content: ' ';
  height: 70px;
  width: 2px;
  background-color: white
}

.arrow_l:before {
  transform: rotate(45deg);
  top:-48px
}

.arrow_l:after {
  transform: rotate(-45deg)

}




.small_title{
font-size: 0.75em;
  font-family: neue-haas-grotesk-text, sans-serif;
  font-weight: 400;
    text-transform: uppercase;
    color: rgba(255,255,255,0.7);
    font-weight: lighter;

    letter-spacing: 0.16em

}

.desc{
  font-family: neue-haas-grotesk-text, Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;


  padding-right: 1.5em;
  padding-bottom: 1.62em;
  /*letter-spacing: 0.07em*/


}

h5 {
font-family: neue-haas-grotesk-text, sans-serif;
font-weight: 400;
font-style: normal;
}

h4{
  font-weight: 400;
  font-size: 1em;
  color: #fcfcfc !important;
}

.desc h4{
  /*font-weight: lighter;*/
  margin:0;

}
.desc_text h4{
  font-family: neue-haas-grotesk-text, Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-style: normal;

  /*font-weight: lighter;*/
  color: #fcfcfc;
  padding: 0;
  margin:0;
  line-height: 1.4em;
  /*letter-spacing: 0.07em*/

}

.desc h5 span {
  padding-bottom: 1em

}

.desc h5 {
  /*font-weight: lighter !important;*/
  letter-spacing: 0.12em;
  padding: 0;
  margin:0;
}



.cred {
  padding-bottom:1em;

  

}

.cred h4 {
    font-family: neue-haas-grotesk-text, Helvetica, Arial, sans-serif !important; 
}



/* MOBILE  SMALLEST CONFIGURATION */
@media (max-width: 600px) {


  .desc_text{
    letter-spacing: 0;

  }

  .black.close:before, .black.close:after {
  background-color: white !important
  }

  .black.close {
    opacity: 0.5 !important
  }

  .vim {
    top:2.5em;
    padding-bottom: 1em;
  } 

  .close {
    top: -2.1em;
    width: 40px;
    height: 40px

  }

  .close:before, .close:after {
    z-index: 100 !important;
    left: 40px;
    height: 40px

  }

  .arrow_l {
    top: calc(50% - 15px);
    width: 30px;
    height: 30px;
    left: 1em
  }

  .arrow_l:before, .arrow_l:after {
    left: 0px;
    height: 30px
  }

  .arrow_l:before {
    top:-20px
  }



  .arrow_r {
        top: calc(50% - 15px);
    width: 30px;
    height: 30px;
    right: 1em
  }

  .arrow_r:before, .arrow_r:after {
    left: 25px;
    height: 30px
  }

.arrow_r:after {
    top:-20px
  }




  h1{
    font-size: 1.5em;
    line-height: 1.6em
  }

  h2{
    font-size: 1.1em
  }

  h3, h4{
    font-size: 0.9em
  }

  .title {
    padding-top:1em;
    width: calc(100vw - 100px)
  }

  .content {
    padding: 1em;
  }

  .sub {
    padding-left: 1em;
  }

}








/* Tablet */

@media (min-width: 601px) and (max-width: 1169px) {

  .sub{
    padding-left:1em
  }

  .content {
    padding:1em
  }

  .close {
    top: 0.3em;
    right: 0.3em
  }

  .arrow_l {
    left: 1em
  }

  .arrow_r {
    right: 1em
  }

  .desc_text{
    letter-spacing: 0;

  }


}

/* Smaller Desktop */
@media (min-width: 1170px) and (max-width: 1359px)   {
  .sub {
    margin-left: 240px;
    padding-left: 0;
  }

  .subline {
    margin-left: 240px
  }

  .content {
    margin-left:480px;
    width: calc(100vw - 480px);
    padding:2em 2.1em 2em 2.1em
  }

  .close {
    top:0;
    right:0
  }

  h4 {
    font-size: 1.0em;
  }

  .desc_text{
    letter-spacing: 0;

  }

}

/* LARGE DEVICE */
@media (min-width: 1360px) {
  .sub {
    margin-left: 240px;
    padding-left: 0
  }

  .subline {
    margin-left: 240px
  }

  .content {
    margin-left:480px;
    width: calc(100vw - 480px);
    padding:2em 2.1em 2em 2.1em;

  }

  .desc_text{
    letter-spacing: 0;

  }


}




/* Bootstrap Crap */
.col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xs, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
  min-height:0px;

}