@font-face {
    font-family: "Roboto3";
    src: url('../fonts/Roboto/Roboto-Regular.ttf');
    src: url('../fonts/Roboto/Roboto-Regular.woff') format('woff'), url('../fonts/Roboto/Roboto-Regular.ttf') format('truetype');
    font-weight: 400; /*normal*/
    font-style: normal;
}
@font-face {
    font-family: "Roboto3";
    src: url('../fonts/Roboto/Roboto-Bold.ttf');
    src: url('../fonts/Roboto/Roboto-Bold.woff') format('woff'), url('../fonts/Roboto/Roboto-Bold.ttf') format('truetype');
    font-weight: 700; /*bold*/
    font-style: normal;
}
@font-face {
    font-family: "Roboto3";
    src: url('../fonts/Roboto/Roboto-Medium.ttf');
    src: url('../fonts/Roboto/Roboto-Medium.woff') format('woff'), url('../fonts/Roboto/Roboto-Medium.ttf') format('truetype');
    font-weight: 500; /*a bit bolder than normal*/
    font-style: normal;
}
@font-face {
    font-family: "Roboto3";
    src: url('../fonts/Roboto/Roboto-Light.ttf');
    src: url('../fonts/Roboto/Roboto-Light.woff') format('woff'), url('../fonts/Roboto/Roboto-Light.ttf') format('truetype');
    font-weight: 300; /*a bit thinner than normal*/
    font-style: normal;
}
html, body{
    font-family: "Roboto3", Calibri, Tahoma, sans-serif;
    /*--second-family: "IBM Plex Sans", sans-serif;*/
    -webkit-font-smoothing: antialiased;
    background: #122D4A; /*main dark blue background*/
    color: #8C9DAF;
}
*{
    outline: none;
    margin: 0;
    padding: 0;
}
:root {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
*,
*::before,
*::after {
    -moz-box-sizing: inherit;
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}
a {
    color: white;
    text-decoration: none;
}
a.curpage {
    color: #99a3b3;/*current page*/
}
input:-webkit-autofill,
input:-webkit-autofill:focus {
  transition: background-color 0s 600000s, color 0s 600000s !important;/*https://stackoverflow.com/questions/61083813/how-to-avoid-internal-autofill-selected-style-to-be-applied*/
}
button, input[type="submit"], input[type="reset"], button {
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;
}
/*STYLED COLORS SECTION - BEGIN*/
label, input[type="text"], input[type="number"], input[type="email"],
.white_btn, input[type="submit"].white_btn, input[type="reset"].white_btn,
#admin_menu_dropdown, #admin_menu_dropdown a, #admin_menu_dropdown a:visited,
#user_menu_dropdown, #user_menu_dropdown a, #user_menu_dropdown a:visited,
#menu_more_dropdown, #menu_more_dropdown a, #menu_more_dropdown a:visited,
.data_wrapper_h1, .popUpMsg, .popUpMsg a,
.ui-datepicker-buttonpane .ui-datepicker-current,
.ui-datepicker-buttonpane .ui-datepicker-close:hover,
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year{
    color: #1a3858; /*text dark blue*/
}
.popUpMsg a {
    text-decoration: underline #1a3858;
}
input[type="radio"], input[type="checkbox"] {
    accent-color: #1a3858; /*text dark blue*/
}
.data_wrapper{
    background: #fff; /*modems form background*/
}
input[type="text"].datetm_ui, input[type="text"].datetm_ui2,
input[type="text"].datetm_ui3, input[type="email"].datetm_ui,
input[type="email"].datetm_ui2, input[type="email"].datetm_ui3,
.datetm_ui3, .datetm_ui, .datetm_ui2, .data_wrapper_h2,
.select_ui, .select_ui2, .select_ui3, .link_back,
.ui-datepicker-calendar th{
    color: #747c84 !important; /*table header grey*/
}
.license_info, .license_info > a, #user_name,
input[type="number"]:disabled, input[type="text"]:disabled,
select:disabled, input[type="email"]:disabled{
    color: #99A3B3 !important; /*top menu light grey*/
}
.blue_btn:hover,
.white_btn:not([disabled]):hover,
.blue_btn:not([disabled]):hover,
input[type="submit"]:not([disabled]):hover.white_btn,
input[type="reset"]:not([disabled]):hover.white_btn,
input[type="submit"]:not([disabled]):hover.blue_btn,
input[type="reset"]:not([disabled]):hover.blue_btn{
    background: #334F72;/*lighet blue - hover buttons*/
}
.white_btn:not([disabled]):hover,
input[type="submit"]:not([disabled]):hover.white_btn,
input[type="reset"]:not([disabled]):hover.white_btn{
    color: white !important;
}
.blue_btn, input[type="submit"].blue_btn,
.ui-datepicker-buttonpane .ui-datepicker-close{
    background: #1a3858; /*background dark blue*/
}
.blue_btn, input[type="submit"].blue_btn,
input[type="reset"].blue_btn, .row_h .blue_btn{
    border: 1px solid #1a3858;
    color: white !important;
}
.white_btn, input[type="submit"].white_btn,
input[type="reset"].white_btn{
    border: 1px solid #a3afbc;
}
.ui-datepicker-buttonpane .ui-datepicker-close{
    border: 1px solid #1a3858;/*background dark blue*/
}
#admin_menu_dropdown div.menu_delimiter,
#user_menu_dropdown div.menu_delimiter{
    border-bottom: 1px solid #1a3858;/*background dark blue*/
}
.lang_sel a, .lang_sel a:visited {
    color: white;
}
.lang_sel:hover {
    background: #657b95;
}
.exit, .exit a {
    color: #f84c5c; /*Exit text color*/
}
.red_text {
    color: #f84c5c; /*same as exit text color used for license highlighting*/
}
.exit:hover, .exit a:hover {
    color: #e4717c; /*Exit text hover color*/
}
input[type="number"], input[type="text"], input[type="email"], select, textarea {
    display: inline-block;
    padding: 8px;
    border: 1px solid #cfd5da;
    border-radius: 4px;
}
input[type="number"].error, input[type="text"].error, input[type="email"].error, select.error {
    border: 1px solid #93232e;/*error red border*/
}
.err_div {
    background: #93232e; /*dark red error background*/
}
.err_div a:visited {
    color: #e48790;
    text-decoration: underline dotted #e48790;
}
.ui-datepicker-calendar .ui-state-default.ui-state-active.ui-state-highlight {
    color: #213953; /*calendar colors*/
    background: #a3afbc;
}
.ui-datepicker-calendar .ui-state-default {
    color: #213953;
}
.ui-datepicker-calendar .ui-state-default.ui-state-active {
    color: white;
}
.ui-datepicker-buttonpane .ui-datepicker-current{
    border: 1px solid #a3afbc;
}
.ui-datepicker-buttonpane .ui-datepicker-close:hover {
    background: white;
}
/*STYLED COLORS SECTION - END*/
.main_col {
    position: relative;
    width: 1232px;
    padding: 0 16px;
    margin: 0 auto;
    color: white;
}
.main_logo {
    padding-top: 20px;
}
.main_logo a {
    display: inline-block;
    width: 134px;
    height: 38px;
    overflow: hidden;
    background: url(../img/logo_with_white_text.svg);
    background-position: left;
}
.lang_sel{
    position: absolute;
    top: 26px;
    right: 16px;
    border-radius: 4px;
    width: 28px;
    height: 26px;
    background: rgba(255, 255, 255, 0.1);   
}
.lang_sel a {
    font-weight: 400;
    font-size: 14px;
    position: absolute;
    box-sizing: content-box;
    display: block;
    text-align: center;
    padding: 3px 5px;
    width: 18px;
    height: 20px;
}
.err_div {
    border-radius: 10px;
    margin-top: 20px;
    padding: 18px 30px;
}
.err_div a {
    color: white;
    text-decoration: underline dotted white;
}
.top_menu_right {
    display: inline-block;
    position: absolute;
    top: 26px;
    right: 74px;
}
.top_menu_left {
    display: inline-block;
    position: absolute;
    top: 26px;
    left: 200px;
}
.top_menu_right *, .top_menu_left * {
    font-size: 14px;
    letter-spacing: .04rem;
}
.top_menu_right > span {
    margin-left: 10px;
}
.exit, .exit a {
    cursor: pointer;
}
.exit .exit_icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    background: url(../img/icons.svg);
    background-position: -72px -96px;
}
.exit:hover .exit_icon {
    background-position: -96px -96px;
}
.link_back {
    display: block;
    margin-bottom: 16px;
}
.lb_icon {
    display: inline-block;
    vertical-align: text-bottom;
    width: 16px;
    height: 16px;
    background: url(../img/icons.svg);
    background-position: -120px -120px;
}
.lb_text {
    display: inline-block;
    height: 16px;
    font-size: 14px;
    line-height: 16px;
    margin-left: 6px;
    vertical-align: middle;
}
#user_name {
    position: relative;
    z-index: 1;
}
.top_menu_left.admin > span,
.top_menu_left.user > span{
    margin-right: 16px;
    display: inline;
}
.top_menu_left > span#admin_menu_list,
.top_menu_left > span#user_menu_list{
    display: none;
    position: relative;
    cursor: pointer;
    width: 44px;
    height: 44px;
    margin-right: 0;
    background: url(../img/icons.svg);
    background-position: -24px -144px;
    overflow: visible;
}
#admin_menu_dropdown, #menu_more_dropdown, #user_menu_dropdown {
    cursor: auto;
    font-weight: 500;
    font-size: 18px;
    background: white;
    top: 34px;
    width: 250px;
    padding: 20px;
    border-radius: 8px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    z-index: 101;
}
#admin_menu_dropdown, #user_menu_dropdown {
    position: relative;
}
#menu_more_dropdown {
    left: 0;
    position: absolute;
}
#admin_menu_dropdown div,
#user_menu_dropdown div,
#menu_more_dropdown div{
    margin-top: 8px;
}
#admin_menu_dropdown div.menu_delimiter,
#user_menu_dropdown div.menu_delimiter{
    margin-top: 0;
    height: 12px;
    width: 100%;
}
#admin_menu_list > #admin_menu_dropdown,
#user_menu_list > #user_menu_dropdown,
.menu_more > #menu_more_dropdown{
    display: none;
}
#admin_menu_list:hover > #admin_menu_dropdown,
#user_menu_list:hover > #user_menu_dropdown,
.menu_more:hover > #menu_more_dropdown{
    display: inline-block;
}
.data_wrapper_h1 {
    font-weight: 600;
    font-size: 24px;
    margin-bottom: 8px;
}
.data_wrapper_h1.nomargin {
    margin-bottom: 0;
}
.data_wrapper_h1.bigmargin {
    margin-bottom: 23px;
}
.data_wrapper_h2{
    font-weight: 400;
    font-size: 16px;
}
.datetm_lbl {
    font-size: 16px;
    margin-right: 10px;
}
.menu_more {
    position: relative;
    cursor: pointer;
    z-index: 2;
    padding-bottom: 20px;
}
.menu_more > .r_arrow_icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    background: url(../img/icons.svg);
    background-position: -120px -24px;
}
.menu_more:hover > .r_arrow_icon {
    background-position: -120px 0;
}
.data_wrapper{
    position: relative;
    border-radius: 14px;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 24px 30px 30px;
}
input[type="checkbox"] {
    -moz-appearance:none;
    -webkit-appearance:none;
    -o-appearance:none;
    appearance:none;
    width: 19px;/*18*/
    height: 19px;/*18*/
    vertical-align: middle;
    border-radius: 3px;
    margin-right: 8px;
    background: url(../img/icons.svg);
    background-position: -72px -48px;
    margin-bottom: 9px;
    cursor: pointer;
}
input[type="checkbox"] + label{
    display: inline-block;
    height: 18px;
    line-height: 18px;
    vertical-align: middle;
    margin-bottom: 10px;
    cursor: pointer;
}
input[type="checkbox"]:checked {
    background-position: -96px -48px;
}
input[type="checkbox"]:disabled {
    background-position: -120px -144px;
    cursor: default;
}
input[type="checkbox"]:checked:disabled {
    background-position: -120px -168px;
    cursor: default;
}
.white_btn, .blue_btn,
input[type="submit"].white_btn, input[type="submit"].blue_btn,
input[type="reset"].white_btn, input[type="reset"].blue_btn{
    border-radius: 4px;
    display: inline-block;
    vertical-align: bottom;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.4;
    text-decoration: none;
    cursor: pointer;
}
.white_btn, input[type="submit"].white_btn,
input[type="reset"].white_btn{
    padding: 3px 10px;
}
.blue_btn, input[type="submit"].blue_btn,
input[type="reset"].blue_btn{
    padding: 5px 10px; 
}
.white_btn:disabled, input[type="submit"]:disabled.white_btn,
input[type="reset"]:disabled.white_btn{
    color: #a3afbc;
    cursor: default;
}
.cmn_form label, .cmn_form select {
    margin-right: 8px;
}
.cmn_form label, .cmn_form select,
.cmn_form input[type="text"], .cmn_form input[type="email"], .cmn_form input[type="number"] {
    margin-bottom: 8px;
}
.cmn_form input[type="submit"] {
    margin-right: 4px;
}
.cmn_form input[type="submit"], .cmn_form input[type="reset"] {
    margin-bottom: 8px;
}
.cmn_form #datetm_from_lbl,
.cmn_form #datetm_to_lbl{
    display: inline-block;
    width: 180px;
}
.submit_arch {
    height: 32px;
}
.backPopUp {
    position: fixed;
    background: rgba(0,0,0,0.1);
    display: none;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
}
.backPopUp.visible {
    display: block;
}
.popUpMsg {
    background: white;
    border-radius: 4px;
    box-shadow: rgba(0, 0, 0, 0.35) 0 0 15px;
    padding: 36px;
    width: 650px;
    margin-left: auto;
    margin-right: auto;
    top: 50%;
    position: relative;
     -ms-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
}
.closeCross {
    position: absolute;
    cursor: pointer;
    width: 24px;
    height: 24px;
    top: 8px;
    right: 8px;
    background: url(../img/icons.svg);
    background-position: -72px -144px;
}
.exclIcon {
    width: 32px;
    height: 32px;
    margin: 0 auto 16px;
    background: url(../img/icons.svg);
    background-position: 0 -96px;
}
.msgText {
    text-align: center;
    margin-bottom: 24px;
}
.btn_group {
    width: auto;
    display: inline-block;
    position: relative;
    left: 50%;
     -ms-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
/*Start of overwriting standard jQuery styles for the datetimepicker*/
#ui-datepicker-div {
    font-size: 14px;
}
#ui-datepicker-div{
    position: absolute !important;
}
.ui-widget-header .ui-icon.ui-icon-circle-triangle-w,
.ui-widget-header .ui-icon.ui-icon-circle-triangle-e {
    background: url(../img/icons.svg);
}
.ui-widget-header .ui-icon.ui-icon-circle-triangle-w {
    background-position: -120px -72px;
}
.ui-widget-header .ui-icon.ui-icon-circle-triangle-e {
    background-position: -120px -96px;
}
.ui-widget-header{
    border-top: hidden;
    border-left: hidden;
    border-right: hidden;
}
.ui-datepicker-calendar th {
    font-weight: 400;
}
.ui-datepicker-calendar .ui-state-default {
    border: none;
    padding-right: 9px;
}
.ui_tpicker_hour_label, .ui_tpicker_minute_label {
    line-height: 2em;
}
.ui_tpicker_hour_slider .ui-spinner-input,
.ui_tpicker_minute_slider .ui-spinner-input{
    margin-top: 0.04em;
    margin-bottom: 0.04em;
}
.ui-spinner-button {
    width: 16px;
}
.ui-datepicker .ui-icon {
    left: .5em;
    top: .4em;
}
.ui-datepicker-buttonpane .ui-datepicker-current{
    opacity: 1;
}
.ui-datepicker-buttonpane .ui-datepicker-close {
    font-weight: 400;
    color: white;
}
.ui-datepicker select.ui-datepicker-month {
    padding: 2px;
    width: 54%;
}
.ui-datepicker select.ui-datepicker-year {
    padding: 2px;
    width: 36%;
}
/*End of overwriting standard jQuery styles for the datetimepicker*/
@media screen and (max-width: 1248px) {
  .main_col {
    width: 100%;
    min-width: 375px;
  }
}
@media screen and (max-width: 1080px) { /*apply mobile version to top menu*/
    .top_menu_left.admin > span {
        display: none;
    }
    .top_menu_left > span#admin_menu_list {
        display: inline-block;
    }
    .top_menu_left.user > span {
        display: none;
    }
    .top_menu_left > span#user_menu_list {
        display: inline-block;
    }
}
@media screen and (max-width: 812px) { /*apply mobile version style form paddings*/
  .err_div {
    padding: 24px 16px;
  }
  .data_wrapper {
    padding: 24px 0;
  }
  .data_wrapper_h1, .data_wrapper_h2, .link_back {
    margin-left: 16px;
  }
  .cmn_form {
    padding: 0 8px 0 16px;
  }
  .cmn_form.igmarg {
    padding: 0;
  }
}
@media screen and (max-width: 700px) {
    .popUpMsg {
        margin-left: 16px;
        margin-right: 16px;
        width: -webkit-calc(100% - 32px);
        width:    -moz-calc(100% - 32px);
        width:         calc(100% - 32px);
    }
}
@media screen and (max-width: 655px) {/*apply mobile version to table headers*/
    .data_wrapper_h1 {
        display: inline-block;
        width: auto;
    }
    /*remove table display from column select table*/
    .datetm_lbl {
        display: inline-block;
    }
    .datetm_lbl {
        width: 19px;
    }
    .EN > .datetm_lbl {
        width: 32px;
    }
    .datetm_ui2 {
        width: -webkit-calc(100% - 49px);
        width:    -moz-calc(100% - 49px);
        width:         calc(100% - 49px);
    }
    .datetm_ui3 {
        width: -webkit-calc(100% - 200px);
        width:    -moz-calc(100% - 200px);
        width:         calc(100% - 200px);
    }
    .EN > .datetm_ui2 {
        width: -webkit-calc(100% - 62px);
        width:    -moz-calc(100% - 62px);
        width:         calc(100% - 62px);
    }
    .select_ui {
        width: -webkit-calc(100% - 106px);
        width:    -moz-calc(100% - 106px);
        width:         calc(100% - 106px);
    }
    .select_ui2 {
        width: -webkit-calc(100% - 134px);
        width:    -moz-calc(100% - 134px);
        width:         calc(100% - 134px);
    }
    .data_wrapper_h1.bigmargin {
        margin-bottom: 16px;
    }
}
@media screen and (max-width: 630px) {/*mobile version*/
   .main_logo a {
        width: 38px;
    }
    .top_menu_left {
        left: 80px;
    }
    .data_wrapper{
        padding-bottom: 12px;
    }
    .data_wrapper_h1 {
        font-size: 18px;
    }
    .data_wrapper_h2 {
        font-size: 14px;
    }
}
@media screen and (max-width: 468px) {/*mobile version the thinniest for excel reports*/
    .datetm_ui3 {
        width: -webkit-calc(100% - 8px);
        width:    -moz-calc(100% - 8px);
        width:         calc(100% - 8px);
    }
    .cmn_form label {
        display: inline-block;
        margin-bottom: 8px;
    }
}