/*====================================*/

@font-face {
	font-family: 'Intel One Regular';
	src: url("../fonts/intel_one/intelone-display-regular.woff2"), url("../fonts/intel_one/intelone-display-regular.woff") format("woff"), url("../fonts/intel_one/intelone-display-regular.ttf") format("truetype");
}

@font-face {
	font-family: 'Intel One Bold';
	src: url("../fonts/intel_one/intelone-display-bold.woff2"), url("../fonts/intel_one/intelone-display-bold.woff") format("woff"), url("../fonts/intel_one/intelone-display-bold.ttf") format("truetype");
}

@font-face {
	font-family: 'Intel One Medium';
	src: url("../fonts/intel_one/intelone-display-medium.woff2"), url("../fonts/intel_one/intelone-display-medium.woff") format("woff"), url("../fonts/intel_one/intelone-display-medium.ttf") format("truetype");
}

/*====================================*/

/*====================================*/

/* preload container */

#preload-container {
	display: none !important;
}

/*====================================================================================*/

#rl-widget {
	margin-right: auto;
	margin-left: auto;
	position: relative;
	width: 100%;
	max-width: 1366px;
	height: 768px;
	color: #fff; /*border: 1px solid #f00;*/
	overflow: hidden;
	background-color: #000;
}

#rl-widget > div {
	z-index: 1;
	position: relative;
}

#rl-widget #rl-headline {
	text-align: center;
	font-size: 3.8rem;
	line-height: 4rem;
	font-family: 'Intel One Bold', sans-serif;
	letter-spacing: .04rem;
	padding: 1.25rem 2rem 1rem;
	-webkit-transition: all .25s;
	transition: all .25s;
}

#rl-widget #rl-subhead {
	text-align: center;
	font-size: 1.6rem;
	line-height: 1.75rem;
	padding: 0rem 6rem 2rem;
	-webkit-transition: all .25s;
	transition: all .25s; /*@media only screen and (max-width: 1365px) {
      padding: 0rem 5% 1rem;
      font-size: 1.5rem;
      line-height: 1.75rem;
    }*/
}

#rl-widget img {
	pointer-events: none;
}

#rl-widget #rl-app-footer {
	width: 100%;
	position: absolute;
	bottom: 1.5rem;
	z-index: 0;
}

#rl-widget #rl-app-footer #rl-core-text {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	position: relative;
	margin-left: 33.5%;
	width: 65%; /*padding-top: 1rem;*/ /*min-height: 210px;*/
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	-ms-flex-pack: justify;
	justify-content: space-between; /*margin-bottom: 2.5rem;*/
	-webkit-transition: all .25s;
	transition: all .25s;
}

#rl-widget #rl-app-footer #rl-core-text ul {
	padding-top: .5rem;
}

#rl-widget #rl-app-footer #rl-core-text ul.init {
	list-style: none;
}

#rl-widget #rl-app-footer #rl-core-text ul li {
	font-size: 1.6rem;
	line-height: 1.75rem;
	-webkit-transition: all .25s;
	transition: all .25s;
}

#rl-widget #rl-app-footer #rl-core-text > div {
	width: 40%;
	padding-right: 1.5rem;
}

#rl-widget #rl-app-footer #rl-core-text > div > div:nth-child(2) {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center; /*margin-top: -1rem;*/ /*@media only screen and (max-width: 650px) {
            margin-top: -.5rem;
          }*/
}

#rl-widget #rl-app-footer #rl-core-text > div > div:nth-child(2) > div:nth-child(1) {
	width: auto;
	padding-right: 1rem; /*
              @media only screen and (max-width: 760px) {
                padding-right: .5rem;
              }
              */
}

