/* * { margin: auto; }
    body { margin: 20px 0; background: #abc; color: #111; font-family: Helvetica, Arial, Verdana, 'Lucida Grande', sans-serif; }*/
    h1, h3, p { text-align: center; }
   .example { padding: 2px;   width: 60%;  }
   .example h3 { margin-bottom: 10px; }
  /*  ul, ol { padding: 0; }
    #list { width: 50px; height: 150px; overflow-y: scroll; }*/
    #images { width: 80%;  overflow-x: hidden; text-align: center; list-style: none; }
    #images img {width:100%;}
    .endless_scroll_loader { position: fixed; top: 10px; right: 20px; }
    
   .example_d {
    /*margin: 0 auto 0 17%; */   
    width: 100%;
     }
    @media screen and (min-width: 641px) and (max-width: 760px) 	
    {
    	 .example { padding: 2px; margin: 0 0 0 33%;  width: 60%; }
    	  .example_d {
    margin: 0 auto 0 10%;    
    width: 100%;
     }
    	}
    @media screen and (min-width: 421px) and (max-width: 640px) 
    {
    	 .example { padding: 2px; margin: 0 0 0 -12%;  width: 110%; }
   .example_d {
    margin: 120% auto 0 -10%;
    width: 159%;
}
}
  @media screen and (min-width: 320px) and (max-width: 420px) 
  {
  	 .example { padding: 2px; margin: 0 0 0 -11%;  width: 100%; }
     #images img {width:100%;}
     	  
.example_d {
    margin: 155% auto 0 -10%;
    width: 149%;
}
}
@media screen and (min-width: 0px) and (max-width: 319px) {

	.example { padding: 2px; margin: 0 0 0 -16%;  width: 100%;  }
	#images img {width:100%;}
	

.example_d {
    margin: 188% auto 0 -15%;
    width: 167%;
}
	}