html {
        /* This is the only place to change the base font-size!!! */
        font-size: 0.75rem;
        background-color: #dcedfe;
}
/*
BODY {
        /* Watch it, make no changes here. rather try BODY.default.
         * Changes here will count for ALL pages
         * including dialogs. * /
}
*/
BODY.default {
        /* The default body layout */
        font-family: Arial, Helvetica, sans-serif;
        color: #002f60;
        background-color: #eee;
        /*      margin: 10 0 10 0;*/
        /*	background-image: url(images/bg.jpg);*/
        background-repeat: repeat;
}

BODY.iframe {
        /* The iframe body */
        background-color: #dcedfe;
}
.select2-selection {
        background-color: #dcedfe !important;
        border-top-right-radius: .375rem !important;
        border-bottom-right-radius: .375rem !important;
}
.select2-selection:disabled,
.select2-selection[readonly] {
        background-color: #97c9fc !important;
        color: rgb(75, 75, 75) !important;
}
.select2-selection:hover {
        background-color: #97c9fc !important;
        cursor: pointer !important;
}

SELECT:disabled,
INPUT:disabled,
TEXTAREA:disabled,
SELECT[readonly],
INPUT[readonly],
TEXTAREA[readonly] {
        background-color: #97c9fc;
        background-color: #dcedfe;
        color: rgb(75, 75, 75);
}

INPUT[type=text]:hover,
[type=password]:hover,
[type=search]:hover,
[type=date]:hover,
SELECT:hover {
        background-color: #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;
	line-height: normal;
	font-weight: normal;
	font-size: small;
	font-style: normal;
}

TABLE.ctable>thead>tr>th,
TABLE.ctable>thead>tr>td {
        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.5rem;
}

.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;
        background: rgba(128, 128, 128, 30%);
        backdrop-filter: blur(5px);
        background-size: cover;
        overflow-y: hidden !important;
        overflow-x: hidden !important;
        /*background: center no-repeat #ddd;*/
}

/*DIV.load_container_logo::before,*/
DIV.load_container_logo {
        position: absolute;
        left: 0px;
        top: 0px;
        z-index: 9998;
        height: 100%;
        width: 100%;
        text-align: center;
        background: url(/images/isologo.png) center no-repeat;
        pointer-events: none;
        mix-blend-mode: hard-light;
        animation: pulsate 1.5s ease-in-out infinite;
        -webkit-animation: pulsate 1.5s ease-in-out infinite;
}

@keyframes pulsate {
        0% {
                transform: scale(0.3);
        }

        50% {
                transform: scale(0.6);
        }

        100% {
                transform: scale(0.3);
        }
}

@-webkit-keyframes pulsate {
        0% {
                -webkit-transform: scale(0.3);
        }

        50% {
                -webkit-transform: scale(0.6);
        }

        100% {
                -webkit-transform: scale(0.3);
        }
}

.avatar {
        vertical-align: middle;
        width: 45px;
        height: 45px;
        border-radius: 50%;
}

h1.dropdown-header {
        color: white;
}

.btn-image:before {
        content: "";
        width: 21px;
        height: 21px;
        display: inline-block;
        margin-right: 10px;
        vertical-align: text-top;
        background-color: transparent;
        background-position: center center;
        background-repeat: no-repeat;
}

.g-button:before {
        background: url(images/g-normal.png) transparent -5px 50% no-repeat;
}

.g-button {
        background-color: white;
}

span.g-button-text {
        display: inline-block;
        vertical-align: middle;
        color: grey;
        font-size: 14px;
        font-weight: bold;
        /* Use the Roboto font that is loaded in the <head> */
        font-family: 'Roboto', sans-serif;
}

.btn-outline-dark:not(:disabled):not(.disabled).active:hover {
        color: white;
        background-color: #97c9fc;
}

.notification {
        /*  background-color: #555;
  color: white;
  text-decoration: none;*/
        padding-right: 40px;
        /*  position: relative;
  display: inline-block;
  border-radius: 2px;*/
}

/*.notification:hover {
  background: blue;
}*/

.notification .badge {
        position: absolute;
        top: 4px;
        right: 4px;
        padding: 5px 5px;
        border: 1px solid grey;
        border-radius: 50%;
        background: #dcedfe;
        color: black;
}

.notification .on {
        background: #97c9fc;
}

.notification .off {
        background: grey;
}

/*.switch {
  position: relative;
  display: inline-block;
  width: 90px;
  height: 34px;
}

.switch input {display:none;}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ca2222;
  -webkit-transition: .4s;
  transition: .4s;
   border-radius: 34px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 50%;
}
*/
/*
input:checked + .slider {
  background-color: #2ab934;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(55px);
}
*/
/*------ ADDED CSS ---------*/
.slider:after {
        content: attr(data-off);
        color: black;
        /* display: block;
 position: absolute;
 transform: translate(-50%,-50%);
 top: 50%;
 left: 50%;*/
}

input:checked+.slider:after {
        content: attr(data-on);
}

.wpo365-mssignin-wrapper {
	background-color: #FAFCFD;
        box-sizing: border-box;
        display: block;
        width: 100%;
        text-align: center;
}

.wpo365-mssignin-spacearound {
        display: inline-block;
}

.wpo365-mssignin-wrapper form {
        display: none;
}

.wpo365-mssignin-button {
        border: 1px solid #8c8c8c;
        border: 1px solid #dadce0;
        background: #ffffff;
	-webkit-transition: background-color .218s,border-color .218s;
	transition: background-color .218s,border-color .218s;
        display: flex;
        display: -webkit-box;
        display: -moz-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        -webkit-box-align: center;
        -moz-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
        -webkit-box-pack: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        cursor: pointer;
        max-height: 41px;
        min-height: 40px;
        -webkit-border-radius: 4px;
        border-radius: 4px;
        height: 40px;
}

a.wpo365-mssignin-button.wpo365 {
	text-decoration: none;
	color: inherit;
}

.wpo365-mssignin-button:hover, .wpo365-mssignin-button:focus {
	-webkit-box-shadow: none;
	box-shadow: none;
	background: rgba(66,133,244,.04);
	border-color: #d2e3fc;
	outline: none;
}

.wpo365-mssignin-button:active {
	background: rgba(66, 133, 244, .1)
}

.wpo365-mssignin-logo {
        padding-left: 12px;
        padding-right: 6px;
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        flex-shrink: 1;
        width: 21px;
        height: 21px;
        box-sizing: content-box;
        display: flex;
        display: -webkit-box;
        display: -moz-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        -webkit-box-pack: center;
        -moz-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
}

.wpo365-mssignin-label {
        padding-left: 6px;
        padding-right: 12px;
        font-weight: 400;
        color: #5e5e5e;
        font-family: "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif;
        font-size: 15px;
        -webkit-flex-shrink: 1;
        -moz-flex-shrink: 1;
        flex-shrink: 1;
        height: 21px;
        line-height: 21px;
}


