html {
	background: radial-gradient(ellipse at bottom, #1b2735 0%, #090a0f 100%);
  /*filter: drop-shadow(0 0 10px white);*/
	/*background-color : #1A77AF;*/
	color: #FFF;
    font: normal 1.3em 'VT323', Arial;
}

 
a:not(.MainNews) {
	text-decoration: none;
	color: rgb(153 205 210);
    text-shadow: 1px 1px 1px #0000FF;
}

.MainNews a {
	text-decoration: none;
	color : rgb(230,230,230);	
}

p {
  margin-bottom: 10px;
  margin-top: 10px;
  overflow-wrap: anywhere;
}

#d {
  position: fixed;
  overflow: hidden;  
  z-index : -1;
  background-attachment:fixed;
}


#LoadingImage {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	overflow: hidden;
	background: rgba( 0, 0, 0, 0.1 );
}
 
#LoadingImage > img {
	position: absolute;
	display: block;
	left: 50%;
	width: 10vw;
	height: 10vw;
	top: 50%;
	-webkit-transform: translate( -50%, -50% );
	transform: translate( -50%, -50% );
}


#grille1{
	background-size: 4px 4px, 4px 4px;
	background-position: 0px 0px;
	overflow: hidden;
	
	background-image: linear-gradient(rgba(126,126,196,.05)  1px, transparent 1px) ,
	linear-gradient(90deg, rgba(126,126,196,.01)  1px, transparent 1px) ,
	linear-gradient(rgba(126,126,196,.08)  2px, transparent 2px),
	linear-gradient(90deg,rgba(126,126,196,.03)  2px, transparent 2px);
	
	background-image: -webkit-linear-gradient(rgba(126,126,196,.05) 1px, transparent 1px),
	-webkit-linear-gradient(90deg, rgba(126,126,196,.01)  1px, transparent 1px),
	-webkit-linear-gradient(rgba(126,126,196,.08) 2px, transparent 2px),
	-webkit-linear-gradient(90deg, rgba(126,126,196,.03) 2px, transparent 2px);

	background-image: -moz-linear-gradient(rgba(126,126,196,.05)  1px, transparent 1px) ,
	-moz-linear-gradient(90deg, rgba(126,126,196,.01)  1px, transparent 1px) ,
	-moz-linear-gradient(rgba(126,126,196,.08)  2px, transparent 2px),
	-moz-linear-gradient(90deg,rgba(126,126,196,.03)  2px, transparent 2px);
	
	background-image: -o-linear-gradient(rgba(126,126,196,.05)  1px, transparent 1px) ,
	-o-linear-gradient(90deg, rgba(126,126,196,.01)  1px, transparent 1px) ,
	-o-linear-gradient(rgba(126,126,196,.08)  2px, transparent 2px),
	-o-linear-gradient(90deg,rgba(126,126,196,.03)  2px, transparent 2px);

}

#grille2{
	position: fixed;
}

#bandeau {
	/*height : 9rem;*/
	width : 100%;
	padding-bottom : 50px;
}

#logo_et_sous_titre {
	position: relative;
	margin-left : 2rem;
	margin-top : 2%;
	z-index : 5;
	width : 100%;
}

#logo_wrapper {
    display: grid;
    grid-template-areas: "stack";
	align-items: start; 
    width: fit-content;
}

#sous_titre_wrapper {
    display: grid;
    grid-template-areas: "stack";
	align-items: start; 
    width: fit-content;
}

#logo_hidden {
    grid-area: stack;
	content:  "OLDIES \A BUT GOODIES";
    font: 3.3vw '04b20';
    letter-spacing: 3px;
	margin-left : 2rem;
    line-height: 1.1;
    visibility: hidden;
    pointer-events: none;
}

#sous_titre_hidden {
    grid-area: stack;
	letter-spacing: 3px;
    font-size: 1.5vw;
	/*border: 1px solid #300B56;*/
	margin-top: -0.75rem;
	text-align : left;
	margin-left : 30rem;
	width : fit-content;
	
	line-height: 1.1;
    visibility: hidden;
    pointer-events: none;
	
}

