/**
* Demo Stuff
*/
/*.style-1{position: relative;}*/
.container {
  text-align: left;
}
/**
* iPhone
* Credits: Flat, Scaleable CSS iPhone Illustration by Tom Hergenreter
* http://codepen.io/TomHergenreter/details/qDywF/
*/

/*.iphone__screen {
  width: 14.5em;
  height: 22.938em;
  position: absolute;
  top: 3.75em;
  left: .750em;
  overflow: hidden;
}*/
.iphone__screen {
  width: 100%;
  /*height: 100%;*/
  position: absolute;
  /*position: absolute;*/
  top:0;
  left:0;
  overflow:hidden;
  z-index:120;
}
.nav--active{position: absolute;}
.iphone__content {
 /* background-color: #D2527F;*/
  width: 100%;
  /*overflow-y: scroll;*/
 -webkit-overflow-scrolling: touch;
 /*height: 100%;*/
}
/**
* Navigation Defaults
*/
.nav {position: fixed;/*z-index: -1;*/ z-index: 20; opacity:1;-webkit-transition-property: all;transition-property: all;
-webkit-transition-duration:500ms;transition-duration: 500ms; display:none;}

.page_collection .nav,.page_product .nav{ z-index:20;display:block}
.page_home .nav{ z-index:-1;display:block}

.nav--active .nav {z-index: 20;opacity: 1;}