#rl-widget #rl-app-footer #rl-core-text .rl-core-prefix,
#rl-widget #rl-app-footer #rl-core-text .rl-core-number,
#rl-widget #rl-app-footer #rl-core-text .rl-core-text {
	font-size: 6rem; /*
  background: rgb(199, 247, 254);
  background: linear-gradient(90deg, rgba(87, 228, 254, 1) 0%, rgba(90, 233, 254, 1) 10%, rgba(72, 97, 248, 1) 50%, rgba(98, 118, 216, 1) 51%, rgba(255, 242, 23, 1) 52%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
  */
	font-family: 'Intel One Medium', sans-serif;
	-webkit-transition: background-position .15s;
	transition: background-position .15s;
	color: #7BF5F5; /* ie */ /*
  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    background: transparent;
    color: #4581F3;
    background-size: 100%;
    transition: none;
  }
  */ /*@media only screen and (max-width: 650px) {
          font-size: 3rem;
        }*/
}

#rl-widget #rl-app-footer #rl-core-text .rl-core-prefix.active,
#rl-widget #rl-app-footer #rl-core-text .rl-core-number.active,
#rl-widget #rl-app-footer #rl-core-text .rl-core-text.active { /*@include text_color();*/
	background-position: 105%;
}

#rl-widget #rl-app-footer #rl-core-text .rl-core-text {
	font-size: 2.2rem;
	line-height: 2.25rem;
}

#rl-widget #rl-app-wrapper {
	position: relative;
	z-index: 0;
}

#rl-widget #rl-activity-buttons {
	top: 12rem;
	left: 2.5rem;
	width: 33%;
	max-width: 21.25rem;
	position: absolute;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: reverse;
	-webkit-flex-direction: column-reverse;
	-ms-flex-direction: column-reverse;
	flex-direction: column-reverse;
	z-index: 9;
	-webkit-transition: all .25s;
	transition: all .25s;
}

#rl-widget #rl-activity-buttons #rl-activity-text {
	font-size: 1.6rem;
	line-height: 1.8rem;
	text-align: center;
	margin-bottom: 2rem;
	-webkit-transition: all .25s;
	transition: all .25s; /*@media only screen and (max-width: 1365px) {
        font-size: 1.25rem;
        line-height: 1.5rem;
        padding: 0 0 0 1rem;
      }*/
}

#rl-widget #rl-activity-buttons .rl-activity-button {
	position: relative;
	margin-bottom: 1.33rem;
	cursor: pointer;
	width: 100%;
	height: 73px;
	border-radius: 7px;
	border: 3px solid #152a56;
	position: relative;
	box-shadow: inset 0 0 50px #001441;
	color: #fff;
	-webkit-transition: all .25s;
	transition: all .25s;
}

#rl-widget #rl-activity-buttons .rl-activity-button > div {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

#rl-widget #rl-activity-buttons .rl-activity-button > div {
	top: 50%;
	height: auto;
	left: 1.7rem;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

#rl-widget #rl-activity-buttons .rl-activity-button > div span {
	font-size: 1.7rem;
	line-height: 2rem;
	white-space: nowrap;
	letter-spacing: .04rem;
}

#rl-widget #rl-activity-buttons .rl-activity-button > div img {
	height: 130%;
	position: absolute;
	right: 3rem;
	left: auto;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-transition: right .25s;
	transition: right .25s;
}

#rl-widget #rl-activity-buttons .rl-activity-button:hover > div img {
	right: 2.5rem;
}

#rl-widget #rl-activity-buttons .rl-activity-button.active {
	box-shadow: inset 0 0 35px #0040fa;
	background-color: #020b1b;
	border: 3px solid #1f3e7f;
}

#rl-widget #rl-activity-buttons .rl-activity-button.active span { /*
  background: rgb(199, 247, 254);
  background: linear-gradient(90deg, rgba(87, 228, 254, 1) 0%, rgba(90, 233, 254, 1) 10%, rgba(72, 97, 248, 1) 50%, rgba(98, 118, 216, 1) 51%, rgba(255, 242, 23, 1) 52%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
  */
	font-family: 'Intel One Medium', sans-serif;
	-webkit-transition: background-position .15s;
	transition: background-position .15s;
	color: #7BF5F5; /* ie */ /*
  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    background: transparent;
    color: #4581F3;
    background-size: 100%;
    transition: none;
  }
  */
}

#rl-widget #rl-app-container {
	position: relative;
	z-index: 0;
	margin-top: -10rem;
}

