html, body, div, span, a, img { padding: 0; margin: 0; font-size: 0; line-height: 0; text-decoration: none; border: none }
body { text-align: center; margin: 0 auto; width: 100%; }

@font-face { font-family: Rub;	src: url("/./rub_var.ttf");								font-style: normal;	font-display: swap; }
body { font-family: Rub, Arial, Helvetica, sans-serif; font-weight: 350; }

.Buttons a { display: inline-block; margin-bottom: -1px; height: 50px; 
	font-style: normal; font-variant: normal; font-weight: 550; line-height: normal; word-spacing: normal; letter-spacing: -1px; text-transform: uppercase }
.Screens img, .Buttons a { border-width: 1px; border-style: solid }
.Buttons img { float: left }
.Buttons, .Text p, .Text span, .Logo, .Screens, .Screens a, .Screens a img, .Welcome div, .Privacy div, .USC2257 div, .Join div, .Bonus div, .Merchants, .PagesNew a { user-select: none }
.Buttons img, .PagesNew a img { opacity: 0.7; }
.Logo, .Buttons div, .PagesNew a { opacity: 0.9; }
.Buttons img { width: 40px; margin: 5px 15px 0 10px }
.Buttons div { font-size: 22px; margin: 18px 0 0 0 }
.Screens, .Text, .Buttons { display: block; clear: both; margin: 0 auto }
.Screens { text-align: center; margin-top: 1px }
.Screens img, .Buttons a { margin: -3px }
.Screens a { display: block; }
.Buttons { text-align: center; margin-top: 0; margin-bottom: 0 }

.BodyBlock, .Text, div.Merchants div.Line { width: 98.1%; max-width: 930px; margin: 0 auto }
.TextContainer .Text { width: 99.5% }
.Logo { float: left; width: 160px; margin: 12px 12px 13px 0 }

.Text { border-style: solid; border-width: 1px; border-radius: 15px; padding-top: 10px; padding-bottom: 0; margin-bottom: 10px; margin-top: 10px }
.Text p, .Text span, .Text div, .Text a, .Text b { font-size: 17px; line-height: 17px }
.Text p, .Text span, .Text div { display: block; width: 86%; max-width: 550px; margin: 0 auto; text-align: center; border-radius: 8px; padding: 4px }
.Text p, .Text span, .Text b { font-weight: 500; }
.Text p, .Text span { padding: 4px 15px 4px 15px }
.Text span, .Text div { border-style: solid; border-width: 1px }
.Text p, .Text p a { text-decoration: underline; text-transform: uppercase; font-size: 20px; line-height: 20px; margin-bottom: 5px; 
	border-style: solid; border-width: 0; margin-top: -2px; padding-top: 2px }
.Text div + p { margin-top: 15px }
.Text span { text-transform: capitalize; border-bottom-width: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; margin-bottom: 0 }
.Text span + div { border-top-width: 1px; margin-top: 0; border-top-left-radius: 0; border-top-right-radius: 0; }
.Text div { margin-bottom: 10px; padding: 10px 15px 10px 15px }
.Text a { text-decoration: underline }

.Bonus div, .Support div { padding: 4px 15px 4px 15px }
.Bonus + .Screens { margin-top: 12px; margin-bottom: 20px }
.Bonus { margin-top: 17px }
#Bonus { margin-bottom: 20px }
.Bonus span a { text-transform: none; }
div.Bonus div { text-transform: capitalize; }
div#Bonus div { text-transform: none; }
.Merchants { text-align: center !important }
.Join p + div { line-height: 24px }
ins, del { text-decoration: none }
sub, sup { vertical-align: inherit; font-size: inherit; }
.Authorisation div { text-align: justify }
.Authorisation div del { display: inline-block; width: 100%; text-align: right }
.Enter { width: 92%; max-width: 580px }
.Privacy div, .USC2257 div, .Welcome div, #Join div { border-radius: 15px; }
.Privacy span { border-top-left-radius: 15px; border-top-right-radius: 15px; }
.Welcome div, .Privacy div, .USC2257 div { text-align: left}

.TextContainer, .ButtonsContainer { display: block; width: 100%; margin: 0; padding: 0 }
.TextContainer { clear: both; float: left }
.ButtonsContainer { float: right }
.TextBlock { display: block; width: 100%; margin: 0 auto; padding: 0 }
.TextBlock { float: right }
.TextBlock div, .TextBlock a, .TextBlock b, #Bonus div, #Bonus2 div, #Bonus2 div a { font-size: 20px; line-height: 21px }
.ButtonsContainer { margin-bottom: 20px }

