@font-face {
	font-family: 'Lars-RegularExtended';
	src: url('fonts/Lars-RegularExtended.eot');
	src: local('☺'), url('fonts/Lars-RegularExtended.woff') format('woff'), url('fonts/Lars-RegularExtended.ttf') format('truetype'), url('fonts/Lars-RegularExtended.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Lars-ThinExtended';
	src: url('fonts/Lars-ThinExtended.eot');
	src: local('☺'), url('fonts/Lars-ThinExtended.woff') format('woff'), url('fonts/Lars-ThinExtended.ttf') format('truetype'), url('fonts/Lars-ThinExtended.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Lars-LightExtended';
	src: url('fonts/Lars-LightExtended.eot');
	src: local('☺'), url('fonts/Lars-LightExtended.woff') format('woff'), url('fonts/Lars-LightExtended.ttf') format('truetype'), url('fonts/Lars-LightExtended.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'SctoGroteskARegular';
	src: url('fonts/SctoGroteskARegular.eot');
	src: local('☺'), url('fonts/SctoGroteskARegular.woff') format('woff'), url('fonts/SctoGroteskARegular.ttf') format('truetype'), url('fonts/SctoGroteskARegular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}




body {
    font-size: 1vw;
}


html, body{
    margin: 0;
}

body, select, input, textarea {
    color: #333;
    font-family: 'SctoGroteskARegular';
}

a {color: #333; text-decoration: none; outline: none;}
a:hover{  }

::-moz-selection{background: transparent; color: #fff; text-shadow: none;}
::selection {background: transparent; color: #fff; text-shadow: none;}

a:link {-webkit-tap-highlight-color: #0080ff;}

ins {background-color: #0080ff; color: #333; text-decoration: none;}
mark {background-color: #0080ff; color: #333; font-style: italic; font-weight: bold;}

input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }
f



.clearafter:after{
    display: table;
    content: '';
    clear: both;
}

img{
    display: block;
}

.text-center{
    text-align: center;
}


.cta-1.mobile,
.cta-2.mobile{
	display: none;
}



header{
    display: none;
}




/*****************************************/
#password-intro {
    background-color: #121212;
    height: 100vh;
    width: 100vw;
    position: fixed;
    left: 0;
    top: 0;
    text-align: center;
    color: #fff;
    z-index: 999;
}
.intro-footer {
    font-size: 0.65vw;
    position: fixed;
    bottom: 10px;
    left: 0;
    width: 100%;
    font-family: sans-serif;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 0 10px;
    box-sizing: border-box;
    line-height: 1.4em;
}
.intro-footer a {
    color: #fff;
}
.intro-footer .left {
    line-height: 1.4em;
    text-align: left;
}
.intro-footer .right {
    line-height: 1.4em;
    text-align: right;
}
#password-intro input[type="text"].introtext {
/*    letter-spacing: 1vw;*/
    letter-spacing: 0.1em;
}
#password-intro input[type="text"] {
    color: #fff;
    width: 100%;
    border: 0;
    font-size: 3.5vw;
    background-color: transparent;
    text-align: center;
    outline-color: #333 !important;
    margin-top: 34vh;
    text-transform: uppercase;
    font-family: 'SctoGroteskARegular';
    
}

#password-intro input[type="text"]{
   color: transparent;
   text-shadow: 0px 0px 0px #fff;
   outline: none !important;
}

#password-intro input[type="text"].blink {

    -webkit-animation: 1s blink step-end infinite;
    -moz-animation: 1s blink step-end infinite;
    -ms-animation: 1s blink step-end infinite;
    -o-animation: 1s blink step-end infinite;
    animation: 1s blink step-end infinite;

}

@keyframes "blink" {
  from, to {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}
@-moz-keyframes blink {
  from, to {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}
@-webkit-keyframes "blink" {
  from, to {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}
@-ms-keyframes "blink" {
  from, to {
    opacity: transparent;
  }
  50% {
    opacity: 0;
  }
}
@-o-keyframes "blink" {
  from, to {
    opacity: transparent;
  }
  50% {
    opacity: 0;
  }
}




/*
-------------------------------------------------------------------------------*/
#action-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 900;
    text-align: center;
}
.cta-1, .cta-2{
	padding: 10px 5px;
	box-sizing: border-box;
    font-size: 1.6vw;
    line-height: 1.6vw;
    font-family: 'SctoGroteskARegular';
    text-align: center;
}

.password-field{
    text-transform: uppercase;
    font-family: 'SctoGroteskARegular';
    font-size: 0.76vw;
}
.cta-1{
	padding-left: 20px;
}
.cta-2{
	padding-right: 20px;
}
.cta-1.mobile,
.cta-2.mobile{
	display: none;
}
.cta-1.desktop,
.cta-2.desktop{
	display: block;
}
.progress-dot {
    height: 0.5vw;
}



/*****************************************/
.section{
    width: 100vw;
    overflow-x: scroll !important;
    overflow-y: hidden;
}
.section .descrizione{
/*
    background-size: 20vw 20vh;
  background-image: radial-gradient(circle, #000000 1px, rgba(0, 0, 0, 0) 1px);
    background-image: linear-gradient(to right, grey 1px, transparent 1px), linear-gradient(to bottom, grey 1px, transparent 1px);
*/
}

.section-intro .descrizione{
     width: 2010vw;
}
.descrizione{
    width: 3000vw;
    width: 10000vw;
    overflow: hidden;
    text-overflow: clip;
    white-space: nowrap;
    
}


.space{
    width: 50vw;
    display: inline-block;
}
.slide-full.text-center {
    float: left;
}

.section-1 .descrizione,
.section-2 .descrizione,
.section-3 .descrizione,
.section-4 .descrizione,
.section-5 .descrizione,
.section-6 .descrizione,
.section-7 .descrizione,
.section-8 .descrizione{
    font-size: 4vw;
}
    .section-3 .descrizione,
    .section-4 .descrizione,
    .section-5 .descrizione,
	.section-6 .descrizione,
	.section-7 .descrizione{
		width: 10000vw;
	}

.section-intro .descrizione{
/*    font-size: 12vw;*/
    font-size: 4vw;
}

.slide-full{
    width: 100vw;
}

.content{
/*
    height: calc(100vh - 25px);
    float: left;
*/
}


.service-footer{
    font-size: 0.76vw;
    position: fixed;
    bottom: 10px;
    left: 0;
    width: 100%;
    text-align: center;
    font-family: sans-serif;
    font-weight: bold;
}


/* WORKS
****************************************************************/
body.works{
    background-color: #f00;
    color: #000;
}

.cta-1, .cta-2 {
/*    padding: 35px 0 0 0 !important;*/
    padding: 20px 0 0 0 !important;
    padding: 5px 0 0 0 !important;
}
.works .slick-slider {
    display: block;
    box-sizing: border-box;
    width: 60vw;
    margin-left: auto;
    margin-right: auto;
}
.works .claim {
    position: fixed;
    color: #f00;
    top: 48.5vh;
    width: 40vw;
    font-size: 1.6vw;
    z-index: 900;
    text-align: center;
    left: 30vw;
}
.works .slider{
    padding: 10px;
    cursor: none !important;
}
.works .single-slide.slick-slide {
    height: calc(100vh - 20px);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    outline: none;
}

.works .slick-prev {
    display: none !important;
}
.works .slick-next {
    width: 100%;
    height: 100%;
    right: 0 !important;
    cursor: none !important;
    z-index: 999 !important;
}
.works .slick-next:before {
    display: none;
}


.works .navigator {
    position: fixed;
    text-align: center;
    left: 50vw;
    top: 48vh;
    z-index: 1000;
    color: #f00;
    font-weight: bold;
    cursor: none !important;
}
.works .slidenumber {
    border: 2px solid #f00;
    border-radius: 5vw;
    height: 3.5vw;
    width: 3.5vw;
    line-height: 3.5vw;
}
.works .slidenumber span {
    padding-right: 1vw;
}

.works .service-footer {
    bottom: 20px;
}
    
    


/* RESEARCH
****************************************************************/

.research .moodboard-wrapper {
    text-align: center;
    margin-top: calc(1.6vw + 30px);
    margin-bottom: 2vw;
}
.research .moodboard-wrapper img {
    display: inline-block;
    vertical-align: bottom;
    margin: 5px;
}

.research .moodboard-wrapper img.size-1 { width: 400px; }
.research .moodboard-wrapper img.size-2 { width: 650px; }
.research .moodboard-wrapper img.size-3 { width: 900px; }





/* rimowa
****************************************************************/

.rimowa {
    background-color: #000;
}

.rimowa .video-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #000;
    display: flex;
    flex-direction: column;
    justify-content: center;
        z-index: 999;
}
.rimowa .video-wrapper video {
    display: block;
    width: 100%;
}
.rimowa .slick-dotted.slick-slider {
        margin-bottom: 0 !important;
    }
.rimowa .video-wrapper .unmute {
    cursor: pointer;
    position: fixed;
    bottom: 10px;
    text-align: center;
    width: 100%;
    color: #fff;
    font-size: 0.76vw;
    text-transform: uppercase;
}
.rimowa .video-wrapper .unmute span {
    margin: 0 5vw;
}

.rimowa .slider-wrapper .sliding-element.slick-slide {
    height: 100vh;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    outline: none;
}

.rimowa .slider-wrapper ul.slick-dots {
    margin-top: -4vw;
    position: absolute;
        bottom: inherit;
}

.rimowa .slider-wrapper .slick-dots li button {
    background-color: transparent;
    border-radius: 3vw;
    border: 1px solid #333;
    height: 10px;
    width: 10px;
}
.rimowa .slider-wrapper .slick-dots li.slick-active button {
    background-color: #333;
}
.rimowa .slider-wrapper .slick-dots li button:before {
    display: none !important;
}



.rimowa .text-slide {
    text-align: center;
}
.rimowa .text-slide.sliding-element {
    display: flex;
    align-items: center;
}
.rimowa .text-slide.sliding-element.slick-slide {
    justify-content: center;
}
.rimowa .text-slide.sliding-element .text-content {
    padding: 0 10%;
    color: #fff;
    font-size: 0.8vw;
}

.rimowa .slick-prev {
    left: 0;
    width: 40%;
    height: 80%;
    display: flex;
    align-items: center;
    z-index: 9000;
}

.rimowa .slick-next {
    right: 0;
    width: 40%;
    height: 80%;
    display: flex;
    align-items: center;
    z-index: 9000;
}

.rimowa .slick-prev:before,
.rimowa .slick-next:before {
    display: none !important;
}

.rimowa .slider-wrapper .slick-prev.slick-disabled,
.rimowa .slider-wrapper .slick-next.slick-disabled {
    display: none !important;
}



/****/

.new #intro-text {
    color: #fff;
    font-size: 0.8vw;
    font-family: 'SctoGroteskARegular';
    top: 0;
    position: fixed;
    height: calc(50vh - 10vw);
    overflow-y: scroll;
    padding: 10px;
    text-align: left;
    padding: 10px 20vw;
    
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.new #intro-text::-webkit-scrollbar {
  width: 0;
}
.new #intro-text * {
    color: #fff !important;
       text-align: left;
}




/* NEW HOME
****************************************************************/
body.hfs {
    background-color: #000;
}
.hfs .slider-wrapper .sliding-element.slick-slide {
    height: 100vh;
    background-position: center;
    background-size: auto 100%;
    background-repeat: no-repeat;
    outline: none;
}

.hfs .slider-wrapper ul.slick-dots {
    margin-top: -4vw;
    position: absolute;
        bottom: inherit;
}

.hfs .slider-wrapper .slick-dots li {
    width: initial;
    height: initial;
    margin: 0 8px;
}

.hfs .slider-wrapper .slick-dots li button {
    background-color: transparent;
    border-radius: 3vw;
    color: red;
    border: 1px solid #333;
    height: 10px;
    width: 10px;
}
.hfs .slider-wrapper .slick-dots li.slick-active button {
    background-color: #333;
}
.hfs .slider-wrapper .slick-dots li button:before {
    display: none !important;
}

.hfs .slick-prev {
    left: 0;
    width: 40%;
    height: 80%;
    display: flex;
    align-items: center;
    z-index: 9000;
}

.hfs .slick-next {
    right: 0;
    width: 40%;
    height: 80%;
    display: flex;
    align-items: center;
    z-index: 9000;
}

.slick-prev:before,
.slick-next:before {
    display: none !important;
}

.hfs .slider-wrapper .slick-prev.slick-disabled,
.hfs .slider-wrapper .slick-next.slick-disabled {
    display: none !important;
}


.hfs .text-slide {
    text-align: center;
}
.hfs .text-slide.sliding-element {
    display: flex;
    align-items: center;
}
.hfs .text-slide.sliding-element.slick-slide {
    justify-content: center;
}
.hfs .text-slide.sliding-element .text-content {
    padding: 0 10%;
}









/* 
****************************************************************/

/* width */
.section::-webkit-scrollbar {
    display: none;
  width: 10px;
}

/* Track */
.section::-webkit-scrollbar-track {
}
 
/* Handle */
.section::-webkit-scrollbar-thumb {
  background: #000; 
}

/* Handle on hover */
.section::-webkit-scrollbar-thumb:hover {
  background: #000; 
}


.col-md-1-8{
    width: 12.5%;
    float: left;
}





/*********/








@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
      .intro-footer {
          bottom: 20px;
      }
    .service-footer {
        bottom: 20px;
    }
}

@media only screen 
    and (device-width : 375px) 
    and (device-height : 812px) 
    and (-webkit-device-pixel-ratio : 3) { 

      .intro-footer {
          bottom: 20px;
      }
    .service-footer {
        bottom: 20px;
    }
}


@media only screen and (min-device-width: 375px) and (max-device-height: 812px) and (-webkit-device-pixel-ratio: 3) {

      .intro-footer {
          bottom: 20px !important;
      }
    .service-footer {
        bottom: 20px !important;
    }
}


@media screen and (max-width: 960px) {
	.cta-1.mobile,
	.cta-2.mobile{
		display: block;
	}
    .cta-1.desktop,
	.cta-2.desktop{
		display: none;
	}
    
    .cta-1.mobile {
        font-size: 4vw;
        line-height: 4vw;
    }
    
    .intro-footer {
	    font-size: 2vw;
	    padding: 10px;
	    padding-bottom: 0;
	    box-sizing: border-box;
        flex-direction: column;
	}
    .intro-footer .left,
    .intro-footer .right {
        text-align: center;
    }

    
    .password-field{
        font-family: 'SctoGroteskARegular' !important;
        letter-spacing: 0px !mportant;
        font-size: 3vw;
    }

    
    .section{
        -webkit-overflow-scrolling: touch;
    }
    .section-intro .descrizione,
    .descrizione{
        width: 3000vw;
    }
    .section-3 .descrizione,
	.section-4 .descrizione{
		width: 10000vw;
	}
    .section .descrizione {
        box-sizing: border-box;
    }
    .section-5 .descrizione {
        width: 100vw !important;
    }

    
	
	#password-intro input[type="text"] {
        font-size: 3.3vw;
		caret-color: transparent !important;
	}

	.service-footer {
	    font-size: 2vw;
	    position: fixed;
	}
	


	#password-intro{
		box-sizing: border-box;	
	}
	#passwordinput{
		width: 95% !important;
	}
    
    
    
    
    /* NEW
    ******************************************************************/
    
    .new #intro-text {
        font-size: 2.5vw;
        height: calc(40vh - 10vw);
        padding: 10px;
    }
        
    .rimowa .video-wrapper .unmute {
        font-size: 3vw;
    }
    .rimowa .video-wrapper video {
        margin-bottom: 30vw;
    }
        
    .rimowa .slick-dotted.slick-slider {
        margin-bottom: 0;
    }
    .rimowa .slider-wrapper ul.slick-dots {
        margin-top: -5vw;
    }
    
    .rimowa .text-slide.sliding-element .text-content {
        padding: 0 10%;
        font-size: 3vw;
    }

    
    /* WORKS
    ******************************************************************/
    .works .slick-slider{
        width: 100%;
        padding: 22vh 10px;
        padding-bottom: 0;
    }
    

    .works .claim {
        top: 46vh;
        width: 100%;
        font-size: 3.9vw;
        left: 0;
    }

    .works .cta-1,
    .works .cta-2 {
        padding: 20px 0 0 0 !important;
    }
    .works .navigator {
        left: 44vw;
        top: calc(20px + 4vw + 20px);
        color: #000;
        font-size: 3.5vw;
        font-weight: inherit;
    }
    
    .works .single-slide.slick-slide{
        height: calc(50vh);
    }
    
    .works .slidenumber {
        border: 1px solid #000;
        border-radius: 12vw;
        height: 12vw;
        width: 12vw;
        line-height: 12vw;
    }
    .works .slidenumber span {
        padding-right: 3vw;
    }
    
    .works .slick-next {
        display: none !important;
    }
    
    
    /* RESEARCH
    ******************************************************************/
    .research .moodboard-wrapper {
        padding-left: 10px;
        padding-right: 10px;
        margin-top: calc(5vw + 30px);
        margin-bottom: 5vw;
    }
    .research .moodboard-wrapper img {
        width: 100%;
        height: auto;
        margin: 0 0 10px 0;
    }
    
    .research .moodboard-wrapper img.size-1 { width: 100%; }
    .research .moodboard-wrapper img.size-2 { width: 100%; }
    .research .moodboard-wrapper img.size-3 { width: 100%; }

    
    
    
    


    
    
    

}