/* ### Mirror Gloss page - custom css ### */

@font-face {
	font-family: 'helen_pro_bold';
	src: url('../fonts/helen_pro/helen_pro_bold.eot');
	src: url('../fonts/helen_pro/helen_pro_bold.eot?#iefix') format('embedded-opentype'),
		url('../fonts/helen_pro/helen_pro_bold.woff') format('woff'),
		url('../fonts/helen_pro/helen_pro_bold.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'helen_pro_regular';
	src: url('../fonts/helen_pro/helen_pro_regular.eot');
	src: url('../fonts/helen_pro/helen_pro_regular.eot?#iefix') format('embedded-opentype'),
		url('../fonts/helen_pro/helen_pro_regular.woff') format('woff'),
		url('../fonts/helen_pro/helen_pro_regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Helen_ProL_ight';
	src: url('../fonts/helen_pro/helen_pro_light.eot');
	src: url('../fonts/helen_pro/helen_pro_light.eot?#iefix') format('embedded-opentype'),
			url('../fonts/helen_pro/helen_pro_light.woff') format('woff'),
			url('../fonts/helen_pro/helen_pro_light.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Helen_ProL_ight';
	src: url('../fonts/helen_pro/helen_pro_lightita.eot');
	src: url('../fonts/helen_pro/helen_pro_lightita.eot?#iefix') format('embedded-opentype'),
			url('../fonts/helen_pro/helen_pro_lightita.woff') format('woff'),
			url('../fonts/helen_pro/helen_pro_lightita.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
}

body, figure, figcaption, h1, h2, h3, h4, p {
	margin: 0;
	padding: 0;
}

a {
	color: inherit;
	text-decoration: inherit;
}


 #content.container {
        max-width: 100% !important;
        width: 100% !important;
    }
    
    #content {
        max-width: 100% !important;
        width: 100% !important;
    }
    
    
    .slick-prev.slick-arrow {
        left: 12px;
    }
    
.owl-carousel {
	overflow: hidden;
}

.owl-carousel,
.owl-wrapper {
	position: relative;
}

.owl-item {
	display: inline-block;
	vertical-align: top;
}

.static-wrappper {
	margin: 0 auto;
	max-width: 1920px;
	font-family: "Helen Pro_Bold";
	font-size: 20px;
	color: #919294;
}
	
.m_sections {
	padding: 10px;
	margin-bottom: 50px;
}

.m_sections img {
	width: 100%;
	height: auto;
}

.m_sections figure {
	margin: 3px 0;
}

.footer_space {
		position: relative;
		display: block;
		height: 50px;
		width: 100%;
}

/* Go to Top */
.back-to-top.visible {
	display: block;
	opacity: 1;
}
.back-to-top {
	display: none;
	position: fixed;
	right: 40px;
	bottom: 40px;
	width: 40px;
	height: 40px;
	background-color: rgba(0, 0, 0, 0.75);
	box-shadow: 0px 4px 10px rgba(0,0,0,.4);
	cursor: pointer;
	z-index: 9999;
	opacity: 0;
	-webkit-transition: opacity 250ms ease 0s;
	transition: opacity 250ms ease 0s;
}
.back-to-top:before {
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 11px;
	height: 6px;
	font-size: 0pt;
	text-indent: -9999px;
	background: url(../../images/arrow_white_down.gif) no-repeat;
	color: #fff;
	-webkit-transform: translate(-50%, -50%) rotate(-180deg);
	transform: translate(-50%, -50%) rotate(-180deg);
}
/* End of Go to TOP*/

@media only screen and (max-width: 767px) {
	.m_sections figcaption {
		margin-top: -60px;
		margin-left: 10px;
		font-size: 25px;
		color: #fff;
		text-align: right;
		padding-right: 20px;
		margin-bottom: 50px;
	}
	
	.owl-stage {
		height: 250px;
	}
}


.m_sections figcaption a:before {
	/*
	content: " ";
	margin-right: 10px;
	width: 30px;
	height: 30px;
	background: #c2c2c2 url('../images/m_arrow.png') no-repeat center center;
	position: absolute;
	pointer-events: none;
	/* top: -100%; */
	/* margin-top: 0; */
	background-color: #fff;
	opacity: 0;
	-webkit-transition: opacity .4s, margin-top .4s;
	transition: opacity .4s, margin-top .4s;	
}


.m_sections figcaption {
/*	pointer-events: none;*/
}

.m_content {
	position: relative;
	padding: 10px;
	padding-bottom: 0;
	color: #656565;
	font-family: "Helen Pro";
}

.m_content .center > * {
	font-size: 16px;
}

.m_content .text a {
	xpadding: 0 5px;
	xborder: 1px solid #c4c4c4;
	xbackground-color: transparent;
	color: #8b8b8b;
	font-family: "Helen Pro_Bold";
	text-decoration: none;
}

.m_content .text {
	margin-top: 20px;
	line-height: 32px;
}

.m_content .left_side,
.m_content .right_side,
.m_content .center {
	overflow: hidden;
}

.m_content .left_side {
	text-align: center;
}

.m_content .left_side figure {
	display: inline-block;
	vertical-align: top;
	margin-top: 10px;
	text-align: left;
}

.m_content .center a {
	display: block;
	overflow: hidden;
	margin: 10px auto 0;
	width: 315px;
}

.m_content .right_side {
	height: 216px;
}

.mooddiv {
	height: 250px;
	display: inline-block;
	width: 100%;
	margin-bottom: 10px;
}
.mooods_container {
	padding-bottom: 0 !important;
}
.mooddiv {
  margin-bottom: 20px;
}
.mooddiv a {
	font-size: 14px;
}
.m_sections figcaption a:hover {
	text-decoration: none;
}

/*------------------------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 768px) {
	.m_sections {
		text-align: center;
	}

	.m_sections figure:before {
		content: " ";
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		width: 100%;
		height: 100%;
		/* background-color: rgba(0, 0, 0, .25); */
		pointer-events: none;
	}

	.m_sections figure {
		position: relative;
		display: inline-block;
		vertical-align: top;
		overflow: hidden;
		width: 100%;
	}

	.m_sections img {
		display: block;
	}

	.m_sections figcaption a:before {
		position: absolute;
		pointer-events: none;
		top: -100%;
		margin-top: 0;
		display: block;
		background-color: #fff;
		opacity: 0;
		-webkit-transition: opacity .4s, margin-top .4s;
		transition: opacity .4s, margin-top .4s;
	}
	
	
	.m_sections figcaption {
		position: absolute;
		right: 15px;
		bottom: 10px;
		z-index: 2;
		width: 90%;
		color: #fff;
		font-size: 26px;
		text-align: right;
	}
	
	.m_content .center {
		text-align: center;
	}

	.m_content .right_side,
	.m_content .center a {
		display: inline-block;
		vertical-align: top;
		margin-top: 7px;
	}

	.m_content .center img {
		display: block;
	}

	.m_content .right_side {
		margin-top: 0;
		height: 223px;
	}

	.m_content iframe {
		height: 315px;
	}
		
		.m_content iframe.yout1617 {
			height: 534px;
			max-width: none;
	}
	/* ### Trends 16/17 ### */        
		.m_box .top_tr1617,
		.m_content_tr1617 {
			width: 97.5%;
		}
		.top_tr1617 > h1.m_title {
			line-height: 80px;
		}
		.nrd01, .nrd03, .nrd06, .nrd08, .nrd09, .nrd10, .nrd13, .nrd15, .nrd02, .nrd04, .nrd05, .nrd07, .nrd11, .nrd12, .nrd14,
		.mtr01, .mtr02, .mtr04, .mtr05, .mtr06, .mtr07, .mtr08, .mtr09, .mtr11, .mtr12, 
		.lxr01, .lxr02, .lxr04, .lxr05, .lxr07, .lxr08, .lxr10, .lxr11 {
			width: 49%;
			margin-bottom: 20px;
		}
		
		.nrd11,
		.mtr03, .mtr10, .mtr13,
		.lxr03, .lxr06, .lxr09 {
			width: 99%;
			display: block;
		}
		.mooods_container {
			padding-bottom: 0 !important;
		}
		
}