body { width: 100%; max-width: 1920px }
.Screens img { width: 24.9% }
.Buttons a { width: 48.7%; margin: 0 -1px -1px 0; border-radius: 10px; }
.Enter a:nth-of-type(1) { width: 72.4%; margin-right: 5px }
.Enter a:nth-of-type(2) { width: 25%; margin-left: 5px }
.Buttons a div { float: left; padding-top: 8px }
.JoinButtons div { text-transform: none }
.Join a { text-transform: uppercase }
.Merchants, div.Merchants a { font-size: 10px; line-height: 14px }
.Merchant a { display: inline-block }
div.Merchants { text-align: left; background: none; border: none; margin-top: 10px; margin-bottom: 5px; box-shadow: none; }
div.Merchants div.Line { width: 100%; height: 1px; background: gray; margin: 0; padding: 0; border-width: 0; margin-bottom: 3px; }
.Welcome + .BodyBlock + .Merchants { margin-top: 12px }
.JoinButtons a { width: 33.0%; margin: 0 -1px -1px 0 }
.JoinButtons a:nth-of-type(1) { border-radius: 10px 0 0 10px; }
.JoinButtons a:nth-of-type(2) { border-radius: 0 0 0 0; }
.JoinButtons a:nth-of-type(3) { border-radius: 0 10px 10px 0; }

.Merchants a { display: inline-block; margin-bottom: 2px; XXbackground: hsl(75deg 100% 50% / 50%); }


@media screen and (min-width: 1600px) {
	.Text p, .Text span, .Text div, .Text a, .Text b { font-size: 23px; line-height: 23px }
	.Merchants, div.Merchants a { font-size: 14px; line-height: 17px }
	.Merchants a { margin-bottom: 3px; }	
	.TextBlock div, .TextBlock a, .TextBlock b, #Bonus div, #Bonus2 div, #Bonus2 div a { font-size: 25px; line-height: 26px }
	.Join p + div { line-height: 29px }
	.Text p, .Text p a { font-size: 24px; line-height: 24px }
	.BodyBlock, .Text, div.Merchants div.Line { max-width: 1300px }
	.Text p, .Text span, .Text div { max-width: 770px }
	.Logo { width: 224px; margin: 17px 8px 18px 0 }
	.Buttons a { height: 70px; margin-bottom: -2px }
	.Buttons img { width: 56px; margin: 7px 15px 0 10px }
	.Buttons div { font-size: 31px; margin: 27px 0 0 0 }
	.Enter { max-width: 805px }
	}

@media screen and (max-width: 960px) {
	.Logo { margin-right: 8px }
	.Screens { width: 100% }
	.Screens img { width: 49.8% }
	.JoinButtons a { width: 33%; margin: 0 0 -1px -1px }
	}

@media screen and (max-width: 910px) {
	.JoinButtons div { font-size: 18px }
	}

@media screen and (max-width: 780px) {
	.Buttons a { width: 48.3% }
	.Enter a:nth-of-type(1) { width: 71.1% }
	.Enter a:nth-of-type(2) { width: 26% }
	.JoinButtons a { width: 90.3%; max-width: 580px; margin: 0 0 -1px 0 }
	.JoinButtons div { font-size: 20px }
	.JoinButtons a:nth-of-type(1) { border-radius: 10px 10px 0 0; }
	.JoinButtons a:nth-of-type(2) { border-radius: 0 0 0 0; }
	.JoinButtons a:nth-of-type(3) { border-radius: 0 0 10px 10px; }
	}

@media screen and (max-width: 530px) {
	.Buttons a { width: 48.1% }
	.Enter a:nth-of-type(1) { width: 63.3% }
	.Enter a:nth-of-type(2) { width: 33% }
	.JoinButtons a { width: 93% }
	.JoinButtons div { font-size: 20px }
	}

@media screen and (max-width: 400px) {
	.Screens img, .Enter { width: 99.3% }
	.Buttons a, .Buttons.Enter a { width: 94%; margin: 0 0 -1px 0 }
	.Enter a:nth-of-type(1) { margin-right: 0; margin-bottom: 10px }
	.Enter a:nth-of-type(2) { margin-left: 0; margin-bottom: 0 }
	.JoinButtons div { font-size: 18px }
	.TextContainer div, .TextContainer a, .TextContainer b, #Bonus div, #Bonus2 div, #Bonus2 div a { font-size: 17px; line-height: 17px }
	.Join p + div { line-height: 21px }
	}

