html {
	/* This is the only place to change the base font-size!!! */
/*	font-size: 0.75rem;*/
        background-color: white;
	font-size: 62.5%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;

}

BODY {
        /* Watch it, make no changes here. rather try BODY.default.
         * Changes here will count for ALL pages
         * including dialogs. */
        /* The default body layout */
	max-width: 100%;
	margin: 0;
	line-height: 1.75;
	font-family: "Kollektif", Helvetica Neue, Helvetica, Arial, sans-serif;
	font-size: 1.8rem;
        color: #002f60;
	color: #464646;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;


}
@font-face {
    font-family: "Kollektif";
    src: url("../fonts/Kollektif.eot");
    src: url("../fonts/Kollektif.eot?#iefix") format("embedded-opentype"),
   	 url("../fonts/Kollektif.woff2") format("woff2"),
	 url("../fonts/Kollektif.woff") format("woff"),
	 url("../fonts/Kollektif.ttf") format("truetype"),
	 url("../fonts/Kollektif.svg#Kollektif") format("svg");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Kollektif";
    src: url("../fonts/Kollektif-Bold.eot");
    src: url("../fonts/Kollektif-Bold.eot?#iefix") format("embedded-opentype"),
   	 url("../fonts/Kollektif-Bold.woff2") format("woff2"),
	 url("../fonts/Kollektif-Bold.woff") format("woff"),
	 url("../fonts/Kollektif-Bold.ttf") format("truetype"),
	 url("../fonts/Kollektif-Bold.svg#Kollektif-Bold") format("svg");
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: "Bitter";
    src: url("../fonts/Bitter-Regular.eot");
    src: url("../fonts/Bitter-Regular.eot?#iefix") format("embedded-opentype"), 
    	 url("../fonts/Bitter-Regular.woff2") format("woff2"),
	 url("../fonts/Bitter-Regular.woff") format("woff"),
	 url("../fonts/Bitter-Regular.ttf") format("truetype"),
	 url("../fonts/Bitter-Regular.svg#Bitter-Regular") format("svg");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Bitter";
    src: url("../fonts/Bitter-Bold.eot");
    src: url("../fonts/Bitter-Bold.eot?#iefix") format("embedded-opentype"),
   	 url("../fonts/Bitter-Bold.woff2") format("woff2"),
	 url("../fonts/Bitter-Bold.woff") format("woff"),
	 url("../fonts/Bitter-Bold.ttf") format("truetype"),
	 url("../fonts/Bitter-Bold.svg#Bitter-Bold") format("svg");
    font-weight: bold;
    font-style: normal;
}

BODY.default {
        /* The default body layout */
/*	font-family: Arial, Helvetica, sans-serif;*/
        background-color: #eee;
/*      margin: 10 0 10 0;*/
/*	background-image: url(images/bg.jpg);*/
	-webkit-font-smoothing: antialiased;
        background-repeat: repeat;
	max-width: 100%;
	margin: 0;
	line-height: 1.75;
	font-family: "Kollektif", Helvetica Neue, Helvetica, Arial, sans-serif;
	font-size: 1.8rem;
        color: #002f60;
	color: #464646;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

}
BODY.iframe {
        /* The iframe body */
        background-color: #dcedfe;
}

SELECT:disabled, INPUT:disabled, TEXTAREA:disabled, SELECT[readonly], INPUT[readonly], TEXTAREA[readonly]  {
	background: #97c9fc;
	color: grey;
}

INPUT[type=text]:hover, [type=password]:hover, [type=search]:hover, /*[type=checkbox]+label:hover,*/ SELECT:hover {
	background: #97c9fc;
	cursor:pointer;
}
INPUT[type=text]:hover, [type=password]:hover, [type=search]:hover {
	cursor:text;
}
/*
INPUT[type=checkbox] {
	display:none;
        position:absolute;
        margin: 2px 0 0;
        z-index:-1;
}
*/
/*INPUT[type=radio], [type=checkbox], [type=checkbox]+label {
	background: #dcedfe;
	color: #002f60;
	border: black;
	outline:none;
	display: inline-block;
	cursor:pointer;
	-webkit-box-shadow: 0px 1px 4px 1px #ccc, 0px 0px 2px 1px #dbedff inset;
	-moz-box-shadow: 0px 1px 4px 1px #ccc, 0px 0px 2px 1px #dbedff inset;
	box-shadow: 0px 1px 4px 1px #ccc, 0px 0px 2px 1px #dbedff inset;
}*/
INPUT[type=checkbox], [type=checkbox]+label {
/*	padding:8px;
	margin: 0;
*//*	-webkit-border-radius:1px;
	-moz-border-radius:1px;
	border-radius:1px;*/
}
INPUT[type=radio], [type=radio]+label {
/*	padding:8px;
	margin: 0;
	-webkit-border-radius:1px;
	-moz-border-radius:1px;
	border-radius:1px;*/
}
/*INPUT[type=checkbox]:checked, [type=radio]:checked, [type=checkbox]:checked+label {
        background:url(/images/icons/check.png) top no-repeat #97c9fc;
        background:url(/images/icons/check.png) top no-repeat #dcedfe;
        background-size:contain;
}
INPUT[type=checkbox]:indeterminate, [type=radio]:indeterminate, [type=checkbox]:indeterminate+label {
        background:url(/images/icons/check.png) top no-repeat #bbbbbb;
        color: grey;
        background-size:contain;
}
INPUT[type=checkbox]:checked + label:after {
        background:url(/images/icons/check.png) top no-repeat #97c9fc;
        background-size:contain;
}
INPUT[type=checkbox]:checked:hover [type=radio]:checked:hover, [type=checkbox]:checked:hover+label {
        background:url(/images/icons/check.png) top no-repeat #dcedfe;
        background:url(/images/icons/check.png) top no-repeat #97c9fc;
        background-size:contain;
}*/
INPUT[type=checkbox]:checked, [type=radio]:checked {
        background-color: #dcedfe;
}
INPUT[type=checkbox]:indeterminate, [type=radio]:indeterminate {
        background-color: #bbbbbb;
        color: grey;
}
INPUT[type=checkbox]:checked:hover [type=radio]:checked:hover {
        background-color: #97c9fc;
}

