@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,700&display=swap");

* {
	margin: 0;
	box-sizing: border-box;
}
table {
	background-color: #181b23;
	border-radius: 5px;
	/*border: 1px solid #8080803d;*/
}

body {
	background-color: black;
	color: white;
	font-family: "Poppins", sans-serif;
}

/**
    Header
 */
 .logo a img{
	height: 40px;
    position: relative;
    top: 10px;
 }
nav {
	width: 100%;
	height: 75px;
	line-height: 75px;
	padding: 0 70px;
	top: 0;
	background-color: #181b23;
}

nav .logo {
	font-size: 30px;
	font-weight: bold;
	float: left;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	cursor: pointer;
}

nav ul {
	float: right;
}

nav li {
	display: inline-block;
	list-style: none;
}

nav a {
	text-decoration: none;
	color: white;
}

nav li a {
	font-size: 18px;
	text-transform: uppercase;
	padding: 0 30px;
}

#rechercheJoueur {
	height: 30px;
	border-radius: 5px;
	background-color: black;
	border: 3px solid #181b23;
	color: white;
}
::placeholder{
	color: white;
}

#statsJoueur td,
#statsJoueur th {
	border: 1px solid black;
	padding: 5px;
	text-align: center;
}

#statsJoueur {
	padding: 0;
	border-collapse: collapse;
}

#infoJoueur {
	padding: 0;
	border-collapse: collapse;
	height: 156px;
}

#imgJoueur {
	width: 168px;
	height: 100%;
	float: left;
	border-radius: 5px;
	padding-right: 15px;
}

#titreInfo {
	text-align: left;
}

#premierTr {
	height: 80px;
}

/*
    GAMES
*/
#live {
	width: 100%;
	height: 145px;
	display: flex;
	overflow: auto;
}


/*Scrollbar*/
#live::-webkit-scrollbar-track {
	border: 1px solid #000;
	padding: 2px 0;
	background-color: #404040;
}

#live::-webkit-scrollbar {
	width: 10px;
}

#live::-webkit-scrollbar-thumb {
	border-radius: 10px;
	box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
	background-color: #737272;
	border: 1px solid #000;
}

#live table {
	height: 100%;
	width: 100px;
}

#live span {
	margin: 0 5px;
	margin-top: 5px;
}

#live td {
	padding: 0 5px;
}

#live th,
#live td {
	width: 100%;
}
#live span table tr:first-child{
	height: 72px;
}

#content {
	width: 98vw;
	height: 80vh;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: 1fr 1fr;
	gap: 10px;
	padding: 10px;
	box-sizing: border-box;
}

#content .tablePrincipal {
	grid-row-start: 1;
	grid-row-end: span 2;
	grid-column-start: 1;
	grid-column-end: span 2;
	width: 100%;
	height: 0;
}
.container-aff-non{
	height: 0;
	display: none;
}
#content #pointsAuj td,
#content #pointsAuj th {
	border: 1px solid black;
}
#hamberger-icon{
	display: none;
	margin: 0;
	cursor: pointer;
}
.logoTeam{
	height: 27px;
}
@media only screen and (min-device-width: 320px) and (max-device-width: 1154px) {
	#content .tablePrincipal {
		grid-row-start: 2;
		grid-row-end: 2;
		grid-column-start: 1;
		width: 100%;
		font-size: 11px;
	}

	header nav {
		padding: 0 20px;
	}
	header .logo {
		font-size: 27px;
	}

	#content {
		grid-template: unset;
		grid-template-rows: unset;
		width: unset;
	}
	#infoJoueur {
		grid-row-start: 1;
		grid-row-end: 1;
		grid-column-start: 1;
	}
	header nav ul li:not(#li-recherche) {
		display: none;
	}
	header nav ul li{
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		top: 250px;
	}
	#live{
		margin-bottom: 70px;
		height: 171px;
	}
	#hamberger-icon{
		display: inline;
		width: 25px;
		position: absolute;
		right: 19px;
		top: 28px;
	}
	.bar1, .bar2, .bar3{
		width: 100%;
		background-color: white;
		height: 3px;
		margin-bottom: 4px;
		margin-right: 5px;
		border-radius: 5px;
	}
	#mobile-menu{
		padding: 0;
	}
	.container-aff-oui{
		height: 100%;
		width: 100%;
		position: fixed;
		top: 0;
		background-color: black;
		opacity: 90%;
		z-index: 1;
	}
	.container-aff-oui img{
		width: 30px;
		position: fixed;
		top: 15px;
		right: 15px;
		opacity: 100%;
	}
	.container-aff-non{
		height: 0;
	}
	#mobile-menu a{
		text-decoration: none;
		color: white;
	}
	#mobile-menu li{
		list-style: none;
		text-align: center;
	}
	#mobile-menu li:not(#xImageLi){
		height: 20%;
	}
	.afficher{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.cacher{
		display: none;
	}
	#mobile-menu li a{
		padding: 5px;
		border: 2px solid white;
	}
}