#rl-widget #rl-app-container:after {
	position: absolute;
	left: 0;
	content: '';
	width: 100%;
	bottom: -150px;
	height: 250px;
	background: black;
	background: -webkit-linear-gradient(bottom, black 66%, rgba(0, 0, 0, 0) 100%);
	background: linear-gradient(0deg, black 66%, rgba(0, 0, 0, 0) 100%);
}

#rl-widget #rl-app-container > div {
	position: absolute;
}

#rl-widget #rl-app-container #rl-app {
	margin: 0 auto;
	margin-right: auto;
	margin-left: auto;
	position: relative;
	width: 100%;
	max-width: 1366px;
	max-height: 730px;
	color: #fff; /*background-color: #000;*/
	overflow: hidden;
	height: auto;
}

#rl-widget #template { /* dev & debug */
	position: absolute;
	left: 0;
	top: 0px;
	width: 100%;
	z-index: 999;
	border: 1px solid #00f;
	opacity: .66;
	display: none;
}

#rl-widget * {
	opacity: 1;
	font-family: 'Intel One Regular', sans-serif;
	color: #fff;
}

#rl-widget .hide {
	display: none !important;
}

#rl-widget .animated { /* animation settings for element fade */ /* animation-duration: 0.1s; */
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}

#rl-widget #preloader-percent {
	font-family: 'Intel One Regular', sans-serif;
	font-size: 10px;
	color: #ccc;
}

#rl-widget #modal-shade { /*====================================*/ /* shade */
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #FFFFFF;
	z-index: 99;
	position: absolute; /* preloader disabled for dev */ /*display: none!important;*/
}

#rl-widget #modal-shade .loader {
	text-align: center;
	position: absolute;
	left: 50%;
	top: 33%;
	-webkit-transform: translate(-50%, -33%);
	-ms-transform: translate(-50%, -33%);
	transform: translate(-50%, -33%);
	width: 15%;
}

#rl-widget #modal-shade div {
	margin-bottom: 20px;
}

#rl-widget #modal-shade .sep {
	width: 100%;
	height: 1px;
	background-color: #CCCCCC;
}

#rl-widget #rl-head {
	text-align: center;
	margin: 7% 0;
}

#rl-widget #rl-head .headline {
	font-family: 'Intel One Bold';
	font-size: 65px;
	font-weight: bold;
	margin-bottom: 15px;
}

#rl-widget #rl-head .subhead {
	font-size: 30px;
	padding: 0 5%;
}

#rl-widget .highlight .title {
	-webkit-transform: scale(1.01) !important;
	-ms-transform: scale(1.01) !important;
	transform: scale(1.01) !important;
	-webkit-transform-origin: left bottom;
	-ms-transform-origin: left bottom;
	transform-origin: left bottom; /*
  background: rgb(199, 247, 254);
  background: linear-gradient(90deg, rgba(87, 228, 254, 1) 0%, rgba(90, 233, 254, 1) 10%, rgba(72, 97, 248, 1) 50%, rgba(98, 118, 216, 1) 51%, rgba(255, 242, 23, 1) 52%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
  */
	font-family: 'Intel One Medium', sans-serif;
	-webkit-transition: background-position .15s;
	transition: background-position .15s;
	color: #7BF5F5; /* ie */ /*
  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    background: transparent;
    color: #4581F3;
    background-size: 100%;
    transition: none;
  }
  */
}

#rl-widget .highlight .title * { /*
  background: rgb(199, 247, 254);
  background: linear-gradient(90deg, rgba(87, 228, 254, 1) 0%, rgba(90, 233, 254, 1) 10%, rgba(72, 97, 248, 1) 50%, rgba(98, 118, 216, 1) 51%, rgba(255, 242, 23, 1) 52%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
  */
	font-family: 'Intel One Medium', sans-serif;
	-webkit-transition: background-position .15s;
	transition: background-position .15s;
	color: #7BF5F5; /* ie */ /*
  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    background: transparent;
    color: #4581F3;
    background-size: 100%;
    transition: none;
  }
  */
}

#rl-widget #rl-buttons {
	width: 100%;
	position: relative;
	background-size: 100% 300%;
	background-repeat: no-repeat;
	background-image: url("../img/i9k-pdp-btn-bg.png");
	background-position: left top;
	overflow: hidden;
	height: 130px;
}

