div.stickers {counter-reset: ballast; font-size: 0px;}

div.sticker.ballast {opacity: 0.2;}

div.stickers:after {content: ""; display: block; clear: both;}
div.stickers div.sticker {border: 1px dotted #666; }

div.stickers div.page {position: relative; }
div.stickers div.page_wrap {position: relative; display: block; break-inside: avoid-page!important; break-after: page!important; margin-top: 20px!important; margin-bottom: 0!important;}


div.stickers.assembly div.sticker {width: 255px; height: 255px; text-align: center; position: relative; margin-right: 25px; margin-bottom: 43px; float: left; /*font-size: 10px;*/ background: url('images/logo_small.png') 78px 36px no-repeat; border-radius: 50%;}
div.stickers.assembly div.sticker:nth-child(3n){margin-right: -10px;}
/* div.stickers.assembly div.sticker:nth-child(12n+1),div.stickers.assembly div.sticker:nth-child(12n+2),div.stickers.assembly div.sticker:nth-child(12n+3){margin-top: 58px;} */
/* div.stickers.assembly div.sticker:nth-child(12n+1){page-break-before: always;} */
div.stickers.assembly div.sticker div.date {}

div.stickers.assembly div.sticker div.id {position: relative; margin: 60px auto 0px; font-size: 58px; line-height: 58px; font-weight: bold;}
div.stickers.assembly div.sticker div.id span:nth-child(2) {position: absolute; width: 100%; text-align: center; font-size: 19px; line-height: 19px; display: block; margin-top: 2px; /*margin-top: -5%;*/}

div.stickers.assembly div.sticker div.eatings {display: inline-flex; /*position: absolute; left: 0px; right: 0px; bottom: 5%; height: 16%;*/ margin-top: 30px; text-align: center; font-size: 0px; color: #fff;}
div.stickers.assembly div.sticker div.eatings span {border: 1px solid #a0a0a0; border-radius: 4px; /*margin-left: 1%; margin-right: 1%; width: 16%; height: 100%;*/ width: 16px; height: 16px; font-size: 12px; line-height: 16px; margin-right: 7px; /*display: flex; flex-direction: row; align-items: flex-start;*/}
div.stickers.assembly div.sticker div.eatings span:last-child {margin-right: 0px;}
div.stickers.assembly div.sticker div.eatings span.change:empty:before {font-family: FontAwesome; content: "\f074";}

div.stickers.assembly div.sticker p.ration {color: #fff; font-size: 33px; font-weight: bold; text-align: center; line-height: 51px; background-color: #ddd; border-radius: 25px; width: 105px; height: 51px; margin: 15px auto 0px;}
/*div.stickers.assembly div.sticker div.ration span:nth-child(2) {font-size: 16px; display: block;}*/


div.stickers.assembly div.sticker div.options {position: absolute; left: 0px; top: 0px; /*right: 0px; bottom: 0px; width: 15%;*/}
div.stickers.assembly div.sticker div.options span {display: block; position: absolute;}
div.stickers.assembly div.sticker div.options span.water {border: #71a4d7 2px solid; background-color: #71a4d7; border-radius: 50%; width: 24px; height: 24px; left: 30px; top: 94px; font-size: 18px; color: #fff;}
div.stickers.assembly div.sticker div.options span.water.no {background-color: #fff;}
div.stickers.assembly div.sticker div.options span.tools {border: #a6814d 2px solid; background-color: #a6814d; border-radius: 8px; width: 24px; height: 24px; left: 30px; top: 138px;  font-size: 18px; color: #fff;}
div.stickers.assembly div.sticker div.options span.tools.no {background-color: #fff;}
div.stickers.assembly div.sticker div.options span.reminder {border-color: #ff9204; background-color: #ff9204; border-radius: 8px; width: 28px; height: 28px; left: 197px; top: 138px;}

div.stickers.assembly div.sticker.ballast:after {counter-increment: ballast; content: counter(ballast); color: #000; font-size: 165px; display: block; margin-top: 90px; position: absolute; width: 100%; height: 100%;}

div.stickers.packaging {font-family: 'Roboto Condensed', sans-serif;}

div.stickers.packaging div.sticker {width: 387px; overflow: hidden; height: 204px; position: relative; margin: 0px; float: left; font-size: 30px; text-align: left;}
div.stickers.packaging div.sticker:before {content: ""; display: block; position: absolute; top: 0; left: 20px; width: 30%; height: 100%; background-image: url(images/logo.png); background-position: center center; background-size: contain; background-repeat: no-repeat;}

div.stickers.packaging div.sticker div {margin-left: calc(30% + 40px); font-size: 20px; margin-right: 20px;}
div.stickers.packaging div.sticker div.eating {font-size: 0px; border-bottom: 2px dashed #614941; margin-top: 20px;}
div.stickers.packaging div.sticker div.eating:before {font-size: 24px;}

div.stickers.packaging div.sticker div.eating.e1:before {content: "Завтрак";}
div.stickers.packaging div.sticker div.eating.e2:before {content: "Второй завтрак";}
div.stickers.packaging div.sticker div.eating.e3:before {content: "Обед";}
div.stickers.packaging div.sticker div.eating.e4:before {content: "Полдник";}
div.stickers.packaging div.sticker div.eating.e5:before {content: "Ужин";}
div.stickers.packaging div.sticker div.eating.e6:before {content: "Ночной перекус";}

div.stickers.packaging div.sticker div.date {position: absolute; bottom: 20px;}


div.stickers.packaging div.sticker.ballast:before {display: none;}
div.stickers.packaging div.sticker.ballast:after {counter-increment: ballast; content: counter(ballast); color: #000; font-size: 148px; display: block; position: absolute; text-align: center; width: 100%; height: 100%;}

#packaging_stickers>div {position: absolute;}

 .stickers div.page:after {content: ""; clear: both; display: block;} 


@media print
  {
  body {background: none;}  
  div.sticker.ballast {opacity: 0;}
  div.stickers.packaging {padding: 0px;}
  .sticker {border-color: transparent!important;}
  .sticker:after {display: none!important;}
  #packaging_stickers {transform: none!important;}

 .stickers div.page {transform-origin: 0 0; transform: scale(1)!important;   border-bottom: 1px solid #000; margin-bottom: 0px; } 

  #stickers.packaging {transform: scale(1)!important;}
 
  #packaging_stickers {transform-origin: 0 0; transform: scale(1)!important;}
    * {color: #000!important;}

  }