@font-face {
	font-family: "Overpass_Mono";
	src: url('/Overpass_Mono/OFL.txt');
}
@font-face {
	font-family: "Overpass_Mono";
	font-weight: lighter;
	src: url('/Overpass_Mono/OverpassMono-Light.ttf');
}
@font-face {
	font-family: "Overpass_Mono";
	font-weight: bold;
	src: url('/Overpass_Mono/OverpassMono-Bold.ttf');
}

body {
	margin: 0;
	padding: 0;
	background-color: #4300ab;
	color: #fff;
	font-family: "Overpass_Mono", monospace;
}

a, a:visited {
  color: white;
}

.playlist {
	position: absolute;
	top: 15%;
	right:10%;
	transform: rotate(-12deg);
	
}

a:hover {
  color: #46ECD1;
}

#tableau {
	border: 0px transparent;
	position:fixed;
	width: 40%;
	height: 80%;
	top:10%;
	top: -webkit-calc(10% - 0.9em); /* Chrome 19 and above */
  top: -moz-calc(10% - 0.9em); /* Firefox 4 and above */
  top: calc(10% - 0.9em); /* IE 9 and above */
	margin-left: 30%;
  margin-right: 30%;
	padding: 0;
	text-align: center;
}

@media (max-width: 1000px) {

  #tableau {
	border: 0px solid red;
	position:fixed;
	width: 70%;
	height: 70%;
	top:10%;
	top: -webkit-calc(15% - 3em); /* Chrome 19 and above */
  top: -moz-calc(15% - 3em); /* Firefox 4 and above */
  top: calc(15% - 3em); /* IE 9 and above */
	margin-left: 15%;
  margin-right: 15%;
	padding: 0;
	text-align: center;
}
	#splash {
	font-size: 3em;
}

}


#escargoog {
	width: 80%;
}

#splash {
	font-size: 0.9em;
}

.socials {
	border: 0px solid yellow;
	box-sizing: border-box;
	width:16%;
	display: inline-block;
	text-align: center;
}

.socialsimg {
	width: 70%;
}