/*texte random*/
@import url("https://fonts.googleapis.com/css?family=Poppins&display=swap");

/*sous-titre*/
@import url('https://fonts.googleapis.com/css?family=Orbitron&display=swap');

/*titre*/
@import url('https://fonts.googleapis.com/css?family=Syncopate&display=swap');

/*palette : https://colorhunt.co/palette/173966*/

*{box-sizing: border-box;}

html{font-size : 62.5%;}

/*accueuil*/

body{
  
  /*background-color: #050505;*/
  margin : 0;
	font-size:1.6rem;
  background-color: white ;
  font-family: "Poppins";
}



a{
  text-decoration : none;
  color : #1c2833;
}

/*header*/
/*nav*/
header nav ul{
	
	display: flex;
	margin: 0;
	background-color: #050505;
	height : 12rem;/*14*/
	padding-top: 8rem;
	/* padding left 40px par défaut */
}

ul{
  list-style-type: none;
}

header img{
  border-radius: 50%;
  height: 15rem;
  width: 15rem;
  float: left;
  background-color: black;
  padding: 0.2rem;
  
}

header img:hover{
  /*background-color: #fd2eb3;*/
}

header ul li{
  margin: 1rem 1.1rem 1rem 0;
	align-self: center;
	padding : 0.4rem 0.7rem 0.4rem 0.7rem;
	font-family: 'Syncopate', sans-serif;
	font-size:1.4rem;
}

header ul li a:hover{
  content: 'Yaa do look here';
}


header ul li a{
  color: white ;
}

header ul li a:hover{
  color : #00FF00;/* #fd2eb3*/
}

header ul li span{
  font-family: 'Orbitron', sans-serif;
  font-weight: bold;
  color: white;
  font-size: 2.5rem;
}

/*
header nav ul li:hover{
  background-color: pink;
	border-radius: 1.1rem;
	
}*/

header nav ul li:last-child{
  
  
}

/*main*/
main{
  min-height: 40rem;
}

/*bannière*/

/*article*/

section{
  margin-top: 4rem;
}

article{
  min-height: 30rem;
  /*box-shadow: 0 0 18px -5px rgba(123,115,115,0.75);*/
  
  background-color:white;
  margin-left:6rem;
  margin-right:6rem;
  padding: 5rem;
}

h1{
  font-family: 'Syncopate', sans-serif;
  font-size: 2rem;
  border-bottom: 1px black solid;
}

#banner{
  height:10rem;
  width: 100%;
  background-color:red;
}



/*footer*/
main + footer{
  background: rgb(6,10,23);
	width: 100%;
	height : auto;
	color : white;
	margin-top: 0%;/*0 ?*/
	margin-bottom: 0%;
	font-size : 1.5rem;
	/*position: relative;*/
	display: flex;
	font-family : Arial, sans-serif;
}


main + footer ul li:first-child {
	font-weight: bold;

}

main + footer ul {
	display:flex;
	flex-direction:column;
	float:left;
	width:auto;
	padding-left : 5rem;
	
}



main + footer ul li{
	padding: 0.5rem;
	
}

main + footer ul li a {
	color : white;
	text-decoration: none;
}

#menuFooter{
	margin : 3rem auto 3rem auto;
}	

#menuFooter ul:last-child ul {
  display:flex;
  flex-direction:row;
  padding:0;
  
}


.terminal{
  background-color:white;
  color:black;
  width:60rem;
  height:auto;
  font-family: "Consolas";
  display:flex;
  flex-direction:column;

}

/*terminal vert

.terminal{
  background-color:black;
  color:#00FF00;
  width:60rem;
  height:auto;
  font-family: "Consolas";
  display:flex;
  flex-direction:column;

}
*/



.blink{
  animation: blink 1s linear infinite;
  display:inline;

}

@keyframes blink {
  50% {
    opacity: 0;
  }
}


.textTyping {
  overflow: hidden; /* Ensures the content is not revealed until the animation */
  white-space: nowrap; /* Keeps the content on a single line */
  margin: 0; /* Gives that scrolling effect as the typing happens */
  animation: typing 2s steps(20, end);
}

/* The typing effect */
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}