html, body, #root {
	padding: 0px;
	margin: 0px;
	width: 100vw;
	height: 100vh;
	max-width: 100vw;
	max-height: 100vh;
	overflow: hidden;
	font-size: 100%;
	font-family: Verdana;
}

/* GLOBAL TEXT */
@media screen and (min-width: 480px) {
  html {
    font-size: 70%;
  }
}

@media screen and (min-width: 768px) {
  html {
    font-size: 85%;
  }
}
/* END TEXT */

/* GLOBAL LINKS */

/* unvisited link */
a {
	font-weight: bold;
	text-decoration: none;
}

a:link {
	color: white;
}

/* visited link */
a:visited {
	color: white;
}

/* mouse over link */
a:hover {
	color: white;
}

/* selected link */
a:active {
	color: white;
}

/* END GLOBAL LINKS */

/* INTRO LAYOUT */
#intro {
	padding: 0px;
	width: 100vw;
	height: 100vh;
	max-width: 100vw;
	max-height: 100vh;
	margin: auto;
	background: #111;
	color: #FFF;
	background-position: center;
	background-size: cover;
}

/* mouse over link */
#intro a:hover {
	color: yellow;
}

/* selected link */
#intro a:active {
	color: orange;
}


#click2start {
	width: 100vw;
	height: 90vh;
	max-width: 100vw;
	max-height: 90vh;
	text-align: center;
	margin: auto;
}

#click2start a {
	top: 66vh;
	position: relative;
	font-size: 2.5em;
}

#logo {
	margin: 0px auto 0px auto;
	font-size: 1.2em;
	padding: 0px;
	width: 15vw;
	top: 2vw;
	left: 2vw;
	position: absolute;
	z-index: 10;
}

#logo img {
	width: 1.5vw;
	filter: invert(100%);
}

/* END INTRO LAYOUT */

/* MAIN LAYOUT */
#main {
	padding: 0px;
	width: 100vw;
	height: 100vh;
	max-width: 100vw;
	max-height: 100vh;
	position: absolute;
	margin: 0px auto 0px auto;
	display: block;
	background: #222;
	color: #FFF;
	background-image: url(../imgs/bg.png);
	background-position: center;
	background-size: cover;
}

#header {
	top: 0px;
	margin: 0px auto 0px auto;
	padding: 0px;
	width: 100vw;
	height: 5.2vh;
	max-width: 100vw;
	position: relative;
	display: block;
	text-align: center;
	background-image: url(../imgs/header.png);
	background-position: center;
}

#footer {
	bottom: 0px;
	width: 100vw;
	height: 5.2vh;
	max-width: 100vw;
	max-height: 5.2vh;
	min-height: 5.2vh;
	position: relative;
	display: block;
	text-align: center;
	font-size: 80%;
	margin: 0px auto 0px auto;
}


#events {
	margin: 0px auto 0px auto;
	width: 80vw;
	max-width: 80vw;
	height: 60vh;
	max-height: 60vh;
	padding: 0px;
	position: relative;
	display: flex;
	flex-wrap: nowrap;
	overflow: hidden;
}

#hscroll {
	width: 100vw;
	max-width: 100vw;
	height: 60vh;
	max-height: 60vh;
	padding: 0px;
	margin: 0px auto 0px auto;
	display: flex;
	flex-wrap: nowrap;
	overflow: hidden;

	.card {
		flex: 0 0 auto;
	}
}

.card a {
	font-size: 150%;
	font-weight: bold;
}







#goback {
	width: 3.6vw;
	height: 5.2vh;
	max-width: 3.6vw;
	max-height: 5.2vh;
	float: left;
	position: relative;
	display: block;
}

#welcome {
	top: 1vh;
	margin-left: 1vw;
	width: 45vw;
	height: 5.2vh;
	max-width: 50vw;
	position: relative;
	display: inline-block;
}

#welcome p {
	margin: 2px;
}

#userpanel {
	width: 12vw;
	height: 5.2vh;
	max-width: 12vw;
	position: relative;
	display: inline-block;
	background-image: url(../imgs/login.png);
}

#userpanel a {
	top: 1vh;
	margin: 4px auto 0px auto;
}

#notifications {
	padding: 10px;
	float: left;
	display: inline-block;
}

