body {
background:#000000;
padding:0;
margin:0;
topmargin:0;
leftmargin:0;
rightmargin:0;
bottommargin:0;
font-family: verdana, arial, sans-serif;
font-size: 90%;
color: black;
width:auto;
height:auto;
}
.global{
	height: 100%;
	width: 100%;
	position: relative;
		margin-left:auto;
	margin-right:auto;
	background-color:#333333;
}
.header{
	position:absolute;
	top:0px;
	width:100%;
	height:180px;
	color:#FFFFFF;
	visibility: visible;
	z-index: 1;
}


#menuhaut{
position:absolute;
left:302px;
top:184px;
width:100%;
height:29px;
background:url(tab_overnnn.jpg);
background-repeat:repeat-X;
text-align:center ;
color:#FFFFFF;
overflow:none;
}
#menuhaut h5{
position:absolute;
top:5px;
font-style:italic;
font-weight:90%;
color:#FFFF66;
left:10px;
} 
#menuhaut h6{
font-style:italic;
font-weight:90%;
color:#FFFFFF;
padding-top:7px;
} 

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
top: 196px;
left: 1em;
width:102px;
font-size: 90%;
background-color:#666666;
}
#menu dt {
cursor: pointer;
background:url(carbone.jpg);
height: 22px;
line-height: 20px;
margin: 2px 0;
border: 1px solid gray;
text-align: center;
font-weight:600;
font-size: 80%;
}
#menu dd {
position: absolute;
z-index: 100;
left: 95%;
margin-top: -2.8em;
width: 50px;
background:#FFFF33;

border: 1px solid gray;
color:#FFFFFF;
font-weight:600;
font-size: 80%;
}
#menu ul {
padding: 2px;
}
#menu li {
text-align: left;
font-size: 90%;
height: 18px;
line-height: 18px;
}
#menu dt,#menu dt a  {
color:#FFFBF0;
text-decoration: none;
display: block;
}
#menu li a{
color:#0B0B0B;
text-decoration: none;
display: block;
}
#menu li a:hover {
text-decoration: underline;
color:#80864D;
}
#menu dt a:hover {
text-decoration: underline;
color:#FFFF80;
}
#photoss{
	position:absolute;
	left:1576px;
	top:260px;
	width:319px;
	font-size:80%;
	font-weight:600;
	height: 336px;
}
#photosss{
position:absolute;
left:660px;
top:220px;
width:240px;
font-size:80%;
font-weight:600;
}
#photos a:hover {
text-decoration: underline;
color:#FB2D32;
}
#photos a{
text-decoration: none;
color:#FFFFFF;
}
#photoaccueil{
position:absolute;
top:0em;
left:15px;
}

#texte a:hover{
color:#FF0000;
}
#texte a{
 color:#FFFF66;}


#raismes{
position:absolute;
top:345px;
left:680px;
text-align:left;
color:#FFFFFF;
width:380px;
font-size:80%;
font-weight:550;
}
#texteee{
position:absolute;
top:290px;
left:60%;
text-align:left;
color:#FFFFFF;
width:250px;
font-size:80%;
font-weight:550;
}

#menuhaut a{
color:#FFFF80;
}
#textee{
position:absolute;
top:230px;
left:680px;
text-align:left;
color:#FFFFFF;
width:255px;
font-size:80%;
font-weight:550;
}
#compteur{
position:absolute;
left:8px;
text-align:center;
font-size:80%;
font-weight:550;
color:#FFFFFF;
width:10%;
top:548px;}
#videos{
color:#FFFFFF;
position:absolute;
width:80%;
left:20%;
top:200px;
font-size:80%;
font-weight:600;
}
#textevideos{
position:absolute;
left:65%;
top:200px;
font-size:80%;
font-weight:600;
color:#FFFFFF;
}
















/* Responsive Navigation styles begin here */

nav > input,
.nav-button {
  display: none; /* hidden on large screens */
}

/* small screens styles */
@media (max-width: 768px) {
 .nav-inner {
   position: absolute;
   width: 70vw;  
   transform: translateX(-100%) translateZ(0);
   transition: transform .2s;
   will-change: transform;
  }
  /* here's goes the slide effect */
  input:checked ~ .nav-inner {
    transform: translateX(0);
  }

  /* Button deco */
  .nav-button {
    display: block;
    position: absolute;
    top: 1rem; right: 1rem;
    z-index: 1;
    height: 3.5rem; width: 3.5rem;
    background-color: transparent;
    background-image: linear-gradient(to right, #333, #333),
      linear-gradient(to right, #333, #333),
      linear-gradient(to right, #333, #333);
    background-position: center top, center, center bottom;
    background-repeat: no-repeat;
    background-size: 3.5rem .9rem;
    padding: 0;
    outline: 0;
    border: 0;
    cursor: pointer;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
  }
  #texte{
  font-size:115%;
  }
}

/* Global deco */
* {
  box-sizing: border-box;
}
html {
  font-size: 60%;
}
body {
  margin: 0;
  padding: 0;
  font-size: 1.6em;
  font-family: arial, sans-serif;
}
a {
  color: #fff;
}
nav a {
  display: block;
  padding: .7em;
  margin-bottom: 2px;
  text-decoration: none;
  background: #777;
  width:110px;
  
}
h1 {
  margin-left: 1rem;
  color: #333;
}
.main, footer {
  padding: 2rem;
  background-color: #eee;
  color: #333;
}