@charset "UTF-8";
/* CSS Document */

body{font-family: 'Raleway', sans-serif;
}

strong{font-weight:700;}

.navbar {background-color:#fff;}
.navbar-nav a.nav-link{color:#939598;}
.navbar-nav a.nav-link:hover{color:#ec008c;}
.navbar-light .navbar-nav .nav-link {
    padding-right: 1rem;
    padding-left: 1rem;
	font-size: 1.1em;
}

#carouselTopSlider{margin-top:60px;}

.topslider{
			width: 100%!important;
			height: 50vw;
			max-height: 100vh;
			background-position: top center;
			background-size: cover;
			display: block!important;
			
		}
		#cocktailslide{
			background-image: url("../images/home/slider-top/OMB-slider-cocktail.jpg");
		}
		
		#discountslide{
			background-image: url("../images/home/slider-top/OMB-slider-piggybank.jpg");
		}
		
		#vipperksslide{
			background-image: url("../images/home/slider-top/OMB-slider-chest.jpg");
		}


h1#feelthemusic{font-size:8vw;}
h1#lovelanguage{font-size:6.8vw;margin-bottom: 5%; text-shadow: 0px 0px 5px #444;}
h1#anywhere{font-size:7vw; margin-bottom: 5%;}
h1#revslide{font-size:6vw; margin-bottom: 5%; text-shadow: 0px 0px 5px #444;}
h1#krushslide{font-size:6vw; margin-bottom: 5%;}
#carouselTopSlider h5{font-size:2.8vw; }
a.slider-button{
	background-color: #e02183;
	color:#fff;
	display: inline-block;
	border-radius: 12px;
	padding: 2% 3%;
	font-size: 1.5vw;
	line-height: 2.3vw;
	letter-spacing: 0.2vw;
	margin: 5% auto;
}