#notifications img {
	width: 25px;
	height: 25px;
}

#notifications img:hover {
	filter: opacity(60%);

}



#championship {
	border: 3px solid #444;
	padding: 15px;
	margin: 15px;
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	color: #FFF;
	text-align: center;
	text-shadow: 0 0 5px var(--mdn-shadow, #111);
	font-weight: bold;
	width: 21.33vw;
	max-width: 21.33vw;
	position: relative;
	float: left;
	display: block;
}

#championship:hover {
	border: 3px solid #f73801;
	box-shadow: 0 0 10px var(--mdn-shadow, #ffff00);
}

#special {
	border: 3px solid #444;
	padding: 15px;
	margin: 15px;
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	color: #FFF;
	text-align: center;
	text-shadow: 0 0 5px var(--mdn-shadow, #111);
	font-weight: bold;
	width: 21.33vw;
	max-width: 21.33vw;
	position: relative;
	float: left;
	display: block;
}

#special:hover {
	border: 3px solid #f73801;
	box-shadow: 0 0 10px var(--mdn-shadow, #ffff00);
}




#rules,#about,#results { 
	max-width: 68vw;
	padding: 5px;
	margin: 5px;
	font-size: 80%;
	border: 2px solid #444;
	border-radius: 10px;
	background-color: rgba(0,0,0,0.8);
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
}

.info > div.gz-rankings-block-wrapper {
	max-width: 68vw;
	padding: 5px;
	margin: 5px;
	font-size: 80%;
	display: flex;
	flex-direction: column;
	width: 100%;
	align-items: center;
	justify-content: center;
	gap: 10;
}

.info > div.gz-rankings-block-wrapper > div.gz-rankings-header {
	display: flex;
	flex-direction: row;
	width: 100%;
	align-items: center;
	justify-content: start;
	gap: 10;
	font-size: large;
	align-items: center;
	justify-content: start;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: start;
	width: 100%;
	min-height: 50vh;
	max-height: 60vh;
	border: 2px solid #444;
	border-radius: 10px;
	background-color: rgba(0,0,0,0.8);
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
}