@media screen and (max-width: 300px) {
	.Logo { width: 120px; margin: 14px 5px 15px 0 }
	.Text p, .Text span, .Text div { padding-left: 11px; padding-right: 11px }
	.Text p, .Text p a { font-size: 15px; padding-left: 0 }
	.Text span, .Text div, .Text a, .Text b, #Bonus div, #Bonus2 div, #Bonus2 div a { font-size: 13px }
	.Join p + div { line-height: 17px }
	.JoinButtons div { font-size: 14px }
	.Merchants, div.Merchants a { font-size: 8px; line-height: 10px }
	}

@media screen and (max-width: 250px) {
	.JoinButtons div { font-size: 11px }
	}





.Screens { display: block; width: 99%; margin: 0 auto; padding: 0; border: none; box-sizing: border-box; }
.Screens a { display: block; width: 100%; margin: 0 auto; padding: 0; border: none; box-sizing: border-box; }
.Screens a img { display: inline-block; aspect-ratio: 16/9; margin: 0; padding: 0; box-sizing: border-box; 
	text-indent: -200vw; background-color: hsl(0 0% 15% / 100%); background-image: url("/./loading.gif"); 
	background-size: 20%; background-position: center; background-repeat: no-repeat; }

.ScreensView3 img { width: 25%; }
.ScreensView3 img:nth-of-type(1) { border-radius: min(2vw) 0 0 min(2vw); border-right-width: 0; }
.ScreensView3 img:nth-of-type(2) { border-radius: 0 0 0 0; border-right-width: 0; }
.ScreensView3 img:nth-of-type(3) { border-radius: 0 0 0 0; border-right-width: 0; }
.ScreensView3 img:nth-of-type(4) { border-radius: 0 min(2vw) min(2vw) 0; }
.ScreensView3 a { margin-top: min(0.2vw); margin-bottom: min(0.6vw); }

.ScreensView2 img { width: 50%; }
.ScreensView2 img:nth-of-type(1) { border-radius: min(3vw) 0 0 0; border-right-width: 0; border-bottom-width: 0; }
.ScreensView2 img:nth-of-type(2) { border-radius: 0 min(3vw) 0 0; border-bottom-width: 0; }
.ScreensView2 img:nth-of-type(3) { border-radius: 0 0 0 min(3vw); border-right-width: 0; }
.ScreensView2 img:nth-of-type(4) { border-radius: 0 0 min(3vw) 0; }
.ScreensView2 a { margin-top: min(0.2vw); margin-bottom: min(1.2vw); }

.ScreensView1 img { width: 100%; }
.ScreensView1 img:nth-of-type(1) { border-radius: min(4vw) min(4vw) 0 0; border-bottom-width: 0; }
.ScreensView1 img:nth-of-type(2) { border-radius: 0 0 0 0; border-bottom-width: 0; }
.ScreensView1 img:nth-of-type(3) { border-radius: 0 0 0 0; border-bottom-width: 0; }
.ScreensView1 img:nth-of-type(4) { border-radius: 0 0 min(4vw) min(4vw); }
.ScreensView1 a { margin-top: min(0.2vw); margin-bottom: min(2.4vw); }


.EuroClipped { overflow: hidden; }
.EuroClipped img { transform: scale(120.19%); XXtransform-origin: 0% 0%; animation: none !important } /* 120.19% = 1+(1/(100/(8.4%*2*100)-1)) */
.EuroClipped.ScreensView3 img:nth-of-type(1) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round min(calc(2vw - 2vw*0.084)) 0 0 min(calc(2vw - 2vw*0.084))); } /* 0.084=8.4% */
.EuroClipped.ScreensView3 img:nth-of-type(2) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round 0 0 0 0); }
.EuroClipped.ScreensView3 img:nth-of-type(3) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round 0 0 0 0); }
.EuroClipped.ScreensView3 img:nth-of-type(4) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round 0 min(calc(2vw - 2vw*0.084)) min(calc(2vw - 2vw*0.084)) 0); }

