@charset "UTF-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Julius+Sans+One&family=Press+Start+2P&family=Share+Tech+Mono&display=swap');
/*@import url(//db.onlinewebfonts.com/c/2d814a09d668f730cc91d8d6e390dc08?family=OCR+A+Extended);

		@font-face {font-family: "OCR A Extended"; src: url("//db.onlinewebfonts.com/t/2d814a09d668f730cc91d8d6e390dc08.eot"); src: url("//db.onlinewebfonts.com/t/2d814a09d668f730cc91d8d6e390dc08.eot?#iefix") format("embedded-opentype"), url("//db.onlinewebfonts.com/t/2d814a09d668f730cc91d8d6e390dc08.woff2") format("woff2"), url("//db.onlinewebfonts.com/t/2d814a09d668f730cc91d8d6e390dc08.woff") format("woff"), url("//db.onlinewebfonts.com/t/2d814a09d668f730cc91d8d6e390dc08.ttf") format("truetype"), url("//db.onlinewebfonts.com/t/2d814a09d668f730cc91d8d6e390dc08.svg#OCR A Extended") format("svg"); }
		
	        font-family: 'Julius Sans One', sans-serif;

    font-family: 'Press Start 2P', cursive;

    font-family: 'Share Tech Mono', monospace;	*/
		
		.Lesite, .texte, h1, H2, .navBVR{
			/*font-family: "OCR A Extended"; */
            font-family: 'Share Tech Mono', monospace;
			color: #cff1d5;
		}

body {
  margin:0;
  padding:0;
  background-color: #323234;
}
.clear {
	clear: both;
}
img { 
border: none; 
}

.Lesite{
    position: relative;
	width: 90%;
    padding: 0px;
	margin: 0px;
	margin-left: auto; 
    margin-right: auto;
	text-align:left;
}
h1{
	font-size:24px;
	line-height:24px;
	margin:0px;
	padding:10px;
	text-align: left;
   /* color:#999;
    font-family: 'Harmattan', sans-serif;*/
}
h2{
	font-size:18px;
	line-height:24px;
	margin:0px;
	padding:0px;

}
.navBVR {
	width:100%;
     
	
}
.navBVR ul{
	list-style:none;
	margin:0px;
	padding:0px;
	text-align:left;
	width:100%;
	
}
.navBVR ul li{
	margin:10px;
}
.navBVR ul li a{
	color:#cff1d5;
	text-decoration:none;
	font-size:20px;
	display:block;
	width:100%;
    padding: 4px;
}
.navBVR ul li a:hover{
	background-color:#cff1d5;
	color:#323234;
}
.imgIntro{
	/*margin-left: auto; 
    margin-right: auto;*/
	width: 250px;
	height: 250px;
	
}
.imgresponsive{
	width: 100%;
	max-width: 250px;
	height: auto;
}
.contact a{
	text-decoration:underline;
	color:#161616;
}
.contact a:hover{
	background-color:#cff1d5;
	color:#323234;
	text-decoration:none;
	padding:5px;
}
.grostitre{
	position: absolute;
	text-align: center;
	top: 180px;
	width:100%;
	max-width: 250px;
	z-index: 20;
	font-family: 'Press Start 2P', verdana;
	font-size: 16px;
	color: #E2F9EC;
	display:block;
    transform: rotate(-5deg);
	-moz-transform: rotate(-5deg);
    -webkit-transform: rotate(-5deg);
    -khtml-transform: rotate(-5deg);
	text-shadow: 0px 0px 6px #111;
	line-height:22px;
}
/*
 * ça Pulse
*/
#capulse {
	margin:0px auto;
	max-width:640px;
    text-align: center;
    padding: 20px;
	}

.animated { 
 	-webkit-animation-name: bounceIn;
 	-webkit-animation-duration: 4s;
 	-webkit-animation-iteration-count: 10;
 	-webkit-animation-timing-function: ease-out;
 	-webkit-animation-fill-mode: forwards;
	
 	animation-name: bounceIn;
 	animation-duration: 4s;
 	animation-iteration-count: 10;
 	animation-timing-function: ease-out;
 	animation-fill-mode: forwards;
} 
/*
 * Pulse animation
*/
@-webkit-keyframes pulse {
    0% { -webkit-transform: scale(1); }
    50% { -webkit-transform: scale(1.1); }
    100% { -webkit-transform: scale(1); }
}
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}
.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse;
}

@media screen and (max-width: 1400px) {
  .imgIntro{
	width: 200px;
	height: 200px;
	
}
    .grostitre{
    top: 120px;
	font-size: 14px;
}
}
@media screen and (max-width: 640px) {
  .imgIntro{
	margin-left: auto; 
    margin-right: auto;
	width: 180px;
	height: 180px;
	
}
    .grostitre{
		width: 100%;
		margin-left: auto; 
        margin-right: auto;
        top: 100px;
	    font-size: 12px;
}
}