/* ---------------------------------------- */

/* Classic version */
.gallery {
    margin: 37px 0 0;
    overflow: hidden;
    width:880px; /* introducing this for posts where .gallery might get wrapped in a narrower .content_readabl */
  }
  .gallery figure {
    display: block;
    object-fit: cover;
    float: left;
    margin-top: 0;
    margin-bottom: 36px;
    margin-left: 0; 
    text-align: center;
    width: 145px; /* default - same as .five */
    margin-right: 38.74px; /* default - same as .five */
  }
  .gallery.one figure {
    width: 880px;
    margin-right: 0; 
  }
  .gallery.two figure {
    width: 421px;
    margin-right: 38px; 
  }
  .gallery.three figure {
    width: 268px;
    margin-right: 38px; 
  }
  .gallery.four figure {
    width: 192px;
    margin-right: 37.33px; 
  }
  .gallery.five figure {
    width: 145px;
    margin-right: 38.74px;
  }

  /* exception - first and last at the same time - align center - think of a better waz later!!! */
  .gallery figure:first-child:last-child {
      margin-left:297px;
      margin-right:297px;
      text-align: center;
  }
  
  /* "Breathe" version */
  .gallery.breathe {
    margin: 80px 0 0;
  }
  .gallery.breathe figure {
    /*margin-bottom: 80px;*/
    width: 128px; /* default - same as .five */
    margin-right: 60px; /* default - same as .five */
  }
  .gallery.two.breathe figure {
    width: 400px;
    margin-right: 80px; 
  }
  .gallery.three.breathe figure {
    width: 240px;
    margin-right: 80px; 
  }
  .gallery.four.breathe figure {
    width: 167px;
    margin-right: 70.66px; 
  }
  .gallery.five.breathe figure {
    width: 128px;
    margin-right: 60px; 
  }
  
  .gallery figure:nth-child(5n),
  .gallery.two figure:nth-child(2n),
  .gallery.three figure:nth-child(3n),
  .gallery.four figure:nth-child(4n),
  .gallery.five figure:nth-child(5n) {
      margin-right:0;
  }
  
  .gallery figure:nth-child(5n+1),
  .gallery.two figure:nth-child(2n+1),
  .gallery.three figure:nth-child(3n+1),
  .gallery.four figure:nth-child(4n+1),
  .gallery.five figure:nth-child(5n+1) {
      clear: left;
  }
  .gallery figure:last-child:after {
      content: "."; 
      visibility: hidden; 
      display: block; 
      height: 0; 
      clear: both;
  }
  
  .gallery figure img {
      max-width: 100%;
      height: auto;
  }
  
  .gallery + p {
      margin-top: 0;
  }