@charset "UTF-8";
/* CSS Document */

html { width:100%; min-height: -webkit-fill-available; height:100vh;}

* {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

body {
	height:100vh;
	min-height: -webkit-fill-available;
	min-height:100%;
	font-family: 'Poppins', sans-serif;
	background:url(../images/bg.jpg) no-repeat center center fixed;
	background-color:#6bc2ba;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100% 100% cover;
	-moz-text-size-adjust: none;
	-webkit-text-size-adjust: none;
	-ms-text-size-adjust: none;
	
	color:#000;
	/*font-size:14px;
	line-height:18px;*/
	font-size:.88rem;
	line-height:1.125rem!important;
	font-weight:400;
	margin:0px;
	padding:0px;
}

.ecard-fixed { display:block;}
.ecard-mob { display:none; }

.clearfix { clear:both;}
img { border:0; border-style: none; outline:0;}
img { image-rendering:high-quality;}
*:focus { outline:0!important;}

a:link, a:visited { color:#bf8b23; text-decoration:none;}
a:hover { color:#000000; text-decoration:none;}


.ecard {
	background-color: rgba(255, 255, 255, 1)!important;
	/*background:url(../images/bg-ecard.jpg) no-repeat bottom center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover; */
	border:1px solid #ffec90;
	background-size: 100% 100% cover;
	-moz-box-shadow: 0px 5px 15px -4px rgba(0,0,0,0.4); 
	-webkit-box-shadow: 0px 5px 15px -4px rgba(0,0,0,0.4); 
	box-shadow: 0px 5px 15px -4px rgba(0,0,0,0.4);
	margin:25px auto 0px!important;
	padding-bottom:30px;
	position:relative;
	overflow:hidden;
}

.home-bg {
	width:100%;
	min-height:330px;
	background:url(../images/home-bg.jpg) no-repeat bottom center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100% 100% cover;
	padding-top:0px;
	position:relative;
	margin-top:40px;
	z-index:200;
}

.about-bg {
	width:100%;
	min-height:330px;
	background:url(../images/about-bg.jpg) no-repeat bottom center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100% 100% cover;
	padding-top:0px;
	position:relative;
	margin-top:40px;
	z-index:200;
}

.plain-bg {
	width:100%;
	min-height:330px;
	background:url(../images/plain-bg.jpg) no-repeat bottom center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100% 100% cover;
	padding-top:0px;
	position:relative;
	margin-top:40px;
	z-index:180;
}

.home-bg-top {
	width:100%;
	min-height:330px;
	background:url(../images/home-bg-mob-top.png) no-repeat bottom center scroll;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100% 100% cover;
	padding-top:0px;
	position:absolute;
	margin-top:0px;
	z-index:200;
}

.logo-opusarte { width:120px; position:absolute; top:20px; left:35px; z-index:600;}

.videoWrapper, .uniflip {
  position: relative;
  /*padding-bottom: 56.25%; *//* 16:9 */
  height: auto;
}

.videoWrapper iframe {
  position: relative;
  top: 0;
  left: 0;
  width: 360px;
}

.uniflip iframe {
	border:none;
	background-color:transparent;
  position: relative;
  top: 0;
  left: 0;
  width: 530px;
}


/* NAVIGATION */
.navigation-m  {
	width:100%;
	height:30px;
	/*background: rgba(0,91,81,1);*/
	text-transform:uppercase;
	padding: 0px 35px 0px 0px;
	margin-top:20px;
	font-size:14px;
	color:#000000;
	text-align:right;
	position:relative;
	z-index:200;
}

.navigation-m ul li {
	display: inline-block;
	margin:0px;
	padding:0px;
}

.navigation-m ul li a {
	display:block;
	padding: 0px 15px;
	border-right:2px solid #000000;
	text-decoration: none;
	color: #000000;
	font-weight: 500;
	margin: 0px 0px 0px 0px;
}

.navigation-m .active-nav {
	color: #bf8b23;
}

.navigation-m ul li a,
.navigation-m ul li a:after,
.navigation-m ul li a:before {
	transition: all .4s;
}
.navigation-m ul li a:hover {
	color: #bf8b23;
}

/* NAVIGATION end */

.up { position:relative; z-index:250; }

h1 { font-family: 'Poppins', sans-serif; font-weight:700; font-size:30px; line-height:34px; color:#000000; margin:0px 0px 25px 0px;}
h2 { font-family: 'Poppins', sans-serif; font-weight:700; font-size:30px; line-height:34px; color:#000000; margin:20px 0px 15px 0px;}

.fweight400 { font-weight:400;}
.fweight600 { font-weight:600;}
.fweight700 { font-weight:700;}

.fsize10 { font-size:10px; line-height:13px;}
.fsize11 { font-size:11px; line-height:13px;}
.fsize12 { font-size:12px; line-height:15px;}
.fsize13 { font-size:13px; line-height:16px;}
.fsize15 { font-size:15px; line-height:19px;}
sup { font-size:20px; line-height:25px;}

.sub { font-size:24px; line-height:28px;}
.credit { font-size:10px; line-height:12px; font-weight:700; position:absolute; bottom:5px; left:10px; }
.shadow-txt-l { text-shadow: 0 0 3px rgba(255,255,255,0.8); }
.shadow-txt-d { text-shadow: 0 0 8px rgba(0,0,0,1); }
.txt-white { color:#FFFFFF;}
.txt-black { color:#000000;}

.p-lr15 { padding-left:15px; padding-right:15px;}
.p-lr25 { padding-left:25px; padding-right:25px;}
.p-lr35 { padding-left:35px; padding-right:35px;}
.rel { position:relative;}
.up { position:relative; z-index:250!important;}

.shadow-img {
	-moz-box-shadow: 0px 0px 10px rgba(68,68,68,0.25);
	-webkit-box-shadow: 0px 0px 10px rgba(68,68,68,0.25);
	box-shadow: 0px 0px 10px rgba(68,68,68,0.25);
}

.content-home { margin-top:20px; position:relative; z-index:200;}
.content-bestsellers { margin-top:20px; position:relative; z-index:200;}
.content-anniv { margin-top:60px; position:relative; z-index:200;}
.content-newreleases { margin-top:30px; position:relative; z-index:200;}
.content-about { margin-top:90px; position:relative; z-index:200;}

.content-landing { margin-top:150px;}


.img-link {
	position:absolute;
	top:0px;
	left:0px;
	z-index:300;
}

.hover-bright {
	-webkit-filter: brightness(100%);
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
}

.hover-bright:hover {
	-webkit-filter: brightness(140%);
}

.hover-opacity {
	-webkit-filter: opacity(100%);
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	-ms-transition: all .5s ease;
	transition: all .5s ease;
}

.hover-opacity:hover {
	-webkit-filter: opacity(50%);
}

.btn-m {
  padding: 10px 20px 10px;
  text-align: center;
  text-transform:uppercase;
  font-size:13px;
  font-weight:700;
  opacity: 1;
  transition: 0.3s;
  border-radius:2px;
  cursor: pointer;
}

/*.btn-download-main {
	position:absolute;
	bottom:230px;
	right:0px;
}
*/

.btn-download-main {
	min-width:150px;
	position:relative;
	bottom:0;
	right:0px;
	margin:auto;
}


.btn-s {
  padding: 5px 15px 5px 15px;
  text-align: center;
  text-transform:uppercase;
  font-size:12px;
  font-weight:700;
  opacity: 1;
  transition: 0.3s;
  border-radius:2px;
  cursor: pointer;
}

a.btn-m, a.btn-s { color: #FFFFFF!important; text-decoration:none;}

.btn-discover { background-color:#005b51; color: #FFFFFF!important;}
.btn-discover:hover { background-color:#024a42; color: #FFFFFF; text-decoration:none; cursor:pointer;}

.btn-download { background-color:#bf8b23; color: #FFFFFF!important;}
.btn-download:hover { background-color:#e5ab38; color: #FFFFFF; text-decoration:none; cursor:pointer;}

.rev-icons {
	/*display:inline-block!important;*/
	display:table-cell;
	padding:0px 3px;
}

.star {
	color:#C20000;
	font-size:11px;
	line-height:15px;
}

.starHalfFill {
	background: linear-gradient(to right, #C20000 50%, #FFFFFF 50%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.logo-opus-main {
	position:relative;
	overflow:hidden;
}

/* SHINE */
.logo-opus-landing:after {
  
  animation: shine 5s ease-in-out  infinite;
  animation-fill-mode: forwards;  
  content: "";
  position: absolute;
  top: -120%;
  left: -210%;
  width: 200%;
  height: 200%;
  opacity: 0;
  transform: rotate(20deg);
  
  background: rgba(255, 255, 255, 0.13);
  background: linear-gradient(
    to right, 
    rgba(255, 255, 255, 0.13) 0%,
    rgba(255, 255, 255, 0.13) 77%,
    rgba(255, 255, 255, 0.5) 92%,
    rgba(255, 255, 255, 0.0) 100%
  );
}

/* Hover state - trigger effect */


/* Active state */

.icon:active:after {
  opacity: 0;
}

@keyframes shine{
  10% {
    opacity: 1;
    top: -30%;
    left: -30%;
    transition-property: left, top, opacity;
    transition-duration: 0.7s, 0.7s, 0.15s;
    transition-timing-function: ease;
  }
  100% {
    opacity: 0;
    top: -30%;
    left: -30%;
    transition-property: left, top, opacity;
  }
}
/* SHINE */


/* FOOTER */

.footer {
	font-size:11px;
	line-height:13px;
	font-weight:600;
	text-align:center;
	color:#FFFFFF;
}

.footer a {
	color:#FFFFFF!important;
}

.footer a:hover {
	color:#520003!important;
	text-decoration:none!important;
}

/* FOOTER end */

@media screen and (min-width: 1600px) {
body {
	zoom:120%;
}
}

@media screen and (max-width: 1200px) {
body {
	zoom:120%;
}
}

@media screen and (min-width: 980px) {
.ecard {
	width:980px;
	height:570px;
}

}

@media screen and (max-width: 768px) {
.home-bg {
	width:100%;
	min-height:280px;
	background:url(../images/home-bg-mob-bottom.jpg) no-repeat bottom center scroll;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: 100% 100% contain;
	padding-top:0px;
	position:relative;
	margin-top:40px;
	padding-bottom:150px;
	z-index:200;
}

.about-bg {
	width:100%;
	min-height:280px;
	background:url(../images/about-bg-mob-bottom.jpg) no-repeat bottom center scroll;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: 100% 100% contain;
	padding-top:0px;
	position:relative;
	margin-top:40px;
	padding-bottom:180px;
	z-index:200;
}
}


@media screen and (max-width: 979px) {
.ecard {
	width:100%;
	/*height:100%;*/
	border:none;
	margin-top:0px!important;
	position:relative;
	overflow-y:scroll;
}

h1 { margin:120px 0px 15px 0px;}
h2 { font-size:26px; line-height:30px; margin:120px 0px 15px 0px;}

.ecard-fixed { display:none;}
.ecard-mob { display:block; }

.no-pad-mob { padding:0px;}
.txt-cen-mob { text-align:center!important;}
.no-mt-mob { margin-top:0px!important;}
.justify-cen-mob { justify-content:center;}

.content-landing, .content-bestsellers, .content-home, .content-anniv, .content-newreleases, .content-about { margin-top:20px;}

.content-bestsellers { min-height:600px;}

.w100-mob { width:100%;}
.w50-mob { width:50%;}

.videoWrapper, uniflip {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
}

.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.uniflip iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  min-height:550px;
  height: 100%;

}
/*
.btn-download-main {
	width:150px;
	position:relative;
	bottom:0;
	right:0px;
	margin:auto;
}

.btn-s {
  padding: 5px 15px 5px 15px;
}
*/
}