/* GRID */


/* 0-599 SMARTPHONES   /// iPhone6 375x667 / iPhone5 320x568 + 568x620
------------------------------------------------------------------------------------------------------ */

.grid-fix {
	width: 100%;
	margin: auto;
}

.grid-fix.narrow {
	max-width: 1280px;
}

.grid {
	-webkit-box-sizing: border-box;
  	-moz-box-sizing: border-box;
  	box-sizing: border-box;	
	display: block;
}

.grid:after {
	content: "";
	display: table;
	clear: both;
}

.grid.content {
	margin-left: -2px;
}

.grid.covers {
	margin-left: -1px;
	background-color: #f8f8f8;
}

.item {
	position: relative;
	float: left;
	overflow: hidden;
	display: block;
}

.content .item {
	width: 50%;
	border-left: 2px solid rgba(0,0,0,0);
	border-bottom: 2px solid rgba(0,0,0,0);
}

.content .item.full,
.covers .item.full {
	width: 100%;
}

.content .item.bigborder {
	border-bottom: 16px solid rgba(0,0,0,0);
}

.covers .item {
	width: 50%;
	border-left: 1px solid rgba(0,0,0,0);
	border-bottom: 1px solid rgba(0,0,0,0);
}

.covers.layout-2 .item {  
    width: 100%;
}

.covers.layout-3 .item {  
    width: 100%;
}

.slider .item {
	width: 100%;
}
	

/* #1 LAYER IMAGE */

.item img {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	z-index: 1;
	-webkit-transition: transform .2s linear;
    transition: transform .2s linear;
}

.slider .item .layer-img {
	-webkit-box-sizing: content-box;
  	-moz-box-sizing: content-box;
	box-sizing: content-box;
	width: 100%;
	height: 0;
  	padding-bottom: 55%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	z-index: 1;
}

.slider .item #gallcover,
.slider .item #modelcover {
	-webkit-transition: transform .2s linear;
    transition: transform .2s linear;
}

.slider .item .layer-img.hor {
    padding-bottom: 66%;
    background-image: url(../covers/001-cover-wide-blank.jpg);
}

.slider .item .layer-img.ver {
  	padding-bottom: 120%;
    background-image: url(../covers/001-cover-issue-blank.jpg);
}

.slider .item .layer-img.hor.alt {
    background-image: url(../covers/002-cover-wide-blank.jpg);
}

.slider .item .layer-img.ver.alt {
    background-image: url(../covers/002-cover-issue-blank.jpg);
}

.slider .item .layer-img.hor.model {
    background-image: url(../models/Milla/000-cover-wide-blank.jpg);
}

.slider .item .layer-img.ver.model {
    background-image: url(../models/Milla/000-cover-model-blank.jpg);
}


/* #2 LAYER SHADOW */

.item .layer-shadow {
	position: absolute;
	overflow: hidden;
	width: 100%;
	height: 100%;
	padding: 0;
	top: 0;
	left: 0;
	z-index: 3;

    background:-webkit-linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 40%);
    background:-o-linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 40%);
    background:-moz-linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 40%);
    background:linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 40%);
}


/* #3 LAYER CONTENT */

.item .layer-text {   
	position: absolute;
	display: block;
	width: 100%;
	margin: 0;
	z-index: 4; 
	bottom: 0;
	padding: 0 20px 20px 20px;
}

.slider .item .layer-text {   
	padding: 0 32px 32px 32px;
}

.content .item .layer-play-button {   
	position: absolute;
	display: block;
	width: 100%;
	margin: 0;
	z-index: 4; 
	height: 100%;
}


/* #4 LAYER LINK */

.item a {   
	position: absolute;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	z-index: 5;
}


/* TEXT */

.item h3,
.item h4 {
	color: #fff;
	text-align: center;
	font-weight: normal;
    text-transform: uppercase;
	opacity: 1;
	margin: 0 auto;
	padding: 0;
    border: 0;
    max-width: 1024px;
}