.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header {
	display: flex;
	flex-direction: row;
	width: 100%;
	font-weight: bold;
}
.info > div.gz-rankings-block-wrapper > div.gz-rankings-header > div.gz-rankings-header-modechange-icon {
	margin-left: 5pt;
	margin-right: 5pt;
	cursor: pointer;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-teams-header-pos {
	width: 5%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-teams-header-team {
	width: 40%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-teams-header-drivers {
	width: 45%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-teams-header-points {
	width: 10%;
}

.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-wrapper-header-colpos {
	width: 5%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-wrapper-header-license {
	width: 10%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-wrapper-header-safetyrate {
	width: 10%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-wrapper-header-nationallity {
	width: 10%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-wrapper-header-driver {
	width: 20%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-wrapper-header-team {
	width: 15%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-wrapper-header-races {
	width: 10%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-wrapper-header-drivethrus {
	width: 10%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper > div.gz-standings-wrapper-header > div.gz-standings-wrapper-header-stopgos {
	width: 10%;
}

.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content {
	display: flex;
	flex-direction: column;
	width: 100%;
	font-weight: bold;
	overflow-y: auto;
	max-height: 90%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row {
	display: flex;
	flex-direction: row;
	width: 100%;
	align-items: center;
	justify-content: start;
}

.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row >  div.gz-standings-teams-pos {
	width: 5%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row >  div.gz-standings-teams-team {
	width: 40%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: start;
	gap: 10pt;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row >  div.gz-standings-teams-team > div.logo {
	width: 75pt;
	height: 70pt;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row >  div.gz-standings-teams-team > div.logo > img {
	width: 100%;
	height: 100%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row >  div.gz-standings-teams-team > div.team {
	font-size: x-large;
}

.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row >  div.gz-standings-teams-drivers {
	width: 45%;
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: center;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row >  div.gz-standings-teams-drivers > div{
	width: 100%;
}

.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row >  div.gz-standings-teams-points {
	width: 10%;
}

.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row > div.gz-standings-wrapper-content-colpos {
	width: 5%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row > div.gz-standings-wrapper-content-collicense {
	width: 10%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row > div.gz-standings-wrapper-content-colsafetyrate {
	width: 10%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row > div.gz-standings-wrapper-content-colnationallity {
	width: 10%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row > div.gz-standings-wrapper-content-coldriver {
	width: 20%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row > div.gz-standings-wrapper-content-colteam {
	width: 15%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row > div.gz-standings-wrapper-content-colraces {
	width: 10%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row > div.gz-standings-wrapper-content-coldrivethrus {
	width: 10%;
}
.info > div.gz-rankings-block-wrapper > div.gz-standings-wrapper  > div.gz-standings-wrapper-content > div.gz-standings-wrapper-content-row > div.gz-standings-wrapper-content-colstopgos {
	width: 10%;
}

.gz-server-block-wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;
	gap: 10;
}
.gz-server-block-wrapper > div.gz-server-list-wrapper {
	max-width: 68vw;
	max-height: 70%;
	padding: 5px;
	margin: 5px;
	font-size: 80%;
	border: 2px solid #444;
	border-radius: 10px;
	background-color: rgba(0,0,0,0.8);
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	overflow: hidden;
}
.gz-server-block-wrapper > div.gz-server-list-wrapper  > div.gz-serverlist-header-row {
	width: 100%;
	height: 5%;
	font-size:large;
	font-weight: bold;
	display: flex;
	flex-direction: row;
	align-items: start;
	justify-content: center;

}
.gz-server-block-wrapper > div.gz-server-block-title {
	width: 85%;
	font-size: large;
	font-weight: bold;
	display: flex;
	flex-direction: row;
	gap: 10;
	justify-content: start;
	align-items: center;
}
.gz-server-block-wrapper > div.gz-server-list-wrapper  > div.gz-server-list-content {
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: start;
	width: 100%;
	height: 95%;
	max-height: 95%;
	overflow-y: auto;
}

.gz-server-block-wrapper > div.gz-server-list-wrapper  > div.gz-server-list-content > div.gz-server-list-row {
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}

#results {
	overflow: auto;
}

#result  {
	display: flex;
	flex-wrap: nowrap;
	vertical-align: middle;
}

.infowrapper{
	display: flex;
	flex-direction: column;
	justify-content: start;
	width: 100%;
}
.infowrapper > div.userinfo-form-row {
	width: 100%;
}
.infowrapper > div.userinfo-form-row > h2 {
	margin-left: 13%;
}

.userinfowrapper {
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	width: 52%;
	height: 80%;
	padding: 10px;
	margin: 20px;
	border: 2px solid #444;
	border-radius: 10px;
	background-color: rgba(0,0,0,0.8);
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
}

.userinfowrapper > div.userinfo-form {
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 70%;
	align-items: start;
	justify-content: start;
}

.userinfowrapper > div.userinfo-form > div.userinfo-form-row {
	display: flex;
	flex-direction: row;
	width: 100%;
	align-items: center;
	justify-content: space-between;
}
.userinfowrapper > div.userinfo-form > div.userinfo-form-row > div.userinfo-form-row-actions {
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}

.recordinfo {

}
.raceinfo {
	width: 20vw;
	max-width: 20vw;
	padding: 5px;
	margin: 5px;
	font-size: 80%;
	border: 2px solid #444;
	border-radius: 10px;
	background-color: rgba(0,0,0,0.8);
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
}
.raceinfo > div.raceinfo-inner-wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.raceinfo > div.raceinfo-inner-wrapper > div.raceinfo-inner-row {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
}
.raceinfo > div.raceinfo-inner-wrapper > div.raceinfo-inner-row > div.raceinfo-inner-row-col-title {
	width: 35%;
}
.raceinfo > div.raceinfo-inner-wrapper > div.raceinfo-inner-row > div.raceinfo-inner-row-col-icon {
	width: 5%;
}
.raceinfo > div.raceinfo-inner-wrapper > div.raceinfo-inner-row > div.raceinfo-inner-row-col-time {
	width: 20%;
}
.raceinfo > div.raceinfo-inner-wrapper > div.raceinfo-inner-row > div.raceinfo-inner-row-col-temp {
	width: 20%;
}

.infowrapper > div.info > div.race-detail-info-wrapper {
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: start;
	width: 25%;
	height: 80%;
}

.infowrapper > div.info > div.race-detail-info-wrapper > div.userinfo-form-row {
	display: flex;
	flex-direction: row;
	align-items: start;
	justify-content: start;
	gap: 10pt;
	width: 100%;
}

.infowrapper > div.info > div.gz-event-car-and-track-wrapper {
	display: flex;
	flex-direction: column;
	width: 15vw;
	height: 100%;
	align-items: center;
	justify-content: center;
	gap: 5%;
}
.infowrapper > div.info >  div.gz-event-car-and-track-wrapper > div.gz-event-car-and-track-img {
	width: 12vw;
	height: 22vh;
	padding: 5px;
	border: 2px solid #444;
	border-radius: 10px;
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
}

.infowrapper > div.info > div.gz-event-car-and-track-wrapper > div.gz-event-car-and-track-img > img {
	width: 100%;
	height: 100%;
}

.infowrapper > div.info > div.gz-event-drivers-wrapper {
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: start;
	font-size: 80%;
	padding: 15px;
	width: 28vw;
	height: 45vh;
	border: 2px solid #444;
	border-radius: 10px;
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	overflow: auto;
}

#userinfo {
	display: block;
	flex: 0 auto auto;
	width: 32vw;
	max-width: 32vw;
	padding: 10px;
	margin: 20px;
	font-size: 80%;
	border: 2px solid #444;
	border-radius: 10px;
	background-color: rgba(0,0,0,0.8);
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
}

#driverinfo {
	font-size: 60%;
	display: block;
}

#driverinfo .SR {
	font-size: 130%;
}

.flag {
	width: 1vw;
	max-width: 1.2vw;
	height: 1vh;
	max-height: 1.2vh;
}

.userrecords {
	display: flex;
	flex-direction: column;
	width: 40%;
	height: 80%;
	overflow-y: auto;
	overflow-x: hidden;
	padding: 10px;
	margin: 20px;
	font-size: 80%;
	border: 2px solid #444;
	border-radius: 10px;
	background-color: rgba(0,0,0,0.8);
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
}
.userrecords > div.userrecords-header {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: start;
}

#usrchart {
	float: left;
	position: absolute;
	display: block;
	max-width: 10vw;
	max-height: 30vh;
	padding: 10px;
	margin: 10px;
	left: -1.5vw;
	font-size: 80%;
	border: 2px solid #444;
	border-radius: 10px;
	background-color: rgba(0,0,0,0.8);
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
}

#UserChart {
	width: 100vw;
	max-width: 10vw;
}

#championship input {
	font-size: 105%;
	width: 10vw;
        padding: 15px;
        margin: 10px;
        color: #FFF;
        border: 2px solid #444;
}

#championship button {
	cursor: pointer;
        padding: 15px;
        margin: 10px;
        color: #FFF;
        border: 2px solid #444;
	font-weight: bold;
}

#championship input:hover,button:hover {
        border: 2px solid #AAA;
	background: #f73801;
        box-shadow: 0 0 10px var(--mdn-shadow, #ffff00);
}

#special input {
	font-size: 105%;
	width: 10vw;
        padding: 15px;
        margin: 10px;
        color: #FFF;
        border: 2px solid #444;
}

#special button {
	cursor: pointer;
        padding: 15px;
        margin: 10px;
        color: #FFF;
        border: 2px solid #444;
	font-weight: bold;
}

#special input:hover,button:hover {
        border: 2px solid #AAA;
	background: #f73801;
        box-shadow: 0 0 10px var(--mdn-shadow, #ffff00);
}

#trackimg {
	width: 12vw;
	height: 22vh;
	padding: 5px;
	border: 2px solid #444;
	border-radius: 10px;
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	float: left;
	display: block;
	position: absolute;
	left: 28vw;
	top: 1.5vw;
}

#trackinfo,.trackionfo {
	padding: 0px;
	margin: 0px;
	font-size: 90%;
}


#avatar {
	width: 5vw;
	height: 10vh;
	padding: 5px;
	border: 2px solid #444;
	border-radius: 10px;
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	float: left;
}

#carimg {
	width: 12vw;
	height: 22vh;
	padding: 5px;
	border: 2px solid #444;
	border-radius: 10px;
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	float: left;
	display: block;
	position: absolute;
	left: 28vw;
	top: 15vw;
}

#carimgmini {
	width: 1.5vw;
	height: 2.5vh;
}

#summary {
	margin: 0px auto 0px auto;
	font-size: 80%;
	padding: 15px;
	width: 28vw;
	height: 45vh;
	border: 2px solid #444;
	border-radius: 10px;
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	float: left;
	display: block;
	position: absolute;
	left: 45vw;
	top: 1.5vw;
	overflow: auto;
}

.weather,.headicon {
	width: 1vw;
	height: 2vh;
	max-width: 1vw;
	max-height: 2vh;
}

.homeicon {
	width: 1vw;
	height: 2vh;
	max-width: 1vw;
	max-height: 2vh;
}

.homeicon:hover {
	filter: opacity(30%);
}

.clock {
	width: 15px;
	height: 15px;
	max-width: 15px;
	max-height: 15px;
}

.startsin {
	font-size: 120%;
	color: yellow;
	text-shadow: 0 0 5px var(--mdn-shadow, #AAA);
}

.fastest {
	font-size: 90%;
}

.fastesttime {
	color: lightblue;
	text-shadow: 0 0 5px var(--mdn-shadow, #111);
}

#livetiming {
	display: none;
	overflow: hidden;
	padding: 50%;
}

.livetiming-iframe {
	border: 2px solid #444;
	border-radius: 10px;
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	overflow: hidden;
	position: absolute;
	top: 11vh;
	left: 10vw;
	width: 75vw;
	height: 55vh;
}

#close-livetiming {
	padding: 5px;
	border: 1px solid #444;
	border-radius: 8px;
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	cursor: pointer;
	display: block;
	position: absolute;
	top: 12vh;
	left: 14vw;
	width: 16px;
	height: 16px;
	background-color: rgba(0,0,0,0.8);
	z-index: 1000;
}

#close-livetiming img {
	width: 16px;
	height: 16px;
}

#close-livetiming:hover {
	border: 1px solid red;
}

.impinfo {
	font-size: 110%;
	color: lightgreen;
	text-shadow: 0 0 5px var(--mdn-shadow, #AAA);
}

.impdate {
	font-size: 110%;
	color: lightpink;
	text-shadow: 0 0 5px var(--mdn-shadow, #AAA);
}




/*
#userslide:hover {
	left: -25px;
}
*/

/* EFFECTCS */

/* Skew */
.skew {
	transform: skew(-1deg);
}

.blink {
	animation: blink-animation 1s steps(12, start) infinite;
	-webkit-animation: blink-animation 1s steps(12, start) infinite;
}

@keyframes blink-animation {
	to {
		filter: opacity(40%);
	}
}

@-webkit-keyframes blink-animation {
	to {
		filter: opacity(40%);
	}
}

/* Fading animation */
.fade {
	animation-name: fade;
	animation-duration: 1.5s;
}

@keyframes fade {
	from {opacity: .4}
	to {opacity: 1}
}

/* Next & previous buttons */
.prev, .next {
	cursor: pointer;
	position: absolute;
	top: 30vh;
	width: auto;
	padding: 16px;
	color: white;
	font-weight: bold;
	font-size: 120%;
	transition: 0.6s ease;
	user-select: none;
	border: 2px solid #444;
	background-color: rgba(0,0,0,0.9);
}

/* Position the "next button" to the right */
.next {
	right: 6vw;
	border-radius: 0 3px 3px 0;
}

.prev {
	left: 0.2vw;
	border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
	border: 2px solid #AAA;
	background-color: rgba(0,0,0,0.95);
	box-shadow: 0 0 10px var(--mdn-shadow, #ffff00);
}

/* waiting animation */
.waiting {
	top: 4vw;
	left: 2vw;
	float: left;
	display: inline-block;
	position: absolute;
	width: 80px;
	height: 80px;
}

.waiting div {
	position: absolute;
	border: 4px solid #fff;
	opacity: 1;
	border-radius: 50%;
	animation: waiting 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

.waiting div:nth-child(2) {
	animation-delay: -0.5s;
}

@keyframes waiting {
  0% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 0;
  }
  4.9% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 0;
  }
  5% {
    top: 36px;
    left: 36px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 72px;
    height: 72px;
    opacity: 0;
  }
}

/* crossfade intro */
.crossfade > figure {
	animation: introAnimation 54s linear infinite 0s;
	backface-visibility: hidden;
	background-size: cover;
	background-position: center center;
	color: transparent;
	width: 100vw;
	height: 100vh;
	max-width: 100vw;
	max-height: 100vh;
	margin: 0;
	padding: 0;
	left: 0;
	top: 0;
	opacity: 0;
	position: absolute;
	z-index: 0;
}
	
.crossfade > figure:nth-child(1) {
	background-image: url('../imgs/intro/001.png');
}

.crossfade > figure:nth-child(2) {
	animation-delay: 6s;
	background-image: url('../imgs/intro/000.png');
}

.crossfade > figure:nth-child(3) {
	animation-delay: 12s;
	background-image: url('../imgs/intro/002.png');
}

.crossfade > figure:nth-child(4) {
	animation-delay: 18s;
	background-image: url('../imgs/intro/003.png');
}

.crossfade > figure:nth-child(5) {
	animation-delay: 24s;
	background-image: url('../imgs/intro/004.png');
}

.crossfade > figure:nth-child(6) {
	animation-delay: 30s;
	background-image: url('../imgs/intro/005.png');
}

.crossfade > figure:nth-child(7) {
	animation-delay: 36s;
	background-image: url('../imgs/intro/006.png');
}

.crossfade > figure:nth-child(8) {
	animation-delay: 42s;
	background-image: url('../imgs/intro/007.png');
}

.crossfade > figure:nth-child(9) {
	animation-delay: 48s;
	background-image: url('../imgs/intro/008.png');
}

@keyframes introAnimation {
  0% {
    animation-timing-function: ease-in;
    opacity: 0;
  }
  8% {
    animation-timing-function: ease-out;
    opacity: 1;
  }
  17% {
    opacity: 1
  }
  25% {
    opacity: 0
  }
  100% {
    opacity: 0
  }
}

/* cursor pointer */
.pointer {
	cursor: pointer;
}

/* END MAIN LAYOUT */

/* RACE LAYOUT */

/* END RACE LAYOUT */

/* COMMON LAYOUT */

/* END COMMON LAYOUT */

/* ERROR PAGES */

#err404 {
	color: #f73801;
	align: center;
	margin: auto;
	text-align: center;
	text-shadow: 0 0 25px var(--mdn-shadow, #111);
	position: relative;
	font-size: 1000%;
}

#err502 {
	color: #f73801;
	align: center; 
	margin: auto;
	text-align: center;
	text-shadow: 0 0 25px var(--mdn-shadow, #111);
	position: relative;
	font-size: 1000%;
}

/* END ERROR PAGES */


.gz-results-drivers-info-header-row {
	width: 100%;
	height: 40pt;
	flex-direction: row;
	-ms-flex-direction: row;
}
.gz-standings-results-wrapper {
	width: 100%;
	min-height: 35vh;
	height: 38vh;
	flex-direction: column;
}
.gz-results-drivers-info-header-row-pos {
	width: 5%;
}
.gz-results-drivers-info-header-row-driver-name {
	width: 35%;
}
.gz-results-drivers-info-header-row-vehicle {
	width: 20%;
}
.gz-results-drivers-info-header-row-sector {
	width: 10%;
}
.gz-results-drivers-info-header-row-sector {
	width: 10%;
}
.gz-results-drivers-info-header-row-sector {
	width: 10%;
}
.gz-results-drivers-info-header-row-lap-time {
	width: 10%;
}

.gz-results-drivers-info-row {
	width: 100%;
	flex-direction: row;
}
.gz-results-drivers-info-row-pos {
	width: 5%;
}
.gz-results-drivers-info-row-driver-name {
	width: 35%;
}
.gz-results-drivers-info-row-vehicle {
	width: 20%;
}
.gz-results-drivers-info-row-sector {
	width: 10%;
}
.gz-results-drivers-info-row-sector {
	width: 10%;
}
.gz-results-drivers-info-row-sector {
	width: 10%;
}
.gz-results-drivers-info-row-lap-time {
	width: 10%;
}
.chartjs-size-monitor {
	width: 120pt;
	height: 120pt;
	background-color: gray;
}
.gz-selector-nationality {
	width: 95% !important;
	display: flex;
}
.gz-selector-nationality-select-button {
	cursor: pointer;
	width: 95% !important;
	color: #FFF;
	border: 2px solid #444;
	font-weight: bold;
}

.gz-records-event-type-driver-block-content {
	display: flex;
	flex-direction: row;
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;
}
.gz-records-event-type-driver-block-content-fastest {
	flex-direction: column;
	width: 25%;
	max-width: 25%;
	height: 100%;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}
.gz-records-event-type-driver-block-content-fastest > div.fastest {
	font-size: 100%;
	font-weight: bold;
}
.gz-records-event-type-driver-block-content-fastest > div.fastest > img.headicon {
	width: 10pt;
	height: 10pt;
	margin: 2pt;
}

.gz-records-event-type-driver-block-content-fasttest-driver {
	display: flex;
	flex-direction: row;
	width: 25%;
	max-width: 25%;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}

.gz-records-event-type-driver-block-content-fasttest-driver > img.flag {
	width: 35pt;
	height: 20pt;
}

.gz-event-result-podium-preview-wrapper {
	display: flex;
	width: 100%;
	height: 100%;
	flex-direction: row;
	align-items: center;
	justify-content: space-around;
}
.gz-event-result-podium-preview-wrapper > div.fastest {
	width: 25%;
	max-width: 25%;
	align-items: center;
	justify-content: center;
	height: 100%;
	flex-wrap: wrap;
}



.accept {
	color: white;
	background-color:green;
}
.reject {
	color: white;
	background-color: red;
}
.reject:hover,
.accept:hover {
	color: white;
	background-color:black;
}

.gz-notifications-inner > div.gz-notifications-inner-block > div.block > div.row {
	display: flex;
	flex-direction: row;
	width: 100%;
	align-items: center;
	justify-content: center;
	gap: 3;
}

.gz-hidden {
	display: none;
}


.infowrapper > div.info > div.web-new-detail-text-wrapper {
	width: 68vw;
	height: 90%;
	padding: 5px;
	margin: 5px;
	font-size: 80%;
	border: 2px solid #444;
	border-radius: 10px;
	background-color: rgba(0,0,0,0.8);
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	overflow-x: hidden;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: start;
	gap: 5;
}

.infowrapper > div.info > div.web-new-detail-text-wrapper > div.web-new-detail-title {
	font-size: large;
	font-weight: bold;
	width: 100%;
	height: 10%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-items: center;
	gap: 5;
	text-align: center;
}
.infowrapper > div.info > div.web-new-detail-text-wrapper > div.web-new-detail-body {
	width: 100%;
	font-size: large;
	margin: 10pt;
	height: 90%;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 0;
	align-items: start;
	justify-content: start;
}


.infowrapper > div.info > div.web-new-detail-news-list-wrapper {
	width: 28vw;
	height: 90%;
	padding: 5px;
	margin: 5px;
	font-size: 80%;
	border: 2px solid #444;
	border-radius: 10px;
	background-color: rgba(0,0,0,0.8);
	box-shadow: 0 0 10px var(--mdn-shadow, #111);
	overflow-x: hidden;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
}

.infowrapper > div.info > div.web-new-detail-news-list-wrapper > div.web-new-list-title {
	display: flex;
	width: 100%;
	flex-direction: row;
	font-size: large;
	font-weight: bold;
	cursor: pointer;
}

.gz-color-green {
	color: lightgreen;
	font-weight: bold;
}
.gz-color-red {
	color: lightpink;
	font-weight: bold;
}
.gz-links-tooltip {
	background: white;
	color: black;
}

.gz-back-action {
    align-items: center;
    background: #111;
    border: 2px solid #444;
    box-shadow: 0 0 10px #111;
    box-shadow: 0 0 10px var(--mdn-shadow,#111);
    cursor: pointer;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    font-weight: 700;
    gap: 5pt;
    justify-content: center;
    margin: 3px;
    opacity: 1;
    padding: 3px;
    text-shadow: 0 0 10px #555;
    text-shadow: 0 0 10px var(--mdn-shadow,#555);
    width: 90%;
}

.gz-back-action:hover {
    border: 2px solid #AAA;
	background: #f73801;
    transition: 1s ease;
}
.gz-disabled {
	filter: grayscale(100%);
}

.gz-blink {
	animation: blinker 1s linear infinite;
  }
  
  @keyframes blinker {
	50% {
	  opacity: 0;
	}
  }