#menu 
{
 position: relative;
 left:50%;
 margin-left:-495px;
 top:10px;
 width:990px;
 height:104px;
/* background-image:url('//cybermotard.com/images/bg_menu.png');
 background-repeat:repeat-x;*/
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
}

#menu dt
{
 float:left;
 width:100px;
 height:47px;
 font-size:18px;
 font-weight:bold;
 padding-left:5px;
 padding-right:5px;
 text-align:center;
 vertical-align:top; 
 background-image:url('//cybermotard.com/images/btn_menu.png');
 background-repeat:no-repeat;
}

#menu #menuToggle {
  display: none;
}

#menu dt:hover
{
 color:white;
 background-image:url('//cybermotard.com/images/btn_menu_over.png');
}

#spacer
{
 float:left;
 height:21px;
 width:100%;
}

@viewport { 
    width: device-width; 
    zoom: 1; 
}

@media only screen and (max-width: 500px) {
  dl {
    display: none;
  }

  #menu #menuToggle {
  display: block !important;
}
    #connectes {
    	float: none;
    	max-width:100%;
    	display: none;
  }

	#tr3_article, #main_article, #tr1_header_logo {
		width: 100%;
	}
	.titre_actualites {
		font-size: 25px;
		height: auto;
		width: 100%;
		max-width:100%;
	}
	.contenu_page, #content_page, .page, #menu {
	    width: 100%;
	}
	#tr1_header_logo img {
		width: 100%;
	}
	#main_article {
    width: 98% !important;
	}
	.titre_actualites {
    max-width: 97%;
	}
	.title_article {
    height: auto;
	}
	#photo_article {
	    margin: 0 auto;
	    margin-right: auto;
	    float: none;
	}
	.date_article {
		clear: both;
	}
	#tr3_middle {
	    float: none;
	    margin: 0 auto;
	}
	#tr3_article {
		float: none;
	}
	#tr4_footer_infos, #tr4_footer_rubrique {
	    float: none;
	    margin: 0 auto;
	    margin-bottom: 16px;
	}
	#tr4_footer {
		padding-top: 10px;
		height: auto;
	}
	#tr1_header_txt {
	    margin: 0 auto;
    	margin-top: 10px;
    	text-align: center;
    }
    #menu dt {
	    float: left;
	    width: 30%;
	    height: 47px;
	    font-size: 13px;
	    font-weight: bold;
	    padding-left: 5px;
	    padding-right: 5px;
	    text-align: center;
	    vertical-align: top;
	    background-image: url('//cybermotard.com/images/btn_menu.png');
	    background-repeat: no-repeat;
	    background-size: contain;
	    padding-top: 5px;
	    margin-top: 5px;
	}
	#menu {
	    position: inherit;
	    width: 98.6% !important;
	    height: 125px;
	    padding-top: 0px;
	    padding-right: 0px;
	    padding-left: 5px;
    	margin-left: 0px;
    	top: 0px;
    	background-color: #FFCC00;
	}
	#tr1_header_logo {
    height: auto;
	}
	.titre_rubrique {
   		width: 97%;
   	}
   	#tr3_pub {
	    float: none;
	    margin: 0 auto;
	}
	.chemin_fer_article {
    	width: 97.4%;
	}
	#depeche, .titre_middle, .pied_middle {
    margin: 0 auto;
	}
}


#menuToggle {
  display: block;
  position: relative;
  top: 0px;
  left: 10px;
  
  z-index: 1;
  
  -webkit-user-select: none;
  user-select: none;
}
#menu nav {
    padding-left: 10px;
}
#menuToggle input
{
    display: block;
    width: 40px;
    height: 32px;
    position: relative;
    top: 31px;
    left: -11px;
    cursor: pointer;
    opacity: 0;
    z-index: 2;
  
  -webkit-touch-callout: none;
}

#menuToggle span {
  z-index: 3!important;
}

#menuToggle input[type="checkbox"] {
    z-index: 3 !important;
}

#menuToggle span
{
  display: block;
  width: 33px;
  height: 4px;
  margin-bottom: 5px;
  position: relative;
  
  background: #222;
  border-radius: 3px;
  
  z-index: 1;
  
  transform-origin: 4px 0px;
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#menuToggle span:first-child
{
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

#menuToggle input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
  background: #232323;
}

#menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

#menuToggle input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(0, -1px);
}

#menuresp {
    z-index: 2;
    position: absolute;
    width: 300px;
    margin: -62px 0 0 -50px;
  padding: 50px;
  padding-top: 100px;
  
  background: #FFCC00;
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  /* to stop flickering of text in safari */
  
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}

#menuresp li
{
  padding: 2px 0;
  font-size: 22px;
}

#menuToggle input:checked ~ ul
{
  transform: none;
}