:root {
	--license-logo-item-margin: 0 10px 10px 10px;
	--license-text-align: left;--license-text-color: #000;--license-text-size: font-size:13.6px;--license-text-link-color: #000;--license-text-link-hover-decoration: underline;--license-text-link-hover-color: #000;
	--beam-background: #000; --beam-font-size: 14px;--beam-padding: 0; img: max-height: 30px;
}

@media screen and (max-width: 767px) { /* mobile view */
	:root {
		--beam-font-size: 12px;
		--license-logo-item-margin: 0 4px 4px 4px;
	} 
}

/***********************************************************************/

/****************************  Main Elements ***************************/
html					{box-sizing:border-box; font-size:62.5%; line-height:62.5%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;}/* 62.5% so each 0.1 rem is 1px */
*, *:before, *:after	{box-sizing:inherit;} /* Inherit box-sizing to make it easier to change */
body					{overflow-y:scroll; background-color:#000; color:#fff; height:100%; font-size:1.7rem; line-height:165%; direction:ltr; text-align:left; font-family:"Roboto", arial, helvetica, sans-serif; margin:0; padding:0;}
@media screen and (max-width: 767px) { /* mobile-view */
	body	{font-size:3.7vw; line-height:145%;}
}

h1, h2, h3	{padding:0; margin-top:0; display:block; color:#fff; font-weight:800;}
h1						{font-size:7rem; line-height:115%; margin-bottom:40px;}
h2						{font-size:5rem; line-height:125%; margin-bottom:40px;}
h3						{font-size:4rem; line-height:135%; font-weight:600; margin-bottom:25px;}

@media screen and (max-width: 767px) { /* mobile-view */
	h1	{font-size:9vw; margin-bottom:5vw;}
	h2	{font-size:8.5vw; margin-bottom:4vw;}
	h3	{font-size:5vw; margin-bottom:3vw;}
}

p				{padding:0; margin-top:0; font-size:inherit;}

ul				{padding:0px 0px 0px 30px; margin:0px 0px 20px 0px; font-size:inherit;}
ol				{padding:0px 0px 0px 30px; margin:0px 0px 20px 0px; font-size:inherit;}
ul li			{padding:0; margin:0 0 8px 0; font-size:inherit; list-style:disc;}
ol li			{padding:0px 0px 0px 5px; margin:0 0 8px 0; font-size:inherit; list-style:decimal;}
ol ul li		{list-style:disc; padding-left:0;}
ul ul, ul ol, ol ol, ol ul	{margin:8px 0px 0px 0px;}

@media screen and (max-width: 767px) { /* mobile-view */
	ul				{padding:0px 0px 0px 7vw; margin:0px 0px 5vw 0px;}
	ol				{padding:0px 0px 0px 7vw; margin:0px 0px 5vw 0px;}
	ul li			{margin:0 0 2vw 0;}
	ol li			{padding:0px 0px 0px 1.3vw; margin:0 0 2vw 0;}
	ul ul, ul ol, ol ol, ol ul	{margin:2vw 0px 0px 0px;}
}

table					{font-size:inherit; line-height:inherit;}
td						{font-size:inherit;}
hr						{height:1px; width:100%; border:0; border-top:1px solid #cbcbcb; background-color:transparent; margin-bottom:15px; box-sizing:border-box;}
img						{display:block; max-width:100%; height:auto; border:0; padding:0; margin:0; -ms-interpolation-mode:bicubic;}
video					{display:block; max-width:100%; height:auto; border:0; padding:0; margin:0;}
figure					{margin:0;}
figure img				{display:blocl;}
figcaption				{text-align:center; padding-top:8px;}
b, strong				{font-weight:bolder;}

@media screen and (max-width: 767px) { /* mobile-view */
	hr				{height:0.26vw; border-width:0.26vw; margin-bottom:4vw;}
	figcaption		{padding-top:2vw;}
}

a						{color:#fff; text-decoration:underline; background-color:transparent; -webkit-tap-highlight-color:rgba(103,199,245,0.4);}
a:hover					{text-decoration:none; color:#fff;}
a:active, a:focus		{}

button.button {
	padding: 0.5em 1.2em 0.47em 1.2em;
	height: auto;
	line-height: normal;
	display: block;
	font-size: 3.6rem;
	white-space: nowrap;
	background: #04c342;
	color: #fff;
	text-align: center;
	border-style: none;
	font-weight: 700;
	text-transform: uppercase;
	margin: 0 auto;
	vertical-align: top;
	border: 0;
	cursor: pointer;
	-webkit-appearance: button;
	box-sizing: border-box;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	-ms-transition: all 0.5s;
	transition: all 0.5s;
}
button.button:hover,
button.button:active,
button.button:focus	 {background:#038a2f; color:#fff;}
@media screen and (max-width: 767px) { /* mobile view */
	button.button	{font-size:6vw; padding:3.3vw 8vw 2.4vw 8vw; font-weight:700;}
} 

button.offer-but {
	background: #fe0000;
}
button.offer-but:hover,
button.offer-but:active,
button.offer-but:focus {
	background: #c80000;
}

/* relative size button */
@media screen and (max-width: 1600px) and (min-width: 991px) { 	
	button.relative		{font-size:2.4vw;}
} 
@media screen and (max-width: 990px) and (min-width: 768px) { 	
	button.relative		{font-size:2.8vw;}
} 

/* clean button */
button.clean			{background:transparent; padding:0; border:0; cursor:pointer;}
button.clean:hover		{background:transparent; padding:0;}


/***********************************************************************/
.site-container		{position:relative; overflow:hidden;}

@media screen and (max-width: 767px) { /* mobile view */
	.site-container		{}
}

.full-size-row		{max-width:1920px; margin:0 auto;}
.area-wrapper		{width:95%; margin:0 auto;}

@media screen and (max-width: 767px) { /* mobile view */
	.area-wrapper		{width:92%;}
}

.content-main			{max-width:1610px; padding-top:60px;}
.content-section		{margin-bottom:110px;}
.content-section h2		{text-align:center;}
.content-section p		{}

@media screen and (max-width: 767px) { /* mobile view */
	.content-main		{padding-top:40px; margin-bottom:13vw;}
	.content-section	{margin-bottom:0;}
}

.banner					{position:relative;}
.foreground				{position:absolute; top:0; left:0;}
.offer-but-container	{max-width:1610px;}
button.offer-but		{margin:2vw 0 0 8%;}
.terms {
	font-size:1.3rem;
	line-height:normal;
	padding-top: 8px;
}
.banner-bg {cursor:pointer;}
@media screen and (max-width: 767px) { /* mobile view */
	.foreground			{position:relative; top:-16vw}
	button.offer-but	{margin:2vw auto 0 auto;}
	.terms {
		font-size:2.8vw;
		padding-top: 6px;
	}
}

.steps				{margin-bottom:70px; padding-top:5px;}
.steps ul			{display:flex; justify-content:space-between; margin:0; padding:0;}
.steps ul li		{display:grid; grid-template-columns:88px auto; width:27.8%; padding:8px 15px 10px 23px; border:#ffcc33 2px solid; text-align:left; position:relative; list-style:none;}
.steps ul li:first-child	{width:24.8%; grid-template-columns:73px auto;}
.steps ul li:last-child		{width:30.8%;}
.steps ul li:after	{content:""; width:30.1%; height:100%; display:block; position:absolute; top:0; left:calc(100% + 2px); background:url('../img/arrow-steps.jpg') no-repeat center center / 35%; z-index:9;}
.steps ul li:first-child:after	{width:33.7%;}
.steps ul li:last-child:after	{display:none;}
.step-number		{font-size:12.8rem; line-height:100%; font-weight:700; color:#ffcc33;}
.step-title			{font-size:3.2rem; line-height:125%; font-weight:700; padding-top:20px; margin-bottom:9px; color:#ffcc33; text-transform:uppercase;}
.step-info			{font-size:1.9rem; line-height:125%;}

.steps button	{margin:0 auto;}

.mobile {display: none;}
.desktop {width: 75%; float: right;}
.col-2 {display: grid; grid-template-columns: 1fr 1fr; column-gap: 80px;}
h3 {font-size: 2.8rem; font-weight: 700; color: #ffcc33; text-align: center; margin-bottom: 30px;}

.col-2-schedule {display: grid; grid-template-columns: 30px 1fr; column-gap: 10px;}


.term-condition h2,
.term-condition h3 {color: #ffcc33; text-align: left;}
.term-condition h3 {margin-top: 20px; margin-bottom: 0;}
.term-condition p {margin-bottom: 0;}

@media screen and (max-width: 1320px) and (min-width: 991px) {
	.steps ul li	{display:block; padding:2% 20px 20px 20px; text-align:center;}
	.step-number	{font-size:8vw; width:100%;}
	.step-title		{font-size:2vw;}
	.step-info		{font-size:1.5vw;}
}

@media screen and (max-width: 990px) and (min-width: 768px) {
	.steps ul li	{display:block; padding:3% 20px 20px 20px; text-align:center;}
	.step-number	{font-size:10vw;}
	.step-title		{font-size:2.7vw;}
	.step-info		{font-size:1.9vw;}
}

@media screen and (max-width: 767px) { /* mobile view */
	.steps			{overflow:auto; padding-top:3vw; margin-bottom:6vw;}
	.steps ul		{width:263vw; padding:0 7vw 0 7vw;}
	.steps ul li	{width:75.3vw !important; grid-template-columns:16vw auto !important; padding:1vw 4vw 1.5vw 4vw; border-width:0.55vw;}
	.steps ul li:first-child	{grid-template-columns:13vw auto !important;}
	.steps ul li:after	{width:12vw !important;}
	.step-number	{font-size:22vw;}
	.step-title		{font-size:4.3vw; margin-bottom:2vw; padding-top:4.4vw;}
	.step-info		{font-size:3.5vw; line-height:135%;}

	.mobile {display:block;}
	.desktop {display: none;}
	.col-2 {grid-template-columns: 1fr; grid-row-gap: 20px;}
	.col-2-schedule {row-gap: 20px;}
	h3 {font-size: 5vw; margin-bottom: 40px;}
	.term-condition h2 {margin-top: 40px; font-size: 5.5vw;}
}


.payments-container				{margin:0 auto 50px auto;text-align: center;}
.payments-container h2			{font-size:2.8rem; line-height:115%; font-weight:700; color:#ffcc33; text-align:center; margin-bottom:30px}
.payments-container > div 		{}
.payments-container > img 		{}

.payments-container ul			{display:inline-flex; justify-content:center; margin:0; padding:0; align-items:center;}
.payments-container ul li		{margin:0 2% 0 2%; list-style:none;}
.payments-container ul li img	{display:block; max-width:100%; width:auto;}

@media screen and (max-width: 767px) { /* mobile view */
	.payments-container				{margin-bottom:4vw; padding: 0 4%;}
	.payments-container h2			{font-size:3.9vw; margin-bottom:6vw;}
	.payments-container ul			{flex-wrap:wrap;}
	.payments-container ul li		{margin:0 1.8vw 5vw 1.8vw; max-width:35%}
	.payments-container ul li img	{max-height:5.6vw; width:auto;}
}

/********************** Footer *******************/
footer			{background-color:#b2b2b2; color:#161616; padding:45px 0 55px 0; border-top:#ffcc33 2px solid;}
footer a		{color:#1788fe;}
footer a:hover	{color:#1788fe;}

.logos			{margin-bottom:20px;text-align: center;}
.logos > div	{display: inline-flex; align-items: center;}
.footer-text	{max-width:1304px; margin:0 auto 15px auto; text-align:center; font-size:1.2rem; line-height:145%;}
.license		{max-width:1304px; margin:0 auto 15px auto; text-align:center; font-size:1.2rem; line-height:145%;}
.footer-bottom-text {color:#fff;}

@media screen and (max-width: 767px) { /* mobile view */
	footer			{padding:5vw 0 12vw 0; color:#000; border-top-width:0.55vw;}
	.footer-text	{font-size:3.4vw; margin-bottom:5vw;}
	.license		{font-size:3.4vw; margin-bottom:5vw;}
	.logos > div	{flex-direction: column;}
}

