main { 
    overflow: auto;
	margin: 10% auto;
}

.mencions { 
    box-sizing: border-box; 
    float: left; 
    padding: 10px; 
}

.mencions  p{ 
   margin: 0;
   text-align: justify;
   padding: 2%;
  /* background-color: #fff;
   color: #6c7d8e;
   
   border-radius: 24px;
   -moz-border-radius: 24px;
   -webkit-border-radius: 24px;
   border: 1px solid #fff;
   margin-bottom: 2%;*/
}

@media screen and (min-width: 320px) {
    
	main {
    width: 92%;
    }
	.mencions  p{ 
	   margin-left: 2%;
	   margin-right: 2%;
	}
}

@media screen and (min-width: 768px) {
    
	main {
    width: 88%;
    }
    main > ul > li:nth-child(2n+1) {
    clear: both;
    }
    .mencions {
    width: 50%;
    }
}

@media screen and (min-width: 1024px) {
    main {
    width: 69%;
	margin: 5% auto;
    }
    main > ul > li:nth-child(2n+1) {
    clear: none;
    }
    main > ul > li:nth-child(3n+1) {
    clear: both;
    }
    .mencions  {
    width: 33.3333%;
    }
}