@media screen and (max-width: 768px) {
	.listgames li {
		flex-basis: calc(45% - 10px);
	}
}

@media screen and (max-width: 480px) {

	.listgames li {
		flex-basis: calc(100% - 10px);
	}
	
	.listgames li a{
		display : flex;
		width : 100%;
	}

	.listgames li .thumbnail {
		flex-basis: 30%;
		margin-right: 20px;
	}

	.listgames li .description {
		flex-basis: 70%;
	}
}
@media only screen and (max-width : 600px) {
  body {
    margin-top: 50px;
  }
  #homepage #left, .simplebox.megabanner, #monpnactivities, #top, .reveal-modal{
    display: none;
  }
  .col_left {
    float:none;
  }
   header {
    display: none;
  }
  #headerMobile {
    display: block !important;
    position: fixed;
	height:50px;
    width: 100%;
    top:0px;
    background-color: #343434;
    z-index: 1000;
  }

	a:link
	{
		text-decoration:none;
	}

	img{
		max-width : 100%;
		height: auto;
	}
	select {
	font-size : 1.8em;
	}
	object,embed,video,iframe{
		max-width : 100%;
	}

	.global, .row,  div#content section#editorial, .col_left, div#content section#editorial #update , #content, .col_right, .simplebox.pave {
		width: auto;
		margin-right: 0px;
		margin-left: 0px;
	}

	.simplebox.pave {
		text-align: center;
	}

	.favslistEmbed,.schedule{
		 display: none;
	}
	.col_right{
		float:none;
	}

	.addthis {
	 display: none;
	}

	#newspn a img{
	 display: none;
	}

	div#content section#newspn {
	  margin-bottom: 20px;
		width: auto;
		margin-top:20px;
		padding: 5px 5px 5px 5px;
	}
	#newspn li, #newspn a{
		color:#ffffff;
	}

	div#content section#newspn ul{
		margin-left: 0px;
	}

	div#content section#newspn ul li  a:nth-child(1):before {
	  content:   "En ce moment : ";
	  }

	/***************************************dossier***********************************************/

	div#content section#headline {
		/*display: none;*/
		width: auto;
		margin-right: 0px;
		margin-left: 0px;
	}

	#headline nav{
	 display: none;
	}

	span system {
		width: 50%;
	}
	.cover{
		width: auto;
		height: auto;
		float: none;
		margin-right: 0px;
		background: #4a4a4a;
		margin-bottom: 0px;
		min-height:200px;
	}
	.cover .system {
		width: 25px;
	}
	.cover aside {
		font-size: 0.8em;
		width: 45%;
		/*height: auto;*/
		background-color: rgba(71, 71, 71, 0.8);
	}
	/*.cover aside p {
		display: none;
	}*/
	.cover aside p a.awesome {
		font-size: 1.4em;
	}
	.cover a img, .cover img {
		max-width: 100%;
		height: auto;
	}

	.cover>a>img,.cover>img{
		min-height:200px;
	}

	/***************************************fin dossier*************************************************/
	div#content {
		padding: 2px 10px 0 10px;
	}

	#center footer div{
		background :none;
		background-color:#3e3e3e;
		text-align:center;
	}

	#center footer div .top dl {
		width: auto;
		padding-right:0px;
		float:none;
	}

	.top dl:nth-child(1){
		margin-bottom: 20px;
		width: auto;
		padding-right:0px;
	}

	.top dl:nth-child(3){
		display: none;
		width: auto;
	}

	/***************************************menu***********************************************/

	.logo{
		text-align: center;
		padding: 7px;
		height: 38px;
		margin-left: 30px;
	}

	.toggle-nav{
		display: block;
		position: absolute;
		color: #ffffff;
		font-size : 2.8em;
		padding: 2px 2px 0 5px;
		color:#ff0000;
	}

	nav .left li a{
		color: #343434;
	}
	/**/
	.nav .left li{
		border-bottom: 1px solid #f2f2f2;
		font-size: 14px;
		float: left;
	}
	.nav .left li:nth-child(7){
		 border-bottom: 1px solid #ff0000;
	}
	.nav .left li a{
		display: block;
		padding: 9px 15px;
		line-height: 30px;
	}
	.nav .left li a:hover{
		background: #f2f2f2;
	}
	.reseauxsociaux{
		margin-top:10px;
	}

	/**/
	.nav-mobile{
		display: none;
	}

	.style-mobile{
		top : 50px;
		position : absolute;
		width : 100%;
	}

	.style-mobile li{
		display: block;
		width: 100%;
	}

	.nav .right{
		display: block;
		float: none;
		margin: 0em;
	}

	.nav .left{
		display: block;
		float: none;
		margin: 0em;
	}
	.nav-mobile input {
		margin:15px 0px 5px 5px;
		width: 96%;
		box-sizing: border-box;
		border: 2px solid #ccc;
		border-radius: 4px;
		font-size: 16px;
		background-color: white;
		background-image: url(http://www.p-nintendo.com/mobile/searchicon.png);
		background-position: 10px 12px;
		background-repeat: no-repeat;
		padding: 12px 20px 12px 40px;
		transition: width .4s ease-in-out;
	}

	.nav-mobile input :focus {
		width: 100%;
	}

	.scrollbar
	{
		float: left;
		/*height: 400px;*/
		width: auto;
		background: #d0d0d0;
		overflow-y: auto;
		margin-bottom: 25px;
	}

	.force-overflow
	{
		min-height: auto;
	}

	#style-3::-webkit-scrollbar-track
	{
		-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
		background-color: #F5F5F5;
	}

	#style-3::-webkit-scrollbar
	{
		width: 6px;
		background-color: #F5F5F5;
	}

	#style-3::-webkit-scrollbar-thumb
	{
		background-color: #ff0000;
	}

	/***************************************fin menu***********************************************/
	/***************************************article***********************************************/
	ul#breadcrumbs {
		margin-top: 20px;
		width: auto;
	}
	.row .hub  header {
		display: block;
	  }

	.hub, .hub.mini {
		width: auto;
		background:none;
		background-color: #f3f3f3;
	}
	.hub nav {
		background:none;
		background-color: #4d4d4d
	}
	.monpnaction, .follow{
		display: none;
	}

	#bulk article .content {
		width: auto;
		float: none;
		margin-right: 0px;
	}

	#bulk article .content aside{
		width: auto;
		margin-right: 0px;
		float: none;
		height: 130px;
	}

	#bulk article .content aside ul li {
		font-size: .9em;
		line-height: 1.2em;
		margin-bottom: 0px;
		float: left;
	}

	#bulk article .content aside ul li:nth-child(2){
		float: right;
		margin-right: 2px;
	}
	#bulk article .content aside ul li.last {
		float: right;
		margin-right: 20px;
	}

	#bulk article .introduction, #bulk article .conclusion {
		font-weight: bold;
		margin: 0px 8px 10px 8px;
		font-size: 1.5em;
		line-height: 1.4em;
		text-align:justify;
	}

	#bulk article .content div {
		width: auto;
		float: none;
		margin: 0px 0px 15px;
		line-height: 1.6em;
	}

	#bulk article .content div .legend {
		font-size: 0.5em;
	}


	#bulk article .content div blockquote {
		width: auto;
		margin-left: auto;
		margin-right: auto;
	}
	

	.figure.video {
		min-width: auto;
		margin-bottom:15px;
	}

	.figure.video h4 {
		font-size: 1.2em;
	}

	span.absolute {
		position: inherit;
	}
	#bulk article .content div h2 {
		margin-left:0px;
		margin-top:10px;
	}

	.render h4 {
		font-size: 0.7em;
	}

	#bulk article nav.bulk a  {
		font-size:12px;
		width: auto;
	}

	#bulk article nav.bulk a span {
		display: none;
	}

	/***************************************fin article***********************************************/
	/***************************************commentaire***********************************************/
	.comments .box h3 {
		background: none;
		background-color :#3f5a62
	}

	.comments .box h3 span.absolute {
		width: 35px;
		left: 8px;
		float: right;
	}

	.comments .box article header {
		display: block;
	}


	.comments .mypost div textarea {
		width: 100%;
		padding: 0px;
	}

	.comments article aside .arrow {
		top: 0px;
	}
	.comments article div {
		font-size: 1.2em;
		line-height: 1.4em;
	}

	/***************************************fin commentaire***********************************************/
	/***************************************recherche article***********************************************/
	#search .simplebox h3  {
		width: 100%;
		padding-right:0px;
	}

	.simplebox h3 span{
		width: 100%;
		position: inherit;
		top: 0px;
	}
	.filter li.caption {
		width: 100%;
	}

	.filter li{
		margin-top: 5px;
	}

	.pagination .prev{
		float: left;
		width: 144px;
		margin-right: 0px;
	}
	.pagination .next{
		float: right;
		width: 144px;
		margin-left: 0px;
	}

	.pagination .next a{
		padding: 7px 12px;
	}
	.pagination .prev .disabled{
		padding: 7px 12px;
	}
	.pagination .next .disabled{
		padding: 7px 12px;
	}

	.pagination .middle{
	  display: none;
	}

	.filter li a {
		padding: 15px 20px;
		margin-right: 15px;

	}

	.list.tags3 dd {
		margin-right: 15px;
		margin-bottom: 10px;
	}

	.list.tags3 dd a {
		padding: 15px 20px;
	}

	/***************************************fin recherche article***********************************************/
	/**********************************************page jeux***********************************************/

	.list.grid {
		width: 100%;
	}

	.list.grid li {
		width: 46%;
		margin: 0px 4px 8px 4px;
	}

	.asideCover {
		font-size: 0.8em;
		width: 96%;
		height: auto;
		position: relative;
		margin: 8px 0px 0px 0px;
		background-color: rgba(71, 71, 71, 0.8);
	}
	.asideCover .desc {
		height: auto;
	}

	.asideCover .scrollbar {
		height: 120px;
	}
	.asideCover .desc .viewport {
		width: 100%;
	}

	.asideCover .desc .viewport {
		height: 80px;
	}

	.asideCover .desc .scrollbar {
		display:none;
	}

	#reviews {
		width: 100%;
	}

	#reviews .monpn, #reviews .pnteam {
		width: 100%;
		margin: 20px 0px 0px 0px;
	}

	#reviews .monpn .graph .bar-title {
		width: 50%;
	}
	#reviews .monpn .graph .bar-container {
		width: 50px;
	}

	.box.monpn.quick h3 .absolute {
		top: 0px;
		left: 5px;
	}

	.simplebox {
		text-align: justify;
	}


	/*******************************************fin page jeux***********************************************/
	/*******************************************page image***********************************************/
	.simplebox fieldset h4 {
		width: auto;
	}


	.simplebox fieldset h4 span.absolute {
		position: absolute;
	}
	/*******************************************fin page image***********************************************/
	/*******************************************encyclo************************************************/
	#encyclo {
		width: auto;
	}
	#encyclo .cover aside p {
		display: inline;
	}

	#encyclo>ul li {
		width: 100%;
		float: left;
		margin-right: 0px;
	}
	/*******************************************fin encyclo************************************************/
	.box.monpn h3 span.absolute {
		top: 0px;
		margin-left: 20px;
		font-size: 13px;
	}

	.box.monpn .col1{
		width: 100%;
		margin-right: 0px;
	}
	.auth .col1 {
		 padding: 0px;
	}

	.box.monpn .col2{
		margin-top: 20px;
		width: 100%;
		margin-left: 0px;
	}
	.auth .col2 {
		 padding: 0px;
		 border-right: none;
		border-left: none;
	}

	.box.monpn .col3{
		margin-top: 20px;
		width: 100%;

	}
	.auth .col3 {
		 padding: 0px;
		 border-right: none;
		border-left: none;
	}
	.box.monpn .background div {
		left: 15px;
	}
}