/*

Title:			Saavn Corp | Base Styles

Z-Index:	  	0    – Outer Blocks
				100  – Wraps
				1000 – Nav Bar

GREY
Background		#f6f6f6
Default			#3e3e3e
Dark			#121212
Alt				#707070
Light			#a9a9a9
Subtle			#e6e6e6

GREEN
Standard		#30b55a
Highlight		#98f0b3
Dark			#17733c
Mint			#ddf8e7

OTHER
Alert			#f3464a
Naavy			#2a2d36
Naavy HLight	#8b9dbf

*/


/* Core
--------------------------------------------- */
*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

html, body {
	height: 100%;
	font-size: 16px;
}
body { background: #2a2d36; }
body, input, textarea, select, button {
	color: #3e3e3e;
	font-family: "Lato", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 400;
	-webkit-font-smoothing: auto;
	-moz-osx-font-smoothing: auto;
	text-rendering: optimizeLegibility;
}

/* Type */
p, li {
	line-height: 1.5;
	margin-bottom: 1.5em;
	text-rendering: optimizeLegibility;
}
ul, ol { margin-bottom: 1em; }
ul.show-bullet { list-style: disc; }
ol.show-nums { list-style: decimal; }
li { margin-bottom: .5em; }
ul.show-bullet li, ol.show-nums li { margin-left: 2em; }
a {
	color: #2bc5b4; /* #30b55a */
	cursor: pointer;
	text-decoration: none;
}
a:hover { color: #3e3e3e; }
.disabled {
	cursor: default !important;
	opacity: .26 !important;
	pointer-events: none !important;
}
.more-link {
	color: #30b55a;
	font-weight: 600;
	line-height: 1.5;
	margin: 0;
	position: relative;
}

strong {}
em {}
.smooth, .btn {
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: antialised;
    text-rendering: optimizeLegibility;
}
sup {
	font-size: .5em;
	opacity: .69;
}

h1 {
	color: #3e3e3e;
	font-size: 4em;
	font-weight: 400;
	margin-bottom: .25em;
	
    -webkit-font-smoothing: subpixel-antialiased;
	-moz-osx-font-smoothing: subpixel-antialised;
    text-rendering: optimizeLegibility;
}
h2 {
	font-size: 3.4em;
	font-weight: 500;
	letter-spacing: -.021em;
	margin-bottom: .75em;
}
h3 {
	font-size: 2.1em;
	font-weight: 400;
	line-height: 1.25;
	margin-bottom: .75em;
}
h4 {
	font-size: 1.3em;
	font-weight: 400;
	line-height: 1.2;
	margin-bottom: .875em;
}
h5 {
	font-size: 1.25em;
	margin-bottom: 16px;
}
h6 {
	font-size: 1em;
	font-weight: 700;
	margin-bottom: 16px;
}
h1 a, h2 a, h3 a, h4 a, h5 a { color: inherit; }

/* Core Effects */
a, .btn, a .btn, .ease, .block .card, .badge, a.card .link { transition: all .12s ease-out; }
.ease.slow { transition: color .69s ease-out, background .69s ease-out, opacity .34s ease-out; }
body.scrolled .masthead .btn:not(.app-stores) { transition: background .12s ease-out, color .12s ease-out, box-shadow .12s ease-out; }
body.scrolled .masthead .btn.app-stores { transition: none; }

/* SVG Easing */
.saavn-logo-svg { transition: fill .17s ease-out, opacity .17s ease-out; }
.saavn-store-svg { transition: fill .69s ease-out; }

/* Link Arrows */
.arrow {
	display: block;
	overflow: hidden;
	position: relative;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.arrow:after { transition: margin-left .12s ease-out; }
	.btn.arrow.left:before { transition: margin-right .12s ease-out; }
.more-link:not(.no-arrow):after, .arrow:after, .btn.arrow.left:before {
	border-top-width: 2px;
	border-right-width: 2px;
	border-top-style: solid;
	border-right-style: solid;
	content: ' ';
	display: inline-block;
	height: 7px;
	margin-left: 0.34em;
	position: relative;
	transform: rotate(45deg);
	vertical-align: middle;
	width: 7px;
}
	.btn.arrow.left:after { display: none; }
	.btn.arrow.left:before {
		margin-left: 0;
		margin-right: .34em;
		transform: rotate(-135deg);
	}
.arrow.light-arrow:after, .arrow.hover-arrow:after {
	border-color: #a9a9a9;
	opacity: .75;
}
.arrow.hover-arrow:after { opacity: 0; }
.arrow.light-arrow:hover:after { border-color: inherit; }
.arrow.hover-arrow:hover:after { opacity: 1; }
.more-link:not(.no-arrow):after, a .more-link:after { transition: margin .12s ease-out; }
.more-link:not(.no-arrow):hover:after, .arrow:hover:after, a:hover .more-link:after { margin-left: .48em; }
	.btn.arrow.left:hover:before { margin-right: .48em; }
.arrow.down:after {
	left: 4px;
	top: -2px;
	transform: rotate(135deg);
}

/* Generic Stuff */
.no-br { white-space: nowrap; }
.alt { color: #707070; }
.light { color: #a9a9a9; }
.justify {
	text-align: justify;
	text-align-last: center;
}
.highlight {
	background: rgba(43, 197, 180, .19); /* rgba(221, 248, 231, .69); */
	padding: 0 2px;
}
a.highlight:hover { background: rgba(43, 197, 180, 1); } /* rgba(221, 248, 231, 1); */
.highlight.alert {
	background: rgba(243,70,74,.12);
	color: #f3464a;
}
.medium { font-size: 93%; }
.small { font-size: 75%; }
.no-margin { margin: 0; }
.mdot { padding: 0 .2em; }
h4 .mdot, h5 .mdot, h6 .mdot { padding: 0 .25em; }
.ellip {
	display: block;
	overflow: hidden;
	position: relative;
	text-overflow: ellipsis;
	white-space: nowrap;
}

abbr.emoji {
	color: #fff;
	display: inline-block;
	font-size: 120%;
	margin: -10% 0;
	padding-right: .175em;
	position: relative;
	top: .075em;
}
.mobile abbr.emoji {
	padding-right: 0;
	top: .025em;
}

h2.bezel, h3.bezel, h4.bezel {
	margin-bottom: .5em;
	padding-bottom: .5em;
	position: relative;
}
h2.bezel:after, h3.bezel:after, h4.bezel:after {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	bottom: 0;
	content: '';
	left: 50%;
	margin-left: -21px;
	position: absolute;
	width: 42px;
}

a.inherit, a.subtle { color: inherit; }
a.subtle { border-bottom: 1px solid rgba(0,0,0,.12); }
a.subtle:hover {
	border: none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
}

.invert { color: #fff; }
.invert h2, .invert h3, .invert h4 a:hover, .invert .light, .invert.light { color: #8b9dbf; }
.invert h2 a:hover, .invert h3 a:hover, .invert h4 a { color: #fff; }

.invert a.subtle:not(:hover), a.subtle.invert:not(:hover) { border-bottom: 1px solid rgba(139,157,191,.12); }
.invert .alt { color: inherit; }
.invert .big-text.bezel-outside.center:before { color: #8b9dbf; }

/* Big Blocks */
.big-text {}
.big-text p:not(.small):not(.medium) {
	font-size: 1.5em;
	margin-bottom: .84em;
}
.big-text p.small {
	font-size: 84%;
	margin-bottom: .84em;
}
.big-text:not(.bezel-outside) h2 {
	margin-bottom: 1px;
	padding-bottom: 1.42em;
	position: relative;
}
.big-text p + .btn { margin-top: .66em; }
.big-text sup { font-size: .4em; font-weight: 600; }
.big-text p + .btn + p { margin-top: .5em; }
.big-text p.no-margin { margin-bottom: 0; }

@media (max-width: 568px) {
	.big-text p { font-size: 1.25em; }
}

.big-text.bezel-outside {
	padding-bottom: 4.8em;
	position: relative;
}
.big-text.bezel-outside h2, .big-text.no-bezel h2,
h2.big-text.bezel-outside, h2.big-text.no-bezel { margin-bottom: 1rem; }
.big-text.bezel-outside p { margin-bottom: 0; }

.big-text:not(.bezel-outside) h2:before, h2.big-text:before,
.big-text.bezel-outside:before {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	bottom: .7em;
	content: '';
	left: 0;
	position: absolute;
	width: 40px;
}
.big-text.bezel-outside:before { bottom: 2.37em; }
.big-text.center h2:before, h2.center.big-text:before, .big-text.bezel-outside.center:before {
	left: 50%;
	margin-left: -20px;
}

.big-text.no-bezel h2 { padding-bottom: 0; }
.big-text.no-bezel h2:before, h2.big-text.no-bezel:before { display: none; }

.big-text.condensed { padding-bottom: 2.5em; }
.big-text.condensed h2, .big-text.condensed h3 { margin: 0; }
.big-text.condensed.bezel-outside:before { bottom: 1.25em; }

.big-text.form-hdr { padding: .5em 0 1em 0; }

.badge {
	background: #2a2d36;
	border-radius: 3px;
	color: #fff;
	display: inline-block;
	font-size: 10px;
	font-weight: 600;
	margin-right: .5em;
	padding: .4em .57em;
	position: relative;
	text-transform: uppercase;
	top: -.2em;
}
.invert .badge, .badge.invert {
	background: #8b9dbf;
	color: #2a2d36;
}
.badge.light {
	background: rgba(0,0,0,.05);
	box-shadow: inset rgba(0,0,0,0.03) 0 0 0 1px;
	color: rgba(0,0,0,.34);
}
p .badge {
	margin: -.3em .5em -.3em 0;
	padding: .3em .57em;
}

/* Buttons */
.btn {
	border: none;
	border-radius: 500px;
	cursor: pointer;
	display: inline-block;
	font-size: 1.3em;
	font-weight: 700;
	line-height: 2;
	padding: .375em 2.5em .5em 2.5em;
	text-align: center;
	text-decoration: none !important;
	user-select: none;
	vertical-align: middle;
}
.btn.white {
	background: #fff;
	color: #2a2d36;
}
.btn.white:hover { background: rgba(255,255,255,.84); }

.btn.outline {
	background: transparent;
	box-shadow: inset #2a2d36 0 0 0 1px;
}
.btn.outline:hover, a:hover .btn.outline {
	background: #2a2d36;
	box-shadow: none;
	color: #fff;
}

.btn.outline.white {
	color: rgba(255,255,255,.84);
	box-shadow: inset rgba(255,255,255,.34) 0 0 0 1px;
}
.btn.outline.white:hover, a:hover .btn.white.outline {
	background: #fff;
	color: #2a2d36;
}

.btn.outline.light {
	color: #8b9dbf;
	box-shadow: inset #8b9dbf 0 0 0 1px;
}
.btn.outline.light:hover, a:hover .btn.light.outline {
	background: #fff;
	box-shadow: inset #fff 0 0 0 1px;
	color: #2a2d36;
}

.btn.basic {
	color: #3e3e3e;
	font-size: 1.1em;
	font-weight: 400;
	margin-bottom: 1.26em;
	opacity: .93;
	padding: .375em 1.4em .5em 1.5em;
	position: relative;
}
.btn.basic.arrow:after, .btn.basic.arrow.left:before {
	height: 9px;
	margin-left: .42em;
	margin-right: 1px;
	width: 9px;
}
	.btn.basic.arrow.left:before {
		margin-left: 1px;
		margin-right: .42em;
	}
.btn.basic.arrow:not(.white):hover {
	background: transparent;
	box-shadow: inset #2a2d36 0 0 0 1px, rgba(0,0,0,.17) 0 0 17px;
	color: inherit;
}
.btn.basic.arrow:hover:after { margin-left: .84em; }
	.btn.basic.arrow.left:hover:before { margin-right: .84em; }

.btn.green, .btn.blue { color: #fff; }
.btn.green { background: #2bc5b4; } /* #30b55a */
.btn.blue { background: #2d75df; }
.btn.naavy {
	background: #2a2d36;
	color: #8b9dbf;
}
.btn:not(.outline):hover, a:hover .btn:not(.outline) { opacity: .93; }

.btn.basic.green, .btn.basic.blue, .btn.basic.naavy {
	-webkit-font-smoothing: subpixel-antialiased;
	-moz-osx-font-smoothing: subpixel-antialised;
}

.btn.large {
	font-size: 1.6em;
	line-height: 1.5;
	padding: .4em 1.84em .5em 1.84em;
}
.btn.medium { font-size: 1.2em; }
.btn.small {
	font-size: 1em;
	line-height: 1.2em;
	padding: .45em 1.25em .55em 1.25em;
}
.btn.x-small {
	font-size: inherit;
	font-weight: 500;
	line-height: 1.2em;
	padding: .17em .75em .26em .75em;
}
.btn.shadow { box-shadow: rgba(0,0,0,.34) 0 4px 21px, rgba(0,0,0,.07) 0 2.5px 0; }

.btn em { font-weight: 400; opacity: .69; }

/* Quick and dirt font shimmy for small desktop screens / tablet portrait. */
@media(max-width: 840px) {
	html, body { font-size: 15px; }
}
/* Reset for mobile, which we'll handle more carefully. */
@media(max-width: 568px) {
	html, body { font-size: 16px; }
	
	h1 { font-size: 3em; }
	h2 { font-size: 2.6em; }
	h3 {
		font-size: 1.7em;
		line-height: 1.3;
	}
	
	.btn[class].condensed {
		font-size: 1.3em;
		line-height: 1.5;
		min-width: 184px;
	}
}
@media(max-width: 375px) {
	h1 { font-size: 2.84em; letter-spacing: -.02em; }
	h2 { font-size: 2.4em; }
	h3 {
		font-size: 1.4em;
		line-height: 1.4;
	}
}
@media(max-width: 320px) {
	h1 { font-size: 2.4em; letter-spacing: -.0125em; }
	h2 { font-size: 2.1em; }
	h3 {
		font-size: 1.2em;
		line-height: 1.5;
	}
}


/* Layout
--------------------------------------------- */
#wrapper { background: #f6f6f6; }

.wrap {
	padding: 0 30px;
	position: relative;
	margin: 0 auto;
	max-width: 1200px;
	z-index: 10;
}
.wrap.flush { padding: 0; }
.wrap:after, .nav-menu:after {
	content: " ";
	clear: both;
	display: table;
}

/* Mobile Mode (Layout) */
@media(max-width: 1240px) {
	.wrap:not(.flush) { padding: 0 5%; }
}
@media(max-width: 468px) {
	.wrap:not(.flush) {
		padding-left: 20px;
		padding-right: 20px;
	}
}

.center { text-align: center; }
.br-group { white-space: nowrap; }
.pad { padding-top: 1.25em; }
.fill {
	bottom: 0;
	left: 0;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 0;
}
.angle {
	transform: skewY(3.5deg);
	transform-origin: 100%;
}

.angle-bottom { padding-bottom: 7.5vw; }
.angle-top { padding-top: 2.6vw; }

/* Basic Grid */
.grid {
	display: flex;
	flex-wrap: wrap;
}
.grid.padded { margin: 0 -15px; }
.grid .col { width: 100%; }
	/* Number Of Columns */ 
	.grid-2 .col { width: 50%; }
	.grid-3 .col { width: 33.3333%; }
	.grid-4 .col { width: 25%; }
	.grid-5 .col { width: 20%; }
	.grid-6 .col { width: 16.6666%; }
	/* Shift Columns */
	.grid-3 .shift { margin-left: 16.6666%; }
	.grid-4 .shift { margin-left: 12.5%; }
	.grid-5 .shift { margin-left: 10%; }
.grid.padded .col {
	padding-left: 15px;
	padding-right: 15px;
}
.grid:before, .grid:after, .col-break {
	content: " ";
	display: table;
	width: 100%;
}
.grid:after, .col-break, .narrow-wrap { clear: both; }
.col-break { display: block; }
.col.can-flex.should-flex { width: 100%; }

.narrow-wrap {
	margin: 0 auto;
	max-width: 570px;
	width: 100%;
}
.grid-align { display: inline-block; }
.divider {
	padding-top: 40px;
	position: relative;
	width: 100%;
}
.divider:before {
	border-top: 1px solid #e6e6e6;
	content: '';
	height: 1px;
	left: 50%;
	margin-left: -25%;
	position: absolute;
	top: 0;
	width: 50%;
}
.button-wrap:not(.inline) .btn:not(:hover) {
	margin-right: .21em;
	margin-left: .21em;
}
.button-wrap.inline .btn:not(:hover) { margin-right: .84em; }
.button-wrap.inline .btn:hover { margin-right: .42em; }

/* For custom layouts, attach this and a size below to your grid wrapper element. */
.layout { margin-left: auto; margin-right: auto; }
	/* Based on 12 Col Grid */
	.layout-12[class] { width: 100%; }
	.layout-11[class] { width: 91.6666%; }
	.layout-10[class] { width: 83.3333%; }
	.layout-9[class]  { width: 75%; }
	.layout-8[class]  { width: 66.6666%; }
	.layout-7[class]  { width: 58.3333%; }
	.layout-6[class]  { width: 50%; }
	.layout-5[class]  { width: 41.6666%; }
	.layout-4[class]  { width: 33.3333%; }
	.layout-3[class]  { width: 25%; }
	.layout-2[class]  { width: 16.6666%; }
	.layout-1[class]  { width: 8.3333%; }

/* Content Containers */
.container { padding-bottom: 4em; }
.big-text .container { padding-bottom: 3.333em; }
.angle-top .container { padding-top: 1em; }

/* Cards */
.card {
	background: #fff;
	border-radius: 2px;
	box-shadow: rgba(42,45,54,.075) 0 12px 34px, rgba(0,0,0,.05) 0 6px 15px, inset transparent 0 0 0 0;
	display: block;
	height: 100%;
}
	a.card {
		color: inherit;
		transition-duration: .17s;
		transform: translate3d(0,0,0);
	}
	a.card:hover { transform: translateY(-3px); }
	a.card:not(:hover) .link { border-bottom-color: transparent; }
	a.card.invert { color: #fff; }
	a.card.invert:hover .badge { background: #fff; }
.card-header {}
.card-content { padding: 30px 30px calc(30px - 1.5em) 30px; }
.card.invert {
	background: #2a2d36;
	border-radius: 3px;
}
.card.invert.condensed h4 { margin-bottom: .25em; }
.card.invert.condensed p {
	font-size: 80%;
	margin-bottom: 2em;
}

.card.flat {
	background: transparent;
	border-radius: 0;
	box-shadow: none;
}
.card.flat .card-content {
	border-radius: 3px;
	box-shadow: inset rgba(0,0,0,.10) 0 0 0 1px;
}
.card.flat.no-fill .card-content {
	border-radius: 0;
	box-shadow: none;
}

@media(max-width: 1240px) {}
@media(max-width: 1024px) {
	.grid-1-condensed.wide-break .col {
		width: 100%;
	}
}
@media(max-width: 840px) {
	.grid-2-condensed .col { width: 50%; }
	.grid-3-condensed .col { width: 33.333%; }
}
@media(max-width: 768px) {
	.grid-1-condensed .col, .layout-1-condensed[class] { width: 100%; }
	.grid-1-condensed .col.shift { margin-left: 0; }
	
	.narrow-wrap .grid-1-condensed {
		display: block;
		flex-wrap: initial;
		padding: 1em 0;
	}
	.narrow-wrap .grid-1-condensed:before, .narrow-wrap .grid-1-condensed:after { display: none; }
	
	/* For resetting cols when we break to mobile sizes. */
	.layout-12-condensed[class] { width: 100%; }
	.layout-11-condensed[class] { width: 91.6666%; }
	.layout-10-condensed[class] { width: 83.3333%; }
	.layout-9-condensed[class]  { width: 75%; }
	.layout-8-condensed[class]  { width: 66.6666%; }
	.layout-7-condensed[class]  { width: 58.3333%; }
	.layout-6-condensed[class]  { width: 50%; }
	.layout-5-condensed[class]  { width: 41.6666%; }
	.layout-4-condensed[class]  { width: 33.3333%; }
	.layout-3-condensed[class]  { width: 25%; }
	.layout-2-condensed[class]  { width: 16.6666%; }
	.layout-1-condensed[class]  { width: 8.3333%; }
}
@media(max-width: 568px) {
	.grid-2-condensed .col { width: 100%; }
	.grid-3-condensed .col { width: 50%; }
}
@media(max-width: 480px) {

}


/* Navbar
--------------------------------------------- */
.navbar {
	height: 75px;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	transform: translateZ(2000px);
	transform-style: preserve-3d;
	z-index: 1000;
}
.navbar .wrap { height: 75px; }
.navbar.full-bezel .fill .wrap {
	max-width: none;
	padding: 0;
}
.navbar.full-bezel .fill .wrap:after {
	left: 0;
	right: 0;
}

/* Fill */
.navbar .fill { transition: background .12s ease-out; }
.navbar .fill:not(.bezel) {
	background: #2a2d36;
	opacity: 0;
}
body:not(.nav-pinned) .navbar .fill.artist-transition { transition: background .69s ease-out; }

/* Bezel */
.navbar .fill .wrap:after {
	background: rgba(255,255,255,.12);
	bottom: -1px;
	content: '';
	display: block;
	height: 1px;
	left: 30px;
	position: absolute;
	right: 30px;
	transition: all .12s ease-out;
	z-index: 0;
}
.navbar.fixed-bezel .fill:not(.bezel) .wrap:after { display: none; }
.navbar:not(.fixed-bezel) .fill.bezel { display: none; }

.navbar #logo {
	color: rgba(255,255,255,0);
	font-size: 0;
	height: 75px;
	float: left;
	line-height: 75px;
	width: 150px;
}
.navbar #logo svg,
.navbar #logo img {
	display: inline-block;
	height: 43px;
	vertical-align: middle;
	width: 100%;
}
.navbar #logo img {
	height: auto;
	max-height: 43px;
}
.navbar #logo .saavn-logo-svg { fill: #fff; }

/* Menu */
.nav-menu {
	
}
.nav-menu ul {
	float: right;
	margin: 0;
}
.nav-menu li {
	float: left;
	margin: 0;
}
.nav-menu li a {
	color: rgba(255,255,255,.84);
	display: block;
	font-weight: 500;
	line-height: 34px;
	padding: 20.5px 21px;
}
.nav-menu li.current:not(.btn-link) a, .nav-menu li:not(.btn-link) a:hover { box-shadow: inset #fff 0 3px 0; }
.nav-menu li.current a, .nav-menu li a:hover { color: #fff; }
.nav-menu li.btn-link.current a .btn { color: #2a2d36; }
body:not(.nav-pinned):not(.no-mast):not(.custom-nav) .nav-menu li:not(.current) a:not(:hover) .btn[class] { box-shadow: inset #8b9dbf 0 0 0 1px; }
.nav-menu li.current a .btn[class] { background: #fff; }
.nav-toggle { display: none; }
.nav-menu li a .btn { margin: -2px -5px 0 -5px; }

/* Pinned */
.nav-pinned:not(.custom-nav) .navbar .fill:not(.bezel), .no-mast .navbar .fill:not(.bezel) {
	background: #f6f6f6 !important;
	box-shadow: inset rgba(0,0,0,.12) 0 1px 0, rgba(0,0,0,.12) 0 1px 0, rgba(0,0,0,.03) 0 3px 0;
	opacity: 1;
}
	.no-mast .navbar .fill:not(.bezel) { opacity: 1 !important; }
.nav-pinned:not(.custom-nav) .navbar #logo .saavn-logo-svg, .no-mast .navbar #logo .saavn-logo-svg { opacity: .84; fill: #2a2d36; }
.nav-pinned:not(.custom-nav) .navbar #logo:hover .saavn-logo-svg, .no-mast .navbar #logo:hover .saavn-logo-svg { opacity: 1; }
.nav-pinned:not(.custom-nav) .navbar .fill .wrap:after { display: none; }
.nav-pinned:not(.custom-nav) .navbar .fill.bezel { display: none; }

.nav-pinned:not(.custom-nav) .nav-menu li a, .no-mast .nav-menu li a { color: #777; }
.nav-pinned:not(.custom-nav) .nav-menu li.current:not(.btn-link) a, .nav-pinned:not(.custom-nav) .nav-menu li:not(.btn-link) a:hover,
.no-mast .nav-menu li.current:not(.btn-link) a, .no-mast .nav-menu li:not(.btn-link) a:hover { box-shadow: inset #3e3e3e 0 3px 0; }
.nav-pinned:not(.custom-nav) .nav-menu li.current a, .nav-pinned:not(.custom-nav) .nav-menu li a:hover,
.no-mast .nav-menu li.current a, .no-mast .nav-menu li a:hover { color: #3e3e3e; }
.nav-pinned:not(.custom-nav) .nav-menu li a .btn.outline, .no-mast .nav-menu li a .btn.outline {
	box-shadow: inset #a9a9a9 0 0 0 1px;
	color: #777;
}
.nav-pinned:not(.custom-nav) .nav-menu li.current a .btn.outline, .nav-pinned:not(.custom-nav) .nav-menu li a:hover .btn.outline,
.no-mast .nav-menu li.current a .btn.outline, .no-mast .nav-menu li a:hover .btn.outline {
	background: #2a2d36;
	box-shadow: none;
	color: #fff;
}

/* Mobile Mode (Header) */
@media(max-width: 1240px) {
	.navbar .fill .wrap:after {
		left: 5%;
		right: 5%;
	}
}
@media(max-width: 1024px) {
	.tablet .navbar #logo, .tablet .navbar #logo svg { width: 166px; }
}
@media(max-width: 840px) {
	.navbar, .navbar .wrap { height: 60px; }
	.navbar #logo { height: 60px; line-height: 60px; }
	
	.navbar #logo, .navbar #logo svg, .tablet .navbar #logo, .tablet .navbar #logo svg { width: 120px; }

	.nav-menu li a { padding: 13px 15px; }
}

/* Collapsed (Hamburger) Nav */
@media(max-width: 768px) {
	body.nav-open { overflow: hidden; }
	
	.nav-toggle {
		cursor: pointer;
		display: block;
		height: 50px;
		position: absolute;
		right: 0;
		top: 0;
		width: 88px;
		z-index: 9999;
	}
	.nav-toggle span {
		background: rgba(255,255,255,.93);
		border-radius: 1px;
		display: block;
		height: 3px;
		opacity: 1;
		left: 50%;
		margin-left: -13px;
		position: absolute;
		transform: rotate(0deg);
		transition: .25s ease-in-out;
		width: 26px;
	}
	body:not(.nav-open).nav-pinned:not(.custom-nav) .nav-toggle span, .no-mast:not(.nav-open) .nav-toggle span {
		background: #2a2d36;
		opacity: .93;
	}
	.nav-toggle span:nth-child(1) { top: 19px; }
	.nav-toggle span:nth-child(2) { top: 27px; }
	.nav-toggle span:nth-child(3) { top: 35px; }
	
	.nav-open .nav-menu .nav-toggle span:nth-child(1) {
		top: 27px;
		transform: rotate(135deg);
	}
	.nav-open .nav-menu .nav-toggle span:nth-child(2) {
		opacity: 0;
	}
	.nav-open .nav-menu .nav-toggle span:nth-child(3) {
		top: 27px;
		transform: rotate(-135deg);
	}
	
	.nav-menu:before, .nav-menu ul {
		min-height: 100vh;
		position: fixed;
		top: 0;
		visibility: hidden;
	}
	.nav-menu:before {
		background: rgba(0,0,0,.48);
		content: '';
		min-width: 100vw;
		right: 0;
		transition: opacity .34s;
		z-index: 9998;
	}
	.nav-menu ul {
		background: #2a2d36;
		box-shadow: rgba(0,0,0,.12) -3px 0 0, inset rgba(255,255,255,.02) 1px 0 0;
		float: none;
		padding-top: 1.5em;
		right: calc(-309px - 10vw);
		transition: all .34s .08s cubic-bezier(0.175, 0.84, 0.193, 1.269);
		width: calc(309px + 10vw);
		z-index: 9998;
	}
	.nav-menu ul li {
		float: none;
	}
	body[class] .nav-menu ul li a {
		color: #fff;
		font-size: 1.48em;
		padding: .75em 1.2em .75em 1.84em;
		position: relative;
	}
	body[class] .nav-menu ul li a:hover, body[class] .nav-menu ul li.current a {
		color: #8b9dbf !important;
		box-shadow: none !important;
	}
	body[class] .nav-menu ul li:not(:last-child) a:after {
		background: rgba(255,255,255,.04);
		bottom: 0;
		content: '';
		height: 1px;
		left: 1.84em;
		position: absolute;
		right: 0;
	}
	body[class] .nav-menu ul li.current a:before {
		content: '•';
		font-size: .57em;
		height: 5.2em;
		left: 1.57em;
		line-height: 5.2em;
		position: absolute;
		top: 0;
	}

	.nav-open .nav-menu:before {
		opacity: 1;
		visibility: visible;
	}
	.nav-open .nav-menu ul {
		right: -10vw;
		visibility: visible;
	}
}
@media(max-width: 468px) {
	.navbar .fill .wrap:after {
		left: 20px;
		right: 20px;
	}
	.nav-toggle { width: 68px; }
}


/* Masthead
--------------------------------------------- */
.masthead {
	display: table;
	height: 50vh;
	max-height: 570px;
	min-height: 420px;
	overflow: hidden;
	padding: 75px 0;
	position: relative;
	width: 100%;
}
.masthead.flex { height: auto; }
.masthead.straight { padding-bottom: 0; }
.masthead .fill { background: #2a2d36; }
.masthead > .wrap {
	color: rgba(255,255,255,.69);
	display: table;
	height: 100%;
	width: 100%;
	z-index: 100;
	
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: antialised;
    text-rendering: optimizeLegibility;
}

.masthead .content {
	display: table-cell;
	padding: 0 0 calc(2em + 1vw) 1px;
	position: relative;
	transform: translateZ(2000px);
	transform-style: preserve-3d;
	vertical-align: middle;
	z-index: 200;
}
.masthead .content.no-click { pointer-events: none; }
.masthead h1 { color: #fff; }
.masthead h3 {
	color: #8b9dbf;
	line-height: 1;
	margin: 0;
}
.masthead .content p {
	color: #8b9dbf;
	font-size: 1.25em;
}
.masthead .content p strong { color: rgba(255,255,255,.93); }
.masthead .content p strong:not(.inline) { display: block; }

.masthead .content .btn.large { margin: 2.1em .25em 1.75em 0; }
.masthead .content .btn.large:not(.app-stores) { padding: .37em 1.26em .48em 1.26em; }
.masthead .content .app-stores .saavn-store-svg { fill: #2a2d36; }

.masthead .content p .link {
	border-bottom-style: solid;
	border-bottom-width: 1px;
	color: inherit;
	cursor: pointer;
}
.masthead .content p .link:hover { color: #fff; }

.masthead .image-fill {
	background: transparent center center no-repeat;
	background-size: cover;
	z-index: 1;
}
	.masthead .image-fill.right { background-position: 2% center; }
.masthead .image-fill:before, .masthead .image-fill:after {
	content: '';
	left: 0;
	position: absolute;
	right: 0;
}
.masthead .image-fill:before {
	background: linear-gradient(-12deg, rgba(42,45,54,.12) 0%, rgba(42,45,54,.75) 69%, rgba(42,45,54,.93) 100%);
	bottom: 0;
	top: 0;
	z-index: 5;
}
.masthead .image-fill:after {
	background: #f6f6f6;
	bottom: -7vw;
	height: calc(7vw + 1px);
	transform: skewY(3.5deg);
	transform-origin: 100%;
	z-index: 10;
}

.masthead .image-fill.subtle { opacity: .21; }
.masthead .image-fill.subtle:before { background: linear-gradient(-12deg, rgba(42,45,54,.12) 0%, rgba(42,45,54,.75) 69%, rgba(42,45,54,.93) 100%); }

/* Mobile Mode (Header) */
@media(max-width: 840px) {
	.masthead { padding: 60px 0; }
	.masthead .wrap:after {
		left: 20px;
		right: 20px;
	}
}
@media(max-width: 568px) {
	.masthead .content {
		padding-bottom: 1.2em;
		text-align: center;
	}
	.masthead.no-hero .content { padding-bottom: .125em; }
	.masthead .content .btn.large { margin: 0; }
	
	.masthead .content p { font-size: 1.7em; }
	
	/* Full-Height Mastheads */ 
	.masthead.full-screen .content { vertical-align: bottom; }
	.masthead.full-screen h1, .masthead.full-screen h3 {
		background-color: #2a2d36;
		margin-left: -20px;
		margin-right: -20px;
	}
	.masthead.full-screen h1 {
		margin-bottom: 0;
		padding-bottom: .125em;
		padding-top: .125em;
	}
	.masthead.full-screen h3 { padding-bottom: 3vh; }
}
@media(min-width: 568px) {
	.masthead h1, .masthead h3 { background: transparent !important; }
}
@media(max-width: 414px) {
	.masthead .content .btn.large { font-size: 6vw; }
}
@media(max-width: 375px) {
	.masthead .content p { font-size: 1.4em; }
}
@media(max-width: 320px) {
	.masthead .content p { font-size: 1.2em; }
}

/* No Masthead */
.no-mast #main {
	padding-top: calc(75px + 5em + 1.2vw);
	padding-bottom: calc(75px + 5em + 2.6vw);
}
@media (max-width: 568px) {
	.no-mast #main {
		padding-top: calc(75px + 2em + 1.2vw);
		padding-bottom: calc(75px + 2em + 2.6vw);
	}
}

/* Hero
--------------------------------------------- */
.mast-hero, .article-hero { margin-top: -9.3vh; }
.mast-hero .card-content { padding: 6% 7% calc(6% - 1.26em) 7%; }
.mast-hero .card-content .fine-print {
	background: #f6f6f6;
	margin: 5.75% -7% calc((6% - 1.26em) * -1) -7%;
	padding: 4% 7% calc(6% - 1.75em) 7%;
}

@media(min-width: 1440px) {
	.mast-hero, .article-hero { margin-top: -6vw; }
}

.article-hero .card {
	background: #f6f6f6;
	border-radius: 3px 3px 0 0;
	box-shadow: none;
	overflow: hidden;
}
.article-hero .card-content {
	min-height: 6em;
	padding: 0 0 4em 0;
}
.article-hero .card img { width: 100%; }


/* Quick Sidebar Nav
--------------------------------------------- */
.quick-nav-col {}
.quick-nav-wrap {
	border-right: 1px solid #e6e6e6;
	margin-top: 1em;
}

.quick-nav {}
.quick-nav li a {
	display: block;
	padding: .25em 1em .25em 0;
}
.quick-nav:not(.green) li:not(.current) > a, .quick-nav:not(.green) li.sub-current > a { color: #3e3e3e; }
.quick-nav:not(.green) li.current:not(.sub-current) > a:hover { color: #30b55a; }
.quick-nav li:not(.current) > a:hover, .quick-nav li.current.with-subnav.current.sub-current > a:hover {
	color: #2a2d36;
	box-shadow: inset #2a2d36 -3px 0 0;
}
.quick-nav li.current, .quick-nav li.current.with-subnav:not(.sub-current) > a { box-shadow: inset #30b55a -3px 0 0; }
.quick-nav li.current.with-subnav { box-shadow: inset rgba(0,0,0,.03) -3px 0 0, #30b55a 1px 0 0; }

.quick-nav .children {
	font-size: .84em;
	margin: .5em 0 0 .75em;
}


/* Footer
--------------------------------------------- */
.footer {
	position: relative;
	z-index: 400;
}
.footer .fill { background: #2a2d36; }
.footer .wrap {
	color: #8b9dbf;
	min-height: 17vh;
	padding-bottom: 50px;
}
.footer .wrap:after { display: none; }

.footer .grid {
	margin-bottom: 26px;
	padding: 43px 0 34px 21%;
}
.footer .grid:before {
    background: transparent url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MiIgaGVpZ2h0PSI0MiIgdmlld0JveD0iMCAwIDQyIDQyIj48cGF0aCBmaWxsPSIjMUVDQ0IwIiBkPSJNMCwyMWMwLDExLjUsOS40LDIxLDIxLDIxczIxLTkuNCwyMS0yMVMzMi41LDAsMjEsMFMwLDkuNSwwLDIxeiIvPjxwYXRoIGZpbGw9IiNGRkYiIGQ9Ik0xOC4xLDMyLjljLTAuOC0xLjMtMS44LTIuNS0zLjEtMy4zcy0yLjYtMS40LTQuMi0xLjhjLTAuMSwwLTAuMywwLTAuNCwwLjFjLTAuMSwwLjEtMC4xLDAuMy0wLjEsMC40IGMwLDAuMSwwLDAuMywwLjEsMC4zYzEuNywyLjUsNC4zLDQuMyw3LjIsNS4xaDAuMWMwLjEsMCwwLjEsMCwwLjMsMGMwLDAsMC4xLDAsMC4xLTAuMWwwLjEtMC4xYzAsMCwwLTAuMSwwLTAuMyBDMTguMiwzMy4xLDE4LjIsMzIuOSwxOC4xLDMyLjl6Ii8+PHBhdGggZmlsbD0iI0ZGRiIgZD0iTTMzLjYsMTcuNXYtMC4xYy0wLjctMi40LTItNC41LTMuOC02Yy0xLjgtMS42LTMuOS0yLjgtNi4zLTMuMWgtMC4xYy0wLjEsMC0wLjMsMC0wLjQsMC4xIGMtMC4xLDAuMS0wLjEsMC4zLTAuMSwwLjR2MC4xYzEuMiw3LjIsMC40LDE0LjUtMi4yLDIxLjRjMCwwLjEtMC4xLDAuMS0wLjEsMC4zYzAsMC4xLTAuMSwwLjEtMC4zLDAuMWMtMC4xLDAtMC4xLDAtMC4zLDAgYzAsMC0wLjEsMC0wLjEtMC4xbC0wLjEtMC4xYzAsMCwwLTAuMSwwLTAuM2MwLDAtMC4xLTAuOS0wLjEtMS4zYy0wLjgtNi4zLTIuNi0xMi4zLTUuNi0xNy45YzAtMC4xLTAuMS0wLjEtMC4xLTAuMWwtMC4xLTAuMSBjMCwwLTAuMSwwLTAuMywwYy0wLjEsMC0wLjEsMC0wLjMsMEMxMS4zLDEyLDkuOSwxMy44LDguOSwxNmMwLDAuMSwwLDAuMywwLDAuNGMwLDAuMSwwLjEsMC4zLDAuMywwLjNjMi45LDEuOCw1LjIsNC4yLDYuOSw3LjIgYzEuNywyLjksMi42LDYuMywyLjgsOS42YzAsMC4xLDAsMC4zLDAuMSwwLjRjMC4xLDAuMSwwLjMsMC4xLDAuMywwLjFjMC4zLDAsMC43LDAuMSwwLjksMC4xYzAuMSwwLDAuMywwLDAuNC0wLjEgYzAuMS0wLjEsMC4xLTAuMSwwLjEtMC4zYzAuNy0zLjQsMi4xLTYuNyw0LjMtOS40czUtNC44LDguMy02LjNjMC4xLDAsMC4xLTAuMSwwLjMtMC4xQzMzLjYsMTcuNiwzMy42LDE3LjYsMzMuNiwxNy41eiIvPjxwYXRoIGZpbGw9IiNGRkYiIGQ9Ik0zMS45LDI2LjloLTAuMWMtNC4xLDAuOS03LjcsMy4xLTEwLjMsNi4zYy0wLjEsMC4xLTAuMSwwLjMtMC4xLDAuNGMwLDAuMSwwLDAuMywwLjEsMC40IGMwLjEsMC4xLDAuMywwLjEsMC40LDAuMWMyLjEtMC4xLDQuMi0wLjgsNi0xLjhjMS44LTEsMy40LTIuNiw0LjUtNC41YzAuMS0wLjEsMC4xLTAuMywwLjEtMC40YzAtMC4xLDAtMC4zLTAuMS0wLjQgQzMyLjEsMjYuOSwzMiwyNi45LDMxLjksMjYuOXoiLz48L3N2Zz4=') no-repeat;
    background-size: 42px;
	content: '';
    height: 42px;
    left: 0%;
	opacity: .93;
    position: absolute;
    top: 0;
    width: 42px;
    margin-top: 45px;
    margin-left: 30px;
}

.footer h6 { color: rgba(255,255,255,.84); }
.footer li, .footer p {
	color: rgba(139, 157, 191, .69);
	font-size: .84em;
	line-height: 2em;
}
.footer li a { color: rgba(139, 157, 191, .69); }
.footer li a:hover { color: #8b9dbf; }
.footer ul, .footer p { margin: 0; }
.footer ul + h6 { padding-top: 2.1em; }

.copyright {
	padding-bottom: 7px;
	position: relative;
}
.copyright:after {
	background: rgba(139, 157, 191, .12);
	content: '';
	display: block;
	height: 1px;
	left: 0;
	position: absolute;
	right: 0;
	top: -1.75em;
}
.footer .copyright p {
	float: right;
	font-size: .75em;
	line-height: 2.6em;
}

.social-links { float: left; }
.social-links li {
	display: inline-block;
	margin-right: 12px;
	position: relative;
}
.social-links li a {
	background: transparent url(../_i/icons.social.svg) 0 0 no-repeat;
	background-size: 30px auto;
	display: block;
	height: 30px;
	opacity: .69;
	overflow: hidden;
	position: relative;
	text-indent: 100%;
	transition: opacity .34s;
	width: 30px;
	z-index: 100;
}
	.social-links li.social-twitter a { background-position: 0 0; }
	.social-links li.social-facebook a { background-position: 0 -30px; }
	.social-links li.social-instagram a { background-position: 0 -60px; }
	.social-links li.social-snapchat a { background-position: 0 -90px; }
	.social-links li.social-youtube a { background-position: 0 -120px; }
.social-links li a:hover {
	opacity: 1;
	z-index: 200;
}
	.social-links li.social-twitter a:hover { background-position: 0 -150px; }
	.social-links li.social-facebook a:hover { background-position: 0 -180px; }
	.social-links li.social-instagram a:hover { background-position: 0 -210px; }
	.social-links li.social-snapchat a:hover { background-position: 0 -240px; }
	.social-links li.social-youtube a:hover { background-position: 0 -270px; }

.social-links li:before {
	background: transparent;
	border-radius: 100px;
	content: '';
	height: 2px;
	left: 50%;
	opacity: 0;
	margin: -1px 0 0 -1px;
	position: absolute;
	top: 50%;
	transition: height .21s ease-out, width .21s ease-out, margin .21s ease-out, opacity .34s linear;
	width: 2px;
	z-index: 50;
}
	.social-links li.social-twitter:before { background: #1da1f2; }
	.social-links li.social-facebook:before { background: #3b5998; }
	.social-links li.social-instagram:before { background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); }
	.social-links li.social-snapchat:before { background: #fffc00; }
	.social-links li.social-youtube:before { background: #e62117; }
.social-links li.hover:before {
	height: 84px;
	margin-top: -42px;
	margin-left: -42px;
	opacity: .84;
	width: 84px;
}

/* Mobile Mode (Footer) */
@media (max-width: 1240px) {
	.footer .grid:before { margin-left: 5%; }
}
@media (max-width: 768px) {
	.footer .grid {
		padding-top: 43px;
		padding-left: 0;
	}
	.footer .grid:before { display: none; }
	.footer .grid .col { margin-bottom: 20px; }
	.footer li {
		display: inline-block; 
		margin-right: 12px;
	}
	.footer ul + h6 { padding-top: 20px; }
}
@media (max-width: 568px) {
	.footer .wrap { padding-bottom: 12px; }
	.footer .grid {
		padding-bottom: 0;
		padding-top: 34px;
	}
	.social-links, .footer .copyright p { float: none; }
	.footer .copyright p { text-align: left; }
}


/* App Store Button
--------------------------------------------- */
.app-stores[class] {
	cursor: default;
	overflow: hidden;
	min-width: 284px;
	padding: .42em 1.26em;
	position: relative;
}
.app-stores .placeholder { visibility: hidden; }
.app-stores span {
	animation-fill-mode: forwards;
	animation-timing-function: linear;
	animation-direction: normal;
	animation-delay: 0s;
}
.app-stores .label, .app-stores .stores {
	bottom: 0;
	left: 12px;
	position: absolute;
	right: 12px;
	top: 0;
}

.app-stores .label {
	height: 100%;
	line-height: 2.2em;
	
	/* Initial state is shown. */
	animation-name: slide-in-vertical;
	animation-duration: 430ms;
}
.app-stores:hover .label {
	animation-name: slide-out-vertical;
	animation-duration: 260ms;
}

.app-stores .stores {
	color: rgba(255,255,255,0);
	font-size: 0;
	left: 50%;
	margin-left: -112px;
	width: 224px;
}
.app-stores .stores span {
	cursor: pointer !important;
	float: left;
	height: 100%;
	line-height: 60px;
	width: 33.333%;
	
	/* Initial state is hidden. */
	animation-name: slide-out-vertical;
	animation-duration: 260ms;
}
	.app-stores .stores span.hero-android svg { margin-left: 3px; }
	.app-stores .stores span.hero-windows svg { margin-left: -3px; }
.app-stores .stores span svg {
	display: inline-block;
	height: 52px;
	transition: all .12s ease-out;
	vertical-align: middle;
	width: auto;
}
.app-stores:hover .stores span {
	animation-name: slide-in-vertical;
	animation-duration: 430ms;
}
	.app-stores:hover span.hero-ios {
		animation-delay: .01s;
		animation-fill-mode: backwards;
	}
	.app-stores:hover span.hero-android {
		animation-delay: .07s;
		animation-fill-mode: backwards;
	}
	.app-stores:hover span.hero-windows {
		animation-delay: .12s;
		animation-fill-mode: backwards;
	}
.app-stores .stores span:hover { opacity: .75; }

/* Outline Version */
.app-stores.outline.basic { margin-bottom: 0; }
.app-stores.outline.basic .saavn-store-svg { fill: #2a2d36; }
.app-stores.outline.basic:hover {
	background: transparent;
	box-shadow: inset #2a2d36 0 0 0 1px, rgba(0,0,0,.17) 0 0 17px;
}
.app-stores.block { display: block; }

/* Condensed Version */
.app-stores[class].condensed {
	font-size: 1.3em;
	line-height: 1.5;
	min-width: 184px;
	padding: .42em 2em;
}
.app-stores.condensed .label { line-height: 2.25em; }
.app-stores.condensed .stores {
	margin-left: -78px;
	width: 156px;
}
.app-stores.condensed .stores span { line-height: 48px; }
.app-stores.condensed .stores span svg { height: 42px; }

/* Mobile Mode (App Store Button) */
@media(max-width: 840px) {
	.app-stores .label { line-height: 2.25em; }
	.app-stores .stores {
		margin-left: -92px;
		width: 184px;
	}
	.app-stores .stores span { line-height: 57px; }
	.app-stores .stores span svg { height: 48px; }
}

@keyframes slide-in-vertical {
	0% {
		opacity: 0;
		-ms-transform: translate(0, 100%);
		transform: translate(0, 100%);
		animation-timing-function: cubic-bezier(.34, 0, 0, 1);
	}
	75% {
		opacity: 1;
		-ms-transform: translate(0, 0);
		transform: translate(0, 0);
		animation-timing-function: linear;
	}
	100% {
		opacity: 1;
		-ms-transform: translate(0, 0);
		transform: translate(0, 0);
	}
}
@keyframes slide-out-vertical {
	0% {
		opacity: 1;
		-ms-transform: translate(0, 0);
		transform: translate(0, 0);
		animation-timing-function: cubic-bezier(1, 0, .69, 1);
	}
	100% {
		opacity: 0;
		-ms-transform: translate(0, 100%);
		transform: translate(0, 100%);
	}
}


/* Accordions
--------------------------------------------- */
.nav-list:not(.fixed) .hdr { cursor: pointer; }
.nav-list:not(.fixed) > ul {
	margin: 0;
	max-height: 0;
	overflow: hidden;
	padding: 0;
}
.nav-list:not(.fixed).open ul {
	max-height: 1200px;
	overflow-y: scroll;
	padding-bottom: 1em;
}


/* Tooltips
--------------------------------------------- */
.tooltip { position: relative; }
.tooltip .just-the {
	background: rgba(42, 45, 54, .93);
	border-radius: 4px;
	box-shadow: rgba(0,0,0,.21) 0 2px 6px 1px, inset rgba(139, 157, 191, .12) 0 0 0 1px;
	color: #fff;
	pointer-events: none;
	bottom: 110%;
	display: block;
	left: 50%;
	margin-left: -67px;
	opacity: 0;
	padding: .75em 1.2em;
	position: absolute;
	text-align: center;
	transition: transform .17s ease-out, opacity .21s ease-out;
	width: 134px;
}
	.tooltip.invert .just-the {
		background: rgba(139,157,191,.97);
		box-shadow: rgba(0,0,0,.21) 0 2px 6px 1px, inset rgba(42, 45, 54, .12) 0 0 0 1px;
		color: #2a2d36;
	}
.tooltip:hover .just-the {
	opacity: 1;
	transform: translate3d(0, -7px, 0);
}


/* Carousels
--------------------------------------------- */
.carousel-wrap { position: relative; }
.carousel {
	display: block;
	overflow: hidden;
	position: relative;
	user-select: none;
	width: 100%;
}
.carousel-track {
	opacity: 0;
	padding: 0;
	width: 100%;
	z-index: 100;
}
.carousel:not(.carousel-flush) .carousel-track { padding: 1px .75em; }
.carousel-track:after {
	content: '';
	clear: both;
	display: table;
	width: 100%;
}
.carousel .carousel-item {
	display: flex;
	float: left;
	height: 100%;
	width: 570px;
}
	/* These two get sized via JS */ 
	.carousel.full-width .carousel-item {}
	.carousel.carousel-widescreen .carousel-item {}
.carousel .carousel-item > .copy { display: block; }
.carousel.center .carousel-item > .copy { margin: 0 auto; }
.carousel:not(.carousel-flush) .carousel-item { margin: 0 .75em; }

/* Mouse Pointers */
.carousel .carousel-item.current {
	cursor: grab;
	cursor: -webkit-grab;
}
.carousel[class] .carousel-item:active, .carousel[class] .carousel-track.animating .carousel-item:active {
	cursor: grabbing;
	cursor: -webkit-grabbing;
}
.carousel.carousel-hideArrows .carousel-item:not(.current) { cursor: pointer; }

/* Arrows */
.carousel-wrap .arrow {
	background: transparent;
	color: transparent;
	height: 100px;
	margin-top: -50px;
	opacity: 0;
	position: absolute;
	transition: none;
	top: 50%;
	width: 100px;
	z-index: 200;
}
.carousel-wrap .arrow:after {
	border-top-width: 6px;
	border-right-width: 6px;
	color: #a9a9a9;
	height: 34px;
	margin: -17px 0 0 0;
	left: 50%;
	position: absolute;
	top: 50%;
	width: 34px;
}
.carousel-wrap:hover .arrow, .carousel-wrap.carousel-showArrows .arrow { opacity: 1; }
.carousel-wrap:hover .arrow:hover:after { color: #3e3e3e; }
	.carousel-wrap .arrow.left {
		left: -60px;
		right: auto;
	}
	.carousel-wrap .arrow.left:after {
		margin-left: -7px;
		transform: rotate(225deg);
	}
	.carousel-wrap .arrow.right {
		left: auto;
		right: -60px;
	}
	.carousel-wrap .arrow.right:after { margin-left: -10px; }

/* Small Arrows */
.carousel-wrap.carousel-smallArrows .arrow {
	height: 80px;
	margin-top: -40px;
	width: 60px;
}
.carousel-wrap.carousel-smallArrows .arrow:after {
	border-top-width: 3px;
	border-right-width: 3px;
	height: 18px;
	margin-top: -9px;
	width: 18px;
}

@media (max-width: 568px) {
	.carousel-wrap.carousel-smallArrows .arrow { display: none; }
}

/* Widescreen */
.carousel-wrap.carousel-widescreen .arrow {
	height: 100%;
	margin: 0;
	top: 0;
	width: 62px;
}
.carousel-wrap.carousel-widescreen .arrow.left { left: 0; }
.carousel-wrap.carousel-widescreen .arrow.right { right: 0; }
	.carousel-wrap.carousel-widescreen .arrow.right:after { margin-left: -23px; }

/* Dots */
.carousel-dots {
	position: absolute;
	text-align: center;
	top: 100%;
	width: 100%;
}
.carousel-dots > a {
	box-shadow: inset rgba(0,0,0,.26) 0 0 0 1px;
	border-radius: 100%;
	display: inline-block;
	height: 10px;
	margin: 0 5px;
	width: 10px;
}
.carousel-dots > a.current {
	background: rgba(0,0,0,.26);
	box-shadow: rgba(0,0,0,.26) 0 0 0 1px, inset #f6f6f6 0 0 0 1.5px;
}


/* vCards
--------------------------------------------- */
.vcard {
	margin: 0 auto 1em auto;
	width: 242px;
}

.vcard div > span {
	color: #707070;
	font-size: .8em;
	line-height: 1.5;
}
.vcard span[property=name] {
	color: #3e3e3e;
	font-size: 1em;
	font-weight: 600;
	margin: 0 0 .25em 0;
}
.vcard span em {
	color: #707070;
	font-style: normal;
	font-weight: 400;
}

.vcard span[property=name], .vcard span[property=streetAddress], .vcard.india span[property=addressLocality] { display: block; }
.vcard.india span[property=streetAddress]:after, .vcard span[property=addressLocality]:after { content: ','; }
.vcard span[property=addressCountry] { display: none; }


/* Fancy Lists
--------------------------------------------- */
.fancy-list { counter-reset: li; }
.fancy-list > li {
	min-height: 3.4em;
    padding-left: 3.75em;
	padding-top: .7em;
	position: relative;
}
.fancy-list > li:before {
	background: #2a2d36;
	border-radius: 100%;
	color: #8b9dbf;
	content: counter(li);
	counter-increment: li;
	font-size: 16px;
	font-weight: 700;
	height: 2.8em;
	left: 0;
	line-height: 2.8em;
	position: absolute;
    text-align: center;
	top: 0;
	width: 2.8em;
}


/* Modals
--------------------------------------------- */
.modal-shade {
	align-items: center;
	background: transparent;
	bottom: 0;
	display: flex;
	justify-content: center;
	left: 0;
	padding: 0 50px;
	position: fixed;
	right: 0;
	top: 0;
	transition: background .48s ease-out;
	transform: translateZ(3000px);
	transform-style: preserve-3d;
	visibility: hidden;
	z-index: 9999;
}
.modal {
	background: #fff;
	box-shadow: rgba(0,0,0,.34) 0 6px 39px;
	border-radius: 6px;
	flex: none;
	max-height: calc(100% - 200px);
	max-width: 690px;
	overflow: scroll;
	-webkit-overflow-scrolling: touch;
	padding: 50px;
	visibility: hidden;
	width: 100%;
	z-index: 100;
}

/*
Fixed Elements
 - Close Button (Top Right)
 - More Overlay (Center Bottom)
*/
.modal-close, .modal-more {
	height: 120px;
	left: 0;
	opacity: 0;
	padding: 0 50px;
	position: absolute;
	right: 0;
	top: 0;
	transition: opacity .39s ease-out;
	visibility: hidden;
	z-index: 200;
}
	.modal-more {
		bottom: 0;
		height: 11em;
		pointer-events: none;
		top: auto;
		transition: opacity .39s ease-out;
	}
.modal-close-wrap, .modal-more-wrap {
	position: relative;
	margin: 0 auto;
	max-width: 690px;
	height: 100%;
	width: 100%;
}

/* Close */
.modal-close .close {
	background: #fff;
	border-radius: 20px;
	box-shadow: rgba(0,0,0,.12) 0 0 0 2px;
	bottom: 0;
	cursor: pointer;
	height: 40px;
	position: absolute;
	right: -20px;
	width: 40px;
}
.modal-close .close:hover { background: #f6f6f6; }
.modal-close .close:before, .modal-close .close:after {
	background: #a9a9a9;
	border-radius: 2px;
	content: '';
	height: 3px;
	left: 50%;
	margin: -1.5px 0 0 -10px;
	position: absolute;
	top: 50%;
	width: 20px;
}
.modal-close .close:before { transform: rotate(45deg); }
.modal-close .close:after { transform: rotate(-45deg); }

/* Simple Close (inside modal) */
.simple-close .modal { position: relative; }
.simple-close .modal-close {
	height: 40px;
	left: auto;
	padding: 0;
	right: 12px;
	top: 12px;
	width: 40px;
}
.simple-close .close { right: 0; }

/* More */
.modal-more .more {
	background: rgba(255,255,255,.93);
	background: linear-gradient(to bottom, rgba(255,255,255,.93) 0%, #fff 100%);
	box-shadow: inset rgba(0,0,0,.07) 0 1px 0, rgba(0,0,0,.03) 0 -2px 0;
	border-radius: 0 0 6px 6px;
	font-style: italic;
	height: 0px;
	line-height: 0;
	margin-top: calc(11em - 100px);
	overflow: hidden;
	position: relative;
	text-align: center;
	transition: all .34s .21s cubic-bezier(0.175, 0.84, 0.193, 1.269);
}
.modal-more .more:before, .modal-more .more:after {
	background: #30b55a;
	border-radius: 2px;
	content: '';
	height: 2px;
	left: 50%;
	margin: 12px 0 0 -10px;
	position: absolute;
	top: 50%;
	width: 12px;
}
.modal-more .more:before { transform: rotate(45deg); }
.modal-more .more:after {
	margin-left: -2px;
	transform: rotate(-45deg);
}

/* Show/Hide Modal & Extras */
.show-modal body {
	height: 100%;
	overflow: hidden;
}
.show-modal .modal-shade {
	background: rgba(0, 0, 0, .34);
	visibility: visible;
}
.show-modal .modal {
    animation: zoomIn 0.21s ease;
    visibility: visible;
}
.hide-modal .modal {
    animation: zoomOut 0.39s ease 0.1s;
    visibility: visible;
}
.modal-open .modal-shade:not(.scroll-hint) .modal-close, .modal-open .modal-more {
    opacity: 1;
    visibility: visible;
}
.modal-open .modal-more .more {
	height: calc(11em - 100px);
	line-height: calc(11em - 112px);
	margin-top: 0;
}
.modal-shade:not(.scroll-hint) .modal-more { opacity: 0; }

@keyframes zoomIn {
	0% {
		opacity: 0;
		transform: scale(0.8, 0.8);
		visibility: hidden;
	}
	57% {
		transform: scale(1.03, 1.03);
	}
	100% {
		opacity: 1;
		transform: scale(1, 1);
		visibility: visible;
	}
}
@keyframes zoomOut {
	0% {
		opacity: 1;
		transform: scale(1, 1);
		visibility: visible;
	}
	100% {
		opacity: 0;
		transform: scale(0.84, 0.84);
		visibility: hidden;
	}
}

/* Mobile Mode (Modals) */
@media (max-width: 480px), (max-height: 480px) {
	.modal-shade { padding: 0 20px; }
	.modal { max-height: calc(100% - 40px); }
	.modal-close, .modal-more {
		height: 60px;
		padding: 0 20px;
	}
		.modal-more { height: 6em; }
	.modal-close .close {
		height: 30px;
		right: 10px;
		width: 30px;
	}
	.modal-close .close:before, .modal-close .close:after {
		height: 2px;
		margin: -1px 0 0 -7px;
		width: 14px;
	}
}
@media (max-width: 375px), (max-height: 480px) {
	.modal { padding: 30px; }
}



/* Forms
--------------------------------------------- */
form { position: relative; }
h6 + form { padding-top: 1.25em; }

input[type=text], input[type=search], input[type=email], input[type=tel], textarea, select:not(.plain), .select-box, .check-wrap {
	background: rgba(0,0,0,.012);
	border: none;
	border-radius: 2px;
	display: block;
	font-size: 1em;
	margin: 0 0 30px 0;
	padding: .75em;
	width: 100%;
	-webkit-appearance: none;
}
select:not(.plain) {
	font-size: .9em;
	padding: .9em;
}
textarea { line-height: 1.4; }

input[type=text], input[type=search], input[type=email], input[type=tel], textarea { box-shadow: rgba(0,0,0,.12) 0 0 0 1px, inset rgba(0,0,0,.03) 0 2px 0 0; }
.select-box { box-shadow: rgba(0,0,0,.12) 0 0 0 1px, rgba(0,0,0,.03) 0 3px 0; }

input[type=text]:focus, input[type=search]:focus, input[type=email]:focus, input[type=tel]:focus, textarea:focus { box-shadow: rgba(0,0,0,.34) 0 0 0 1px, inset rgba(0,0,0,.03) 0 2px 0 0; }

::-webkit-input-placeholder { color: rgba(0,0,0,.34); }
::-moz-placeholder { color: rgba(0,0,0,.34); }
:-ms-input-placeholder { color: rgba(0,0,0,.34); }
:-moz-placeholder {
	color: rgba(0,0,0,.34);
	opacity: 1;
}

select:not(.plain) {
	opacity: 0;
	-webkit-appearance: none;
}
.select-wrap {
    cursor: pointer;
	display: block;
	position: relative;
	text-align: left;
}
.select-box {
	bottom: 0;
	left: 0;
	line-height: 2.75em;
	margin: 0;
	overflow: hidden;
	padding: 0 39px 0 .75em;
	position: absolute;
	right: 0;
	text-overflow: ellipsis;
	top: 0;
	white-space: nowrap;
	z-index: 0;
}
.select-box:after {
	border-color: #a9a9a9;
	border-top-width: 2px;
	border-right-width: 2px;
	border-top-style: solid;
	border-right-style: solid;
	content: ' ';
	display: inline-block;
	height: 7px;
	margin-top: -4px;
	position: absolute;
	right: 21px;
	top: 50%;
	transform: rotate(135deg) translate3d(0,0,0);
	vertical-align: middle;
	width: 7px;
}
.select-box.placeholder { color: rgba(0,0,0,.34); }

form .btn-wrap {
	padding-bottom: 1.5em;
	text-align: center;
}

/* Checkboxes */
.check-wrap {
	box-shadow: rgba(0,0,0,.12) 0 0 0 1px;
	color: #707070;
}
.check-wrap p { margin-bottom: .25em; }
.check-group {
	font-size: .84em;
	margin-bottom: -.5em;
	padding-top: 1em;
}
.check-group label {
	cursor: pointer;
	display: inline-block;
	margin: 0 1em .5em 0;
}
.check-group label input[type=checkbox] {
    display: inline-block;
    margin: 0 .5em 0 0;
	position: relative;
	top: -1px;
}

/* Errors */
.error input[type=text], .error input[type=search], .error input[type=email], .error input[type=tel], .error textarea { box-shadow: #f3464a 0 0 0 1px, inset rgba(0,0,0,.03) 0 2px 0 0; }
.error .select-wrap .select-box { box-shadow: #f3464a 0 0 0 1px, rgba(0,0,0,.03) 0 3px 0; }

.error ::-webkit-input-placeholder { color: #f3464a; }
.error ::-moz-placeholder { color: #f3464a; }
.error :-ms-input-placeholder { color: #f3464a; }
.error :-moz-placeholder { color: #f3464a; }
.error .select-box.placeholder, .error .select-wrap { color: #f3464a; }

form .error { position: relative; }
form .error .error-label {
	background: #f3464a;
	border-radius: 0 0 3px 3px;
	box-shadow: inset rgba(0,0,0,.12) 0 1px 0;
	color: rgba(255,255,255,.93);
	font-size: .8em;
	left: 14px;
	overflow: hidden;
	max-width: calc(100% - 28px);
	padding: .25em .4em .34em .34em;
	position: absolute;
	text-overflow: ellipsis;
	top: calc(100% - 30px);
	white-space: nowrap;
}

/* Submission */
form.sending .field {
	opacity: .34;
	pointer-events: none;
}

.submit {
	transition: all .34s ease-in-out;
	max-width: none;
}
.submit.sending, .submit.sending:hover {
	color: rgba(255,255,255,0);
	cursor: default !important;
	opacity: 1;
	overflow: hidden;
	position: relative;
	max-width: 184px;
}

.sending-spinner, .sending-spinner:after {
	border-radius: 50%;
	height: 1.4em;
	left: 50%;
	margin: -.7em 0 0 -.7em;
	position: absolute;
	top: 50%;
	width: 1.4em;
}
.sending-spinner {
	border: .2em solid rgba(255, 255, 255, 0.21);
	border-left: .2em solid #ffffff;
	transform: translateZ(0);
	animation: spinner .48s infinite linear;
}
@keyframes spinner {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	} 100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

.sending-bar {
	background: #2a2d36;
	bottom: 0;
	display: none;		/* TODO: There's some weird CSS bug here, so hiding this for now. Can do it later, or not at all. */
	left: 0;
	position: absolute;
	transition: width 3.4s .12s linear;
	top: 0;
	width: 1px;
}
.sending-bar.progress { width: 100%; }


/* Toast Messages
--------------------------------------------- */
.site-message {
	background: #30b55a;
	border-radius: 4px;
	bottom: -100%;
	box-shadow: rgba(42,45,54,.12) 0 12px 34px, rgba(0,0,0,.07) 0 6px 15px, inset transparent 0 0 0 0;
	color: #98f0b3;
	display: table;
	left: 2em;
	opacity: .97;
	pointer-events: none;
	position: fixed;
	transition: bottom .39s ease-out;
	width: calc(100% - 4em);
	z-index: 99999;
}
.site-message.show { bottom: 2em; }
.site-message-wrap {
	display: table-cell;
	padding: 2em;
	text-align: center;
	vertical-align: middle;
	width: 100%;
}

.site-message-wrap h3 {
	color: #fff;
	font-size: 1.3em;
	margin: -.1em 0 .4em 0;
}
.site-message-wrap p:last-child { margin: 0; }

@media (max-width: 480px) {
	.site-message {
		left: 1em;
		width: calc(100% - 2em);
	}
	.site-message.show { bottom: 1em; }
}


/* 404 / Error Pages
--------------------------------------------- */
h1.xl {
	font-size: 5em;
	font-weight: 600;
}

.turntable {
	height: 340px;
	margin: 1.7em auto 1.2em auto;
	overflow: hidden;
	position: relative;
	width: 340px;
}
.record, .needle {
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}
.record {
	animation: spinner .93s infinite linear;
	background-image: url(../_i/404-record.png);
	z-index: 100;
}
.needle {
	animation: needle .9s infinite ease-in-out;
	animation-direction: alternate;
	background-image: url(../_i/404-needle.png);
	transform-origin: 90% 10%;
	z-index: 200;
}
@keyframes needle {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	} 100% {
		-webkit-transform: rotate(3deg);
		transform: rotate(3deg);
	}
}

@media (max-width: 568px) {
	.turntable {
		height: 260px;
		width: 260px;
	}
}


/* Special Alert / Callout
--------------------------------------------- */
.megaphone #back-bezel { transition: top .21s ease-in-out; }
.megaphone .navbar { transition: height .21s ease-in-out, padding-top .21s ease-in-out; }
.megaphone .navbar .fill .wrap { transition: height .21s ease-in-out; }
.megaphone .megastrip { transition: height .21s ease-in-out, background .21s ease-in-out, color .21s ease-in-out; }

.megaphone.show #back-bezel { top: 75px; }
.megaphone.show .navbar { height: 150px; padding-top: 75px; }
.megaphone.show .navbar .fill .wrap { height: 150px; }
.megaphone.show .masthead { padding-top: 150px; }

.megaphone .megastrip {
	background: #2a2d36;
	box-shadow: rgba(255,255,255,.12) 0 1px 0, inset rgba(0,0,0,.12) 0 -2px 0;
	color: #8b9dbf;
	height: 0;
	left: 0;
	overflow: hidden;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 2000;
}
	.megaphone.show .megastrip { height: 75px; }

.megaphone .megastrip .strip-contain {
	display: table;
	height: 100%;
	width: 100%;
}
.megaphone .megastrip .strip-wrap {
	display: table-cell;
	height: 100%;
	vertical-align: middle;
	width: 100%;
}
.megaphone .megastrip a {
	display: block;
	color: inherit;
	padding: 1em calc(1em + 34px) 1em 0;
}
	.megaphone .megastrip .strip-wrap.no-close a {
		padding-right: 0;
		position: relative;
	}
	.megaphone .megastrip .strip-wrap.no-close a .more {
		background: #8b9dbf;
		border-radius: 100px;
		box-shadow: none;
		content: 'Some FAQs';
		color: #2a2d36 !important;
		font-size: .9em;
		line-height: 2em;
		opacity: .93;
		margin-top: -1.3em;
		padding: .2em 1.34em;
		position: absolute;
		right: 0;
		top: 50%;
	}
.megaphone .megastrip .strip-wrap p { margin: 0; }
.megaphone .megastrip .strip-wrap .close {
	background: red;
	height: 34px;
	margin-top: -17px;
	position: absolute;
	right: 1em;
	top: 50%;
	width: 34px;
}

@media(max-width: 840px) {
	.megaphone.show #back-bezel { top: 60px; }
	.megaphone.show .navbar { height: 120px; padding-top: 60px; }
	.megaphone.show .navbar .fill .wrap { height: 120px; }
	.megaphone.show .masthead { padding-top: 80px; }
	
	.megaphone.show .megastrip { height: 60px; }
	
	.megaphone .megastrip .strip-wrap.no-close a .more { margin-top: -1.4em; }
}
@media(max-width: 768px) {
	.nav-open .megastrip { z-index: 999; }
}
@media(max-width: 468px) {
	.megaphone .megastrip .strip-wrap.no-close a .more {
		font-size: .8em;
		padding: .2em 1.25em .2em 1.1em;
	}
	.megaphone .megastrip .strip-wrap.no-close a .more:after { top: -1px; }
}


/* Straight Mobile Shell
--------------------------------------------- */
.chrome {
	background: #e6e6e6;
	box-shadow: inset 0 0 3px 0 rgba(0,0,0,0.2);
	box-sizing: content-box !important;
	display: inline-block;
    position: relative;
	z-index: 20;
}
.chrome .screen {
	background: #2a2d36;
	border-radius: 1px;
	box-shadow: 0 0 0 3px #121212;
	color: rgba(139,157,191,.8);
	display: block;
	font-size: 7px;
	font-weight: 600;
	height: 100%;
	letter-spacing: .1em;
	overflow: hidden;
	position: relative;
	text-align: center;
	text-transform: uppercase;
	width: 100%;
	z-index: 3;
}
.chrome .camera, .chrome .speaker, .chrome .sensor {
	background: rgba(0,0,0,.75);
	border-radius: 100px;
	position: absolute;
	z-index: 3;
}
.chrome .screen img {
	display: block;
	height: 100%;
	margin: 0;
	width: 100%;
}

/* iPhone */
.chrome.iphone {
	border-radius: 52px;
	height: 560px;
	padding: 86px 16px;
	width: 314px;
}
.chrome.iphone:before {
	background: #f6f6f6;
	border-radius: 48px;
	content: '';
	height: calc(100% - 12px);
	left: 6px;
	position: absolute;
	top: 6px;
	width: calc(100% - 12px);
	z-index: 1;
}
.chrome.iphone:after {
	border-radius: 46px;
	box-shadow: inset 0 0 3px 0 rgba(0,0,0,.1), inset 0 0 6px 3px #fff;
	content: '';
	height: calc(100% - 16px);
	left: 8px;
	position: absolute;
	top: 8px;
	width: calc(100% - 16px);
	z-index: 2;
}
/* Top */
.chrome.iphone .camera {
	height: 10px;
	left: 50%;
	margin-left: -6px;
	top: 20px;
	width: 10px;
}
.chrome.iphone .speaker {
	height: 6px;
	left: 50%;
	margin-left: -30px;
	top: 44px;
	width: 60px;
}
.chrome.iphone .sensor {
	height: 12px;
	top: 40px;
	left: 116px;
	width: 12px;
}
/* Sides */
.chrome.iphone .left {
	background: #e6e6e6;
	border-radius: 4px 0px 0px 4px;
	box-shadow: inset rgba(0,0,0,.07) 0 0 0 1px;
	height: 66px;
	left: -5px;
	position: absolute;
	top: 186px;
	width: 5px;
	z-index: 0;
}
.chrome.iphone .left:before, .chrome.iphone .left:after, .chrome.iphone .right {
	background: inherit;
	border-radius: 4px 0px 0px 4px;
	box-shadow: inset rgba(0,0,0,.07) 0 0 0 1px;
	content: '';
	display: block;
	left: 0px;
	position: absolute;
	width: 100%;
}
.chrome.iphone .left:before {
	height: 40px;
	top: -78px;
}
.chrome.iphone .left:after {
	height: 66px;
	top: 78px;
}
.chrome.iphone .right {
	border-radius: 0px 4px 4px 0px;
	height: 66px;
	left: auto;
	right: -5px;
	top: 186px;
	width: 5px;
}
/* Bottom */
.chrome.iphone .home {
	background: rgba(0,0,0,.12);
	border-radius: 100%;
	bottom: 18px;
	box-shadow: inset rgba(0,0,0,.05) 0 0 0 1px;
	height: 56px;
	left: 50%;
	margin-left: -28px;
	position: absolute;
	width: 56px;
	z-index: 3;
}
.chrome.iphone .home:after {
	background: #f6f6f6;
	border-radius: 100%;
	box-shadow: rgba(0,0,0,.03) 0 0 0 1px;
	content: '';
	height: calc(100% - 10px);
	left: 5px;
	position: absolute;
	top: 5px;
	width: calc(100% - 10px);
}


/* Payment Icons
--------------------------------------------- */
.payments {
	font-size: 0;
	padding: 12px 0 0 0;
}
.payments .secure, .payments ul { display: inline-block; }
.payments .secure, .payments li {
	border-radius: 2px;
	color: rgba(0,0,0,0);
	display: inline-block;
	height: 24px;
	margin: 0 0 0 3px;
	overflow: hidden;
	vertical-align: top;
	width: 34px;
}
.payments .secure {
	box-shadow: inset rgba(139,157,191,.34) 0 0 0 1px;
	overflow: visible;
	position: relative;
	width: 75px;
}
	.payments .secure:hover { box-shadow: inset rgba(139,157,191,.84) 0 0 0 1px; }
	.payments .secure .just-the {
		font-size: 15px;
		font-style: normal;
		font-weight: 600;
		margin-left: -112px;
		width: 224px;
	}
.payments .secure:after {
	color: #8b9dbf;
	content: 'Secure';
	height: 100%;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .1em;
	line-height: 22px;
	position: absolute;
	right: 6px;
	top: 0;
	text-transform: uppercase;
}

.payments ul { font-size: 0; }
.payments li {
	background: url(../_i/icons.payments.svg) center top no-repeat;
	background-size: 100%;
	box-shadow: inset rgba(255,255,255,.07) 0 0 0 1px;
}
	.payments li.payment-visa {}
	.payments li.payment-mastercard { background-position: 0 -25px; }
	.payments li.payment-amex { background-position: 0 -50px; }
	.payments li.payment-discover { background-position: 0 -75px; }
	.payments li.payment-stripe { background-position: 0 -100px; }

.payments .lock {
	background: #8b9dbf;
	border-radius: 2px;
	height: 8px;
	left: 8px;
	position: absolute;
	top: 11px;
	width: 11px;
}
.payments .lock:before, .payments .lock:after {
	content: '';
	position: absolute;
}
.payments .lock:before {
	border: 2px solid #8b9dbf;
	border-bottom: 0;
	border-radius: 100px 100px 0 0;
	height: 5px;
	left: 2px;
	top: -6px;
	width: 7px;
}

@media(max-width: 568px) {
	.payments { transform: scale(.62); }
	.payments .secure:after { line-height: 24px; }
}

#payment-submitting {
	background: rgba(42,45,54,.84);
	display: none;
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	transform: translate3d(0, 0, 2000px);
	width: 100%;
	z-index: 99999999999;
}
#payment-submitting:before, #payment-submitting:after {
	position: absolute;
	left: 50%;
	text-align: center;
	top: 50%;
}
#payment-submitting:before {
	animation: pulse 1.69s infinite;
	box-shadow: rgba(243,70,74,.48) 0 0 0 1px;
	border-radius: 100%;
	content: '😍';
	font-size: 34px;
	height: 40px;
	line-height: 42px;
	margin: -20px 0 0 -20px;
	width: 40px;
	z-index: 30;
}
#payment-submitting:after {
	background: #f6f6f6;
	border-radius: 4px;
	box-shadow: rgba(0,0,0,.48) 0 12px 69px;
	color: #3e3e3e;
	content: 'One moment...';
	font-weight: 700;
	height: 112px;
	line-height: 75px;
	margin: -42px 0 0 -92px;
	padding-top: 40px;
	width: 184px;
	z-index: 20;
}
@keyframes pulse {
	0% { box-shadow: rgba(243,70,74,.48) 0 0 0 1px; }
	70% { box-shadow: rgba(243,70,74,0) 0 0 0 12px; }
	100% { box-shadow: rgba(243,70,74,0) 0 0 0 1px; }
}
.angle-bottom{
	padding-top: 15px;
}
.no-bg{
	background: none;
}