.nav__list {color: #000;text-align: right;width:120px;margin:20em auto 0 auto;}
.nav__list a{color: #000;}
.nav__item {font-size: 1.8em;list-style-type: none; line-height:6.5vh;}
.nav__item a:hover{/*font-family:"HelveticaNeueLTStd-Md"; font-weight:bold;*/  opacity:0.6 }
.nav ul .active a{/*font-family:"HelveticaNeueLTStd-Md"; font-weight:bold;*/  opacity:0.6}
.nav__link {
  /*text-transform: uppercase;*/
  text-decoration: none;opacity: 1;
/*  -webkit-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
    -webkit-transition-duration: 300ms;
          transition-duration: 300ms;*/
}
/*.nav__link:hover{}*/

.nav__trigger {/*display: block;*/display:none;position:fixed;width: 3em;height: 3em;right:4%;top: 1.5em;z-index: 30;opacity: 1;  padding-top: 2em;}
.page_home .nav__trigger{ display: block;}
	
.nav--active .nav__trigger { opacity: 1;}
.nav__trigger:hover{ opacity:1;}

.nav__icon {
  display: inline-block;
  position: relative;
  width: 100%;
  height: 3px;
  background-color: #FFF;
  -webkit-transition-property: background-color, -webkit-transform;
  transition-property: background-color, -webkit-transform;
  transition-property: background-color, transform;
  transition-property: background-color, transform, -webkit-transform;
  -webkit-transition-duration: 500ms;
          transition-duration: 500ms;
}
.nav__icon:before,
.nav__icon:after {
  content: '';
  display: block;
  width: 100%;
  height: 3px;
  position: absolute;
  z-index:20;
  background: #FFF;
  -webkit-transition-property: margin, -webkit-transform;
  transition-property: margin, -webkit-transform;
  transition-property: margin, transform;
  transition-property: margin, transform, -webkit-transform;
  -webkit-transition-duration: 500ms;
          transition-duration: 500ms;
}
.nav__icon:before {
  margin-top: -1em;
}
.nav__icon:after {
  margin-top: 1em;
}


.page_home .nav__icon {background-color: #FFF;}
.page_home .nav__icon:before,.page_home .nav__icon:after{background-color: #FFF;}

/* Don't nest if you don't have to. */

.nav2{width:180px;height:100%;background:#FFF;position:fixed; left:15%;top:0;z-index:-1;-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out;opacity: 0;-webkit-transform: translateX(-100%);transform: translateX(-100%);}

/*.page_product .nav2{-webkit-transform: translateX(0);transform: translateX(0); opacity:1; z-index:10;width:150px}*/
.page_product .nav2{width:150px; background:none;}

.nav2{ margin-top: 5em}
.nav2 ul{ margin-top:25em;}
.nav2 ul li {font-size: 12px;list-style-type: none; margin:10px 0;white-space:nowrap;}
.nav2 ul li:hover,.nav2 ul li .active{/*font-family:"HelveticaNeueLTStd-Md"; font-weight:bold;*/ opacity:0.6}
/**
* Style #1
*/
.style-1 .nav {opacity:1;width: 15%;left:0;height:100%;background:#FFF;-webkit-transform: translateX(0);transform: translateX(0);}

.page_home .style-1 .nav {-webkit-transform: translateX(-100%);transform: translateX(-100%);}

.style-1 .nav__link {
  opacity: 1;
/*  -webkit-transition-delay: 300ms;
          transition-delay: 300ms;*/
}
.style-1 .nav--active .nav__link {
  opacity: 1;
  
}
.style-1 .nav--active .nav {

/*    -webkit-transition-duration: 300ms;
          transition-duration: 300ms;*/
		  opacity:1;
  -webkit-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
  -webkit-transform: translateX(0);
          transform: translateX(0);
}
.style-1 .nav--active .nav__icon {
  background: rgba(0, 0, 0, 0);

}
.style-1 .nav--active .nav__icon:before {
  margin-top: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
		  background: #FFF;height: 1px;
		  
}
.style-1 .nav--active .nav__icon:after {
  margin-top: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
		  background: #FFF;height: 1px;
}


.nav .lang{ position:absolute; bottom:3%;width:92%;text-align:right;left:0;}
.nav .lang a{font-size:10px;}

@media screen and (max-width:1000px){
	.nav__list {color: #808080;text-align: center;width:100%;margin:5vh auto 0 auto;}
		


	.nav__item{}
	.style-1 .nav {width:100%;-webkit-transform: translateX(-100%);transform: translateX(-100%);}
	.nav__link { color:#000;}
	
	.nav {z-index:20;display:block; top:0;}
	.page_collection .nav,.page_product .nav{z-index: 20;display:block; background:#FFF;}
	
	
	.nav__trigger {display: block}
	.page_about .nav__trigger {display:none}
	
	.nav .lang{text-align:center;font-size:10px; bottom:2vh;}

	.nav .lang .active{/*font-family:"HelveticaNeueLTStd-Md"; font-weight:bold;*/}

	
	.nav2{width:100%;height:100%;background:#FFF;position:fixed; left:0;top:0;z-index:-1;-webkit-transition:all 500ms ease-in-out;transition:all 500ms ease-in-out;opacity: 0;-webkit-transform: translateX(-100%);transform: translateX(-100%); padding-top:4em;}
	.page_product .nav2{width:100%; padding-top:4em;}

	/*.page_product .nav2 .back,.page_collection .nav2 .back{ top:5%}*/
	.style-1 .nav--active .nav__icon:before {background-color:#000;}
	.style-1 .nav--active .nav__icon:after {background-color:#000;}
	/*.nav__icon {background-color: #808080;}
	.nav__icon:before,.nav__icon:after {background-color: #808080;}
	
	
	.style-1 .nav--active .nav__icon:before {background-color:#808080;}
	.style-1 .nav--active .nav__icon:after {background-color:#808080;}*/
	/*.sub_menu .nav__item a{ color: #666666}
	.nav--active .nav {background-color:rgba(255,255,255,0.9);}
	#index .nav--active .nav {background:none;}*/
	
	
	.nav__item ul{width: 100%; text-align: center;clear: both;overflow: hidden;}
	.nav__item ul a{margin: 0 10px; font-size: 14px;font-weight: bold; color: #000;}
	.mtopmenu{line-height: 5vh;}
	.mtopmenu a{}

}