/*------------------------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 1024px) {
	
	.test .m_sections {
		padding-bottom: 0px;
	}
	
	.m_sections figure {
		width: 100%;
	}

	.m_sections figcaption {
		font-size: 18px;
		position: absolute;
		width: 90%;
	}

	.m_box .top,
	.m_content {
		margin: 0 auto;
		width: 550px;
	}

	.m_content {
		margin-top: 30px;
	}

	.m_content .left_side {
		float: left;
		margin-left: -230px;
		width: 210px;
	}

	.m_content .left_side figure {
		display: block;
		font-size: 14px;
	}

	.m_content .left_side figure:first-child {
		margin-top: 0;
	}

	.m_content .center {
		position: relative;
		overflow: visible;
		text-align: left;
		font-size: 0;
	}

	.m_content .center .small {
		display: inline-block;
		vertical-align: top;
		margin-top: 11px;
		width: 50%;
		box-sizing: border-box;
	}

	.m_content .center .small + .small + .small,
	.m_content .center .small {
		border-right: 5px solid #fff;
		border-left: 0;
	}

	.m_content .center .small + .small + .small + .small,
	.m_content .center .small + .small {
		border-right: 0;
		border-left: 5px solid #fff;
	}

	.m_content .center .big {
		display: block;
		width: 100%;
		border-left: 0;
		border-right: 0;
	}

	.m_content .right_side {
		float: right;
		margin-right: -230px;
		margin-top: 0;
		width: 210px;
		height: 473px;
	}

	.m_content .right_side a {
		margin-bottom: 13px;
				margin-top: 0;
	}

	.m_box:nth-child(odd) .m_content .left_side {
		float: right;
		margin-left: 0;
		margin-right: -230px;
	}

	.m_box:nth-child(odd) .m_content .right_side {
		float: left;
		margin-right: 0;
		margin-left: -230px;
	}
		.mooddiv a {
			font-size: 12px;
		}
		/* ### Trends 16/17 ### */        
		.m_box .top_tr1617,
		.m_content_tr1617 {
			width: 950px;
		}
		.m_content {
			line-height: 32px;
			margin-top: 20px;
		}
		/* Color */
		.nrd01, .nrd03, .nrd06, .nrd08, .nrd13, .nrd15,
		.mtr05, .mtr07,
		.lxr02, .lxr04, .lxr07, .lxr11 {        
			width: 120px;
		}
		/* Metals */
		.nrd10,
		.mtr02, .mtr06, .mtr08, .mtr12,
		.lxr05, .lxr08 {                                
			width: 185px;
		}
		
		.mooddiv {
			vertical-align: top;
		}
		
}

