@media print{
  @page {
    
    /*WRONG FORMAT BC OF CHROME EXPORT
    Actual Format is 84x130mm*/
    /*size: 90mm 138.65mm;*/
    size: 84mm 130mm;

    margin: 10mm 15mm;
    /*top-center: 200mm;*/
    bleed: 3mm;
    marks: crop;
    
  }

  @page:first{

    margin-top: 30mm;
    margin-left: 17mm;
    margin-right: 17mm;
    background-color: black;
    a{
      color: white;
    }
    
    @top-center {
      content: none;
    }

    @bottom-center {
      content: none;
    }
  }

  @page:blank{
    @top-center {
      content: none;
    }

    @bottom-center {
      content: none;
    }
  }

    @page:nth(3){

    margin-top: 30mm;
    margin-left: 7mm;
    margin-right: 7mm;

    
    @top-center {
      content: none;
    }

    @bottom-center {
      content: none;
    }
  }

    @page:nth(404){
margin-top: 7mm;
}

    @page:nth(405){
    margin-top: 7mm;
    margin-left: 14mm;
    margin-right: 6mm;
  }

  @page:nth(407){
    margin-top: 7mm;
    margin-left: 14mm;
    margin-right: 6mm;
  }

    @page:nth(406){
    margin-top: 7mm;
    margin-left: 6mm;
    margin-right: 14mm;
  }

  @page:nth(408){
    margin-top: 7mm;
    margin-left: 6mm;
    margin-right: 14mm;
  }

@page:nth(409){
  @bottom-center {
      content: none;
    }
}

@page:nth(410){
  @bottom-center {
      content: none;
    }
}

  @page:nth(411){
    background-color: black;
    color: white;
    margin-top: 30mm;
    margin-left: 5mm;
    margin-right: 5mm;
    @bottom-center {
      content: none;
    }

    h1{
      color: white;
    }
  }

   @page:nth(412){
    background-color: black;
    color: white;
    margin-top: 30mm;
    margin-left: 5mm;
    margin-right: 5mm;
    @bottom-center {
      content: none;
    }

    h1{
      color: black;
    }
  }


  @page:left {
    margin-left: 7mm;
    margin-right: 10mm;

    /*background-color: black;

    p{
      color: white;
    }*/


    @bottom-center {
      content: counter(page);
    }

    @top-center{
      /*content: "Frankenstein; or";*/
    }
  }

  @page:right {
    margin-left: 7mm;
    margin-right: 5mm;
    /*text-align: right;*/

    @bottom-center {
      content: counter(page);
  }

    @top-center{
      /*content: "The Modern Prometheus.";*/
      margin-left: -19px;
      
  }

}


  body {
    /*font-family: Vinta, serif;*/
    color: black;
    display: block;
    text-align: center;
    font-size: 12pt;
    height: 100vh;
    overflow: auto;
    hyphens: auto-fit;
  }

  a{
    color: black;
    text-decoration: none;
  }

p{
  
}

.grid{
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0;
  height: 100%;
  width: 100%;
  /*break-before: left !important;*/

} 

.item{
  /*break-before: always;*/
}

.grid-image{
  display: flex;
  /*break-before: always;*/
  break-after: none;
  /*padding-bottom: 20%;*/
  break-before: right;
  /*flex-grow: 2;*/

}

.grid-image img{
  /*max-width: none;*/
    /*max-width: 100%;
    max-height: 80%;
    position: absolute;*/
    width: auto;
    height: auto;
    max-width: 250px;
    max-height: 350px;


}

.title{
  position: relative;
  opacity: 1;
  display: block;
  /*color: red;*/
  break-before: left;
  /*break-after: left;*/
  max-width: none;
}



/*----------BREAKS----------*/

.break-right{
  break-before: right;
  /*break-after: left;*/
}

.break-left{
  break-before: left;
  /*break-after: left;*/
}



/*----------PAGES----------*/

.firstpage{
  
}