#rl-widget #rl-buttons .btn {
	display: inline-block;
	position: relative;
	background-size: 100%;
	background-repeat: no-repeat;
	margin: 0;
	height: 100%;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#rl-widget #rl-buttons .btn#rl-btn-0 {
	position: absolute;
	left: 0;
	width: 33.33%;
}

#rl-widget #rl-buttons .btn#rl-btn-1 {
	position: absolute;
	left: 33.33%;
	width: 33.33%;
}

#rl-widget #rl-buttons .btn#rl-btn-2 {
	position: absolute;
	left: 66.66%;
	width: 33.33%;
}

#rl-widget #rl-buttons .btn a {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	text-align: center;
	text-decoration: none; /*border: 1px solid #f00;*/
}

#rl-widget #rl-buttons .btn a span {
	color: #fff;
	font-size: 30px;
	position: absolute;
	top: 47%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-shadow: none;
	width: 100%;
	padding: 0 5% 0 10%;
}

#rl-widget #rl-buttons .btn a span * {
	color: #fff;
}

#rl-widget #rl-buttons .btn a,
#rl-widget #rl-buttons .btn.active a span,
#rl-widget #rl-buttons .btn.active a span * {
	color: #44d2c5;
}

/* fallback to static image if not able to create webgl canvas */

#rl-widget.no-webgl #rl-app img {
	-webkit-transform: scale(1) translateY(-5rem);
	-ms-transform: scale(1) translateY(-5rem);
	transform: scale(1) translateY(-5rem);
}

@media only screen and (max-width: 1365px) {

#rl-widget #rl-headline {
	font-size: 2.5rem;
	line-height: 3rem;
	padding: 2rem 5% .5rem;
}

#rl-widget #rl-app-footer #rl-core-text {
	margin-left: 0%;
	width: 100%; /*min-height: 200px;*/
	-webkit-justify-content: space-around;
	-ms-flex-pack: distribute;
	justify-content: space-around;
	padding-top: .5rem;
}

#rl-widget #rl-app-footer #rl-core-text > div {
	margin-top: 0;
}

#rl-widget #rl-activity-buttons .rl-activity-button {
	height: 60px;
}

#rl-widget #rl-activity-buttons .rl-activity-button > div img {
	height: 80%;
}

}

@media only screen and (max-width: 1360px) {

#rl-widget.no-webgl #rl-app img {
	-webkit-transform: scale(1.1) translate(2.5rem, -4rem);
	-ms-transform: scale(1.1) translate(2.5rem, -4rem);
	transform: scale(1.1) translate(2.5rem, -4rem);
}

}

@media only screen and (max-width: 1100px) {

#rl-widget #rl-app-footer #rl-core-text .rl-core-prefix,
#rl-widget #rl-app-footer #rl-core-text .rl-core-number,
#rl-widget #rl-app-footer #rl-core-text .rl-core-text {
	font-size: 5rem;
}

#rl-widget #rl-app-footer #rl-core-text .rl-core-text {
	font-size: 1.75rem;
	line-height: 1.5rem;
}

#rl-widget #rl-activity-buttons {
	top: 5rem;
}

#rl-widget #rl-app-container {
	margin-top: -4rem;
}

}

@media only screen and (max-width: 992px) {

#rl-widget #rl-app-footer #rl-core-text ul li {
	font-size: 1.25rem;
	line-height: 1.5rem;
}

#rl-widget #rl-activity-buttons {
	top: 2.5rem;
}

#rl-widget #rl-activity-buttons #rl-activity-text {
	font-size: 1.5rem;
	line-height: 1.75rem;
}

#rl-widget #rl-activity-buttons .rl-activity-button {
	margin-bottom: 1rem;
	height: 50px;
}

#rl-widget #rl-activity-buttons .rl-activity-button > div span {
	font-size: 1.5rem;
}

#rl-widget #rl-activity-buttons .rl-activity-button > div img {
	height: 50%;
}

#rl-widget #rl-app-container {
	margin-top: -3rem;
}

