@font-face {
  font-family: 'Lato';
  font-weight: normal;
  src: url('Lato-Regular.ttf');
}

@font-face {
  font-family: 'Lato';
  font-weight: normal;
  font-style: italic;
  src: url('Lato-Italic.ttf');
}

@font-face {
	font-family: 'Lato';
	font-weight: bold;
	src: url('Lato-Bold.ttf');
}

@font-face {
	font-family: 'Lato';
	font-weight: bold;
  font-style: italic;
	src: url('Lato-BoldItalic.ttf');
  }

@font-face {
	font-family: 'LatoBlack';
	font-weight: bold;
	src: url('Lato-Black.ttf');
  }

@font-face {
	font-family: 'LatoBlack';
	font-weight: bold;
	font-style: italic;
	src: url('Lato-BlackItalic.ttf');
  }

  @font-face {
    font-family: 'FontAwesome';
	src: url('fa-solid-900.woff2');
}

html {
	height:100%;
    background-color:black;
}

body
{
    background-color:black;
	color:white;
	margin: 0px;
    font-family: 'Lato', sans-serif!important;
    line-height:24px;
	height:100%;
	text-align:center;
	font-weight:normal;
	font-size:18px;
	line-height:1.1;
}

.no-select {
  user-select: none;
  -webkit-user-select: none;
}

input:focus,
select:focus,
textarea:focus,

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #5a5a5a;
  opacity: 1; /* Firefox */
}

h1 {
	padding:0;
	margin:0;
}

h2 {
	padding:0;
	margin:0;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
}

/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: transparent; 
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #372817; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: black; 
}

option {
	font-size:18px;
	background-color:transparent;
	color:black;
}

button:focus, button:active {
    outline: none !important;
}

button {
	font-family: 'Lato'!important;
	cursor:pointer;
	width:120px;
	height:45px;
	border-radius:10px!important;
	color:white;
	background-color:transparent;
	border:solid 1px white;
	font-weight: bold;
}

.buttonYellow {
	font-size:14px;
	width:auto;
	line-height:1;
	background-color:#fbba02;
	color:#153470;
	border:none;
	border-radius:5px!important;
	font-weight:bold;
	text-transform: uppercase;
	text-align:center;
	position:relative;
	vertical-align: top;
	padding:10px 20px;
	/*disable wrap*/
	white-space: nowrap;
}


.blueButton {
	border:solid 1px #286ef0;
	background-color:#18233df0
}

.button200 {
	width:200px;
}

.button100perc {
	width:100%;
}

a
{
border:none;
text-decoration:none;
color:inherit;
}

a:hover {
	text-decoration:underline;
	color:inherit;
}


img
{
	border:none;
}

sub, sup {
    position: initial!important;
}

hr {
	height:1px;
	border: none;
    height: 1px;
    color: #858483; /* old IE */
    background-color: #858483; /* Modern Browsers */
	margin-bottom:10px;
	margin-top:10px;
}

select {
	width:100%;
	height:62px;
	border:0;
	border-radius:10px;
	font-size:18px;
	font-family:Lato;
}

.mobileOnly {
	display:none;
}

.yellow {
	color:#ffb300;
}

.link {
	color:#ffb300;
	text-decoration: underline;
}

.uppercase {
	text-transform: uppercase;
}
/*** TOP-LOGO ***/

.topLogo {
	position:absolute;
	top:20px;
	left:100px;
}

.topLogo img {
	width:250px;
}

/*** MENU ***/

.sideMenu {
	position:absolute;
	top:140px;
	left:100px;
	text-transform: uppercase;
	text-align:left;
}

.sideMenu ul {
	list-style-type: none;
	padding:0;
	margin:0;
}

.sideMenu ul li {
	padding:10px 0;
	font-size:18px;
	position: relative;
	padding-right: 20px;
}

.sideMenu ul li::after {
	content: "\f054"; /* fa-chevron-right */
    font-family: "FontAwesome";
    font-weight: 900;

	position: absolute;
	right: -20px;
	top: 50%;
	transform: translateY(-50%);
}

.sideMenuSelected {
	color:#ffb300;
}

