*{
	outline:none;
}

@font-face {
  font-family: 'Aksidenz';
  src: url('../fonts/akzidenzgrotesk-light-webfont.eot'); /* IE9 Compat Modes */
  src: url('../fonts/akzidenzgrotesk-light-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/akzidenzgrotesk-light-webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/akzidenzgrotesk-light-webfont.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/akzidenzgrotesk-light-webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/akzidenzgrotesk-light-webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

ul,li{
		margin:0px;
		padding:0px;
}

a{
	text-decoration:none;
	color:#000;
}

html{
	height:100%;
}

body{
	font-family: 'Aksidenz';
	margin:0px;
	background-color:#f7f6ec;	
	height:100%;
	font-size:14px;
	color:#000;
	letter-spacing:0.7px;
}

p{
	margin:8px 0px;
	font-size:14px;
	line-height:16px;
}

.container{
	height:100%;
	display:table;
	vertical-align:middle;
	margin:0px auto;
	max-width:1408px;
	padding:48px 16px;
}

.container-voir{
	vertical-align:middle;
	margin:0px auto;
	padding:48px 0px;
}

.frame-container{
	display:table-cell;
	vertical-align:middle;
}

.frame-container-voir{
	vertical-align:middle;
}

.white-frame{
	width:328px;
	height:448px;
	background-color:#FFF;
	display:none;
	padding:16px;
}

.clear{
	clear:both;
	height:0px;
	line-height:0px;
}

.menu{
	position:fixed;
  width:100%;	
	display:none;
	z-index:1000;
}

nav{
	/*max-width:1408px;*/
	padding:16px;
	margin:0px auto;
}

nav>ul{
	width:100%;
	display:table;
}

nav>ul>li{
	display:table-cell;
	width:25%;
	list-style:none;
	list-style-type:none;
	position: relative;
}

nav>ul>li:nth-child(2), nav>ul>li:nth-child(3) {
  text-align:center;
}

nav>ul>li:nth-child(4) {
  text-align:right;
}

nav>ul>li>ul>li{
	line-height:20px;
}

nav>ul>li>ul.dropdown{
	min-width: 125px; /* Set width of the dropdown */
	display: none;
	position: absolute;
	z-index: 999;
	left: 0;
	right: 0px;
	padding-top:4px;
	padding-left:26px;
}

nav ul li:hover ul.dropdown{
	display: block; /* Display the dropdown */
}

nav ul li ul.dropdown li{
	display: block;
}

.controls{
	text-align:right;
	display:none;
}

.up, .down{
	margin:0px 16px;
	cursor:pointer;
	line-height:40px;
}

.typical{
	position:absolute;
	bottom:16px;
	left:16px;
	font-size:10px;
}

.slider-item-text{
	margin:0px auto; width:360px;margin-top:16px;
}

.slider-item-text-1{
	width:120px; float:left; text-align:left
}

.slider-item-text-2{
	width:240px;margin:0px auto; float:left; text-align:left
}


/*------MEDIA QUERIES------*/
@media (max-width: 632px) {
	nav>ul>li>ul.dropdown{
		padding-left:20px;
	}
}

@media (max-width: 580px) {
	.menu{
		position:absolute;
	}	
	nav{
		max-width:360px;	
	}
	nav>ul>li{
		display:block;
		width:100%;
	}
	nav>ul>li:nth-child(1n){
		text-align:left;
	}	
	nav>ul>li>ul.dropdown{
		left: 70px;
		top:0px;
	}
	nav li{
		line-height:20px;
	}
	.container{
		padding:110px 16px;
	}
	.container-voir{
		padding:110px 16px;
	}	
}

@media (max-width: 408px) {
	p{
		margin:4px 0px;
		font-size:12px;
		line-height:14px;
		letter-spacing:0.50px;
	}
	nav{
		max-width: 320px;
		padding:16px 0px;
	}	
	.container{
		width:100%;
		padding-left:0px;
		padding-right:0px;
	}
	.container-voir{
		width:100%;
		padding-left:0px;
		padding-right:0px;
	}	
	.frame-container{
		width:100%;
		padding:0px 16px;
	}
	.frame-container-voir{
		width:100%;
		padding:0px 0px;
	}	
	.white-frame{
		width:288px;
		height:384px;
		margin:0px auto;		
	}
	.slider-item-text{
		width:288px;
	}
	.slider-item-text-1{
		width:88px;
	}
	.slider-item-text-2{
		width:200px;
	}	
	.slick-slide img{	
		width:288px;
		height:384px;	
	}
}

@media (max-width: 368px) {
	.frame-container{
		padding: 0px 8px;
	}	
	.frame-container-voir{
		padding: 0px 0px;
	}		
}

@media (max-width: 352px) {
	.frame-container, .frame-container-voir{
		padding:0px;
	}	
	body{
		font-size:13px;
		line-height:15px;
		letter-spacing:0.65px;
	}	
	p{
		letter-spacing:0.40px;
	}	
}

@media (max-width: 332px) {
	.white-frame{
		width:272px;
		height:370px;
		margin:0px auto;		
	}	
	.slider-item-text{
		width:272px;
	}
	.slider-item-text-1{
		width:72px;
	}
	.slider-item-text-2{
		width:200px;
	}		
	.slick-slide img{	
		width:272px;
		height:370px;	
	}	
	nav{
		max-width:300px;
	}		
}



@media (max-width: 640px and orientation: landscape){
	body {
			-webkit-transform: rotate(-90deg);
			-moz-transform: rotate(-90deg);
			-o-transform: rotate(-90deg);
			-ms-transform: rotate(-90deg);
			transform: rotate(-90deg);
	}
	nav{
		max-width:288px;
	}	
	.container, .container-voir{
		width:100%;
		padding-left:0px;
		padding-right:0px;
	}
	.frame-container, .frame-container-voir{
		width:100%;
		padding:0px 16px;
	}	
	.white-frame{
		width:288px;
		height:384px;
		margin:0px auto;		
	}	
	.slick-slide img{	
		width:288px;
		height:384px;	
	}	
	.scrollable{
		width:288px;
		height:384px;
		margin:0px auto;	
		background-color:#FFF;
		overflow: hidden;
		position: relative;
	}	
}