/*------------------------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 1366px) {
	
	.m_carousel .owl-controls {
		margin-top: -20px;
	}

	.owl-prev,
	.owl-next {
		width: 40px;
		height: 40px;
	}

	.m_content .right_side {
		width: 315px;
		margin-right: -335px;
	}

	.m_box:nth-child(odd) .m_content .right_side {
		margin-left: -335px;
		margin-right: 0;
	}

	.m_sections figcaption {
		margin-top: -30px;
		font-size: 28px;
		line-height: 28px;
		width: 90%;
	}

	.m_box .m_title {
		font-size: 80px;
	}

	.m_box .m_num {
		font-size: 40px;
	}

	.m_box .m_left,
	.m_box .m_right {
		width: 60px;
		height: 60px;
	}

	.m_box .m_left:before,
	.m_box .m_right:before {
		margin-top: -7px;
		width: 13px;
		height: 13px;
	}

	.m_sections figcaption a {
		display: inline-block;
		vertical-align: top;
		position: relative;
		margin-top: 0;
		-webkit-transition: margin-top .4s;
		transition: margin-top .4s;
	}

	.m_sections figcaption a:before {
		position: absolute;
		pointer-events: none;
		top: -100%;
		margin-top: 0;
		display: block;
		background-color: #fff;
		opacity: 0;
		-webkit-transition: opacity .4s, margin-top .4s;
		transition: opacity .4s, margin-top .4s;
	}
		
	.m_sections img {
		-webkit-transition: -webkit-transform .4s;
		transition: transform .4s;

		-webkit-transform: scale(1.1);
		transform: scale(1.1);
	}

	.m_sections figure:hover {
		background-color:#646363;
	}
	.m_sections figure:hover a {
		margin-top: -15px;
	}

	.m_sections figure:hover a:before {
		-webkit-transition-delay: .3s;
		transition-delay: .3s;
		opacity: 1;
		margin-top: 20px;
	}

	.m_sections figure:hover img {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 0.7;
		transition: all 1s;
		-webkit-transition: all 1s;
	}

	.m_box .top,
	.m_content {
		margin: 0 auto;
		width: 650px;
	}

	.m_box .m_title {
		margin-top: -20px;
	}

	.m_content {
		margin-top: 30px;
	}

	.m_content .center img {
		width: 100%;
		height: auto;
	}
		.mooddiv a {
			font-size: 12px;
		}
		/* ### Trends 16/17 ### */        
		.m_box .top_tr1617,
		.m_content_tr1617 {
			margin-top: 10px !important;
			width: 950px;
		}
		.m_content {
			line-height: 32px;
			margin-top: 20px;
		}
		
}

