@charset "utf-8";

@font-face {
  font-family: 'PressStart2PRegular';
  src: url('PressStart2P-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'SevenHexa';
  src: url('pendule-ornamental.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'SevenSegment';
  src: url('seven-segment.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}


@font-face {
  font-family: 'DigiPoint';
  src: url('pidvl-bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}

.segment7 {
  font-family: 'SevenSegment';
  font-weight: normal;
  font-style: normal;
  font-size: 1.5em; 
  color: ForestGreen;
}

.segment {
  font-family: 'SevenHexa';
  font-weight: normal;
  font-style: normal;
  font-size: 1.5em; 
  /*letter-spacing: 0.1em;*/
  color: Lime; /*GreenYellow*/
}

.segment-big {
  font-family: 'SevenHexa';
  font-weight: normal;
  font-style: normal;
  font-size: 3em;
  letter-spacing: 0.1em;
  color: Orange;
}

.digip {
  font-family: 'DigiPoint';
  font-size: 2em; 
  color: Orange;
}

.segment, .segment-big { display: flex; }
.char-box {
   width: 16px;
   height: 23px;
   border: 1px solid #222;
   display: flex;
   align-items: center;
   justify-content: flex-end;
   padding-right: 2px;
   box-sizing: border-box;   
}

.ls02 { letter-spacing: 0.2em; }
.ls03 { letter-spacing: 0.3em; }
.ls05 { letter-spacing: 0.5em; }

.char-box-big {
   width: 32px;
   height: 50px;
   border: 1px solid #555;
   display: flex;
   align-items: center;
   justify-content: flex-end;
   padding-right: 3px;
   box-sizing: border-box;
}