@charset "UTF-8";
@viewport {
  width: device-width;
}
html {
	height: 100%;
}
.body {
	background: #f8f8f8;
	color: #222;
	font-family: niveau-grotesk, sans-serif;
	font-style: normal;
	font-size: 14px;
	font-weight: ;
	height: 100%;
	margin: 0;
}
::placeholder {
	color: #555;
	font-size: 15px;
	font-weight: 400;
	opacity: 1;
}

/* ----- text ----- */

.niveau {
	font-family: niveau-grotesk, sans-serif;
}
.freight {
	font-family: freight-sans-pro, sans-serif;	
}
.prometo {
	font-family: prometo, sans-serif;	
}
.seravek {
	font-family: seravek-web, sans-serif;	
}
.allumi {
	font-family: allumi-std, sans-serif;
}
.sofia {
	font-family: sofia-pro, sans-serif;
}
.gibson {
	font-family: canada-type-gibson, sans-serif;
}
.ebony {
	font-family: ebony, sans-serif;
}
.usual {
	font-family: usual, sans-serif;
}
.rival {
	font-family: rival-sans, sans-serif;
}
.univia {
	font-family: univia-pro, sans-serif;
}

a {
	text-decoration: none;
	color: #0E8AE0;
}
.href {
/*	color: #0E8AE0;	*/
	cursor: pointer;
}
h1 {
	font-size: 30px;
}
h2 {
	font-size: 25px;
}
h3 {
	font-size: 20px;
}
h4 {
	font-size: 16px;
}
h5 {
	font-size: 14px;
}
h1, h2, h3, h4, h5 {
	font-family: prometo, sans-serif;
	margin-bottom: 30px;
	line-height: normal;
	font-weight: 500;
}
b {
	font-weight: 500;
}
.heading {
	font-weight: 600;
	font-size: 14px;
	text-transform: uppercase;
}
p {
	margin-bottom: 20px;
}

/* ----- header ----- */

footer {
	background: #fff;
	width: 100%;
	margin-top: 50px;
	border-top: solid 1px #f5f5f5;
}
.footer {
	max-width: 1240px; /* -- 30px padding on each side -- */
    margin: 50px auto 0 auto;
    padding: 50px 0 40px 0;
}
.footer .heading {
	font-weight: 500;
	margin-bottom: 5px;
	color: #555;
	text-transform: uppercase;
}
.footer .item {
	padding: 5px 0;
	color: #999;
}
.footer .item a {
	color: #999;
}

header {
	transition: top 0.2s ease-in-out;
	background: #fff;
	position: fixed;
	height: 80px;
	width: 100%;
	top: 0;
	left: 0;
    z-index: 1000000000;
}
.header-temp {
	background: #fff;
	position: fixed;
	height: 80px;
	width: 100%;
	top: 0;
	left: 0;
    z-index: 1000000000;	
}
.nav-up {
    top: -80px;
}
.header-temp-strip {
	position: relative;
    padding: 15px;
    text-align: center;
    color: #fff;
    background: #000;
}
.header {
	height: 80px;
	position: relative;
	border-bottom: solid 1px #f8f8f8;
	max-width: 1240px; /* -- 30px padding on each side -- */
    margin: 0 auto;
    padding: 0;
	background: #fff;	
}
.subheader {
	background: #fff;
	border-bottom: solid 1px #f8f8f8;
	max-width: 1240px; /* -- 30px padding on each side -- */
    margin: 0 auto;
	padding: 10px 0;
	font-size: 13px;
	color: #555;
}
.header--logo {
	position: absolute;
	top: 17px;
	left: 0;
	width: 160px;
	height: 45px;
	background-image: url("/img/logo160.png");
	background-repeat: no-repeat;
	background-size: 160px 45px;
}
.header--logo--icon {
	display: none;
	position: absolute;
	top: 17px;
	left: 0;
	width: 45px;
	height: 45px;
	background-image: url("/img/icon.png");
	background-repeat: no-repeat;
	background-size: 45px 45px;
}
.header--search--box {
	max-width: 100%;
	margin-left: 180px;
	margin-right: 230px;
	position: relative;
	text-align: center;
}
.header--search--box--inner {
	position: relative;
	display: inline-block;
	width: 560px;
	margin: 18px 0 0 0;
}
.header--search {
	font-family: 'niveau-grotesk', 'sans-serif';
	border: solid 1px #ebebeb;
	border-radius: 24px;
	background: #fff;
	font-size: 16px;
	color: #222;
	font-weight: 400;
	padding: 12px 30px;
	width: 100%;
}
.header--search--icon--wrap {
	position: absolute;
	top: 6px;
	right: 8px;
	height: 32px;
	width: 32px;
}
.header--search--icon--circle {
	position: relative;
	height: 32px;
	width: 32px;
	background: #0E8AE0;
	border-radius: 100%;
}
.header--search--icon--inner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	height: 16px;
	width: 16px;
	background-image: url('/img/search-icon.svg');
	background-repeat: no-repeat;
}
.header--menubutton {
	display: none;
	position: absolute;
	top: 27px;
	right: 25px;
	width: 24px;
	height: 24px;
}
.header .menubutton:hover {
	color: #ddd;
}
.header--links {
	position: absolute;
	top: 32px;
	right: 0px;
	font-size: 15px;	
}
.header--links a {
	padding: 0 10px;
	color: #222;
}
.header a.logo--center {
	background-image: url("/img/logo-160.png");
	background-repeat: no-repeat;
	width: 160px;
	height: 32px;
	position: absolute;
	top: 20px;
	left: 50%;
	transform: translateX(-50%);
}
.header .searchbutton {
	display: none;
	position: absolute;
	top: 23px;
	right: 62px;
	color: #ddd;
	font-size: 26px;
}
.header .closebutton {
	position: absolute;
	top: 20px;
	right: 20px;
	color: #ddd;
	font-size: 32px;	
}
.header--overlay {
	position: absolute;
	display: none;
	top: 0;
	left: 0;
	background: #fff;
	z-index: 10000;
	width: 100%;
	height: 70px;	
}
.header--overlay--search {
	border: none;
	font-family: 'canada-type-gibson', 'FontAwesome';	
	width: 100%;
	height: 70px;	
	padding-left: 20px;
}
.subheader--left {
	float: left;
	margin-left: 20px;
}
.subheader--right {
	float: right;
	margin-right: 20px;
}
.subheader--link--left {
	margin-right: 15px;
}
.subheader--link--right {
	margin-left: 15px;
}
.subheader--link {
	margin: 0 10px;
}
.page--banner--image {
	width: 100%;
	height: 700px;
    background-repeat: no-repeat;
    background-position: center; 
	background-size: cover;
	position: relative;
    margin: 115px 0 0 0;
    z-index: 100;
}

