@import '../variables';

.reliure {
    width: 400mm;
    height: 40mm;
    border: 1px solid gray;
    transform: rotate(90deg);
}
.reliure img {
    transform: rotate(-90deg);
    width: 30mm;
}
.reliure h1 {
    font-size: 30pt !important;
    line-height: 40pt;
    color: $blue !important;
    text-align: center;
}
.reliure .nom-installation {
    font-size: 20pt !important;
    line-height: 30pt;
    color: darkorange !important;
    text-align: center;        
}
table tr td {
    height: 40mm;
}
    
/**************** Pour que le parent de la div rotated s'agrandisse '**************************/
    
.rotation-wrapper-outer {
  display: table;
}
.rotation-wrapper-inner {
  padding: 50% 0;
  height: 0;
}
.element-to-rotate {
  display: block;
  transform-origin: top left;
  /* Note: for a CLOCKWISE rotation, use the commented-out
     transform instead of this one. */
  /*transform: rotate(-90deg) translate(-100%);*/
   transform: rotate(90deg) translate(0, -100%); 
  margin-top: -50%;

  /* Not vital, but possibly a good idea if the element you're rotating contains
     text and you want a single long vertical line of text and the pre-rotation
     width of your element is small enough that the text wraps: */
  white-space: nowrap;
}