#rl-widget.no-webgl #rl-app img {
	-webkit-transform: scale(1) translate(0rem, 0rem);
	-ms-transform: scale(1) translate(0rem, 0rem);
	transform: scale(1) translate(0rem, 0rem);
}

}

@media only screen and (max-width: 768px) {

#rl-widget {
	height: 1020px;
}

#rl-widget #rl-headline {
	font-size: 2.5rem;
	line-height: 2.75rem;
	padding: 1rem 10% 0rem;
}

#rl-widget #rl-subhead {
	padding: 1rem 10% 1rem;
	font-size: 1.5rem;
	line-height: 1.75rem;
}

#rl-widget #rl-app-footer #rl-core-text {
	margin-left: 0%;
	width: 100%; /*min-height: 225px;*/
	-webkit-justify-content: space-around;
	-ms-flex-pack: distribute;
	justify-content: space-around;
	padding-top: .5rem;
}

#rl-widget #rl-app-footer #rl-core-text ul li {
	font-size: 1.5rem;
	line-height: 1.75rem;
}

#rl-widget #rl-app-footer #rl-core-text > div {
	width: 42%;
	margin-right: 0;
}

#rl-widget #rl-activity-buttons {
	position: relative;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	width: 100%;
	top: 1rem;
	max-width: 100%;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
}

#rl-widget #rl-activity-buttons > div {
	width: 40%;
}

#rl-widget #rl-activity-buttons > div:nth-child(1) {
	width: 50%;
}

#rl-widget #rl-activity-buttons #rl-activity-text {
	text-align: left;
	padding: 0 0 0 2rem;
	margin-bottom: 0rem;
}

#rl-widget #rl-app-container:after {
	bottom: 100px;
	height: 220px;
}

#rl-widget.no-webgl #rl-app img {
	-webkit-transform: scale(1) translate(0rem, 0rem);
	-ms-transform: scale(1) translate(0rem, 0rem);
	transform: scale(1) translate(0rem, 0rem);
}

}

@media only screen and (max-width: 760px) {

#rl-widget #rl-app-footer #rl-core-text ul li {
	font-size: 1rem;
	line-height: 1.25rem;
}

#rl-widget #rl-app-footer #rl-core-text .rl-core-text {
	font-size: 1.25rem;
	line-height: 1.1rem;
}

#rl-widget #rl-activity-buttons #rl-activity-text {
	font-size: 1.25rem;
	line-height: 1.5rem;
}

}

@media only screen and (max-width: 700px) {

#rl-widget #rl-app-container:after {
	bottom: -150px;
	height: 250px;
}

}

@media only screen and (max-width: 600px) {

#rl-widget #rl-app-footer #rl-core-text { /*min-height: 128px;*/
}

}

@media only screen and (max-width: 480px) {

#rl-widget {
	height: 768px;
}

#rl-widget #rl-headline {
	padding: 1rem 5% 0rem;
	font-size: 1.75rem;
	line-height: 2rem;
}

#rl-widget #rl-subhead {
	padding: 1rem 5% 1rem;
	font-size: .85rem;
	line-height: 1rem;
}

#rl-widget #rl-app-footer #rl-core-text ul {
	padding-top: .25rem;
}

#rl-widget #rl-app-footer #rl-core-text ul li {
	font-size: .85rem;
	line-height: 1rem;
}

#rl-widget #rl-app-footer #rl-core-text > div {
	padding-right: .25rem;
}

#rl-widget #rl-app-footer #rl-core-text .rl-core-text {
	font-size: 1rem;
	line-height: 1.1rem;
}

#rl-widget #rl-app-wrapper {
	margin-top: 1rem;
}

#rl-widget #rl-activity-buttons {
	left: 1rem;
	top: 0rem;
}

#rl-widget #rl-activity-buttons #rl-activity-text {
	font-size: .85rem;
	line-height: 1rem;
	padding: 0 0 0 1rem;
}

#rl-widget #rl-activity-buttons .rl-activity-button {
	height: 30px;
	margin-bottom: .2rem;
}

#rl-widget #rl-activity-buttons .rl-activity-button > div span {
	font-size: .9rem;
}

#rl-widget #rl-app-container {
	margin-top: -1rem;
}

}