a.slider-button:hover, a.slider-button:active{background: #f53296; text-decoration: none; color:#fff;}

a.slider-button2{
	background-color: #fff;
	color:#e02183;
	display: inline-block;
	border-radius: 12px;
	padding: 2% 3%;
	font-size: 1.5vw;
	line-height: 2.3vw;
	letter-spacing: 0.2vw;
	margin: 5% auto;
}
a.slider-button2:hover, a.slider-button2:active{color: #f53296; text-decoration: none; }
/* Quote block */

h1#cocktail, h1#discounts, h1#vipperks {
			margin-bottom: 2%;
    		text-shadow: 0px 0px 5px #444;
		}
		h1#cocktail{font-size: 6vw;}
		
		h1#discounts{font-size: 6vw;}		
		h1#vipperks{font-size: 6.5vw;}
    		
		
		#carouselTopSlider h5.shadowedtext{text-shadow: 0px 0px 5px #444; font-size: 4vw;}
		
		a.slider-button3{
			background-color:#273e9a;
			display: inline-block;
			color:#fff;
			border-radius: 10px;
			padding: 2% 3% 2%;
			font-size: 1.5vw;
			line-height: 2.3vw;
			letter-spacing: 0.2vw;
			margin: 5% auto;}

		a.slider-button3:hover, a.slider-button3:active{background-color:#2c47b1;text-decoration: none;}
		
		a.slider-button4{
			background-color:#bf25ac;
			display: inline-block;
			color:#fff;
			border-radius: 12px;
			padding: 2% 3%;
			font-size: 1.5vw;
			line-height: 2.3vw;
			letter-spacing: 0.2vw;
			margin: 5% auto;}
		a.slider-button4:hover, a.slider-button4:active{background-color:#ce35bb;text-decoration: none;}
		
		a.slider-button5{
			color:#36a6ae;
			background-color: #fff;
			display: inline-block;
			border-radius: 12px;
			padding: 2% 3%;
			font-size: 1.5vw;
			line-height: 2.3vw;
			letter-spacing: 0.2vw;
			margin: 5% auto;}
		a.slider-button5:hover, a.slider-button5:active{color:#3db3bc;text-decoration: none;}

span.button-sub{font-size: 2.5vw; font-weight:700;}

		
@media screen and (max-width: 767px) and (min-width:576px){
			.topslider{
			height: 80vw;
			max-height: 100vh;
			}
	
			.carousel-caption {
			position: relative;
			width:88%;
			left:6%;
			right:6%;
				top:20vh;
			z-index: 10;
			padding-top: 20px;
			padding-bottom: 20px;
			color: #fff;
			text-align: center;
		}
			h1#cocktail{font-size: 7.4vw;}
		h1#discounts{font-size: 7vw;}		
		h1#vipperks{font-size: 7.3vw;}
		#carouselTopSlider h5.shadowedtext{text-shadow: 0px 0px 5px #444; font-size: 5vw;}
	a.slider-button3, a.slider-button4, a.slider-button5{font-size:3vw; line-height:4vw;}
	span.button-sub{font-size: 3.8vw; font-weight:700;}
	
	
}

@media screen and (max-width: 767px){
	a.slider-button5, a.slider-button4, a.slider-button3{margin: 4% auto 1% auto;}
}

@media screen and (max-width: 575px){
			.topslider{
			height: 90vh;
			}
	
			.carousel-caption {
			position: relative;
			width:88%;
			left:6%;
			right:6%;
			top:20vh;
			z-index: 10;
			padding-top: 20px;
			padding-bottom: 20px;
			color: #fff;
			text-align: center;
		}
			h1#cocktail{font-size: 12.4vw;}
		h1#discounts{font-size: 12vw;}		
		h1#vipperks{font-size: 12.3vw;}
		#carouselTopSlider h5.shadowedtext{text-shadow: 0px 0px 5px #444; font-size: 8.5vw; padding-left:5%; padding-right:5%;}
	a.slider-button3, a.slider-button4, a.slider-button5{font-size:5vw; line-height:7vw;}
	span.button-sub{font-size: 6vw; font-weight:700;}
	
	
}
a.carousel-control-prev, a.carousel-control-next{z-index:20;}
#quoteblock{
	width:100%;
	background-color: #e6e6e6;
	color: #363636;
	padding: 30px;
}

#quoteblock p{font-size: 1.25em;
line-height: 1.6em;
letter-spacing: 0.7px;
text-align: center;}


/* Brand block */

#brandblock{padding: 90px 0;}

.brandblockbox{
	padding: 8%;
	margin: 20px 5px;
}

.brandblockbox p{font-size:1.6em; font-weight: 700; letter-spacing: .5px; padding-left: 5px;}

.brandgraphic{position: absolute;}

#brandblock-ohmibod .brandgraphic{top:15%; right: 10%; width: 28%;}
#brandblock-lovelife .brandgraphic{top:13%; right: 6%; width:40%;}
#brandblock-bluemotion .brandgraphic{top:33%; right: 8%; width:44%;}
#brandblock-clubvibe .brandgraphic{top:25%; right: 4%; width:43%;}

a.brand-button{
	display: inline-block;
	background: #e02183;
	color:#fff;
	font-weight: 700;
	padding: 10px 20px;
	font-size: 1.4em;
	border-radius: 15px;
	width: auto;
}

a.brand-button:hover, a.brand-button:active{background: #f53296; text-decoration: none; color:#fff;}

#brandblock-ohmibod{
	background: rgb(235,235,235);
	background: -webkit-linear-gradient(86deg, rgba(235,235,235,1) 0%, rgba(249,249,249,1) 100%);
	background: -o-linear-gradient(86deg, rgba(235,235,235,1) 0%, rgba(249,249,249,1) 100%);
	background: linear-gradient(176deg, rgba(235,235,235,1) 0%, rgba(249,249,249,1) 100%);
	color:#939598;
}

#brandblock-lovelife{
	background: rgb(227,48,141);
	background: -webkit-linear-gradient(86deg, rgba(227,48,141,1) 0%, rgba(248,120,188,1) 100%);
	background: -o-linear-gradient(86deg, rgba(227,48,141,1) 0%, rgba(248,120,188,1) 100%);
	background: linear-gradient(176deg, rgba(227,48,141,1) 0%, rgba(248,120,188,1) 100%);
	color:#fff;
}

#brandblock-bluemotion{
	background: rgb(250,251,255);
	background: -webkit-linear-gradient(86deg, rgba(250,251,255,1) 0%, rgba(192,220,252,1) 100%);
	background: -o-linear-gradient(86deg, rgba(250,251,255,1) 0%, rgba(192,220,252,1) 100%);
	background: linear-gradient(176deg, rgba(250,251,255,1) 0%, rgba(192,220,252,1) 100%);
	color:#07468a;
}