.m_content:after,
.m_box nav:after {
   content: " ";
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}

#content {padding: 0px 0 24px 0;}

#content p {line-height: inherit;}

/* ### Trends 16/17 ### */ 
.mooods_container {
	line-height: 12px;
	padding-bottom: 10px;
}
.mooddiv {
	background-repeat: no-repeat;
	background-size: cover;
	display: inline-block;
	height: 250px;
	position: relative;
	cursor: pointer;
}
.mooddiv_500 {
	height: 500px;
}
.mooddiv > figcaption {
	bottom: -100%;
	left: 0;
	position: relative;
}

.tr1415 {
	line-height: 100px;
}
.m_box .m_title {
	margin-top: -8px;
	color: #c2c2c2;
	font-size: 50px;
}

.static-wrappper {
	margin: 0 auto;
	max-width: 1920px;
	font-family: "Helen Pro_Bold";
	font-size: 29px;
	color: #939597;
	 padding-top: 47px;
}

.m_content {
	position: relative;
	padding: 10px;
	padding-bottom: 0;
	color: #939597;
	font-family: "Helen Pro";
}

#content p {
	font-family: Helen Pro_Light;
	line-height: 1.2em;
	padding:0;
	font-size: 20px;
}

h2 {
	text-transform: none;
}
.small_title {
	position: relative;
	padding-bottom: 7px;
	font-size: 23px;
	padding-top: 28px;
	color: #939597;
	font-family: "Helen Pro";
}

.description {
	font-size: 20px;
	line-height:22px;
}

.main_image {
	 margin-top: 13px;
	 margin-bottom: 60px;
	 width: 100%;
	 height: auto;
	 position: relative;
	 background-repeat: no-repeat;
}