.item h3 {
	font-family: "ProximaNova-Extrabld", serif;
	font-size: 17px;
	line-height: 16px;
	letter-spacing: -0.5px;
	word-spacing: -1px;
	padding-bottom: 0px;
    border-top: 2px solid rgba(255,255,255,0.00);
    border-bottom: 2px solid rgba(255,255,255,0.00);
}

.item h4 {
	font-family: "ProximaNova-Medium", serif;
	font-size: 10px;
	line-height: 12px;
	letter-spacing: 0px;
	word-spacing: -1px;
    border-top: 3px solid rgba(255,255,255,0.00);
    border-bottom: 1px solid rgba(255,255,255,0.00);
}

.content .item h3,
.content .item h4 {
	text-align: right;
    max-width: inherit;
}

.slider .item h3 {
	font-size: 36px;
	line-height: 32px;
	letter-spacing: -0.5px;
	word-spacing: -1px;
	padding-bottom: 4px;
    border-top: 0px solid rgba(255,255,255,0.00);
    border-bottom: 0px solid rgba(255,255,255,0.00);
}

.slider .item h4 {
	font-size: 16px;
	line-height: 32px;
	letter-spacing: 0px;
	word-spacing: -1px;
    border-top: 2px solid rgba(255,255,255,0.00);
    border-bottom: 3px solid rgba(255,255,255,0.00);
}


/* VERTICAL-ALIGN CONTENT */

.item .tab {	
	display: table;
  	table-layout: fixed;
    position: relative;	
    width: 100%;
	height: 100%;
}

.item .tab-cell {
    display: table-cell;
	text-align: center;
	vertical-align: middle;
}

.item .tab-content {
    position: relative;
	width: 100%;
	margin: 0 auto;	
}

.content .play-button {
  width: 56px;
  height: 56px;
  background-color: rgba(17,17,17,0.7);
  margin: auto;
}

.content svg.play {
  width: 56px;
  height: 56px;
}


/* VIDEO COVER */

.covers .item .vbgr,
.content .item .vbgr {
    position: absolute;
	overflow: hidden;
	width: 100%;
	height: 100%;
	padding: 0;
	top: 0;
	left: 0;
	z-index: 2;
}

.covers .item .vbgr video,
.content .item .vbgr video {
    width: 100%;
	height: 100%;
    background-size: cover;
    -webkit-transition: transform .2s linear;
    transition: transform .2s linear;
}

.covers .item .vbgr video::-webkit-media-controls,
.content .item .vbgr video::-webkit-media-controls {
    display: none !important;
}

.covers .item .vbgr video::-webkit-media-controls-panel,
.content .item .vbgr video::-webkit-media-controls-panel {
    display: none !important;
    -webkit-appearance: none;
}

.covers .item .vbgr video::-webkit-media-controls-start-playback-button,
.content .item .vbgr video::-webkit-media-controls-start-playback-button {
    display: none !important;
    -webkit-appearance: none;
}



/* 600-1200 TABLETS   /// iPhone6 667x375 / iPad2 768x1024 + 1024x768
------------------------------------------------------------------------------------------------------ */
@media screen and (min-width: 600px) {

.covers .item {
	width: 33.333%;
}
    
.covers.layout-2 .item {  
    width: 50%;
}
    
.covers.layout-3 .item {  
    width: 50%;
}
    
.content.cams .item {  
    width: 33.333%;
}
    
}