#brandblock-clubvibe{
	background: rgb(0,0,0);
	background: -webkit-linear-gradient(86deg, rgba(0,0,0,1) 0%, rgba(66,66,66,1) 100%);
	background: -o-linear-gradient(86deg, rgba(0,0,0,1) 0%, rgba(66,66,66,1) 100%);
	background: linear-gradient(176deg, rgba(0,0,0,1) 0%, rgba(66,66,66,1) 100%);
	color:#d7d7d7;
}

@media screen and (min-width: 992px) and (max-width: 1199px){
	
	.brandblockbox p{font-size:1.4em; font-weight: 700; letter-spacing: .5px; padding-left: 5px; line-height: 1.4em;}
	a.brand-button{font-size: 1.3em;}
}

@media screen and (min-width: 768px) and (max-width: 991px){
	
	.brandblockbox p{font-size:1em; font-weight: 700; letter-spacing: .5px; padding-left: 5px; line-height: 1.2em;}
	a.brand-button{font-size: 1.0em;}
}

@media screen and (max-width: 575px){
	
	.brandblockbox p{font-size:4.8vw; font-weight: 700; letter-spacing: 0.2vw; padding-left: 5px; line-height: 5.5vw;}
	a.brand-button{font-size: 4vw;}
}


/* ESCA 2 Block */

#esca2block{width:100%; background: url('../images/home/purple-gradient.jpg') 0 0 repeat-x; background-size: contain;}
#esca2image{width:100%; background: url('../images/home/esca2-image.jpg') 0 0 no-repeat; background-position: center right; background-size:contain;}

#esca2block .container{padding-top: 160px; padding-bottom: 140px;}

#esca2block .container p{font-size: 1.8em; line-height:1.4em; padding: 10px 0; font-weight:600;}
#esca2block .container p.second{font-size: 1.6em; line-height:1.4em; padding: 0px 0px 20px 0; font-weight:300; font-style: italic;}
#esca2block .container p img{ width:110px; margin-top: -9px; padding: 0 10px;}

.esca-mobile{display:none;}

@media screen and (max-width: 991px){
	
	#esca2image{background:none;}
	.esca-mobile{display: block;}
}

@media screen and (min-width: 768px) and (max-width: 991px){
	
	#esca2block .container{padding: 90px 15px;}
	#esca2block .container p{font-size: 1.4em; line-height:1.4em; padding: 10px 0; font-weight:600;}
#esca2block .container p.second{font-size: 1.3em; line-height:1.4em; padding: 0px 0px 20px 0; font-weight:300; font-style: italic;}
#esca2block .container p img{ width:90px; margin-top: -9px; padding: 0 6px;}
	.esca-mobile{width:85%; margin: 5px auto;}
	
}

@media screen and (max-width: 767px){
	#esca2block .container{padding: 100px 35px;}
	#esca2block .brand-button{text-align: center; margin: auto;}
	.esca-mobile{width:60%; margin: 25px auto 0px auto;}
	
	#esca2block .container p, #esca2block .container p.second {
    font-size: 4vw;
    line-height: 5.2vw;
    padding: 1vw 0;
}
	
#esca2block .container p img{ width:21%; margin-top: -2%; padding: 0 1%;}}

/* OHMIBOD DIFFERENCE BLOCK */

#ohmiboddifferenceblock{
	width:100%;
	text-align: center;
	color:#6f7274;
	background: rgb(250,251,251);
	background: -webkit-linear-gradient(rgba(250,251,251,1) 0%, rgba(230,230,230,1) 100%);
	background: -o-linear-gradient(rgba(250,251,251,1) 0%, rgba(230,230,230,1) 100%);
	background: linear-gradient(rgba(250,251,251,1) 0%, rgba(230,230,230,1) 100%);
	padding: 100px 0;
}

#ohmiboddifferenceblock .col-md-6{padding: 0;}