DIV.main {
        background-color: #dcedfe;
/*        min-height: 100%;*/
/*      margin-left: auto;
        margin-right: auto;
        padding: 10px 10px;*/
}
TABLE.ctable {
        background-color: #0078f0;
        border-collapse: collapse !important;
}
TABLE.ctable > thead > tr > th, TABLE.ctable > thead > tr > td {
        text-color: #ffffff;
        border-bottom: 2px solid #c8d1da;
}
TD, TH {
        vertical-align: middle !important;
}
TD.check {
        text-align: center;
}
TH {
#       text-align: left;
        cursor:pointer;
}

.table-header-rotated td{
  width: 40px;
  vertical-align: middle;
  text-align: center;
}

.table-header-rotated th.rotate-45{
  height: 80px;
  width: 40px;
  min-width: 40px;
  max-width: 40px;
  position: relative;
  vertical-align: bottom;
  padding: 0;
  line-height: 0.8;
}

.table-header-rotated th.rotate-45 > div{
  position: relative;
  top: 0px;
  left: 40px; /* 80 * tan(45) / 2 = 40 where 80 is the height on the cell and 45 is the transform angle*/
  height: 100%;
  -ms-transform:skew(-45deg,0deg);
  -moz-transform:skew(-45deg,0deg);
  -webkit-transform:skew(-45deg,0deg);
  -o-transform:skew(-45deg,0deg);
  transform:skew(-45deg,0deg);
  overflow: hidden;
}

.table-header-rotated th.rotate-45 span {
  -ms-transform:skew(45deg,0deg) rotate(315deg);
  -moz-transform:skew(45deg,0deg) rotate(315deg);
  -webkit-transform:skew(45deg,0deg) rotate(315deg);
  -o-transform:skew(45deg,0deg) rotate(315deg);
  transform:skew(45deg,0deg) rotate(315deg);
  position: absolute;
  bottom: 30px; /* 40 cos(45) = 28 with an additional 2px margin*/
  left: -25px; /*Because it looked good, but there is probably a mathematical link here as well*/
  display: inline-block;
  width: 85px; /* 80 / cos(45) - 40 cos (45) = 85 where 80 is the height of the cell, 40 the width of the cell and 45 the transform angle*/
  text-align: left;
}

TR.cTRhead {
        color: #ffffff;
        background-color: #0078f0;
	/*overflow:hidden;*/
}
SPAN.title {
        /* The title as shown on every page. */
        font-family: Arial, Helvetica;
        font-size: 1.4rem;
        font-weight: 300;
}
SPAN.subtitle {
        /* the subtitle (if present) as shown on pages where you edit some. */
}
IMG {
        vertical-align: top;
        border: 0px solid black;
        margin: 0px 0px;
        padding: 0px 0px;
}
IMG.icon {
/*        vertical-align: center;
        border: 0px solid black;
        width: 20px;
        height: 20px;*/
}
.material-icons {
	font-size: 1.6rem;
}
.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
DIV.load_container::before,
DIV.load_container::after,
DIV.load_container {
        position: absolute;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        z-index: 9999;
        text-align: center;
        background: url(images/isologo.png) center no-repeat #ddd;
	mix-blend-mode: hard-light;
	animation: pulsate 1.5s ease-in-out infinite;
	-webkit-animation: pulsate 1.5s ease-in-out infinite;
}
/*DIV.load_container::before,
DIV.load_container::after {
	position: absolute;
	content: "";
	left: 0px;
	top: 0px;
	height: 100%;
	width: 100%;
	background: linear-gradient(transparent, gray);
	pointer-events: none;
}
*/
h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    color: #464646;
    color: #0070ba;
    font-family: "Kollektif",Helvetica Neue,Helvetica,Arial,sans-serif;
    line-height: 1.2;
}
h3 {
    display: block;
    font-size: 1.17em;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}
@keyframes pulsate {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.5);
    }
    100% {
        transform: scale(1);
    }
}

@-webkit-keyframes pulsate {
    0% {
        -webkit-transform: scale(1);
    }
    50% {
        -webkit-transform: scale(1.5);
    }
    100% {
        -webkit-transform: scale(1);
    }
}