.loggedBox {
	position:absolute;
	top:50px;
	right:100px;
	text-align:right;
	width:200px;
	text-align:left;
	font-size:15px;
	line-height:1.1;
	display:table;
}

.loggedBoxScore {
	color:#276ef1;
	font-weight:bold;
}

.loggedBoxContent {
	display:table-cell;
	vertical-align: middle;
}

.loggedBoxPhoto {
	display:table-cell;
	vertical-align: middle;
}

.loggedBoxPhoto img {
	width:50px;
	border-radius:50%;
}

.loggedBoxText {

}

.loggedBoxPhoto {

}

/*** HOME ***/
.homeContainer {
	background-image:url(../img/gnd1.jpg);
	min-height:100vh;
	background-size: cover;
	background-position: center top;
	height:850px;
}

.homeContent {
	position:absolute;
	width:500px;
	top:140px;
	left:43%;
}

.homeContentText {
	padding-top:15px;
	padding-left:15%;
	text-align:left;

}

.homeContent img {
	width:100%;
}

.homeContentButtons {
	padding-top:40px;
}

.homePrizesContainer {
	position:absolute;
	top:550px;
	left: 50%;
	transform: translateX(-50%);
	width: 265px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.homePrizesBox {
	display: flex;
	overflow-x: auto;
	overflow-y: hidden;
	gap: 12px;
	padding: 0 10px;
	box-sizing: border-box;
}

.homePrizesArrow {
	width:50px;
	height:50px;
	cursor: pointer;
	object-fit: contain;
	transition: opacity 0.3s ease;
	flex-shrink: 0;
}

.homePrizesArrow:hover {
	opacity: 0.7;
}

.homePrizesBox::-webkit-scrollbar {
	height: 0px;
	display: none;
}

.homePrizesBox::-webkit-scrollbar-track {
	background: transparent;
	display: none;
}

.homePrizesBox::-webkit-scrollbar-thumb {
	background: transparent;
	border-radius: 4px;
	display: none;
}

.homePrizesBox::-webkit-scrollbar-thumb:hover {
	background: transparent;
	display: none;
}

.homePrize {
	margin:0;
	display:inline-flex;
	flex-direction: column;
	border:solid 1px #283f8b;
	text-align:left;
	font-size:16px;
	line-height:1.1;
	border-radius:8px;
	flex-shrink: 0;
	min-width: 200px;
}

.homePrize img {
	width:250px;
	border-radius:8px 8px 0 0;
}

.homePrizeText {
	padding:15px 0;
	width:90%;
	margin:0 auto;
	text-transform: uppercase;
}

.homePrizePrice {
	background-color:#276ef1;
	color:white;
	padding:2px 10px;
	width:100px;
	text-transform: lowercase;
	margin-top:15px;
	border-radius:5px;
}

/*** REGISTER ***/
.registerContainer {
	background-image:url(../img/gnd2.jpg);
	min-height:100vh;
	background-size: cover;
	background-position: center top;
}

.registerContent {
	display:table;
	width:75%;
	margin-left:25%;
	padding-top:140px;
}

.registerCenterBlock {
	display:table-cell;
	width:50%;
	vertical-align:top;
	padding-top:80px;
	padding-right:40px;
}

.registerContentText {
	padding-top:15px;
	padding-left:15%;
	text-align:left;
}

.registerContent img {
	width:100%;
}

.registerFormBlock {
	display:table-cell;
	vertical-align:top;
	padding-right:100px;
}

.registerFormTitle {
	text-transform:uppercase;
	font-size:30px;
	line-height: 1;
	font-family:LatoBlack;
	text-align:left;
	font-style: italic;
}

.registerFormRow {
	display:table;
	width:100%;
}

.registerFormItem {
	display:table-cell;
	width:50%;
	padding-right:10px;
}

.registerFormLabel {
	margin-top:20px;
	width:100%;
	text-align:left;
	font-size:18px;
	line-height:24px;
	font-weight: bold;
	padding-bottom:2px;
	font-style: italic;
}

.registerFormInput {
	width:100%;
	text-align:left;
}

.registerFormInput input {
	width:100%;
	border:solid 1px #999796;
	border-radius:10px;
	background:none;
	height:40px;
	color:white;
	padding-left:15px;
	box-sizing: border-box;
	font-size:15px;
}

.registerFormInput select {
	border:solid 1px #999796;
	border-radius:10px;
	background:none;
	height:40px;
	color:white;
	padding-left:5px;
	box-sizing: border-box;
	width:25%;
	font-size:14px;
	height:39px;
}

.registerFormInputPhone {
	width:69%!important;
}

.registerFormCheckbox {
	margin-top:10px;
	text-align:left;
	font-size:10px;
	line-height: 1;
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.registerFormCheckbox a {
	  color: #286ef0;
	  text-decoration: underline;
}

.loginPasswordForgot {
	font-size:14px;
	line-height:1;
}

.loginPasswordForgot a {
	color:#286ef0;	
}

/*** CONTATTI ***/
.contattiContainer {
	background-image:url(../img/gnd3.jpg);
	min-height:100vh;
	background-size: cover;
	background-position: center top;
}

.contattiContent {
	display:block;
	width:75%;
	margin-left:25%;
	padding-top:140px;
	text-align:left;
}

.contattiTitle {
	font-family:LatoBlack;
	font-style: italic;
	color:#ffb300;
	font-size:50px;
	line-height:1;
	text-transform: uppercase;
}

.contattiBox1 {
	width:400px;
	border:solid 1px #286ef0;
	border-radius:20px;
	padding:20px;
	display:inline-block;
	vertical-align: top;
	margin-right:20px;
}

.contattiContent hr {
	border:0;
	background-color:#153470;
	margin:20px 0;
}

.contattiBoxSmallText {
	padding-top:5px;
	font-size:14px;
	line-height: 1.2;
}

.contattiTable {
	display:table;
}

.contattiCell {
	display:table-cell;
	vertical-align: middle;;
}

.contattiCell img {
	width:80px;
	padding-right:20px;
}

.contattiBox2{
	width:350px;
	border:solid 1px #286ef0;
	border-radius:20px;
	padding:20px;
	display:inline-block;
	vertical-align: top;
}

.contattiRow {
	display:table-row;
}

.contattiDay {
	display:table-cell;
	width:205px;
	text-transform: uppercase;
}

.contattiTime {
	display:table-cell;
	width:120px;
	font-weight:bold;
}

.contattiIconTime {
	width:70px!important;
}

.contattiIconDate {
	width:50px!important;
}

.contattiTimeHr {
	margin: 10px 0!important;
}

/** DASHBOARD **/

.dashboardContainer {
	background-image:url(../img/gnd4.jpg);
	min-height:100vh;
	background-size: cover;
	background-position: center top;
}

.dashboardContent {
	display:block;
	width:75%;
	margin-left:25%;
	padding-top:140px;
	text-align:left;
}

.dashboardTopBox {
	border:solid 1px #fbba02;
	border-radius:10px;
	width:200px;
	padding:5px 10px;
	position:relative;
	display:inline-block;
}

.dashboardTopBox h1::after {
	content: "\f054"; /* fa-chevron-right */
    font-family: "FontAwesome";
    font-weight: 900;
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	color:#286ef0;
}

.dashboardTopBox h1 {
	font-size:12px;
	line-height:1;
	text-transform: uppercase;
	font-weight: bold;;
}

.dashboardTopBox h2 {
	font-size:11px;
	line-height:1;
}

.dashboardBox {
	width:500px;
	border:solid 1px #417ef2;
	border-radius:10px;
	padding:10px;
	display:inline-block;
	margin-right:10px;
	min-height:250px;
	margin-bottom:15px;
	vertical-align: top;
}

.dashboardBox h1 {
	color:#fbba02;
	font-family:LatoBlack;
	font-style: italic;
	text-transform: uppercase;
	font-size:20px;
	line-height:1;
}

.dashboardProfileBoxContent {
	display:table;
	width:100%;
}

.dashboardProfileBoxContent label {
	margin:0;
	padding:0 0 5px 0;
	font-size:12px;
	line-height:1;
	font-style: italic;
}

.dashboardProfileBoxContentLeft {
	display:table-cell;
	width:33%;
	vertical-align:top;
}

.dashboardProfileBoxContentCenter {
	display:table-cell;
	width:33%;
	vertical-align:top;
}

.dashboardProfileBoxContentRight {
	display:table-cell;
	width:33%;
	vertical-align:top;
}

.dashboardProfileBoxContent input {
	width:90%;	
	background-color:transparent;
	border:solid 1px #868890;
	border-radius:5px;
	color:white;
	font-size:12px;
	line-height:1;
	padding:5px;
}

.dashboardProfileImage {
	top:20px;
	width:120px;
	height:120px;
	position:relative;
	background-image:url(../img/profile_empty.png);
	background-size: contain;
}

.dashboardProfileImageIcon {
	position:absolute;
	top:90px;
	left:90px;
}

.dashboardProfileImageIcon img {
	width:30px;
	cursor:pointer;
}

.dashboardProfileLevel {
	padding-top:30px;
	font-size:12px;
	line-height:1;
	text-align:center;
	padding-right:20px;
}

.dashboardProfileLevel h1 {
	padding-top:5px;
	text-transform: uppercase;
	font-family:LatoBlack;
	font-style: italic;
	color:#fbba02;
	font-size:18px;
	line-height: 1;
}

.dashboardBox button {
	font-size:8px;
	line-height:1;
	background-color:#fbba02;
	color:#153470;
	border:none;
	height:20px;
	border-radius:5px!important;
	font-weight:bold;
	text-transform: uppercase;
	text-align:left;
	position:relative;
	vertical-align: top;
}

.dashboardProfileBoxContent button {
	width:90%;
	margin-top:15px;
}

.dashboardBox button::after {
	content: "\f054"; /* fa-chevron-right */
    font-family: "FontAwesome";
    font-weight: 900;	
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	color:#153470;
}

.dashboardBox hr {
	margin:10px 0 15px 0;
}

.dashboardPassportBoxTitle2 {
	display:table;
	width:100%;
}

.dashboardPassportBoxTitle2Left {
	display:table-cell;
	width:50%;
	text-align:left;
}

.dashboardPassportBoxTitle2Right {
	display:table-cell;
	width:50%;
	text-align:right;
	font-size:12px;
	line-height:1;
	text-transform: uppercase;
	font-weight: bold;
}

.dashboardPassportBoxTitle2Right b {
	color:#fbba02;
	font-size:14px;
}

.dashboardPassportBoxContent {
	display:table;
	width:100%;
	margin-top:20px;
}

.dashboardPassportBoxContentItem {
	display:table-cell;
	width:30px;
	text-align:center;
	line-height:10px;
}

.dashboardPassportBoxContentItem img {
	width:50px;
}

.dashboardPassportBoxContentItemDot {
	width:20px!important;
}

.dashboardPassportBoxContentItemDisabled {
	opacity: 0.3;
}

.dashboardBoxGameLogo {
	padding-left:5px;
	height:18px;
	padding-top:2px;
	vertical-align:top;
}

.dashboardBoxGameTable {
	display:table;
	width:100%;
	margin:0 auto;
}

.dashboardBoxGameTableCellLeft {
	display:table-cell;
	width:70%;
	text-align:left;
	vertical-align: top;
}

.dashboardBoxGameTableCellRight {
	display:table-cell;
	width:30%;
	text-align:right;
	vertical-align: top;
}

.dashboardBoxGameContent {
	display:table;
	width:100%;
	margin:20px auto;
}

.dashboardBoxGameContentCell {
	display:table-cell;
	text-align:center;
	font-weight: bold;
	color:#fbba02;
	width:33%;
	font-size:12px;
	line-height:1;
	text-transform: uppercase;
}

.dashboardBoxGameContentCell img {
	width:100%;
	padding:0 10px 15px 10px;
}

.dashboardLevelTable {
	display:table;
	width:100%;
}

.dashboardLevelTableLeft {
	display:table-cell;
	width:50%;
}

.dashboardLevelTableLeftScore {
	text-transform: uppercase;
	width:200px;
	font-size:11px;
	line-height:1;
	display:inline-block;
}

.dashboardLevelTableLeftScore b {
	font-size:13px;
	line-height:1;
	color:#fbba02;
	font-weight:bold;
}

.dashboardLevelTableLeftNextLevel {
	font-size:11px;
	line-height:1;
	text-transform: uppercase;
	display:inline-block;
}

.dashboardLevelTableLeftNextLevel b {
	font-size:13px;
	line-height:1;
	color:#fbba02;
	font-weight:bold;
}

.dashboardLevelTableRight {
	display:table-cell;
	width:50%;
	text-align:center;
}

.dashboardLevelTableRight button {
	width:90px;
}

.dashboardLevelTableRightCurrentPoints {
	font-size:10px;
}

.dashboardLevelTableRightCurrentPoints b {
	font-size:11px;
	color:#fbba02;
}

.dashboardLevelTableRightNextLevel {
	padding-top:15px;
	font-size:10px;
}

.dashboardLevelTableRightNextLevelName {
	font-size:12px;
	color:#fbba02;
	text-transform:uppercase;
	font-style: italic;
	font-family:LatoBlack;
	padding-bottom:20px;
}

.dashboardFidelityTable {
	display:table;
	width:100%;
	margin-top:5px;
}

.dashboardFidelityTableLeft {
	display:table-cell;
	width:60%;
	vertical-align: middle;
}

.dashboardFidelityTableRight {
	display:table-cell;
	width:40%;
	font-size:10px;
	line-height:1;
	vertical-align: middle;
}

.dashboardFidelityTableRight b {
	color:#fbba02;
}

.dashboardLevelTableLeftTitle {
	font-size:12px;
	font-weight: bold;
	padding-bottom:2px;
}

.dashboardLevelTableLeftSubTitle {
	font-size:14px;
	font-family:LatoBlack;
	text-transform: uppercase;
	color:#fbba02;
}

.dashboardLevelProgressBar {
	margin:5px 0;
	border:solid 1px #544519;
	height:30px;
	width:320px;
}

.dashboardScoreDivider{
	margin:8px 0!important;
}

.dashboardFidelityBall {
	display:inline-block;
	font-weight:bold;
	font-size:12px;
	text-align:center;
	text-transform: uppercase;
}

.dashboardFidelityBall img {
	width:30px;
	padding-bottom:2px;
}

.dashboardFidelityBallDisabled {
	opacity: 0.3;
}


/*** GENERIC ***/
.genericContainer {
	background-image:url(../img/gnd3.jpg);
	min-height:100vh;
	background-size: cover;
	background-position: center top;
}

.genericContent {
	display:block;
	width:75%;
	margin-left:25%;
	padding-top:140px;
	text-align:left;
	max-width: 950px;
}

.genericContent hr {
	border:0;
	background-color:#153470;
	margin:20px 0;
}


.genericTitle {
	font-family:LatoBlack;
	font-style: italic;
	color:#ffb300;
	font-size:50px;
	line-height:1;
	text-transform: uppercase;
}
 
/*** AGE GATE ***/
.ageGateContainer {
	background-image:url(../img/gnd0.jpg);
	min-height:100vh;
	background-size: cover;
	background-position: center top;
}

.ageGateContent {
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	width:90%;
	height:100vh;
	text-align:center;
	max-width:450px;
	margin:0 auto;
}

.ageGateContent img {
	max-width:500px;
	width:100%;
}

.ageGateContent h1 {
	font-family:LatoBlack;
	font-style: italic;
	color:#fbba02;
	font-size:50px;
	line-height:1;
	text-transform: uppercase;
	margin-top:20px;
	margin-bottom:20px;
}

.ageGateContent input {
	width:120px;
	height:80px;
	font-size:30px;
	color:#283f8b;
	text-align:center;
	font-family:LatoBlack;
	margin:0 2px;
	border-radius:10px;
	border:0;
}

/*set color of placeholder to #ffb300*/
.ageGateContent input::placeholder {
	color:#ffb300;
	opacity:1;
}

.ageGateContent button {
	margin:20px 0;
	width:85%;
	background-color:#18233d;
	border:solid 1px #286ef0;
	color:#ffb300;
	font-family:LatoBlack;
	font-size:30px;
	text-transform: uppercase;
}