.EuroClipped.ScreensView2 img:nth-of-type(1) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round min(calc(3vw - 3vw*0.084)) 0 0 0); }
.EuroClipped.ScreensView2 img:nth-of-type(2) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round 0 min(calc(3vw - 3vw*0.084)) 0 0); }
.EuroClipped.ScreensView2 img:nth-of-type(3) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round 0 0 0 min(calc(3vw - 3vw*0.084))); }
.EuroClipped.ScreensView2 img:nth-of-type(4) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round 0 0 min(calc(3vw - 3vw*0.084)) 0); }

.EuroClipped.ScreensView1 img:nth-of-type(1) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round min(calc(4vw - 4vw*0.084)) min(calc(4vw - 4vw*0.084)) 0 0); }
.EuroClipped.ScreensView1 img:nth-of-type(2) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round 0 0 0 0); }
.EuroClipped.ScreensView1 img:nth-of-type(3) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round 0 0 0 0); }
.EuroClipped.ScreensView1 img:nth-of-type(4) { clip-path: inset(8.4% 8.4% 8.4% 8.4% round 0 0 min(calc(4vw - 4vw*0.084)) min(calc(4vw - 4vw*0.084))); }


XX.Screens a img 	{ transition: width 0.05s linear 0s }
@keyframes Opacity0to100 { 0% { opacity: 0; } 100% { opacity: 1; } }
.Screens img:not(.ScreensBonus img) { animation: Opacity0to100 0.9s ease-in -0.5s 1 normal both running; }/* 0.3s cubic-bezier(1, 0, 1, 1) */



.Videos { margin-bottom: min(calc(11.2vw*1.0),calc(11.2vh*0.9)); }
#Merchants { display: none; padding-top: 0; margin-top: calc(max(calc(-11.2vw*1.0),calc(-11.2vh*0.9)) + 5px); margin-bottom: calc(min(10vw,calc(10vh*0.9)) + 5px); }
#Merchants .Line { display: none; }



.PagesNew { position: fixed; bottom: 0; left: 50%; transform: translate(-50%,0); width: 100vw; height: min(10vw,calc(10vh*0.9)); /* min(10vmin); also working */
				display: flex; flex-flow: row nowrap; justify-content: center; align-items: center; z-index: 1 }
.PagesNew a { flex: 0 0 auto; height: 70%; padding: min(1vw,calc(1vh*0.9)); margin: 0 min(0.5vw,calc(0.5vh*0.9));
				cursor: pointer; font-size: min(6vw,calc(6vh*0.9)); line-height: 1.2; font-weight: 550; letter-spacing: max(-0.125vw,calc(-0.125vh*0.9)); 
				border-radius: min(1.75vw,calc(1.75vh*0.9)); border-width: min(0.25vw,calc(0.25vh*0.9)); XXborder: 1px solid gray; }
.PagesNew a:nth-of-type(4) { cursor: default; padding-right: min(1vw,calc(1vh*0.9)); }
.PagesNew a:first-of-type { margin-right: min(3.6vw,calc(3.6vh*0.9)); margin-left: 0; }
.PagesNew a:last-of-type { margin-left: min(3.6vw,calc(3.6vh*0.9)); margin-right: 0; }
.PagesNew a:first-of-type, .PagesNew a:last-of-type, a#Menu { width: min(7vw,calc(7vh*0.9)); height: min(7vw,calc(7vh*0.9)); display: flex; justify-content: center; align-items: center }
.PagesNew a img, a#Menu img { height: 90%; XXborder: 1px solid red; }
img.ButtonView1 { background-image: url("/./grid1x2.png"); background-size: 140% 110%; background-position: center; }
img.ButtonView2 { background-image: url("/./grid2x2.png"); background-size: 110% 110%; background-position: center; }
img.ButtonView3 { background-image: url("/./grid2x1.png"); background-size: 110% 140%; background-position: center; }

.PagesNew a del { display: inline-block; transform: scale(1.3,0.9); margin-right: min(0.1vw,calc(0.1vh*0.9)); }
.PagesNew form { float: left; XXborder: 1px solid blue; }
.PagesNew input { all: inherit; border-radius: min(1.5vw,calc(1.5vh*0.9)); width: min(calc(07.6vw + 0.5vw),calc((07.6vh + 0.5vh)*0.9)); text-decoration: underline; cursor: pointer; }
input.InputDigits1 { width: min(calc(03.8vw + 0.5vw),calc((03.8vh + 0.5vh)*0.9)); }
input.InputDigits2 { width: min(calc(07.6vw + 0.5vw),calc((07.6vh + 0.5vh)*0.9)); }
input.InputDigits3 { width: min(calc(11.4vw + 0.0vw),calc((11.4vh + 0.0vh)*0.9)); }