/* ----- containers ----- */

.mw1500 {
	max-width: 1540px; /* -- 30px padding on each side -- */
    margin: 0 auto;
}
.mw1200 {
	max-width: 1240px; /* -- 30px padding on each side -- */
    margin: 0 auto;
}
.pmw1000 {
	max-width: 940px; /* -- 30px padding on each side -- */
    margin: 0 auto;
}
.mw600 {
	max-width: 640px; /* -- 30px padding on each side -- */
    margin: 0 auto;
}
.mw450 {
	max-width: 490px; /* -- 30px padding on each side -- */
    margin: 0 auto;
}
.mw400 {
	max-width: 440px; /* -- 30px padding on each side -- */
    margin: 0 auto;
}
.page {
	max-width: 1240px; /* -- 30px padding on each side -- */
    margin: 80px auto 0 auto;
    padding-top: 20px;
    position: relative;
	min-height: 100vh;
}

/* ----- modal ----- */

.modal__film {
	position: fixed;
	background: #000;
	opacity: 0.7;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow-x: hidden;	
	z-index: 10000000000;
	display: none; 
	padding: 0;
	display: none;
	align-items: center;
	justify-content: center;
}
.modal__wrap {
	position: fixed;
	background: none;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10000000000;
	align-items: center;
	justify-content: center;
	display: none;
}
.modal {
	position: relative;
	max-width: 640px; /* -- 30px padding on each side -- */
	z-index: 10000000000;
	background: #fff;
	border-radius: 10px;
	padding: 30px;
	box-shadow: 2px 2px 10px 0 #555;	
    max-height: calc(100vh - 210px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.modal__x {
	position: absolute;
	top: 30px;
	left: 30px;
	font-size: 25px;
	cursor: pointer;
	color: #888;
}
.menu--film {
	position: fixed;
	background: #fff;
	opacity: 0.97;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow-x: hidden;	
	z-index: 10000000000;
	display: none;
	padding: 0;
}
.menu--outside--wrap {
	position: relative;
	max-width: 1240px; /* -- 30px padding on each side -- */
    margin: -30px auto 0 auto;
	height: 100%;
	z-index: 10000000000;
}
.menu--content {
	position: relative;
	top: 150px;
	width: 100%;
	text-align: center;
	margin-top: 30px;
	z-index: 10000000000;
}
.menu--content .menu--header {
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 5px;
}
.menu--content .menu--link {
	display: block;
	color: #222;
	font-weight: 400;
	font-size: 16px;
	margin-bottom: 5px;
}
.menu--film .menubutton {
	position: absolute;
	top: 27px;
	right: 25px;
}
.menu--film .menubutton:hover {
	color: #ddd;
}


/* ----- promo ----- */

.promoblock--main {
	margin: 0 120px 0 0;
	height: auto;
}
.promoblock--logo {
	position: absolute;
	right: 20px;
	top: 15px;
	width: 100px;
	z-index: 100000;
}
.promoblock--amountoff {
	display: inline-block;
	vertical-align: middle;
	margin: 0 10px 5px 0;
	font-size: 23px;
	font-weight: 700;
	font-family: freight-sans-pro, sans-serif; 
}
.promoblock--title {
	font-size: 15px;
	color: #000;
	min-height: 60px;
	word-wrap: break-word;
}
.promoblock--label {
	display: inline-block;
	vertical-align: middle;
	font-size: 12px;
	color: #fff;
	text-align: center;
	border-radius: 10px;
	padding: 5px 10px;
}
.promoblock--tab {
	width: 0;
	height: 0;
	border-top: 40px solid #F5ED34;
	border-left: 40px solid transparent;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 100001;
}
.promoblock--tab--amazon {
	border-top-color: #FF9900;
}
.promoblock--tab--toppick {
	border-top-color: #FFCA38;
}
.promoblock--tab--competitors {
	border-top-color: #9AD908;
}
.promoblock--tab--icon {
	position: absolute;
	top: 6px;
	right: 6px;
	color: #fff;
	font-size: 12px;
	z-index: 100002;
}
.promoblock--tab--label {
	position: absolute;
	top: -18px;
	right: 0px;
	font-size: 11px;
	color: #000;
	font-weight: 400;
}

/* ----- flex page ----- */

.flex--container {
	display: flex;
	flex-direction: row;
}
.flex--column--middle {
	flex: 1;
}
.flex--column--left--250 {
	width: 250px;
	margin-bottom: 30px;
}

/* ----- flexbox ----- */

.flex--center {
	display: flex;
	justify-content: center;
}
.flex--stretch {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
}
.flex--promo {
	margin: 5px;
	flex-grow: 2;
}

/* ------ flex containers ---- */

.flex--container--wrapping {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
}

.flex--module--container {
	margin: 0 -10px;
	width: calc(100% + 20px);
}

/* ------ flex modules ---- */

.flex2--module {
	flex-grow: 1;
	flex-shrink: 1;
	flex-basis: auto;
	margin: 0 10px 20px 10px;
}

/* ----- flexbox ----- */

.flex--center {
	display: flex;
	justify-content: center;
}
.flex--stretch {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
}
.flex--promo {
	margin: 5px;
	flex-grow: 2;
}


/* ----- store block ----- */

.storeblock--logo {
	position: absolute;
	right: 25px;
	top: 20px;
	width: 100px;
}
.storeblock--main {
	margin: 0 120px 0 0;
	height: auto;
}

/* ----- top deal ----- */

.topdeal--card {
	border-radius: 12px;
	box-shadow: 2px 2px 10px 0 #eee;
	margin-right: 20px;
	height: 330px;
	flex-basis: 293px;
	margin-bottom: 20px;
}
.topdeal--logo--box {
	height: 200px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
}
.topdeal--logo {
	display: block;
}
.topdeal--bottom {
	border-top: solid 1px #eee;
	padding: 20px;
	vertical-align: top;
	font-size: 15px;
	height: 130px;
}
.regdeal--card {
	border: solid 1px #e7e7e7;
	border-radius: 8px;
	padding: 20px 25px;
	flex-basis: 230px;
	margin-right: 20px;
	margin-bottom: 20px;
}


/* --- tables --- */

.tablesh--cell {
	padding: 2px 0;
}

/* --- misc --- */

.exp--button--wide {
	font-size: 14px;
	background: #fff;
	text-align: center;
	color: #555;
	padding: 15px 20px;
	width: 100%;
}

.ddtab {
	padding: 10px 0;
	font-size: 16px;
	font-weight: 500;
	display: inline-block;
	cursor: pointer;
}
.dd--menu {
	display: none;
	padding: 10px 0;
}
.dd--menu--item {
	padding-bottom: 5px;
	font-size: 14px;
	font-weight: 400;
	display: block;	
}
.dd--menu--item a {
	color: #333;
}
.hoverstar:hover {
	color: #ddd;
	cursor: pointer;
}

/* -- resources pages -- */

.resource--page {
}
.resource--page p {
	margin-bottom: 25px;
	font-size: 15px;
	line-height: 22px;
}
.resource--page ul {
	margin-bottom: 25px;
	font-size: 15px;
	line-height: 22px;
}
.resource--page li {
    margin-left: 5px;
    margin-bottom: 10px;
    padding: 0 0 0 20px;
    position: relative;
}
.resource--page h1 {
	font-size: 30px;
}
.resource--page h2 {
	font-size: 27px;
}
.resource--page h3 {
	font-size: 20px;
	margin-bottom: 10px;
}
.resource--page h4 {
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 5px;
}
.resource--page li::before {
	content: '—';
	left: 0;
	position: absolute;
	top: 0;
	color: #999;
}
.ptext--short {
	font-size: 14px;
	line-height: 18px;
	word-wrap: break-word;
}
.ptext {
	font-size: 14px;
	line-height: 22px;
	word-wrap: break-word;
}
.ptext2 {
	font-size: 15px;
	line-height: 25px;
	word-wrap: break-word;
}
.ptext--short p {
	margin: 0 0 10px 0;
}
.ptext p {
	margin: 0 0 15px 0;
}
.ptext2 p {
	margin: 0 0 20px 0;
}
.ptext blockquote {
	background: #fafafa;
	padding: 10px 15px;
	border-left: solid 3px #eee;
	color: #555;
	font-style: italic;
	margin: 0 0 20px 10px;
}
.ptext blockquote p {
	margin: 0;
}
.ptext2 h1 {
	font-size: 30px;
	line-height: 35px;
}
.univia {
	font-family: 'univia-pro', sans-serif;
}
.norm {font-weight:400;}
.semibold {font-weight:500;}
.bold {font-weight:600;}
.extrabold {font-weight:700;}
.list li {
    margin-left: 5px;
    margin-bottom: 5px;
    padding: 0 0 0 20px;
    position: relative;
}
.list li::before {
	content: '—';
	left: 0;
	position: absolute;
	top: 0;
	color: #999;
}
.header--s3 {
	font-family: 'univia-pro', sans-serif;
	font-weight: 600;
	text-transform: uppercase;
	font-size: 12px;
	color: #999;
}

/* ----- inputs ----- */

.input--text--grey {
	border: none;
	padding: 20px 20px;
	font-size: 16px;
	color: #333;
	background: #fafafa;
	border: solid 1px #eee;
	font-weight: 400;
}
.input--text--redeem {
	font-size: 25px;
	padding: 10px;
}
.input--text--titlepreview {
	font-size: 15px;
	text-align: center;
	border: none;
	color: #555;
	background: #fafafa;
	font-weight: 400;
}
.input--text--disabled--addcode {
	background-color: #fff !important;
	border-color: #fff !important;
}
.label {
	font-size: 13px;
	font-weight: 500;
	display: block;
	margin: 0 0 5px 0;
}
.checkbox--label {
	float: left;
	line-height: 40px;
	vertical-align: middle;
	font-size: 13px;
}
.radio {
	border: none;
	background: #fafafa;
	border: solid 1px #eee;
	height: 40px;
	width: 40px;
	float: left;
	margin-right: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50%;	
}
.radio--check {
	background: #0CBBE5;
	height: 15px;
	width: 15px;
	border-radius: 50%;
	display: none;
	
}

/* --- custom select --- */

/* the container must be positioned relative: */
.custom-select {
	position: relative;
	font-family: 'canada-type-gibson', sans-serif;;
}

.custom-select select {
	display: none; /* hide original SELECT element: */
}

.select-selected {
	background-color: #eee;
	color: #333;
}

/* style the arrow inside the select element: */
.select-selected:after {
	position: absolute;
	content: "";
	top: 14px;
	right: 10px;
	width: 0;
	height: 0;
	border: 6px solid transparent;
	border-color: #aaa transparent transparent transparent;
}

/* point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after {
	border-color: transparent transparent #aaa transparent;
	top: 7px;
}

/* style the items (options), including the selected item: */
.select-items div,.select-selected {
	color: #777;
	padding: 10px 15px;
/*	border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent; */
	border: solid 1px #eee;
	background: #fafafa;
	cursor: pointer;
	user-select: none;
	text-align: left;
	font-size: 13px;
	margin-bottom: -1px;
}

/* style items (options): */
.select-items {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 99;
	border: solid 1px #fafafa;
}

/* hide the items when the select box is closed: */
.select-hide {
	display: none;
}
.select-items div:hover, .same-as-selected {
  background-color: #f5f5f5;
}


/* ----- buttons ----- */

.btn {
	font-family: freight-sans-pro, sans-serif; 
	font-weight: 600;
	padding: 8px 20px;
	border: none;
	border-radius: 8px;
	text-align: center;
	color: #fff;
	font-size: 14px;
	display: inline-block;
	vertical-align: middle;
	cursor: pointer;
}
.btn--blue {
	background: #0E8AE0;
	border-color: #0E8AE0;
}
.btn--green {
	background: #9AD908;
	border-color: #9AD908;
}
.btn--grey {
	background: #999;
	border-color: #999;
}
.btn--grb {
	background: #aaa;
	border-color: #aaa;
}

.btn--promo {
	font-family: freight-sans-pro, sans-serif; 
	background: #0E8AE0;
	border-color: #0E8AE0;
	font-weight: 600;
	padding: 12px 25px;
	border-radius: 8px;
	text-align: center;
	color: #fff;
	margin-top: 7px;
	font-size: 15px;
	display: inline-block;
	vertical-align: middle;
	cursor: pointer;
}
.btn--promo:hover {
	background: #2796E3;
}
.btn--code {
	margin-top: 7px;
	background-color: #0E8AE0;
	position: relative;
	padding: 12px 33px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
}
.btn--code:hover {
	background-color: #2796E3;
}
.btn--code--corner {
	right: 0px;
    width: 25px;
    height: 25px;
    bottom: 0px;
    position: absolute;
    background: #084C7B;
    transition: 0.15s;
    border-bottom: 25px solid #d7d7d7;
    border-left: 25px solid transparent;
    pointer-events: none;
    border-top-left-radius: 8px;		
}
.btno {
	font-family: freight-sans-pro, sans-serif; 
	font-weight: 600;
	padding: 10px 20px;
	border: solid 1px #222;
	border-radius: 8px;
	text-align: center;
	color: #222;
	font-size: 15px;
	display: inline-block;
	vertical-align: middle;
	cursor: pointer;
}
.copy-code {
	cursor: pointer;
}
.open-link {
	cursor: pointer;
}
.popu {
	cursor: pointer;	
}

/* ----- codes, pills ----- */

.code {
	font-family: freight-sans-pro, sans-serif; 
	display: inline-block;
	font-size: 25px;
	font-weight: 500;
	text-align: center;
	cursor: pointer;
	line-height: auto;
	vertical-align: middle;
	margin-right: 5px;
}
.codepill {
	font-family: freight-sans-pro, sans-serif; 
	display: inline-block;
	font-size: 20px;
	font-weight: 600;
	text-align: center;
	cursor: pointer;
	line-height: auto;
	vertical-align: middle;
	margin-right: 5px;
	padding: 10px 30px;
	border: solid 1px #ccc;
	border-radius: 8px;
	color: #444;
	background: #fdfdfd;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.codepill:hover {
/*	color: #0E8AE0; */
	background: #fafafa;
}
.codepill--cut {
	color: #bbb;
	margin-right: 3px;
}
.pointermenu {
	z-index: 10000;
	position: absolute;
	top: -28px;
	height: 30px;
	line-height: 30px !important;
	vertical-align: middle;
	width: 100px;
	left: 50%;
	transform: translateX(-50%);
	background: #333;
	font-size: 12px;
	font-weight: 500;
	border-radius: 10px;
	color: #fff;
	text-align: center;
	font-style: normal;
	line-height: normal;
}
.pointermenu--arrow {
	z-index: 10000;
	position: absolute;
	top: 2px;
	left: 50%;
	transform: translateX(-50%);
	width: 0; 
	height: 0; 
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 7px solid #333;
}
.pointermenu2 {
	width: 200px;
	background: #444;
	top: -45px;
}
.pointermenu2--arrow {
	border-top: 7px solid #444;	
	top: -15px;
}
.code--link {
	display: inline-block;
	vertical-align: middle;
	line-height: auto;
	font-size: 18px;
	font-weight: 500;
	margin-left: 10px;
	text-align: center;
	cursor: pointer;
	color: #0CBBE5;
}

/* -- codebox getcode -- */

.getcodebox {
  white-space: nowrap;
  overflow: hidden;
	text-overflow: ellipsis;
	border: 0;
	background: #f5f5f5;
	color: #0E8AE0;
	padding: 20px;
	font-size: 32px;
	font-weight: 700;
	text-align: center;
	min-width: 150px;
  max-width: 350px;
  width: 100%;
	margin: 0 auto;
}

/* -- codebox -- */

.codebox {
	text-overflow: ellipsis;
    white-space: nowrap; 
    overflow: hidden;
	border: 0;
	background: #f5f5f5;
	padding: 0 20px;
	vertical-align: middle;
	height: 50px;
	line-height: 50px;
	font-size: 18px;
	font-weight: 500;
	text-align: center;
	display: inline-block;
	width: 170px;
	margin: 0;
	cursor: pointer;
}
.codebox--btn {
	border: 0;
	background: #0E8AE0;
	width: 80px;
	vertical-align: middle;
	height: 30px;
	line-height: 30px;
	font-size: 13px;
	font-weight: 500;
	text-align: center;
	display: inline-block;
	cursor: pointer;
	color: #fff;
	border-radius: 8px;
}
.codebox--btn:hover {
	background: #2796E3;
}
.codebox--btn--clicked {
	border: 0;
	background: #85BA21;
	width: 80px;
	vertical-align: middle;
	height: 30px;
	line-height: 30px;
	font-size: 13px;
	font-weight: 500;
	text-align: center;
	display: inline-block;
	cursor: pointer;
	color: #fff;
}
.codebox--btn--clicked:hover {
	background: #85BA21;
}
.codebox--btn--wrapper {
	display: inline-block;
	background: #f5f5f5;
	vertical-align: middle;
	height: 50px;
	line-height: 50px;	
	text-align: center;
	width: 100px;
	margin: 0 0 0 -5px;
	border: 0;
}
.codebox--resp--wrapper {
	display: inline-block;
}
.codebox--resp--wrapper--outer {
	text-align: center;
}
.codebox--redeem--btn {
	display: none;
	margin-top: 5px;
	border: 0;
	width: 270px;
	font-size: 13px;
	font-weight: 500;
	text-align: center;
	cursor: pointer;
	color: #fff;
	padding: 8px 0;
	background: #0E8AE0;
	border-radius: 8px;
}
.codebox--redeem--btn:hover {
	background: #2796E3;
}

/* --- CODEBOXSM2 --- */

.codeboxsm2 {
	text-overflow: ellipsis;
    white-space: nowrap; 
    overflow: hidden;
	text-overflow: ellipsis;
	border: 0;
	background: #f5f5f5;
	padding: 0 20px;
	vertical-align: middle;
	height: 50px;
	line-height: 50px;
	font-size: 17px;
	font-weight: 500;
	text-align: center;
	display: inline-block;
	width: 200px;
	margin: 0;
	cursor: pointer;
}
.codeboxsm2--btn {
	border: 0;
	background: #0E8AE0;
	width: 80px;
	vertical-align: middle;
	height: 30px;
	line-height: 30px;
	font-size: 13px;
	font-weight: 500;
	text-align: center;
	display: inline-block;
	cursor: pointer;
	color: #fff;
	border-radius: 8px;
}
.codeboxsm2--btn:hover {
	background: #0D83D5;
}
.codeboxsm2--btn--clicked {
	border: 0;
	background: #85BA21;
	width: 80px;
	vertical-align: middle;
	height: 30px;
	line-height: 30px;
	font-size: 13px;
	font-weight: 600;
	text-align: center;
	display: inline-block;
	cursor: pointer;
	color: #fff;
}
.codeboxsm2--btn--clicked:hover {
	background: #85BA21;
}
.codeboxsm2--btn--wrapper {
	display: inline-block;
	background: #f5f5f5;
	vertical-align: middle;
	height: 50px;
	line-height: 50px;	
	text-align: center;
	width: 100px;
	margin: 0 0 0 -5px;
	border: 0;
}
.codeboxsm2--resp--wrapper {
	display: inline-block;
}
.codeboxsm2--resp--wrapper--outer {
	text-align: center;
}
.codeboxsm2--redeem--btn {
	display: none;
	margin-top: 10px;
	border: 0;
	width: 300px;
	font-size: 13px;
	font-weight: 600;
	text-align: center;
	cursor: pointer;
	color: #fff;
	padding: 9px 0;
	background: #0E8AE0;
	border-radius: 3px;
}
.codeboxsm2--redeem--btn:hover {
	background: #0D83D5;
}

/* --- vote buttons --- */

.btn--vote {
	background: #f5f5f5;
	border: solid 1px #eee;
	color: #555;
	font-size: 13px;
	padding: 7px 10px;
	cursor: pointer;
	border-radius: 10px;
}
.btn--vote--large {
	font-size: 15px;
	padding: 10px 20px;
}
.btn--vote--yes--click {
	background: #9AD908;
	color: #fff;
}
.btn--vote--no--click {
	background: #FF5F71;
	color: #fff;
}


/* ----- pills ----- */

.pill {
	display: inline-block;
	font-size: 13px;
	margin: 0 5px 5px 0;
	padding: 4px 12px;
	border: solid 1px #eee;
	background: #fafafa;
	color: #555;
	text-align: center;	
}
.pill-close {
	color: #ccc;
	margin-left: 5px;
	cursor: pointer;
}
.codepill--wrap {
	position: relative;
	display: inline;
}
.codepill--btn {
	display: inline-block;
	margin-top: -5px;
	font-size: 13px;
	font-weight: 400;
	padding: 8px 30px;
	border: solid 1px #eee;
	background: #fcfcfc;
	color: #888;
	text-align: center;
	cursor: pointer;
	line-height: normal;
	max-width: 100%;
}
.codepill--copied {
	background: #E7F7FC;
	color: #00B3E2;
	border-color: #E7F7FC;
}
.codepill--copied--bubble {
	z-index: 10000;
	position: absolute;
	top: -60px;
	height: 26px;
	line-height: 26px !important;
	vertical-align: middle;
	width: 100px;
	left: 50%;
	transform: translateX(-50%);
	background: #00B3E2;
	font-size: 11px;
	border-radius: 3px;
	color: #fff;
	text-align: center;
	font-weight: normal;
	font-style: normal;
	line-height: normal;
}
.codepill--share {
	display: inline-block;
	font-size: 25px;
	font-weight: 400;
	padding: 25px 40px;
	border: solid 1px #eee;
	background: #fafafa;
	color: #00B3E2;
	text-align: center;
	cursor: pointer;
	line-height: normal;
	width: 300px;
}
.codepill--l2 {
	font-size: 20px;
	padding: 20px 30px;
}
.codepill--s0 {
	font-size: 20px;
	padding: 20px 30px;
}
.codepill--s1 {
	font-size: 13px;
	padding: 7px 20px;
}
.codepill--s2 {
	font-size: 14px;
	padding: 5px 12px;
}
.pointermenu--codepill--s1 {
	top: -60px;
}
.pointermenu--codepill--s1--arrow {
	top: -30px;
}
.pointermenu--codepill--l2 {
	top: -85px;
}
.pointermenu--codepill--l2--arrow {
	top: -55px;
}
.codepill--redeem {
	display: inline-block;
	font-size: 30px;
	font-weight: 600;
	padding: 15px 50px;
	background: #f5f5f5;
	color: #00B3E2;
	text-align: center;
}
.mpill {
	border-radius: 4px;
	position: relative;
	display: inline-block;
	font-size: 11px;
	padding: 5px 12px;
	border: solid 1px #eee;
	background: #fafafa;
	text-align: center;
}
.mpill--green {
	border: solid 1px #B5FCCA;
	background: #F8FFF9;	
	color: #00DB44;
}
.mpill--orange {
	border: solid 1px #FFD4B3;
	background: #FFFBF7;
	color: #FF8A33;
}

.hover {
	cursor: pointer;
}
.hovertip {
	display: none;
	z-index: 10000;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
	font-weight: normal;
	font-style: normal;
	font-size: 12px;
	line-height: 12px;
	vertical-align: middle;
	background: #fff;
	border: solid 8px #fafafa;
	padding: 15px;
}

/* ----- modules ----- */

.mod {
	background-color: white;
	padding: 15px 20px;
	word-wrap: break-word;
	margin-bottom: 20px;
	border: solid 1px #eee;
	border-radius: 5px;
	box-shadow: 1px 1px 1px #eee;
}
.mod--hover:hover {
	background-color: #fcfcfc;
	box-shadow: 1px 1px 10px #eee;	
}
.mod--pad {
	background-color: white;
	padding: 20px 25px;
	word-wrap: break-word;
	margin-bottom: 20px;
	border-radius: 5px;
	box-shadow: 1px 1px 1px #eee;
}
.mod--subtle {
	background-color: #fcfcfc;
	padding: 15px 20px;
	word-wrap: break-word;
	margin-bottom: 20px;
	box-shadow: 1px 1px 1px #eee;
}
.mod_ns {
	background-color: white;
	padding: 20px 25px;
	word-wrap: break-word;
	margin-bottom: 20px;
}
.mod_ol {
	background-color: white;
	padding: 20px 25px;
	word-wrap: break-word;
	margin-bottom: 20px;
	border: solid 1px #eee;
}

/* ----- tables ----- */

.table {
	display: table;
	border-spacing: 0;
	border-collapse: collapse;
	min-width: 1500px;
}
.table2 {
	display: table;
	border-spacing: 0;
	border-collapse: collapse;
	table-layout: auto;
}
.table--container {
	overflow-x: scroll;
}
.table--separate {
	border-collapse: separate;	
}
.table--row {
	display: table-row;
}
.table--cell {
	display: table-cell;
}
.table--cell--mw1 {
	max-width: 200px;
}
.table--cell--wider {
	font-size: 13px;
	padding: 7px 20px;
}
.table--cell--tall {
	font-size: 13px;
	padding: 10px 20px;
}
.table--cell--taller {
	font-size: 13px;
	padding: 15px 20px;
}
.table--cell--s2 {
	font-size: 13px;
	padding: 7px 10px;
}
.table--cell--s3 {
	font-size: 12px;
	padding: 7px 10px;
}
.table--cell--s4 {
	font-size: 11px;
	padding: 7px 10px;
}
.table--cell--small {
	font-size: 12px;
	padding: 5px 10px 5px 0;
}
.mp--cell {
	padding: 10px 20px;
}
.mp--cell--tall {
	padding: 15px 20px;
}
.mp--row {
	border-bottom: solid 1px #f3f3f3;
}
.promo--cell {
	display: table-cell;
	font-size: 12px;
	line-height: normal;
	word-wrap: break-word;
	border: solid 1px #eee;
	background: #fff;
	padding: 20px 25px;
	margin: 0 10px 10px 0;
}
.cell--default {
	position: relative;
	display: table-cell;
	font-size: 12px;
	line-height: normal;
	word-wrap: break-word;
	border: solid 1px #eee;
	background: #fff;
	padding: 20px 25px;
	margin: 0 10px 10px 0;
	text-align: center;
	width: 33%;
}

/* ----- navtab ----- */

.navtab {
	display: block;
	padding: 10px;
	font-size: 13px;
	border-top: solid 1px #eee;
	border-bottom: solid 1px #eee;
	color: #555;
	margin-top: -1px;
}
.navtab--selected {
	color: #00B3E2;
	font-weight: 600;
}



/* ----- bugs ----- */

.bug {
	border-radius: 7px;
	padding: 4px 8px;
	text-align: center;
	color: #fff;
}

/* ----- article, blog --- */

.article--container {
	max-width: 700px;
	margin: 0 auto;
	font-size: 17px;
	color: #333;
	line-height: 29px;
}
.article--container h1, .article--container h2, .article--container h3, .article--container h4, .article--container h5 {
	color: #222;
	font-weight: 500;
	margin-top: 50px;
	margin-bottom: 17px;
}
.article--container h2 {
	font-size: 30px;
	font-weight: 600;
}
.article--container h3 {
	font-size: 25px;
	font-weight: 600;
}
.article--container h4 {
	font-size: 17px;
	font-weight: 600;
}
.article--container p {
	margin-bottom: 30px;
}
.article--container--img img {
	border: solid 1px #eee;
	padding: 40px;
	display: block;
	margin: 0 auto 40px auto;
}
.article--container ul, .article--container ol {
	margin-bottom: 30px;
	margin-top: 0;
}
.article--container li {
    margin-left: 0px;
    margin-bottom: 25px;
    padding: 0 0 0 20px;
    position: relative;
}
.article--container li::before {
	content: '—';
	left: 0;
	position: absolute;
	top: 0;
	color: #bbb;
}
.article--subtitle {
	font-size: 22px;
	line-height: 27px;
	color: #555;
}
.toc--box {
	padding: 30px;
	border: solid 1px #e8e8e8;
	margin-bottom: 50px;
}
.toc--title {
	font-weight: 400;
	font-size: 25px;
	margin-bottom: 20px;
	color: #888;
}
.toc--header {
	display: block;
	margin: 10px 0 5px 0;
	font-weight: 600;
	color: #222;
	font-size: 17px;
	position: relative; 
}
.toc--item {
	display: block;
	margin: 0 0 0 20px;
	font-weight: 400;
	font-size: 15px;
	color: #555;
	line-height: 25px;
	position: relative; 
}
.toc--line {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	border-bottom: solid 1px #eee;
	width: 100%;
	z-index: 1;
}
.toc--text {
	z-index: 2000;
	display: inline-block;
	padding-right: 20px;
	position: relative;
	background: #fff;
}
.article--hero--image {
	padding-left: 30px;
	margin-top: 30px;
}
.article--hero--text {
	padding-right: 30px;
	margin-top: 30px;
}

/* ------ charts ------ */

.barchart--container {
	position: relative;
}
.barchart--multibar {
	position: absolute;
	bottom: 0;
}
.barchart--bar {
	position: absolute;
	bottom: 0;
	cursor: pointer;
}
.barchart--label {
	display: none;
	position: absolute;
	text-align: center;
	font-size: 11px;
	font-weight: 500;
	height: 15px;
}
.barchart--legend {
	position: absolute;
	right: 0;
	top: 0;
	width: 100px;
}
.barchart--legend--bar {
	width: 30px;
	height: 7px;
}
.barchart--item--wrap {
	position: relative;
	display: inline-block;
}
.barchart--item--segment {
	position: absolute;
	height: 1px;
	left: 0;
}

/* ----- notifications ----- */

.notification {
	display: inline-block;
	text-align: center;
	margin: 0 auto 30px auto;
	padding: 15px 40px;
	border-radius: 15px;
	border: solid 1px #eee;
	background: #fff;
	color: #222;
}
.notification a {
}
.notification--title {
	font-size: 18px;
	font-weight: 500;
}
.notification--details {
	margin-top: 5px;
	font-size: 14px;
}

/* ----- accuracy meter ----- */

.accuracymeter--mod {
	padding: 10px;
	border: solid 1px #eee;
	width: 350px;
	margin: 0 auto;
}
.accuracymeter--bar {
	width: 250px;
	margin: 0 auto;
	position: relative;
	height: 13px;
}
.accuracymeter--middle {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);	
	top: 0;	
	width: 1px;
	background: #ccc;
	height: 13px;
	z-index: 1000;
}
.accuracymeter--right {
	background: #10F24C;
	position: absolute;
	left: 50%;
	height: 7px;
	top: 3px;	
	z-index: 900;
}
.accuracymeter--left {
	background: #FF5F71;
	position: absolute;
	right: 50%;
	height: 7px;
	top: 3px;	
	z-index: 900;
}
.accuracymeter--background {
	background: #f5f5f5;
	width: 100%;
	height: 7px;
	position: absolute;
	top: 3px;
	left: 0;
	z-index: 800;
}

/* ----- pagination ----- */

.pagination_key {
    display: inline-block;
    padding: 15px 20px;
    border: solid 1px #e5e5e5;
    background: #fff;
    text-align: center;
    font-size: 16px;
    color: #aaa;
	font-weight: 500;
	margin-right: 3px;
}
.pagination_key--selected {
    background: #fff;
    color: #222;
	font-weight: 500;
}
.pagination_key:hover {
    background: #fafafa;
}
.pagination_spacer {
    display: inline-block;
    padding: 10px 20px;
    border: none;
    background: none;
    text-align: center;
    font-size: 20px;
    color: #aaa;
}

/* ----- jquery-ui ----- */

.ui-autocomplete {
    position: absolute;
    top: 0;
    left: 0;
	cursor: pointer !important;
    background: white;
    padding: 0;
    width: inherit;
    z-index: 10000000000;
	margin: 5px 0 0 0;
	font-family: niveau-grotesk, sans-serif;
	border: none !important;
    color: #555 !important;
}
.ui-menu .ui-menu-item-wrapper {
    padding: 12px 22px !important;
	margin: 0 !important;
	cursor: pointer !important;
	font-size: 16px;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active, .ui-button:active,
.ui-button.ui-state-active:hover {
    color: #111 !important;
	background: #E7FAFF !important;
	cursor: pointer !important;
	border: none !important;
}

/* ----- PRIMARY colors ----- */

.blue {
	color: #0E8AE0;
}
.blue2 {
	color: #0E8AE0;
}
.green {
	color: #ADF508;
}
.yellow {
	color: #F5ED34;
}
.orange {
	color: #FFCA38;
}

/* ----- SECONDARY colors ----- */

.bluel {
	color: #0CBBE5;
}
.blue--l20 {
	color: #3DDAFF;
}
.blue--l10 {
	color: #26D5FF;
}
.blue--d10 {
	color: #0CBBE5;
}
.blue--d15 {
	color: #0C76BF;
}
.blue--d20 {
	color: #0E8AE0;
}
.blue2--l10 {
	color: #2796E3;
}
.blue2--l20 {
	color: #3EA2E6;
}
.blue2--d10 {
	color: #0D83D5;
}
.blue2--d20 {
	color: #0B6FB3;
}
.blue2--d30 {
	color: #0A609D;
}
.green--d5 {
	color: #A2E609;
}
.green--d10 {
	color: #9AD908;
}
.green--d20 {
	color: #89C207;
}
.green--d30 {
	color: #78A906;
}
.yellow--d10 {
	color: #DCD52F;
} 
.yellow--d20 {
	color: #C4BE2A;
} 
.yellow--d30 {
	color: #ABA624;
} 

.bg--ebay {
	background-color: #F5AF02;
}
.bg--blue--l20 {
	background-color: #3DDAFF;
}
.bg--blue--l10 {
	background-color: #26D5FF;
}
.bg--blue {
	background-color: #0DD0FF;
}
.bg--blue--d10 {
	background-color: #0CBBE5;
}
.bg--blue--d20 {
	background-color: #0E8AE0;
}
.bg--blue2 {
	background-color: #0E8AE0;
}
.bg--blue2--l90 {
	background-color: #E7F3FC;
}
.bg--blue2--l80 {
	background-color: #CFE7F9;
}
.bg--blue2--d10 {
	background-color: #0D83D5;
}
.bg--blue2--d20 {
	background-color: #0B6FB3;
}
.bg--blue2--d30 {
	background-color: #0A609D;
}
.bg--green {
	background-color: #ADF508;
}
.bg--green--l70 {
	background-color: #E6FBB6;
}
.bg--green--l80 {
	background-color: #EEFCCE;
}
.bg--green--d5 {
	background-color: #A2E609;
}
.bg--green--d10 {
	background-color: #9AD908;
}
.bg--green--d20 {
	background-color: #89C207;
}
.bg--green--d30 {
	background-color: #78A906;
}
.bg--yellow {
	background-color: #F5ED34;
}
.bg--yellow--d10 {
	background-color: #DCD52F;
} 
.bg--yellow--d20 {
	background-color: #C4BE2A;
} 
.bg--yellow--d30 {
	background-color: #ABA624;
} 
.bg--orange--d10 {
	background-color: #E5B532;
}
.bg--orange--d5 {
	background-color: #F2C035;
}
.bg--orange {
	background-color: #FFCA38;
}
.red {
	color: #FF5F71;
}
.amazon {
	color: #FF9900;
}
.bg--amazon {
	background-color: #FF9900;
}


/* -- jquery-ui -- */
.fr-box.fr-basic, .fr-toolbar.fr-top, .second-toolbar { 
	border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; 
	border-color: #e2e2e2;
	border-radius: 0;
}

/* ----- media queries ----- */

@media only screen and (max-width: 1300px) {
	.header--logo {
		left: 10px;
	}
	.header--logo--icon {
		left: 10px;
	}
	.header--links {
		right: 10px;
	}
}
@media only screen and (max-width: 1200px) {
	.footer {
		margin-right: 10px;
		margin-left: 10px;
	}
	.page {
		padding-right: 10px;
		padding-left: 10px;
		padding-bottom: 10px;
	}
	.topdeal--card {
		flex-basis: 250px;
	}
	.regdeal--card {
		flex-basis: 195px;
	}
}
@media only screen and (max-width: 1100px) {
	.topdeal--card {
		flex-basis: 270px;
	}
	.regdeal--card {
		flex-basis: 205px;
	}
}
@media only screen and (max-width: 1000px) {
	.header--links {
		display: none;;
	}
	.header--search--box {
		margin-right: 70px;
	}
	.header--search--box--inner {
		width: 100%;
	}
	.header--menubutton {
		display: block;
	}
	.article--hero--image {
		padding-left: 0;
	}
	.article--hero--text {
		padding-right: 0;
		margin-top: 0;
	}
	.flex--container {
		flex-wrap: wrap; 
	}
	.flex--column--left--250 {
		width: 100%;
	}
	.hd1000 {
		display: none;
	}
  .flex--order--first {
    order: -1;
  }
}
@media only screen and (max-width: 900px) {
	.topdeal--card {
		flex-basis: 340px;
	}
	.regdeal--card {
		flex-basis: 220px;
	}
}
@media only screen and (max-width: 800px) {
	.subheader {
		display: none;
	}
/*
	header {
		height: 80px;
	}
	.nav-up {
	    top: -80px;	
	}
	.page {
		margin-top: 80px;
	}
*/
}
@media only screen and (max-width: 750px) {
	.modal {
	    max-height: calc(100vh - 60px);
		padding: 70px 10px 10px 10px;
	}
	.hd750 {
		display: none;
	}
}
@media only screen and (max-width: 600px) {
	.promoblock--title {
		min-height: auto;
	}	
	.mod {
		padding: 15px 15px;
	}
	.header--logo {
		display: none;
	}
	.header--logo--icon {
		display: block;
	}
	.header--search--box {
		margin-left: 80px;
	}
}
@media only screen and (max-width: 500px) {
	.codeboxsm2--btn {
		width: 170px;		
	}
	.codeboxsm2--btn--wrapper {
		display: block;
		width: 200px;
		margin-left: 0;
	}
	.codeboxsm2--redeem--btn {
		width: 200px;		
		font-size: 11px;
	}
	.codeboxsm2--vote--label {
		margin-top: 10px;
	}
	.home--title {
		font-size: 22px;
	}
	.mp--title {
		font-size: 25px;
		margin-bottom: 20px;
	}
	.hd500 {
		display: none;
	}
}

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) {
  .header--logo {
	  background-image: url("/img/logo320.png");
  }
}