#logo {
	grid-area: stack;
	
	content:  "OLDIES \A BUT GOODIES";
	/* text-shadow: 5px 5px 6px rgba(1, 130, 235, 0.8), 2px 6px 9px rgba(0, 0, 0, 0.33); */
    letter-spacing: 3px;
    font: 3.3vw '04b20';
	/* border: 1px solid #282d56;*/
	/*background-color : rgba(29,108,158,0.2);*/
	/*padding : 1rem;*/
	
	width : fit-content;
	background-repeat: no-repeat;
	
	position: relative;
	margin-left : 2rem;
	z-index : 5;
	
	text-shadow: 0 0 7px #87ceeb, 0 0 10px #87ceeb, 0 0 20px deepskyblue;
	color: rgba(250,250,250,0.8); 
	
	animation: blur 7s ease-in-out 3 alternate, pulse1 .2s alternate infinite;
	-webkit-animation:  blur 7s ease-in-out 3 alternate, pulse1 .2s alternate infinite;  
    -moz-animation: blur 7s ease-in-out 3 alternate, pulse1 .2s alternate infinite;  
	-o-animation:  blur 7s ease-in-out 3 alternate, pulse1 .2s alternate infinite;   

	
	/*text-shadow : 4px 0 3px rgba(251, 0, 231, 0.5), 0 4px 3px rgba(0, 233, 235, 0.5), -4px 0 3px rgba(0, 242, 14, 0.5), 0 -4px 3px rgba(244, 45, 0, 0.8), 4px 0 3px rgba(59, 0, 226, 0.5) ;	
	background-image: linear-gradient(360deg,rgba(29,108,258,.3), transparent);
	background-image: -webkit-linear-gradient(360deg,rgba(29,108,258,.3), transparent);
	background-image: -moz-linear-gradient(360deg,rgba(29,108,258,.3), transparent);
	background-image: -o-linear-gradient(360deg,rgba(29,108,258,.3), transparent);*/	

	/* debut version chatgpt */
	text-shadow: -2px 0 rgba(255, 0, 80, 0.55),  2px 0 rgba(0, 220, 255, 0.55), 0 0 12px rgba(135, 206, 235, 0.9);
	color: rgba(240,250,255,0.95);
    animation: phosphor-strong 2.2s ease-in-out infinite, blur-strong 6s ease-in-out infinite, crt-shift-strong 4.5s infinite, glitch-strong 5s infinite;
	/* fin version chatgpt */
}


#logo:hover {
	text-shadow: 0 0 7px #87ceeb, 0 0 10px #87ceeb, 0 0 20px deepskyblue;
}


#sous_titre {
	grid-area: stack;
	text-rendering: auto;
    color: rgba(250, 250, 250, 0.8);
    text-shadow: 0 0 2px #0000FF, 0 0 5px #fff, 0 0 7px #fff, 0 0 10px #ff2d95, 0 0 15px #ff2d95, 0 0 20px #ff2d95, 0 0 25px #ff2d95, 0 0 35px #ff2d95;
    letter-spacing: 3px;
    font-size: 1.5vw;
	/*border: 1px solid #300B56;*/
	margin-top: -0.75rem;
	text-align : left;
	margin-left : 30rem;
	width : fit-content;
	text-decoration:#000000;
	position: relative;
	z-index : 10;
	background-color : rgba(250,0,0,0.1);
	/*animation-delay: 3s;
	animation-name: sous_titre_anim; 
	animation-duration: 1s; 
	animation-iteration-count: 1; 
	animation-timing-function: linear;*/
	animation: pulse1.2s alternate infinite;
	-webkit-animation: pulse1.2s alternate infinite;	
	-moz-animation: pulse1.2s alternate infinite;	
	-o-animation: pulse1.2s alternate infinite;	
	
	animation: sous_titre_anim 3s linear 0s 1 none;
	-webkit-animation: sous_titre_anim 3s linear 0s 1 none;
	-moz-animation: sous_titre_anim 3s linear 0s 1 none;
	-o-animation: sous_titre_anim 3s linear 0s 1 none;
}


#sous_titre2 {
	text-rendering: auto;
	color: rgba(250, 250, 250, 0.7);
    text-shadow: 0 0 2px #0000FF, 0 0 5px #fff, 0 0 7px #fff, 0 0 10px #952dff, 0 0 15px #952dff, 0 0 20px #952dff, 0 0 25px #952dff, 0 0 35px #952dff;
    font-size: 1.5vw;
	margin-left:440px;
	margin-top: 1rem;
	padding : center;
	height : 2rem;
	width : 21rem;
	text-align : left;
	padding-left: 10px ;
	text-decoration:#118877;	
	background-color : rgba(250,0,31,.1);
	position: relative;
	
	z-index : 10;
	
	animation: pulse1.2s alternate infinite;
	-webkit-animation: pulse1.2s alternate infinite;
	-moz-animation: pulse1.2s alternate infinite;
	-o-animation: pulse1.2s alternate infinite;
	
	animation: sous_titre_anim2 6s linear 0s 1 none;
	-webkit-animation: sous_titre_anim2 6s linear 0s 1 none;
	-moz-animation: sous_titre_anim2 6s linear 0s 1 none;
	-o-animation: sous_titre_anim2 6s linear 0s 1 none;
	
}

footer {
	position:fixed;
	bottom:0px;
	right:0px;
	left:0px;
	min-width:100%;
	z-index: 30;
}

.bd {
	display: flex;
    justify-content: space-between;
	width : 100%;
			margin-top : 40px;
		margin-bottom : 40px;
}
	
.bd ul{
    display: flex;	
	font-size : 27px;
	color : rgb(175,237,250);	
	text-shadow: 2px 2px 2px #289BC1;
	width : 100%;
	margin: auto;
	padding : auto;
	z-index : 5;
}