.PagesNew input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.PagesNew input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.PagesNew input[type=number] { -moz-appearance: textfield; margin: 0; }



.Screens img { border-color: hsl(0deg 0% 20%); }
.Text p a { text-decoration: none; }
.Text:has(p#Join2) { margin-top: 0; }
a#Menu { position: fixed; top: min(2vw,calc(2vh*0.9)); right: max(2vw,calc(100vw/2 + 2vw - 1920px/2)); z-index: 1; padding: min(1vw,calc(1vh*0.9)); border-radius: min(1.75vw,calc(1.75vh*0.9)); }

body { -webkit-tap-highlight-color: hsl(0deg 0% 0% / 30%); }
.Logo 	{ filter: invert(90%) }
.LogoSF 	{ filter: invert(90%) hue-rotate(180deg)/*red*/ saturate(900%)/*for SF chilli*/; }
.LogoSPL { filter: invert(90%) hue-rotate(180deg)/*red*/ saturate(050%)/*for SPL*/; }

body { background-color: hsl(0deg 0% 10%); background-image: linear-gradient(hsl(0deg 0% 10% / 80%),hsl(0deg 0% 10% / 80%)), url("/./bg_black.jpg");
		background-size: 25vmin 25vmin; background-attachment: fixed; }
.Text:not(.Merchants) { background-color: hsl(0deg 0% 15%); border-color: hsl(0deg 0% 20%); box-shadow: 1px 2px 4px 1px hsl(0 0% 5% / 20%) !important; }
.Text p, .Text div, .Text span, .Text a, .Text p a, .Merchants { color: hsl(0deg 0% 100% / 80%) !important; }
.Line { background-color: hsl(0deg 0% 60%) !important; }
.Text div, .Text span { border-color: hsl(0deg 0% 25%); }
.Text div { background-color: hsl(0deg 0% 20%); }
.Text span { background-color: hsl(0deg 0% 22.5%); }
.Buttons a { box-shadow: inset 1.5px 1.5px 1.5px 1.5px hsl(0deg 0% 100% / 0.5), inset -1.5px -1.5px 1.5px 1.5px hsl(0deg 0% 0% / 0.2) !important }
.Buttons a, .PagesNew a, a#Menu { background-color: hsl(0deg 0% 85%) !important; border-color: hsl(0deg 0% 70%); }
.Buttons div, .PagesNew a { color: hsl(0deg 0% 15%); opacity: 1; }
.Buttons img, .PagesNew a img, #Menu img { opacity: 0.8; }
.PagesNew { background-color: hsl(0deg 0% 15%); border-top: min(0.25vw,calc(0.25vh*0.9)) solid hsl(0deg 0% 20%); }
.PagesNew a, a#Menu { box-shadow:	inset min(calc(0.25vmin))				min(calc(0.25vmin))				min(calc(0.25vmin))	min(calc(0.25vmin))	hsl(0deg 0% 100% / 0.5),
												inset min(calc(-0.25vmin))				min(calc(-0.25vmin))				min(calc(0.25vmin))	min(calc(0.25vmin))	hsl(0deg 0% 0% / 0.2) !important }
.PagesNew input { background-color: hsl(0deg 0% 100%); }
.PagesNew input:focus { background-color: hsl(0deg 0% 100%); }
.JoinButtons a:nth-of-type(2) { background-image: linear-gradient(#ffcf404D,#ffcf404D) !important; XXborder-color: #d9b036;
	box-shadow: inset 1.5px 1.5px 1.5px 1.5px hsl(0deg 0% 100% / 0.42), inset -1.5px -1.5px 1.5px 1.5px hsl(0deg 0% 0% / 0.175) !important }
.JoinButtons a:nth-of-type(1) { background-image: linear-gradient(#ffcf40E6,#ffcf40E6) !important; border-color: #d9b036;
	box-shadow: inset 1.5px 1.5px 1.5px 1.5px hsl(0deg 0% 100% / 0.35), inset -1.5px -1.5px 1.5px 1.5px hsl(0deg 0% 0% / 0.15) !important }



/* BLACK FRIDAY 
body { background-color: hsl(0deg 0% 10%); background-image: linear-gradient(hsl(0deg 0% 10% / 90%),hsl(0deg 0% 10% / 90%)), url("https://les-world.com/bg_bf.png");
		background-size: 50vmin 50vmin; background-attachment: fixed; }
*/