/* 1200-2080 DESKTOP   /// MacBookPro 1680x1050
------------------------------------------------------------------------------------------------------ */
@media screen and (min-width: 1200px) {
	
.covers .item {
	width: 25%;
}

.covers.layout-1 .item {  
    width: 25%;
}
    
.covers.layout-1 .item:nth-child(6n+1) {  
    width: 50%;
    clear: both;
}
    
.covers.layout-1 .item:nth-child(6n-2) {  
    width: 50%;
    float: right;
}
    
.covers.layout-2 .item {  
    width: 33.333%;
}
 
.covers.layout-3 .item {  
    width: 33.333%;
}
    
.covers.layout-3 .item:nth-child(6n+1) {  
    width: 66.666%;
    float: left;
    clear: both;
}
    
.covers.layout-3 .item:nth-child(6n-2) {  
    width: 66.666%;
    float: right;
}
    
.content .item.bigborder {
	border-bottom: 32px solid rgba(0,0,0,0);
}

.item .layer-text {   
	bottom: 0;
	padding: 0 36px 36px 36px;
    opacity: 0;
}
    
.content .item .layer-text {   
	padding-right: 44px;
    opacity: 1;
}
    
.covers .item:hover .layer-text {
	opacity: 1;
}
    
.slider .item .layer-text {   
    opacity: 1;
    padding: 0 72px 72px 72px;
}
    
.slider .item .layer-img.hor,
.slider .item .layer-img.ver {
    padding-bottom: calc(100vh - 96px - 48px);
}
    
.item h3 {
	font-family: "ProximaNova-Extrabld", serif;
	font-size: 36px;
	line-height: 32px;
	letter-spacing: -0.5px;
	word-spacing: -1px;
	padding-bottom: 4px;
    border-top: 0px solid rgba(255,255,255,0.00);
    border-bottom: 0px solid rgba(255,255,255,0.00);
}

.item h4 {
	font-family: "ProximaNova-Medium", serif;
	font-size: 16px;
	line-height: 32px;
	letter-spacing: 0px;
	word-spacing: -1px;
    border-top: 2px solid rgba(255,255,255,0.00);
    border-bottom: 2px solid rgba(255,255,255,0.00);
}
    
.slider .item h3 {
	font-size: 72px;
	line-height: 64px;
	letter-spacing: -0.5px;
	word-spacing: -1px;
	padding-bottom: 8px;
    border-top: 3px solid rgba(255,255,255,0.00);
    border-bottom: 1px solid rgba(255,255,255,0.00);
}

.slider .item h4 {
	font-size: 32px;
	line-height: 64px;
	letter-spacing: 0px;
	word-spacing: -1px;
    border-top: 1px solid rgba(255,255,255,0.00);
    border-bottom: 3px solid rgba(255,255,255,0.00);
}

.covers .item .layer-shadow {   
	opacity: 0;
}
    
.covers .item:hover .layer-shadow {   
	opacity: 1;
}	
    
.covers .item:hover img,
.covers .item:hover .vbgr video,
.content .item.video:hover img,
.slider .item:hover #gallcover,
.slider .item:hover #modelcover {
	-ms-transform:scale(1.04);
	-webkit-transform:scale(1.04);
	transform:scale(1.04);
}

.content .play-button {
  width: 96px;
  height: 96px;
}
    
.content .item:hover .play-button {
  background-color: rgba(17,17,17,0.9);
}
    
.content svg.play {
  width: 96px;
  height: 96px;
}
	  
}


/* 2080+ BIG DESKTOP   /// iMac Retina 2560x1440
------------------------------------------------------------------------------------------------------ */
@media screen and (min-width: 2080px) {

.grid-fix.narrow {
	max-width: 1440px;
}
    
.covers .item {
    width: 20%;
}
    
.covers.layout-1 .item {  
    width: 20% !important;
    clear: inherit !important;
    float: left !important;
}
    
.covers.layout-1 .item:nth-child(24n+1) {  
    width: 40% !important;
}
    
.covers.layout-1 .item:nth-child(24n-8) {  
    width: 40% !important;
    float: right !important;
}
    
.covers.layout-1 .item:nth-child(12n+8) {  
    clear: both !important;
}
	
}


/* ADJUSTMENTS
------------------------------------------------------------------------------------------------------ */
@media screen and (min-width: 1600px) {

/* .slider .item h3 {
	font-size: 92px;
	line-height: 80px;
	padding-bottom: 16px;
    border-top: 3px solid rgba(255,255,255,0.00);
    border-bottom: 1px solid rgba(255,255,255,0.00);
} */
        
}