.bd li {
    display: inline;
	margin: auto;
	padding : auto;
	z-index : 5;

}

/*.bd li:hover {
    color : rgba(230,51,51,1);
	text-shadow:  2px 2px 2px #bb00b0;
}*/



.window-margin {
  max-width: 95%;
  margin-left: auto;
  margin-right: auto;
}

.window {
  margin-left: auto;
  margin-right: auto;
  border-radius: 5px;
  overflow: hidden;
  position: relative;
  
}

#pge_haut {
    color : #cbffee;
    text-shadow: 1px 1px 1px #131388;
	text-align : center;
	height : auto;
	width : 100%;
	overflow: hidden;

}

#pge_centrale {
	position : relative;
	margin-left: auto;
    margin-right: 1em;
	margin-top : 0px;
	margin-bottom : 0px;
	padding : 0px;	
}




.main-centre{
	float: left;
	width: 45%;
	height: 100%;
	margin : 0px 10px 0 auto;
	border-radius: 5px;
	
}

.main-gauche{
	float : left;
	width : 25%;
	height : 100%;
	margin : 0px 10px 0 0;	
	border-radius: 5px;	
}


.main-droite {
	float : left;
	width : 25%;
	height : 100%;
	margin : 0px 10px 0 0;
	border-radius: 5px;
	
}


#pge_bas {
    color : #cbffee;
    text-shadow: 1px 1px 1px #131388;
	text-align : center;
	height : auto;
	width : 100%;
	font-size: 1.2rem ;
	overflow: hidden;
    background-color: rgba(0, 0, 0, 0.9);
}

#pge_bas a {
    color : #cbffee;
}	
	
#pacman_anim {
	position : absolute;
	background-image: url(./../images/theme/pacman0.gif) ;
	background-position: 10px 10px;
	width:320px;
	height:340px;
	background-repeat: no-repeat;
	margin-top: 50px;
	margin-left: -10px;
	opacity: 0.5;
	filter:alpha(opacity=0.5);
	animation-delay: 0s ;
	animation-name: pacman; 
	animation-duration: 2s; 
	animation-iteration-count: 1; 
	animation-timing-function: linear;
	
	animation: pacman 1.5s linear 0s 1 none;
	-webkit-animation: pacman 1.5s linear 0s 1 none;
	-moz-animation: pacman 1.5s linear 0s 1 none;
	-o-animation: pacman 1.5s linear 0s 1 none;
}



.logo:after {
  white-space : pre;
  content:  "OLDIES \A BUT GOODIES_";
  text-shadow: 5px 5px 6px rgba(1, 130, 235, 0.8), 2px 6px 9px rgba(0, 0, 0, 0.33);
  position: absolute;
  text-shadow: -1px 0 red;
  left:7px;
  top:-5px;
  color: transparent;
  background: transparent;
  overflow: hidden;
  clip: rect(0, 900px, 0, 0);
  
  animation: noise-anim-2 3s infinite linear alternate-reverse, shift 4s ease-in-out infinite alternate;
  -webkit-animation: noise-anim-2 3s infinite linear alternate-reverse, shift 4s ease-in-out infinite alternate;
  -moz-animation: noise-anim-2 3s infinite linear alternate-reverse, shift 4s ease-in-out infinite alternate;
  -o-animation: noise-anim-2 3s infinite linear alternate-reverse, shift 4s ease-in-out infinite alternate;

  transform: skewX(0deg);
  -webkit-transform: skewX(0deg);
  -moz-transform: skewX(0deg);
  -o-transform: skewX(0deg);
  
  z-index: -5;
  opacity: 0.7;
  filter:alpha(opacity=70);   
}

.logo:before {
  white-space : pre;
  content:  "OLDIES \A BUT GOODIES_";
  text-shadow: 5px 5px 6px rgba(1, 130, 235, 0.8), 2px 6px 9px rgba(0, 0, 0, 0.33);
  position: absolute; 
  text-shadow: -3px 0 cyan;
  left:-5px;
  top:2px;
  color: transparent;
  background: transparent;
  overflow: hidden;
  clip: rect(0, 900px, 0, 0);

  animation: noise-anim-2 3s infinite linear alternate-reverse, shift 4s ease-in-out infinite alternate;
  -webkit-animation: noise-anim-2 3s infinite linear alternate-reverse, shift 4s ease-in-out infinite alternate;
  -moz-animation: noise-anim-2 3s infinite linear alternate-reverse, shift 4s ease-in-out infinite alternate;
  -o-animation: noise-anim-2 3s infinite linear alternate-reverse, shift 4s ease-in-out infinite alternate;
		  
  transform: skewX(0deg);
  -webkit-transform: skewX(0deg);
  -moz-transform: skewX(0deg);
  -o-transform: skewX(0deg);
  
  z-index: -5;
  opacity: 0.8;
  filter:alpha(opacity=80);   
}