#ohmiboddifferenceblock .differenceitem{
	width:49%;
	padding: 2%;
display: inline-block;
vertical-align: top;}

#ohmiboddifferenceblock h1{padding-bottom:40px; letter-spacing: 2px;}
#ohmiboddifferenceblock .differenceitem img{max-width: 80%;}
#ohmiboddifferenceblock .differenceitem p{
	font-size: 1.4em;
	font-weight:200;
	padding: 20px 40px;
}

@media screen and (max-width: 1199px){
	#ohmiboddifferenceblock .differenceitem p{
	font-size: 2vw;
	font-weight:200;
	padding: 1vw 2vw;
}
}
@media screen and (max-width: 991px){
	#ohmiboddifferenceblock .differenceitem p{
	font-size: 2.3vw;
	font-weight:200;
	padding: 1vw 2vw;
}
	#ohmiboddifferenceblock{padding: 70px 0;}
}

@media screen and (max-width: 767px){
	#ohmiboddifferenceblock .differenceitem p{
	font-size: 1.4em;
	font-weight:200;
	padding: 1vw 3vw;
}
	#ohmiboddifferenceblock .differenceitem img{max-width: 60%;}
	#ohmiboddifferenceblock{padding: 50px 0;}
}

/* APP BLOCK */


#appblock{
	width: 100%;
	background: url("../images/home/app-bg.jpg") 0 0 no-repeat;
	background-size: 48%;
	padding: 7%;
	font-size: 1.7vw;
	color:#424242;
}

img#app-logo{width:70%;
	min-width:250px;
	margin-bottom: 20px;
}

img#app-illust{
	width:70%;
	padding: 3% 0;
	margin-bottom: 2%;
}
#appblock ul {
  list-style: none; /* Remove default bullets */
}
#appblock ul li::before {
  content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  color: #e02183; /* Change the color */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1.2em; /* Also needed for space (tweak if needed) */
  margin-left: -1.2em; /* Also needed for space (tweak if needed) */
}

#appblock ul li{line-height:2.1vw;
padding-top:1%; padding-bottom: 2%;}

#icon-block{height:4vw; width:100%; text-align: center; display: block;margin-top: 40vw; padding-left: 3vw; }
#icon-block .app-icon{height: 100%;}

#icon-block2{display: none;}

@media screen and (max-width: 767px){
#appblock{
	width: 100%;
	background: url("../images/home/app-bg.jpg") 0 0 no-repeat;
	background-size: 90%;
	packground-position: top center;
	padding: 10%;
	font-size: 3.5vw;
	color:#424242;
}
	
	#appblock ul li{line-height:4.1vw;
padding-top:1%; padding-bottom: 2%;}
	
	img#app-logo{width:100%;
	margin-bottom: 20px;
}
	
	#app-block1{display: block; height:80vw;}
	#icon-block{display: none;}
	#icon-block2{display: block;}
	#icon-block2 .app-icon{height: 9vw; padding: 1vw;}

}

/* PRESS BLOCK */

#pressblock{
	width: 100%;
	background-color: #363636;
	color:#fff;
	text-align: center;

}

#pressblock .container{padding-top: 50px; padding-bottom:100px; }

#pressblock img{ 
	max-width:80%;}

#pressblock .col-sm-4{margin: auto;}

@media screen and (max-width: 575px){
	#pressblock img{ 
	max-width:50%;}
}

#videoblock{padding: 70px 0 90px 0; }
#videoblock .col-md-6{padding: 15px;}


/* other content */

.page-content{
	padding-top: 100px;
	padding-bottom: 50px;
	height: auto;
	min-height: 85vh;
}

.page-content h1{ text-transform: uppercase; color:#939598; padding: 25px 0;}

/* Footer */

#footer{
	width: 100%;
	background: #939598;
	color: #f1f1f1;
	padding: 50px 0;
	font-size: 0.9em;
}

#footer a{font-weight:600; text-decoration: none; color:#fff;}
#footer a:hover{color:#ffb4da;}
#footer p.social{text-align:right; font-size: 1.4em; font-weight:600;}
#facebook, #twitter, #instagram{
	width: 25px;
	display: inline-block;
}
