/* Global */
@import url("https://fonts.googleapis.com/css?family=Roboto:400,400i,700");
body {
	background: #36393e;
	color: #bfbfbf;
	font-family: Roboto, Arial, sans-serif;
	margin: 0;
	white-space: nowrap;
}

h1 {
	font-size: 1.7rem;
    margin-top: 1rem;
    background: #2f3136;
    color: #bfbfbb;
    padding: 0.2em 1em;
    border-radius: 3px;
    border-left: solid #4974a9 5px;
    font-weight: 100;
}

h2 {
	font-size: 1.1rem;
    margin-top: 1rem;
    background: #2f3136;
    color: #bfbfbb;
    padding: 0.4em 1.8em;
    border-radius: 3px;
    border-left: solid #4974a9 5px;
    font-weight: 100;
}

table{
	border-collapse: collapse;
}

label{
	line-height: 38px;
}

p{
	margin: 0.5em 0;
}

.left {
	float: left;
}
.right {
	float: right;
}
.bold {
	font-weight: bold;
}
.red{
	color: #F04747;
}
.green{
	color:#43B581;
}
.clear {
	clear: both;
}
.centered{
	text-align: center;
}

#copyright{
	font-size: 0.95em;
	text-align: center;
	margin-top: 3em;
	margin-bottom: 3em;
}


.chColor {
    width: 17px;
    height: 17px;
    background-color: #4974A9;
    margin-left: 14px;
    margin-right: 9px;
}

.chColorNW{
	background-color: #3333FF;
}

/* Meter */
.meter_background{
	background: #42464D;
	width: 100%;
	word-break: normal;
	min-width: 100px;
}
.meter_forground{
	color: #fff;
	padding: 4px 0;
	/* + one of the colors below
	(width will be set by the JS) */
}
.meter_green{
	background: #43B581;
}
.meter_orange{
	background: #FAA61A;
}
.meter_red{
	background: #F04747;
}
.meter_value{
	padding-left: 8px;
}


/* Tables */
table {
	width: 100%;
	min-width: 400px;
	margin-bottom: 2em;
}

th, td {
	padding: 2px 5px;
    text-align: left;
    border-bottom: 1px solid #5d5d5d;
}
tr {
	page-break-after: auto;
	page-break-inside: avoid;
}

.banner {
	display: block;
	padding: 8px 10px;
	background: #2f3136;
	text-align: center;
	padding: 6px;
	cursor: pointer;
}

input[type="file"] {
    display: none;
}

input[type="text"] {
	background-color: transparent;
    color: #bfbfbf;
    border: none;
    font-size: inherit;
    padding-left: 10px;
	width: 1000px;
}

/* ==== GRID SYSTEM ==== */
.container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  max-width: 1140px;
}

.row {
  position: relative;
  width: 100%;
}

.row [class^="col"] {
  float: left;
  margin: 0.25rem 2%;
  min-height: 0.125rem;
}

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
  width: 96%;
}

.row::after {
	content: "";
	display: table;
	clear: both;
}

.hidden-sm {
  display: none;
}

#metaTable tr:not(:first-child)>td {
	padding-left: 34px;
}

@media only screen and (min-width: 24em) {
  .col-1 {
    width: 4.33%;
  }

  .col-2 {
    width: 12.66%;
  }

  .col-3 {
    width: 21%;
  }

  .col-4 {
    width: 29.33%;
  }

  .col-5 {
    width: 37.66%;
  }

  .col-6 {
    width: 46%;
  }

  .col-7 {
    width: 54.33%;
  }

  .col-8 {
    width: 62.66%;
  }

  .col-9 {
    width: 71%;
  }

  .col-10 {
    width: 79.33%;
  }

  .col-11 {
    width: 87.66%;
  }

  .col-12 {
    width: 96%;
  }

  .hidden-sm {
    display: block;
  }
}



#spinnerBox {
	position:fixed;
	left:50%;
	top:50%;
	transform: translate(-50%, -50%);
	
	opacity: 0;
	visibility: hidden;
    transition: opacity 1s ease-out;
    
}
#spinnerBox.active {
    opacity: 1;
    visibility: visible;
}




.donut {
  width: 5rem;
  height: 5rem;
  margin: 2rem;
  border-radius: 50%;
  border: 0.6rem solid rgba(73, 116, 169, 0.3);
  border-top-color: #979fd0;
  animation: 1.5s spin infinite linear;

  &.multi {
    border-bottom-color: #979fd0;
  }
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@media print {
	html,body{
		/* height:100%; */
		/* width:100%; */
		margin:0;
		padding:0;
		page-break-before: avoid;
		/* background-image:url('EbannerTrans.png'); */
		/* background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkqAcAAIUAgUW0RjgAAAAASUVORK5CYII=); */
		background: #36393e;
		background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkqAcAAIUAgUW0RjgAAAAASUVORK5CYII=);
		display: block; 
		/* background-repeat: */
		/* color-adjust: exact;  */
		-webkit-print-color-adjust: exact; 
		/* print-color-adjust: exact; */
		/* display: block;  */
		/* height: 891mm; */
		/* height:4630px; */
		/* height: 3369px; */
		/* height:-webkit-fill-available; */
		/* height: available height; */
	}
	@page {	
		size: 210mm 297mm;
		
		max-height:100%; 
		max-width:100%;
		height:100%;
		margin-top: 0px;
		margin-bottom: 0cm;
		margin-left: 0cm;
		margin-right: 0cm;
		/* @bottom-center{ */
			/* content: "Page " counter(page); */
			/* content: url("EbannerTrans.png");  */
			/* border: solid green; */
			/* } */
		
	}
	/* .bannerY{ */
		/* position:fixed; */
		/* top:0; */
		/* left:50%; */
		/* transform: translateX(-50%); */
		/* background: #36393e; */
		/* background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkqAcAAIUAgUW0RjgAAAAASUVORK5CYII=); */
		/* display: block;  */
	/* } */
	/* #copyright{ */
		/* position:absolute; */
		/* bottom:0; */
		/* left:50%; */
		/* transform: translateX(-50%); */
	/* } */
	.container{
		margin-top:80px;
		display: block; 
		/* height: 300%; */
		/* height: 891mm; */
		/* min-height: 100%; */
		/* height: 100%; */
		/* page-break-before: avoid; */
		/* color-adjust: exact;  */
		/* -webkit-print-color-adjust: exact;  */
		/* print-color-adjust: exact; */
		/* background: #36393e; */
		/* background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkqAcAAIUAgUW0RjgAAAAASUVORK5CYII=); */
		/* display: block;  */
		/* padding-top: 10px; */
		height: 100%;
	}
}