/*------------------------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 768px) {
	.mlxry02, .mlxry03,
	.infinli01, .infinli02,
	.grhmny02, .grhmny03,
	.clrply01, .clrply02, .clrply03, .clrply04,
	.pcfct02, .pcfct03, 
	.wrmel01, .wrmel02, .wrmel03, .wrmel04, .wrmel05, .wrmel06 {
		width: 49%;
		margin-bottom: 20px;
	}
	.mlxry01, .mlxry04, .infinli03, .grhmny01, .grhmny04, .clrply05, .pcfct01, .wrmel07  {
		width: 100%;
	}
}
/*------------------------------------------------------------------------------------------------------------------------------------
@media only screen and (min-width: 1024px) {
	.mlxry01, .mlxry02, .mlxry03, .mlxry04,
	.infinli01, .infinli02, .infinli03,
	.grhmny01, .grhmny02, .grhmny03, .grhmny04,
	.greyh01, .greyh02, .greyh03,
	.pcfct01, .pcfct02, .pcfct03,
	.wrmel01, .wrmel02, .wrmel03, .wrmel04, .wrmel05, .wrmel06{
		width: 365px;
	} 
} */
/*------------------------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 1024px) {
	.mlxry02, .mlxry03, .mlxry04,
	.infinli01, .infinli02,
	.grhmny02, .grhmny03, .grhmny04,
	.clrply01, .clrply02, .clrply03, .clrply04, .clrply05, 
	.pcfct02, .pcfct03,
	.wrmel01, .wrmel02, .wrmel03, .wrmel04, .wrmel05, .wrmel06{
		width: 120px;
	}
	.mlxry01, .grhmny01 {
		width: 571px;
	}
	.infinli03, .pcfct01 {
		width: 697px;
	}
	.wrmel07 {
		width: 192px;
	}
	.clrply05 {
		width: 444px;
	}
}

	.responsive_image {
		width: 100%;
		height: auto;
		border: 0px;
	}
	
		
	
/* @media only screen and (max-width: 768px) { */

@media only screen and (max-width: 1024px) {
	
	.main_image {
		margin-top: 30px;
		margin-bottom: 30px;
	}
	
	.m_sections {
		padding: 10px;
		margin-bottom: -30px;
	}
}


/* NEW CSS CODE */

.main_title {
	color: #939597;
	font-size: 50px;
	text-align: center;
	font-weight: bold;
	text-transform: none;
	line-height: 48px;
		margin-top: 47px;
	font-family: Helen Pro_Light;
}

.sub_title {
	color: #939597;
	font-size: 28px;
	text-align: center;
	font-weight: bold;
	text-transform: none;
	line-height: 36px;
		padding-top: 26px;
		font-family: Helen Pro_Light;
}

.text_small {
	font-family: Helen Pro_Light;
	text-align: center;
	font-size: 20px;
	color: #939597;
	padding-bottom: 50px;
}

.text_normal {
	font-family: Helen Pro_Light;
	text-align: center;
	font-size: 24px;
}
.video-container {
	margin-top:75px;
	margin-bottom: 80px;
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px; height: 0; overflow: hidden;
	display: block;
	background: url(/public/hightlights/images/_3d_foils/embed_splashscreen.png) no-repeat top left;
	background-repeat:no-repeat;
	background-size:contain;
	background-position:center;
	cursor: pointer;
}
 
.image_full_width {
	margin-top: 110px;
	margin-bottom: 75px;
	width: 100%;
	height: auto;
}

.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.collections {
	width: 100%;
	height: auto;
	margin-top: 50px;
}

.trends_14_15 {
	float: left;
	width: 49%;
}

.trends_16_17 {
	float: left;
	width: 49%;
	padding-left: 15px;
}

.box_decor {
	width: 24%;
	height: auto;
	float: left;
	padding-right: 4px;
}

.decor_image {
	width: 100%;
	height: auto;
	padding-bottom: 5px;
}

.decor_number {
	top: -5px;
	position: relative;
	line-height: normal !important;
	font-size: 12px;
	color: #373737;
	text-transform: uppercase;
	font-weight: bold;
}


.decor_name {
	top: -8px;
	position: relative;
	color: #373737;
	line-height: normal !important;
	font-size: 11px !important;
	font-weight: bold;
	min-height: 28px;
}

.decor_number span {
	line-height: normal !important;
	font-weight:normal;
}

.collection_header {
	color: #373737;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 5px;
}

.additional_p p {
	margin-top: 25px;
	font-size: 24px !important;
}

@media only screen and (max-width: 768px) {
		.trends_14_15, .trends_16_17 {
			width: 100%;
			padding-left: 0px;
			padding-bottom: 10px;
	}
		
		.box_decor {
			width: 48.7%;
			padding-bottom: 10px;
		}
}

@media only screen and (max-width: 320px) {
		.trends_14_15, .trends_16_17 {
		width: 100%;
				padding-left: 0px;
				padding-bottom: 10px;
	}
		
		.box_decor {
			width: 48.5%;
			padding-bottom: 10px;
		}
}
    
