@font-face {
   font-family: 'OpenSans';
   src: url('/fonts/open_sans/OpenSans-Regular.woff2') format('woff2'), url('/fonts/open_sans/OpenSans-Regular.woff') format('woff'), url('/fonts/open_sans/OpenSans-Regular.ttf') format('truetype');
   font-weight: normal;
   font-style: normal;

}

@font-face {
  font-family: 'OpenSans';
  src: url('/fonts/open_sans/OpenSans-Semibold.woff2') format('woff2'), url('/fonts/open_sans/OpenSans-Semibold.woff') format('woff'), url('/fonts/open_sans/OpenSans-Semibold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}

:root {
   /* COLOURS */
   --main_colour: #3B4557;
   --darker_shade_1: #2F3746;
   --darker_shade_2: #242c3b;
   --lighter_shade_1: #454f63;
   --lighter_shade_2: #5c667a;
   --lighter_shade_3: #778092;
   --lighter_shade_4: #9199a8;
   --lighter_shade_5: #b3bac7;
   --lightest_shade_1: #e6e9ef; /* lightest colour */
   --lightest_shade_2:  #D7E1ED;
   --light_transparent: #3B455714;

   /* GENERAL */
   --icon: var(--main_colour);
   --icon_grey: #4f4f4f;
   --icon_green: #4EC66A;
   --icon_amber: #FF8B2B;
   --icon_red: #F46464;
   --font: #101010; /* e.g base font colour */
   --font_grey: #4f4f4f; /* e.g grey font colour */
   --font_link: #207bbf;
   --font_link_hover: #00233c;
   --box_shadow: 0px 0px 10px #00000029;
   --popup_box_shadow: 3px 3px 10px rgba(0,0,0,0.3);
   --popup_image_colour_1: var(--main_colour);
   --popup_image_colour_2: var(--lighter_shade_4);
   --popup_image_colour_3: var(--lighter_shade_5);
   --scrollbar_thumb: #b4b4b4;
   --scrollbar_thumb_hover: #909090;
   --scrollbar_track: #e6e6e6;
   --font_family: 'OpenSans', 'Open Sans', Tahoma, Verdana, Helvetica, Arial, sans-serif;

   /* NAVIGATOR */
   --navigator_gradient1: var(--main_colour);
   --navigator_gradient2: var(--darker_shade_1);
   --navigator_font: #FFFFFF;
   --navigator_image_overlay: url(/images/navigator_bg_style_curves.svg); /* e.g light curves image overlayed on navigator */
   --navigator_hover: rgba(0, 0, 0, 0.2); /* e.g hovering over items in navigator */
   --navigator_selected: rgba(255, 255, 255, 0.1); /* e.g current page item highlighted in navigator */
   --navigator_skeleton_loader_gradient: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0));
   --navigator_skeleton_loader_background: #00000044;
   --navigator_show_button: #454E5D;

   /* NON THEME SPECIFIC: */
   --budget_sticky_1-left: 0px; /*Using var here on budget sticky to prevent massive for loops*/
   --budget_sticky_2-left: 73px;
   --budget_sticky_3-left: 113px;
   --budget_sticky_4-left: 203px;
   --budget_sticky_5-left: 261px;
   --selected_column-position: relative;
}

.theme_background {
   background-color: var(--main_colour);
}

.theme_light_background {
   background-color:var(--lightest_shade_1);
}

.theme_color {
   color: var(--main_colour);
}

body {
   font-size:10pt;
   font-family : var(--font_family);
   color:var(--font);
   margin:0px;
   padding:0px;
   background:white;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
 
::-webkit-scrollbar-track {
  /*   -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px; */
   background-color: var(--scrollbar_track);
   display: none;
}
 
::-webkit-scrollbar-thumb {
   /*  border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);  */
   background-color: var(--scrollbar_thumb);
   border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
   background-color: var(--scrollbar_thumb_hover);
}


html>body {
   width:auto;
/*   min-width:1000px; */
   min-height: 100vh;
   background: #f9f9f9;
}

a {
   text-decoration:none;
   color: var(--font_link);
}

a:hover {
   text-decoration:none;
   color: var(--font_link_hover);
}

.noselect {
   -webkit-user-select: none;
   -moz-user-select: none;
   user-select: none;
}

q:before, q:after {
   display:none;
}

em {
   color:#FF3333;
}

em.green {
   color:#00AA00;
}

textarea {
   vertical-align:top;
   font-family: var(--font_family);
}

legend {
   color: var(--font_grey);
   /* background:#E7F1FB; */
  /*  -webkit-border-radius:6px;
   -moz-border-radius:6px;
   border-radius:6px; */
    padding:5px 10px 5px 10px;
    border: 1px solid transparent;
}

.textonly {
   position:absolute;
   left:-9999px;
}

.disable_animations div,
.disable_animations a,
.disable_animations p,
.disable_animations img,
.disable_animations input,
.disable_animations table,
.disable_animations th,
.disable_animations td,
.disable_animations tr,
.disable_animations h1,
.disable_animations h2,
.disable_animations h3,
.disable_animations ul,
.disable_animations li,
.disable_animations circle,
.disable_animations rect {
   transition: 0s !important;
   animation-duration: 0s !important;
}

.fielderror {
   background:#FFDDDD;
}

.popup input[type="text"].fielderror, .popup .wysiwyg.fielderror, .popup select.fielderror, .popup .listfield.fielderror, .popup textarea.fielderror, .popup input[type="password"].fielderror {
   border-bottom: 1.5px solid #FF0000 !important;
   background-image: url(/images/icons/red/exception.svg);
   background-size: 18px;
   background-repeat: no-repeat;
   background-position: calc(100% - 5px) center;
}

.inline {
   display:inline;
}

.floatright {
   float:right;
   margin-left:10px;
}

.floatleft {
   float:left;
   margin-right:10px;
}

/* .vcentre {
   vertical-align:middle !important;
} */

.centred table {
   margin-left:auto;
   margin-right:auto;
}

.nonvisual {
   position:absolute !important;
   top:-9999px !important;
   left:-9999px !important;
}

.noborder {
   border:none;
}

.clear_both {
   clear:both;
   font-size:0px;
}

.right_align {
   text-align:right !important;
}

.center_align {
   text-align:center !important;
}

.nounderline {
   text-decoration:none;
}

#skiplinks {
   position:absolute;
   left:-9999px;
}

#skiplinks:focus-within {
   position:absolute;
   left:0px;
   top:0px;
   z-index: 100;
   background-color: #ffffff;
   padding: 10px;
   border-radius: 10px;
}

#skiplinks h1 {
   font-size: 1.25em;
   margin-top: 0px;
   margin-bottom: 5px;
}

#never {
   display:none;
}

.pre_div {
   padding:5px;
   width:600px;
   overflow:auto;
   border:1px solid #5555ff;
   background:#bbbbbb;
   height:100px;
}

.pre_div.details_template_code {
   width:100%;
   background:#1E1E1E;
   border:none;
   color: #67CDFE;
}

html>body .pre_div {
   height:auto;
   min-height:100px;
   max-height:400px;
}

.hover_link {
   text-decoration:none;
   color: var(--font_grey);
}

.hover_link:hover {
   text-decoration:underline;
}

#input_error, .inlineedit_input_error {
   color:#FF3333;
   font-weight: bold;
   padding-left: 10px;
}

.watermark {
   position:absolute;
   width:100%;
   height:100%;
   top:-0.5px;
   left:-0.5px;
}

.fullwidth {
   width:100%;
   height:auto;
}

.eightypercent {
   width:80%;
   height:auto;
}

.spacer40px {
   height:40px;
}

/* new icons 2024 */
.psoda_icon {
   vertical-align: middle;
}

.psoda_icon use, .psoda_icon svg g, .psoda_icon svg path, .psoda_icon svg circle, .psoda_icon svg rect {
   fill: var(--icon) !important;
}

.psoda_icon.grey_font_icon use, .psoda_icon.grey_font_icon svg g, .psoda_icon.grey_font_icon svg path, .psoda_icon.grey_font_icon svg circle, .psoda_icon.grey_font_icon svg rect {
   fill: var(--icon_grey) !important;
}

.psoda_icon.white_font_icon use,.psoda_icon.white_font_icon svg g, .psoda_icon.white_font_icon svg path, .psoda_icon.white_font_icon svg circle, .psoda_icon.white_font_icon svg rect {
   fill: #ffffff !important;
}

.psoda_icon.red_font_icon use,.psoda_icon.red_font_icon svg g, .psoda_icon.red_font_icon svg path, .psoda_icon.red_font_icon svg circle, .psoda_icon.red_font_icon svg rect {
   fill: var(--icon_red) !important;
}

.psoda_icon.amber_font_icon use,.psoda_icon.amber_font_icon svg g, .psoda_icon.amber_font_icon svg path, .psoda_icon.amber_font_icon svg circle, .psoda_icon.amber_font_icon svg rect {
   fill: var(--icon_amber) !important;
}

.psoda_icon.green_font_icon use,.psoda_icon.green_font_icon svg g, .psoda_icon.green_font_icon svg path, .psoda_icon.green_font_icon svg circle, .psoda_icon.green_font_icon svg rect {
   fill: var(--icon_green) !important;
}

.photo_thumbnail {
   border:transparent;
   -webkit-border-radius:50%;
   -moz-border-radius:50%;
   border-radius:50%;
    vertical-align:middle;
}

.photo_letters {
   display: inline-block;
   color: #ffffff;
   /* vertical-align: middle; */
   text-align: center;
   border-radius: 50%;
   background: #DD1D47;
   font-weight: bold;
}

.photo_letter_A {
   background: #DD1D47;
}

.org_chart_user_letter_A {
   fill: #DD1D47;
}

.photo_letter_B {
   background: #F43D3D;
}

.org_chart_user_letter_B {
   fill: #F43D3D;
}

.photo_letter_C {
   background: #E55C5C;
}

.org_chart_user_letter_C {
   fill: #E55C5C;
}

.photo_letter_D {
   background: #F98D73;
}

.org_chart_user_letter_D {
   fill: #F98D73;
}

.photo_letter_C {
   background: #FC7F4F;
}

.org_chart_user_letter_E {
   fill: #FC7F4F;
}

.photo_letter_F {
   background: #FFA42C;
}

.org_chart_user_letter_F {
   fill: #FFA42C;
}

.photo_letter_G {
   background: #EAC734;
}

.org_chart_user_letter_G {
   fill: #EAC734;
}

.photo_letter_H {
   background: #B9DB3B;
}

.org_chart_user_letter_H {
   fill: #B9DB3B;
}

.photo_letter_I {
   background: #72D86A;
}

.org_chart_user_letter_I {
   fill: #72D86A;
}

.photo_letter_J {
   background: #3CBC45;
}

.org_chart_user_letter_J {
   fill: #3CBC45;
}

.photo_letter_K {
   background: #0CA874;
}

.org_chart_user_letter_K {
   fill: #0CA874;
}

.photo_letter_L {
   background: #20D3BD;
}

.org_chart_user_letter_L {
   fill: #20D3BD;
}

.photo_letter_M {
   background: #2FBFE0;
}

.org_chart_user_letter_M {
   fill: #2FBFE0;
}

.photo_letter_N {
   background: #3596E5;
}

.org_chart_user_letter_N {
   fill: #3596E5;
}

.photo_letter_O {
   background: #78B0F4;
}

.org_chart_user_letter_O {
   fill: #78B0F4;
}

.photo_letter_P {
   background: #467BF2;
}

.org_chart_user_letter_P {
   fill: #467BF2;
}

.photo_letter_Q {
   background: #5050D8;
}

.org_chart_user_letter_Q {
   fill: #5050D8;
}

.photo_letter_R {
   background: #7A4DE8;
}

.org_chart_user_letter_R {
   fill: #7A4DE8;
}

.photo_letter_S {
   background: #C185E8;
}

.org_chart_user_letter_S {
   fill: #C185E8;
}

.photo_letter_T {
   background: #C666DD;
}

.org_chart_user_letter_T {
   fill: #C666DD;
}

.photo_letter_U {
   background: #AF3EB5;
}

.org_chart_user_letter_U {
   fill: #AF3EB5;
}

.photo_letter_V {
   background: #8E3379;
}

.org_chart_user_letter_V {
   fill: #8E3379;
}

.photo_letter_W {
   background: #93245C;
}

.org_chart_user_letter_W {
   fill: #93245C;
}

.photo_letter_X {
   background: #ED4897;
}

.org_chart_user_letter_X {
   fill: #ED4897;
}

.photo_letter_Y {
   background: #FF7BA7;
}

.org_chart_user_letter_Y {
   fill: #FF7BA7;
}

.photo_letter_Z {
   background: #EF5076;
}

.org_chart_user_letter_Z {
   fill: #EF5076;
}


/*********/
/* GANTT */
/*********/
.gantt {
   overflow:auto;
   width:auto;
   position:relative;
}

.gantt_tree_controls {
    position: absolute;
    top: 95px;
    left: 19px;
    width: 150px;
}

.gantt_tree_controls>.displaylist_tree_clip_odd {
    height: 24px;
   position:relative;
   overflow:hidden;
}

.gantt_tree_controls>.displaylist_tree_clip_even {
    height: 21px;
   position:relative;
   overflow:hidden;
}

.gantt_tree_controls .displaylist_tree_div use {
	fill: var(--main_colour) !important;
}

#gantt_div {
   position:relative;
   margin-top: 5px;
}

#gantt_div.loading{
	opacity: 0.5;
}

.gantt_wait {
   cursor:wait;
   background:#FFBBBB;
   border:1px solid #FF5555;
}

.gantt_error {
   background:#FF0000;
   border:1px solid #880000;
}

#table_div_clip {
   position:absolute;
   overflow:hidden;
   border:1px solid #BBBBBB;
}

#table_div {
   position:relative;
   overflow:hidden;
   width:5000px;
}

#gantt_div input {
   border:1px solid #BBBBBB;
   position:absolute;
   -webkit-border-radius:0px;
   -moz-border-radius:0px;
   border-radius:0px;
   padding:0px 5px;
}

.options_fieldset {
   border:1px solid #eaeaea;
   /* -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px; */
   width:300px;
   float:left;
   margin-top:10px;
   margin-right:10px;
}

.tooltip {
   cursor:help;
}

input[type="text"] {
   border:1px solid #eaeaea;
   /* -webkit-border-radius:6px;
   -moz-border-radius:6px;
   border-radius:6px; */
    max-width:450px;
    padding: 5px;
   font-family: var(--font_family);
}

input[type="password"] {
   border:1px solid #eaeaea;
  /*  -webkit-border-radius:6px;
   -moz-border-radius:6px;
   border-radius:6px; */
   font-family: var(--font_family);
}

input[type="number"] {
	border:1px solid #eaeaea;
	max-width:115px;
	padding: 5px;
   font-family: var(--font_family);
	text-align: right;
}

input[type="text"]:disabled {
   background: #eaeaea !important;
    color: #aaaaaa !important;
}

.popup input[type="text"]:disabled, .popup textarea:disabled, .popup input[type="password"]:disabled {
   background: #eaeaea !important;
   color: #aaaaaa !important;
   border: none;
   padding: 5px;
   border-radius: 5px;
}

input[type="checkbox"]:disabled + .fancyCheckbox {
   background-color: #f9f9f9 !important;
   border: 1px solid #eaeaea !important;
   color: #f9f9f9 !important;
}

input[type="checkbox"]:checked:disabled + .fancyCheckbox {
   background-color: #eaeaea !important;
   color: #aaaaaa !important;
}

input[type="submit"]:disabled {
   background: #eaeaea !important;
   color:#888888 !important;
}

input[type="text"]:focus {
   background:#f9f9f9;
}

input[type="password"]:disabled {
   background: #eaeaea;
}

input[type="password"]:focus {
   background:#f9f9f9;
}


/** checkboxes **/
.checkboxcontainer {
   position:relative;
   width: 14px;
   height: 14px;
   display: inline-block;
   margin-right: 10px;
}

/** when UNchecked **/

.checkboxcontainer input[type="checkbox"] {
   position:absolute;
   top:-6px;
   left:-6px;
   z-index:1;
   opacity:0;
   width: 24px;
   height: 24px;
}

.checkboxcontainer input[type="checkbox"] + .fancyCheckbox {
    position: absolute;
    top:3px;
    left:3px;
    background-color: #ffffff;
    border: 1px solid var(--main_colour);
    color: #ffffff;
    font-size: 10.5px;
    width: 10px;
    height: 10px;
    padding-top: 0px;
    padding-bottom: 4px;
    padding-left: 2px;
    padding-right: 2px;
    margin-top: -1px;
    text-align: center;
    margin-left: -1px;
   font-weight: bold;
   border-radius: 2px;
}

/** when checked **/
.checkboxcontainer input[type="checkbox"]:checked + .fancyCheckbox {
    position: absolute;
    background-color: var(--main_colour);
    border: 1px solid var(--main_colour);
    color: white;
    font-size: 10.5px;
    width: 10px;
    height: 10px;
    padding-top: 0px;
    padding-bottom: 4px;
    padding-left: 2px;
    padding-right: 2px;
    margin-top: -1px;
    text-align: center;
    margin-left: -1px;
}

/** when UNchecked hover **/
.checkboxcontainer input[type="checkbox"]:focus + .fancyCheckbox,
.checkboxcontainer input[type="checkbox"]:hover + .fancyCheckbox {
    position: absolute;
    background-color: #eaeaea;
    color: #eaeaea;
    font-size: 10.5px;
    width: 10px;
    height: 10px;
    padding-top: 0px;
    padding-bottom: 4px;
    padding-left: 2px;
    padding-right: 2px;
    margin-top: -1px;
    text-align: center;
    margin-left: -1px;
}

/** when checked hover **/
.checkboxcontainer input[type="checkbox"]:checked:focus + .fancyCheckbox,
.checkboxcontainer input[type="checkbox"]:checked:hover + .fancyCheckbox {
    position: absolute;
    background-color: var(--lighter_shade_1);
    color: white;
    font-size: 10.5px;
    width: 10px;
    height: 10px;
    padding-top: 0px;
    padding-bottom: 4px;
    padding-left: 2px;
    padding-right: 2px;
    margin-top: -1px;
    text-align: center;
    margin-left: -1px;
}

.memberselect-checkbox.checked .inner-memberselect-checkbox {
   background-color: var(--lighter_shade_1);
   border: 1px solid var(--lighter_shade_1);
}


#userpreferences__keep_alive:hover input ~ #userpreferences__keep_aliveerror {
    background-color: #CF2B1F;
}





.wysiwyg, .listfield {
   border: 1px solid #eaeaea;
 /*   -webkit-border-radius:6px;
   -moz-border-radius:6px;
   border-radius:6px; */
   overflow:auto;
   padding: 5px;
}

.wysiwyg_buttons, .listfield_buttons {
    border-left: 1px solid #eaeaea;
    margin-top: 5px;
    padding: 3px;
    border-top: 1px solid #eaeaea;
    border-right: 1px solid #eaeaea;
    /* -webkit-border-radius: 6px 6px 0px 0px; */
/*     -moz-border-radius: 6px 6px 0px 0px; */
    /* border-radius: 6px 6px 0px 0px; */
    height: 21px;
    margin-left: 10px;
    background: #ffffff;
    border-radius: 5px;
}

.wysiwyg_buttons img {
   padding: 6px;
   margin-right: 0 !important;
}

.listfield_buttons img {
   padding: 3px;
   margin-left: 2px !important;
   margin-right: 2px !important;
}

/* .wysiwyg_buttons img:hover {
background-color: #eaeaea;
} */

.wysiwyg_button_div .psoda_icon {
	vertical-align: top;
}

.wysiwyg_button_div .psoda_icon svg {
	padding: 4px;
}

.wysiwyg_button_div:hover, .listfield_button_div:hover{
   background-color: #eaeaea;
}

.wysiwyg_button_div, .listfield_button_div {
   display: inline-block;
   height: 24px;
   width: 24px;
   border-radius: 5px;
}

.wysiwyg_button_div_color .psoda_icon svg {
   width: 12px;
   height: 12px;
   margin-bottom: 0px;
   margin-left: 2px;
}

.wysiwyg_selected_format {
   background: #cccccc;
}

.wysiwyg_font_color_underline, .wysiwyg_highlight_color_underline {
   margin: auto;
   margin-top: -7px;
   width: 12px;
   text-align: center;
   height: 2px;
}

.wysiwyg_font_color_underline {
   background-color: #6b50ef;
}

.wysiwyg_highlight_color_underline {
   background-color: #f7ac63;
}

.wysiwyg_textonly + .wysiwyg_buttons .wysiwyg_button_div {
	opacity: .5;
	pointer-events: none;
}

.wysiwyg_textonly + .wysiwyg_buttons .wysiwyg_textonly_button_div, .wysiwyg_button_div.wysiwyg_button_active {
	opacity: 1;
	pointer-events: auto;
	background-color: var(--main_colour);
}

.wysiwyg_textonly + .wysiwyg_buttons .wysiwyg_textonly_button_div .psoda_icon svg use, .wysiwyg_button_div.wysiwyg_button_active .psoda_icon svg use {
	fill: #FFFFFF !important;
}

/*wysiwyg picker*/
.wysiwyg_picker_container::-webkit-scrollbar {
   width: 5px;
   height: 5px;
}

.wysiwyg_picker_container {
   position: absolute;
   /* height: 200px; */
   width: 215px;
   padding: 10px;
   background: #fff;
   box-shadow: 0px 0px 10px rgb(0 0 0 / 30%);
   z-index: 10000;
   max-height: 200px;
   overflow: auto;
   border-radius: 5px;
}

.wysiwyg_picker_color {
   width: 24px;
   height: 24px;
   margin: 3px;
   display: inline-block;
   border-radius: 3px;
   cursor: pointer;
   vertical-align: middle;
}

.wysiwyg_picker_color_white {
   border: 1px solid #cccccc;
   width: 22px;
   height: 22px;
}

.wysiwyg_picker_color:hover {
   opacity: .8;
}

.wysiwyg_default_color_container {
   width: 100%;
   border-bottom: 1px solid #eaeaea;
   margin-bottom: 10px;
   padding-bottom: 10px;
   text-align: center;
   cursor: pointer;
}

.wysiwyg_default_color_container:hover {
   opacity: .8;
}

.wysiwyg_picker_container .link_label_input, .wysiwyg_picker_container .link_url_input {
   background-color: #f7f7f7;
   border: 1px solid #eaeaea;
   border-radius: 3px;
   padding: 5px;
   margin-bottom: 5px;
   font-family: var(--font_family);
   width: 160px;
}

.wysiwyg_default_color_label {
   display: inline-block;
   vertical-align: middle;
   padding-left: 5px;
}

.wysiwyg_link_insert {
   color: #ffffff;
   width: 75px;
   text-align: center;
   padding: 3px;
   border-radius: 3px;
   cursor: pointer;
   margin-left: calc(50% - 37.5px);
   margin-top: 5px;
}


m {
	background: #e6e6e6;
	border-radius:5px;
	padding-left:5px;
	padding-right:5px;
	font-weight: bold;
}


.mention_menu_item {
	cursor:pointer;
	border-radius:5px;
	padding:5px;
}


.mention_no_items {
	display: flex;
	align-items: center;
	padding:3px;
	text-align:center;
}


.mention_menu_container {
	width:200px;
	max-height:310px;
	overflow-y:auto;
	position:fixed;
	background:#FFFFFF;
	z-index:10000000;
	padding:5px;
	border-radius:5px;
	box-shadow: 3px 3px 10px rgba(0,0,0,0.3);
}


.mention_hover {
   background-color: #e6e6e6;
}

.emoji_filter_input {
   width: calc(100% - 10px);
   background-color: #f7f7f7;
   border: 1px solid #eaeaea;
   border-radius: 3px;
   padding: 5px;
   margin-bottom: 5px;
   font-family: var(--font_family);
}

.wysiwyg_picker_emoji {
   width: 30px;
   height: 30px;
   margin: 3px;
   display: inline-block;
   border-radius: 3px;
   cursor: pointer;
   vertical-align: middle;
   background-size: 30px;
}

#text_only_wysiwyg_paste_outer {
	position: absolute;
	z-index: 1000;
	background: #ffffff;
	padding: 5px;
	box-shadow: var(--box_shadow);
	border-radius: 5px;
	width: 105px;
	cursor: pointer;
}

#text_only_wysiwyg_paste_outer:hover {
	background: #f7f7f7;
}

#text_only_wysiwyg_paste {
	position: absolute;
	left: 0px;
	top: 0;
	height: 30px;
	width: 114px;
	padding-left: 26px;
	background: none;
	border: none;
	font-size: .9em;
	cursor: pointer;
}

/* .wysiwyg_picker_container input[type=text], 
.wysiwyg_picker_container input[type=url] {
   width: 80%;
} */

.listfield_item_container {
   background-color: #eaeaea;
   padding: 5px;
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 20px;
   margin: 5px;
   display: inline-block;
}

.fieldset .listfield_item_container {
   background-color: #ffffff;
}

.listfield_item {
   display: inline-block;
   padding-left: 5px;
   padding-right: 5px;
}

.listfield_item_clear, .listfield_item_move {
   display: inline-block;
   background-size: 12px;
   background-repeat: no-repeat;
   background-position: center;
   width: 12px;
   height: 12px;
   margin-left: 5px;
   padding: 2px;
   border-radius: 20px;
   vertical-align: sub;
   cursor: pointer;
}

.listfield_item_clear {
   background-image: url(/images/icons/darkgrey/closepopup.svg);
   background-size: 8px;
}

.listfield_item_move {
   cursor: grab;
   background-image: url(/images/icons/darkgrey/drag.svg);
   margin-left: 0px;
   margin-right: 5px;
}

.listfield_item_clear:hover {
   background-color: #cecece;
}


.counter_textedit {
	opacity:100;
	/* position:absolute; */
}

.under_text_field_counter {
   text-align: right;
   color: #a0a0a0;
   font-size: 0.75em;
   font-style: italic;
   opacity: 0;
   transition: .25s ease;
}

.under_list_field_text {
   color: #a0a0a0;
   font-size: 0.75em;
   font-style: italic;
   opacity: 0;
   transition: .25s ease;
   float: left;
}

.popup .input_focus .under_list_field_text, .popup .input_focus .under_text_field_counter {
   opacity: 1;
}

.under_list_field_text + .under_text_field_counter {
   float: right;
   width: 100px;
}

.listfield_copied_feedback_div {
   display: block;
   position: absolute;
   background-color: #fff;
   border-left: 5px solid #00a470;
   box-shadow: 0px 0px 10px rgb(0 0 0 / 30%);
   border-radius: 5px;
   padding: 10px;
   z-index: 100000;
   transition: .25s;
}

.under_text_field_max_length_orange_warning {
   font-weight: bold;
   color: #f58836;
}

.under_text_field_max_length_red_warning {
   font-weight: bold;
   color: #FF3333;
}

textarea {
/*    border:2px solid #c3e5f7;
   -webkit-border-radius:6px;
   -moz-border-radius:6px;
    border-radius:6px; */
    
    border: 1px solid #eaeaea;
    padding: 5px;
}

textarea:disabled {
   background:#eaeaea;
}

textarea:focus {
   background:#f9f9f9;
}

select {
    border:1px solid #eaeaea;
    padding: 5px;
   /* -webkit-border-radius:6px;
   -moz-border-radius:6px;
   border-radius:6px; */
   min-width:300px;
   max-width:500px;
   overflow:auto;
   font-family: var(--font_family);
   color: var(--font);
}

select:disabled {
   background:#eaeaea !important;
   border-radius: 5px;
}

select:focus {
   background:#f9f9f9;
}

fieldset {
   /* -webkit-border-radius:6px;
   -moz-border-radius:6px;
   border-radius:6px; */
   margin-top:20px;
   margin-bottom:20px;
   border:1px solid #eaeaea;
}

fieldset:hover {
   border:1px solid #eaeaea;
}

fieldset:hover>legend {
    border: 1px solid #eaeaea;
    background: #eaeaea;
}

/**** AJAX edit ****/
.textedit {
   cursor:text;
   background-image:url("/images/icons/lightgrey/edit.svg");
   background-repeat:no-repeat;
   /* background-position: right 10px;
   background-size:8px; */
   background-position: calc(100% - 5px) 10px;
   background-size: 10px;
   padding-right:10px;
   border: 2px solid transparent;
}

.inline_edit_icon_hover .textedit {
   background-image:none;
}

.inline_edit_icon_hover .textedit:hover {
   background-image:url("/images/icons/darkgrey/edit.svg");
}

.inner_collapse_table .textedit {
   background-position: right top;
}

.first_asset_header .textedit, .asset_header .textedit, .displaylist_title .textedit, .details_section_outer .textedit {
   background-position: right 5px;
   padding-right: 15px;
}

span.textedit, span.textedit_active #input_error {
   display: inline-block;
}

.textedit_active input {
   cursor:text;
   background:rgba(150,150,150,0.5);
   border:1px solid #3b679e;
   padding: 0;
   font-size: inherit;
   /* width: auto !important; */
}

/* .displaylist td.textedit_active {
   padding: 5px;
}

.displaylist td.textedit_active input {
   padding: 5px;
} */

.inlineedit_error {
   background: #ffdddd !important;
}

.inlineedit_loader.circle_loader {
   border-color: var(--main_colour) var(--main_colour) var(--main_colour) transparent;
   position: absolute;
   top: 12px;
   right: 12px;
}

.top_selected_details_element_content .textedit_wait .inlineedit_loader.circle_loader, .top_selected_details_element_content .textareaedit_wait .inlineedit_loader.circle_loader, .top_selected_details_element_content .wysiwygedit_wait .inlineedit_loader.circle_loader {
   top: 3px;
}

.top_selected_details_element_content .dateedit_wait .inlineedit_loader.circle_loader {
   top: 2px;
   right: -10px;
}

.top_selected_details_element_content .dropdown_wait .inlineedit_loader.circle_loader {
   top: 9px;
	right: 0px;
}

.details_section_element .dropdown_wait .inlineedit_loader.circle_loader {
   top: 7px;
	right: 0px;
}

.top_selected_details_element_content .status_state {
	margin-left: 18px;
}

.details_section_element.details_full div.circle_loader {
   min-width: auto !important;
}

#report .textedit_wait .inlineedit_loader.circle_loader, #report .textareaedit_wait .inlineedit_loader.circle_loader, #report .wysiwygedit_wait .inlineedit_loader.circle_loader {
   top: 5px;
}

#report .dateedit_wait .inlineedit_loader.circle_loader {
   top: 5px;
}

#report .dropdown_wait .inlineedit_loader.circle_loader {
   top: 10px;
	right: 10px;

}

.textedit_wait {
   cursor:wait;
   position: relative;
}

.textedit_wait input {
   background:transparent;
   border:none;
   /* background:rgba(255,150,150,0.5);
   border:1px solid #FF5555; */
   opacity: .5;
}

.textedit_wait_multi, .dateedit_wait_multi, .textareaedit_wait_multi, .dropdown_wait_multi {
   position: relative;
}

.wysiwygedit_wait_multi {
   position: relative !important;
}

.textedit_wait_multi div:first-of-type, .dateedit_wait_multi div:first-of-type, .textareaedit_wait_multi div:first-of-type, .dropdown_wait_multi div:first-of-type, .wysiwygedit_wait_multi div:first-of-type {
   opacity: .7;
}

.textedit_wait_multi .inlineedit_loader.circle_loader, .dateedit_wait_multi .inlineedit_loader.circle_loader, .textareaedit_wait_multi .inlineedit_loader.circle_loader, .dropdown_wait_multi .inlineedit_loader.circle_loader, .wysiwygedit_wait_multi .inlineedit_loader.circle_loader {   
   top: 10px;
   right: 10px;
}

/*TODO WYSYIWYG DIFFEREND*/

.dateedit {
   cursor:text;
   background-image:url("/images/icons/lightgrey/edit.svg");
   background-repeat:no-repeat;
   /* background-position: right 10px;
   background-size:8px; */
   background-position: calc(100% - 5px) 10px;
   background-size: 10px;
   padding-right:10px;
   border: 2px solid transparent;
}

.inline_edit_icon_hover .dateedit {
   background-image:none;
}

.inline_edit_icon_hover .dateedit:hover {
   background-image:url("/images/icons/darkgrey/edit.svg");
}

.inner_collapse_table .dateedit {
   background-position: right top;
}

.first_asset_header .dateedit, .asset_header .dateedit, .displaylist_title .dateedit, .details_section_outer .dateedit  {
   background-position: right 2.5px;
   padding-right: 12.5px;
}

.dateedit_active input {
   cursor:text;
   background:rgba(150,150,150,0.5);
   border:1px solid #3b679e;
   padding: 0;
   min-width: 50px;
}

/* .displaylist td.dateedit_active {
   padding: 5px;
}

.displaylist td.dateedit_active input {
   padding: 5px;
} */

.dateedit_wait {
   cursor:wait;
   position: relative;
}

.dateedit_wait input {
   background:transparent;
   border:none;
   opacity: .5;
   /* background:rgba(255,150,150,0.5);
   border:1px solid #FF5555; */
}

.dateedit_active .popup_calendar_icon {
   margin-right: 0;
   margin-left: 5px;
   margin-bottom: -3px;
}

.textareaedit {
   cursor:text;
   background-image:url("/images/icons/lightgrey/edit.svg");
   background-repeat:no-repeat;
   /* background-position:right 10px;
   background-size:8px; */
   background-position: calc(100% - 5px) 10px;
   background-size: 10px;
   padding-right:10px;
   border: 2px solid transparent;
}

.inline_edit_icon_hover .textareaedit {
   background-image:none;
}

.inline_edit_icon_hover .textareaedit:hover {
   background-image:url("/images/icons/darkgrey/edit.svg");
}

.inner_collapse_table .textareaedit {
   background-position: right top;
}

.first_asset_header .textareaedit, .asset_header .textareaedit, .displaylist_title .textareaedit, .details_section_outer .textareaedit  {
   background-position: right 2.5px;
   padding-right: 12.5px;
}

.textareaedit_active textarea {
   cursor:text;
   border:1px solid #eaeaea;
}

.details_template_code .textareaedit_active textarea {
   color: #fff;
   background:#1E1E1E;
}

.textareaedit_wait {
   cursor:wait;
   /* background:rgba(255,150,150,0.5);
   border:1px solid #FF5555; */
   position: relative;
}

.textareaedit_wait textarea {
   background:transparent;
   border:none;
   opacity: .5;
}

.wysiwygedit {
   cursor:text;
   background-image:url("/images/icons/lightgrey/edit.svg");
   background-repeat:no-repeat;
   /* background-position: right 10px;
   background-size:8px; */
   background-position: calc(100% - 5px) 10px;
   background-size: 10px;
   padding-right:10px;
   border: 2px solid transparent;
   position: relative;
}

.inline_edit_icon_hover .wysiwygedit {
   background-image:none;
}

.inline_edit_icon_hover .wysiwygedit:hover {
   background-image:url("/images/icons/darkgrey/edit.svg");
}

.inner_collapse_table .wysiwygedit {
   background-position: right top;
}

.first_asset_header .wysiwygedit, .asset_header .wysiwygedit, .displaylist_title .wysiwygedit, .details_section_outer .wysiwygedit   {
   background-position: right 2.5px;
   padding-right: 12.5px;
}

.wysiwygedit_active {
   position: relative;
   overflow: visible !important;
}

.wysiwygedit_active .wysiwyg_buttons {
   position: absolute;
   top: -23px;
   z-index: 10;
   left: 0;
   margin-left:0;
   margin-top:-5px;
}

/*Weird timesheet task only table wysiwig position too low*/
/* #displaylist_timesheettask_ .wysiwygedit_active .wysiwyg_buttons {
   top: -33px;
   left: -5px;
} */

.displaylist_container .wysiwygedit_active .wysiwyg_buttons {
   margin-left:5px;
   margin-top:0;
}

/* .details_section_element .wysiwygedit_active .wysiwyg_buttons, .displaydetails .wysiwygedit_active .wysiwyg_buttons {
   margin-left:0;
   margin-top:-5px;
} */

.details_section_element .wysiwygedit_active .wysiwyg, .details_section_element .textedit_active input, .details_section_element .dateedit_active input, .details_section_element .textareaedit_active input {
   padding: 2px !important;
}

.wysiwygedit_active .wysiwyg {
   padding: 0;
}

/* .displaylist td.wysiwygedit_active {
   padding: 5px;
}

.displaylist td.wysiwygedit_active .wysiwyg {
   padding: 5px;
} */

.wysiwygedit_active textarea {
   cursor:text;
   background:rgba(150,150,150,0.5);
   border:1px solid #3b679e;
   padding: 0;
}

.wysiwygedit_wait {
   cursor:wait;
   /* background:rgba(255,150,150,0.5);
   border:1px solid #FF5555; */
   position: relative;
}

.wysiwygedit_wait textarea {
   background:transparent;
   border:none;
   opacity: .5;
}

.wysiwygedit_wait .wysiwyg {
   background: transparent;
   border: none;
   opacity: .5;
}

.wysiwygedit_wait .wysiwyg_buttons {
   display: none;
}


span.wysiwygedit {
        display:block;
}

.dropdown {
   cursor:text;
   min-width:50px;
   background-image:url("/images/icons/lightgrey/edit.svg");
   background-repeat:no-repeat;
   /* background-position: right 10px;
   background-size:8px; */
   background-position: calc(100% - 5px) 10px;
   background-size: 10px;
   padding-right:10px;
   border: 2px solid transparent;
}


.inlinecheckbox {
   border: 2px solid transparent;
}

.inline_edit_icon_hover .dropdown {
   background-image:none;
}

.inline_edit_icon_hover .dropdown:hover {
   background-image:url("/images/icons/darkgrey/edit.svg");
}

.inner_collapse_table .dropdown {
   background-position: right top;
}

.first_asset_header .dropdown, .asset_header .dropdown, .displaylist_title .dropdown, .details_section_outer .dropdown  {
   background-position: right 2.5px;
   padding-right: 12.5px;
}

.dropdown_active input {
   cursor:text;
   background:rgba(150,150,150,0.5);
   border:1px solid #E7F1FB;
   padding: 0;
}

.dropdown_active select {
   padding: 0;
   border:0;
   min-width: auto;
   /* width: 100% !important;
   min-width: 100% !important; */
}

.dropdown_active select option {
   padding: 0;
   border:0;
}

.dropdown_wait {
   cursor:wait;
   position: relative;
}

.dropdown_wait select {
   background:transparent;
   border:none;
   opacity: .5;
	min-width: auto;
   /* background:rgba(255,150,150,0.5);
   border:1px solid #FF55FF; */
}

.dropdown_wait .inlineedit_loader.circle_loader {
   top: 18px;
}

.dragable {
   cursor:move;
}

/* td.dragable {
   background-image: url(/images/icons/darkgrey/drag.svg) !important;
   background-repeat:no-repeat !important;
   background-position:50% 50% !important;
   background-size:16px 16px !important;
} */


.table_row_circle_loader.circle_loader,
.report_load_circle_loader.circle_loader, 
.notification_menu_loader_gif.circle_loader,
.waiting_image_small.circle_loader,
#gantt_load_icon.circle_loader,
.loader_div .circle_loader {
   border-color: var(--main_colour) var(--main_colour) var(--main_colour) transparent;
   width: 20px;
   height: 20px;
	background-image: none;
}

.report_load_circle_loader.circle_loader, .notification_menu_loader_gif.circle_loader, #gantt_load_icon.circle_loader {
   margin-left: auto !important;
   margin-right: auto !important;
}

.table_row_circle_loader.circle_loader {
	display: inline-block;
	vertical-align: middle;
}

.table_row_loader_text {
	display: inline-block;
	margin-left: 10px;
	font-weight: bold;
	color: var(--main_colour);
	vertical-align: middle;
}

/**** Logo ****/

#logo {
   color:#ffffff;
   background:var(--main_colour);
/*   background-image:url(/images/easter2018/header_background.png);
   background-repeat:no-repeat;
   background-size:499px 55px;
   background-position:50% 0px;*/
   height:45px;
   padding-left:10px !important;
   position:relative;
/* background:radial-gradient(circle at 50% 50%,#FFF7E0, #FFD97E); */
}

#logo a {
   text-decoration:none;
}

#logo .psodalogo {
   background-image: url(/images/psoda_logo_icon_white.svg);
   background-repeat: no-repeat;
   background-size: auto 25px;
   background-position: left;
   height: 25px;
   width: auto;
   margin-top: 10px;
   padding-left: 93px;
   display: inline-block;
}

#logo .psodalogo:hover {
   opacity: .75;
}

/* season psoda logo: */
#logo .psodalogo.season {
   background-image: url(/images/psoda_logo_icon_white.svg);
}

.versionstring {
   color:#ffffff;
   display:inline;
   font-size:1em;
   margin-left:0px;
   position:relative;
   bottom:1px;
   background:transparent;
   padding-left:15px;
   padding-right:5px;
}

.versionstring:hover {
   color:#eaeaea;
}

.logoouter {
   display: inline-block;
}

.brand_logo {
   margin-left:15px;
}

.brand_logo img {
width: auto;
    height: 25px;
}

/**** flavours ****
.orange_flavour {
   background-image:url(/images/orange_bottle_tiny.png);
   background-repeat:no-repeat;
   background-position:95% 20px;
}

.green_flavour {
   background-image:url(/images/green_bottle_tiny.png);
   background-repeat:no-repeat;
   background-position:95% 20px;
}

.blue_flavour {
   background-image:url(/images/blue_bottle_tiny.png);
   background-repeat:no-repeat;
   background-position:95% 20px;
}

.purple_flavour {
   background-image:url(/images/purple_bottle_tiny.png);
   background-repeat:no-repeat;
   background-position:95% 20px;
}

.all_flavours {
   background-image:url(/images/bottle_box_tiny.png);
   background-repeat:no-repeat;
   background-position:95% 20px;
}

/**** usermenu ****/

#usermenu {
   color:#404040;
   position:absolute;
   z-index:10;
   right:5px;
   top:5px;
   text-align:right;
   /*min-width:600px;*/
   background:transparent;
   padding-left:5px;
   padding-right:5px;
   padding-bottom:12px;
}

#usermenu h1 {
   position:absolute;
   left:-9999px;
}

#usermenu img {
   border:none;
}

#usermenu a:hover img {
   border-top:1px solid #888888;
   border-left:1px solid #888888;
   border-bottom:1px solid #dddddd;
   border-right:1px solid #dddddd;
}

.flag {
   vertical-align:middle;
}

.flagselected {
   vertical-align:top;
   display: block;
}


.textsize {
   vertical-align:middle;
}

.textsize_selected {
   border-top:2px solid #8A0000;
   border-left:2px solid #8A0000;
   border-right:2px solid #8A0000;
   border-bottom:2px solid #8A0000;
   vertical-align:middle;
}

.display_format {
   background:#BBBBBB;
   border-top:1px solid #dddddd;
   border-left:1px solid #dddddd;
   border-bottom:1px solid #888888;
   border-right:1px solid #888888;
   vertical-align:middle;
}

/**** Notification dropdown ****/
.navigator_expanded #notificationDropdown {
   right: 10px;
   bottom: 7.5px;
   position: absolute;
}

#notificationDropdown {
   margin:0px;
   padding:0px;
   text-decoration:none;
   font-size:0.9em;
   display:inline;
   /* position:relative; */
   z-index:1500;
   /* position: static; */
   position: absolute;
   bottom: 60px;
}

#notificationDropdown .notification_menu_bell:hover {
   background-color: var(--navigator_hover);
   border-radius: 5px;
}

#notificationDropdown li {
   display: inline;
   text-decoration:none;
 /*   cursor: default; */
}

#notificationDropdown li.sfhover ul {
   top:1.3em;
   display:block;
}

#notificationDropdown li ul li {
   display:inline-block;
   border:none;
   background:white;
   text-align:left;
   width: 120px;
   margin-left: 10px;
   margin-bottom: 15px;
   padding-top: 10px;
}

/**** Menu dropdown ****/
#menuDropdown {
   margin:0px;
   padding:0px;
   text-decoration:none;
   font-size:0.9em;
   display:inline;
   position:absolute;
   z-index:5;
   bottom: 5px;
}

.navigator_expanded #menuDropdown {
   position: relative;
   bottom: auto;
}



/* #menuDropdown li {
   display:inline;
   text-decoration:none;
} */

#menuDropdown li ul {
   margin:0px;
   padding:10px 0px 0px 0px;
   display:none;
   width:18em;
   max-height: calc(100vh - 75px);
   position:absolute;
   /* top:1.3em; */
   font-size: 1.15em;
   right:0px;
   background:#FFFFFF;
   text-align:left;
   -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px;
   -webkit-box-shadow:var(--box_shadow);
   -moz-box-shadow:var(--box_shadow);
   box-shadow:var(--box_shadow); /*CSS3 shadow*/
   cursor: default;
   overflow-y: auto;
   overflow-x: hidden;
}

#menuDropdown li.sfhover ul {
   top:1.3em;
   display:block;
}

#menuDropdown li ul li, #user_menu_about_menu div li {
    display: block;
    border: none;
    /* background: #FFFFFF; */
    text-align: left;
    border-radius: 5px;
    /* padding: 10px; */
    padding-left: 15px;
    cursor: pointer;
 }
 
 #menuDropdown li ul li:hover, #user_menu_about_menu div li:hover {
    background: #eaeaea;
}

#menuDropdown li ul #user_top {
   position: relative;
   padding-bottom: 20px;
   padding-left: 0px;
}

#menuDropdown li ul #user_top:hover, #user_menu_about_menu #user_top:hover {
   background: #FFFFFF;
   cursor: default;
}

#menuDropdown li ul #user_top img {
   /* display: inline-block; */
   width: 90px;
   height: 90px;
   /* margin-left: 15px; */
   margin: auto;
}

#menuDropdown li ul #user_top .status_state {
   /* display: none; */
   width: 10px;
   height: 10px;
   border: 2px solid #ffffff;
   top: 15px;
   right: 7.5px;
}

#menuDropdown li ul #user_top>a, #user_menu_about_menu #user_top>a {
   display: block;
   padding-left: 0px;
   padding-right: 0px;
   padding-bottom: 10px;
   width: 90px;
   margin: auto;
   position: relative;
}

#menuDropdown li ul #user_top .user_top_outer, #user_menu_about_menu #user_top .user_top_outer {
   /* display: inline-block; */
   /* margin-left: 10px; */
   vertical-align: middle;
   text-align: center;
}

#menuDropdown li ul #user_top .user_top_outer a, #user_menu_about_menu #user_top .user_top_outer .about_menu_website_link {
   color: var(--main_colour);
   border: 1px solid var(--main_colour);
   display: inline-block;
   margin: auto;
   text-align: center;
   padding-top: 2px;
   padding-bottom: 2px;
   font-size: .8em;
   border-radius: 20px;
   width: auto;
   padding-left: 20px;
   padding-right: 20px;
}

#menuDropdown li ul #user_top .user_top_outer a:hover, #user_menu_about_menu #user_top .user_top_outer .about_menu_website_link:hover {
   background-color: var(--lightest_shade_1);
}

#menuDropdown li ul #user_top .user_top_fullname, #user_menu_about_menu .user_top_fullname {
   font-weight: bold;
   font-size: 1.1em;
}

#user_menu_about_menu .user_top_fullname {
   cursor: pointer;
}

#user_menu_about_menu .user_top_fullname:hover {
   opacity: .8;
}

#menuDropdown li ul #user_top .user_top_username, #user_menu_about_menu .user_top_username {
   font-size: .8em;
   margin-top: 2.5px;
   margin-bottom: 7.5px;
}

#menuDropdown li ul #currenttimesheet, #menuDropdown li ul #userpreferences {
   margin-left: 10px;
   margin-right: 10px;
   padding-left: 10px;
   /* background-repeat: no-repeat;
   background-position: 10px center;
   background-size: 18px; */
}

#menuDropdown li ul #currenttimesheet {
   /* background-image: url(/images/icons/darkgrey/timesheet.svg); */
}

#menuDropdown li ul #userpreferences {
   margin-bottom: 10px;
   /* background-image: url(/images/icons/darkgrey/settings.svg); */
}

#menuDropdown li ul #currenttimesheet .psoda_icon {
   padding-right: 10px;
}

#menuDropdown li ul #userpreferences .psoda_icon {
   padding-right: 10px;
}

#user_menu_middle {
   padding: 10px;
   background-color: #f7f7f7;
   cursor: default;
}

#menuDropdown li ul #menu_theme {
   border-radius: 0;
   margin-top: 10px;
   margin-bottom: 10px;
   background-repeat: no-repeat;
   background-position: calc(100% - 15px);
   background-size: 20px;
   border: 1px solid var(--main_colour) !important;

}

#menuDropdown li ul #menu_theme.user_menu_theme_night {
   /* border: 1px solid #51668f; */
   /* background-image: url(/images/theme_menu_night.svg); */
}

#menuDropdown li ul #menu_theme svg {
	width: 20px;
	height: 20px;
	padding: 7.5px;
}

#menuDropdown li ul #menu_theme .theme-menu-cls-1 {
	fill: var(--lighter_shade_3);
}

#menuDropdown li ul #menu_theme .theme-menu-cls-3 {
	fill: var(--lighter_shade_1);
}

#menuDropdown li ul #menu_theme .theme-menu-cls-2 {
	fill: var(--main_colour);
}

#menuDropdown li ul #menu_theme .theme-menu-cls-6 {
	fill: var(--lighter_shade_2);
}

#menuDropdown li ul #menu_theme .theme-menu-cls-4 {
	fill: var(--lightest_shade_2);
}

#menuDropdown li ul #menu_theme .theme-menu-cls-5 {
	fill: var(--lighter_shade_5);
}

#menuDropdown li ul #menu_theme .theme-menu-cls-7 {
	fill: var(--lighter_shade_2);
}

#menuDropdown li ul #menu_theme.user_menu_theme_night:hover, #menu_theme.user_menu_theme_night.lang_theme_open {
   background-color: #eceff3;
}

#menuDropdown li ul #menu_theme.user_menu_theme_purple {
   /* border: 1px solid #6D7AE0; */
   /* background-image: url(/images/theme_menu_purple.svg); */
}

#menuDropdown li ul #menu_theme.user_menu_theme_purple:hover, #menu_theme.user_menu_theme_purple.lang_theme_open {
   background-color: #f4f5ff;
}

#menuDropdown li ul #menu_theme.user_menu_theme_psodared {
   /* border: 1px solid #f58836; */
   /* background-image: url(/images/theme_menu_psodared.svg); */
}

#menuDropdown li ul #menu_theme.user_menu_theme_psodared:hover, #menu_theme.user_menu_theme_psodared.lang_theme_open {
   background-color: #fff4ea;
}

#menuDropdown li ul #menu_theme.user_menu_theme_green {
   /* border: 1px solid #277267; */
   /* background-image: url(/images/theme_menu_green.svg); */
}

#menuDropdown li ul #menu_theme.user_menu_theme_green:hover, #menu_theme.user_menu_theme_green.lang_theme_open {
   background-color: #ddebe9;
}

#menuDropdown li ul #menu_theme.user_menu_theme_dark {
   border: 1px solid #3c3c3c;
   /* background-image: url(/images/header/theme_grey.svg); */
   opacity: .5;
}

#menuDropdown li ul #menu_theme.user_menu_theme_dark:hover, #menu_theme.user_menu_theme_dark.lang_theme_open {
   background-color: #292929;
}

#menuDropdown li ul #menu_theme.user_menu_theme_highcontrast {
   border: 1px solid #e3e32f;
   /* background-image: url(/images/header/theme_highcontrast.svg); */
}

#menuDropdown li ul #menu_theme.user_menu_theme_highcontrast:hover, #menu_theme.user_menu_theme_highcontrast.lang_theme_open {
   background-color: #626262;
}

#menuDropdown li ul #menu_theme.user_menu_theme_osx {
   border: 1px solid #505050;
   /* background-image: url(/images/header/theme_grey.svg); */
}

#menuDropdown li ul #menu_theme.user_menu_theme_normal {
   border: 1px solid #4B86B4;
   /* background-image: url(/images/theme_menu_classic.svg); */
}

#menuDropdown li ul #menu_theme.user_menu_theme_normal:hover, #menu_theme.user_menu_theme_normal.lang_theme_open {
   background-color: #e5edf3;
}

#menuDropdown li ul #menu_theme.user_menu_theme_sky {
   border: 1px solid #8fc0f2;
   /* background-image: url(/images/theme_menu_sky.svg); */
}

#menuDropdown li ul #menu_theme.user_menu_theme_sky:hover, #menu_theme.user_menu_theme_sky.lang_theme_open {
   background-color: #f4f9ff;
}

/* #menuDropdown li ul #menu_theme.user_menu_theme_charcoal {
   border: 1px solid #9A8B0A;
   background-image: url(/images/theme_menu_charcoal.svg);
} */

#menuDropdown #menu_language.user_menu_lang_en {
   background-image: url(/images/icon_lang_menu_nz.svg);
}

#menuDropdown #menu_language.user_menu_lang_en-us {
   background-image: url(/images/icon_lang_menu_us.svg);
}

#menuDropdown #menu_language.user_menu_lang_fr-ca {
   background-image: url(/images/icon_lang_menu_ca.svg);
}

#menuDropdown #menu_language.user_menu_lang_af {
   background-image: url(/images/icon_lang_menu_za.svg);
}

#menuDropdown #menu_language.user_menu_lang_ja {
   background-image: url(/images/icon_lang_menu_ja.svg);
}

#menuDropdown #menu_language.user_menu_lang_zh {
   background-image: url(/images/icon_lang_menu_cn.svg);
}

#menuDropdown #menu_language.user_menu_lang_ru {
   background-image: url(/images/icon_lang_menu_ru.svg);
}

#menuDropdown li ul #support {
   /* background-image: url(/images/user_menu_support.svg);
   background-size: 18px 18px; */
}

#menuDropdown li ul #support .psoda_icon svg, #menuDropdown li ul #menu_whats_new .psoda_icon svg {
   padding: 7.5px;
}

#menuDropdown li ul #support .psoda_icon, #menuDropdown li ul #menu_whats_new .psoda_icon {
   pointer-events: none;
}


#menuDropdown li ul #menu_theme,
#menuDropdown li ul #menu_language,
#menuDropdown li ul #support,
#menuDropdown li ul #menu_whats_new {
   display: inline-block;
   width: 35px;
   height: 35px;
   padding: 0;
   margin-top: 10px;
   margin-bottom: 5px;
   margin-left: 10px;
   margin-right: 10px;
   border-radius: 20px;
   background-color: #ffffff;
   border: 1px solid #dbdbdb;
   background-repeat: no-repeat;
   background-position: center;
   vertical-align: top;
}

#menuDropdown li ul #menu_language {
   background-size: 20px 20px;
}

#menuDropdown li ul #menu_theme:hover,
#menuDropdown li ul #menu_language:hover,
#menuDropdown li ul #support:hover,
#menuDropdown li ul #menu_whats_new:hover {
   background-color: #eaeaea;
}

/* .user_menu_caret {
   width: 7px;
   height: 7px;
   display: inline-block;
   vertical-align: middle;
   margin-left: 10px;
}

.user_menu_language_icon {
   width: 16px;
   height: 16px;
   display: inline-block;
   vertical-align: middle;
   margin-left: 10px;
} */

#user_menu_middle_bottom {
   text-align: center;
}

#user_menu_middle_bottom a {
   display: block;
   width: 100%;
   height: 100%;
}

/* New menu user language and theme */

#menuDropdown .lang_theme_open {
   background-color: #eaeaea;
}

#user_menu_language_menu {
   margin: 0px;
   padding: 10px 0px 10px 0px;
   display: none;
   width: 25.5em;
   position: absolute;
   bottom: 125px;
   left: 190px;
   background: white;
   text-align: left;
   z-index: 1500;
   font-size: 1em;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
}

#user_menu_language_menu.langOpen {
   display: block;
}

.navigator_expanded #user_menu_language_menu {
   bottom: 170px;
   left: 150px;
}

#user_menu_language_menu li {
   display: inline-block;
   margin-bottom: 10px;
   margin-left: 10px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
}

#user_menu_language_menu li:hover {
   background-color: #f7f7f7;
}

#user_menu_language_menu li a {
   display: block;
   padding-top: 10px;
   padding-bottom: 10px;
   text-align: center;
   width: 100px;
}

.flag.graphicsonly {
   vertical-align: top;
   display: block;
}

#user_menu_language_menu img {
   width: 40px;
   height: 40px;
   margin: auto;
   margin-bottom: 10px;
}

#user_menu_language_menu .lang_selected {
   border-bottom: 5px solid var(--main_colour);
   background-color: #eaeaea;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
}


#user_menu_theme_menu.themeOpen {
   display: block;
}

#user_menu_theme_menu {
   margin:0px;
   padding:10px 0px 10px 0px;
   display:none;
   width:49.5em;
   position:absolute;
   bottom: 125px;
   left: 130px;
   background:white;
   text-align:left;
   font-size: 1em;
   -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px;
   -webkit-box-shadow:var(--box_shadow);
   -moz-box-shadow:var(--box_shadow);
   box-shadow:var(--box_shadow); /*CSS3 shadow*/
   z-index: 6;
}

.navigator_expanded #user_menu_theme_menu {
   bottom: 170px;
   left: 90px;
}

.theme_lang_menu_header {
   font-weight: bold;
   margin-left: 10px;
   padding-bottom: 5px;
}

.theme_image {
   height: 80px;
}

#user_menu_theme_menu .brand_contactenergy_theme .theme_image .theme-menu-icon-cls-2 {
	fill: #C23456 !important;
}

#user_menu_theme_menu .brand_powerco_theme .theme_image .theme-menu-icon-cls-2 {
	fill: #622B8B !important;
}

#user_menu_theme_menu #night_theme .theme_image .theme-menu-icon-cls-2 {
	fill: #3B4557;
}

#user_menu_theme_menu #purple_theme .theme_image .theme-menu-icon-cls-2 {
	fill: #6D7AE0;
}

#user_menu_theme_menu #psodared_theme .theme_image .theme-menu-icon-cls-2 {
	fill: #F58836;
}

#user_menu_theme_menu #green_theme .theme_image .theme-menu-icon-cls-2 {
	fill: #10332E;
}

#user_menu_theme_menu #sky_theme .theme_image .theme-menu-icon-cls-2 {
	fill: #E7F1FB;
}

#user_menu_theme_menu #osx_theme .theme_image .theme-menu-icon-cls-2 {
	fill: #505050;
}

#user_menu_theme_menu #normal_theme .theme_image .theme-menu-icon-cls-2 {
	fill: #4B86B4;
}

#user_menu_theme_menu #night_theme .theme_image,
#user_menu_theme_menu #purple_theme .theme_image,
#user_menu_theme_menu #psodared_theme .theme_image,
#user_menu_theme_menu #green_theme .theme_image,
#user_menu_theme_menu #sky_theme .theme_image,
#user_menu_theme_menu #osx_theme .theme_image,
#user_menu_theme_menu #normal_theme .theme_image {
	background-image: unset !important;
}

#user_menu_theme_menu .theme_image svg {
	height: 80px;
	padding-left: 25px;
}

#user_menu_theme_menu li {
   display:inline-block;
   border:none;
   background:white;
   text-align:left;
   width: 120px;
   margin-left: 10px;
   margin-bottom: 15px;
   padding-top: 10px;
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
   vertical-align: middle;
}

#user_menu_theme_menu span {
   display:block;
   padding-top:10px;
   padding-bottom:10px;
   text-align: center;
}

#user_menu_theme_menu #night_theme:hover {
   background-color: #f7f7f7;
}

/* #user_menu_theme_menu #night_theme .theme_image {
   background-image: url(/images/icon_theme_menu_night.svg);
   background-repeat: no-repeat;
   background-position: center;
   margin: auto;
} */

#user_menu_theme_menu #night_theme.night_selected {
   border-bottom: 5px solid var(--main_colour);
   background-color: #eaeaea;
}

#user_menu_theme_menu #purple_theme:hover {
   background-color: #f7f7f7;
}

/* #user_menu_theme_menu #purple_theme .theme_image {
   background-image: url(/images/icon_theme_menu_purple.svg);
   background-repeat: no-repeat;
   background-position: center;
   margin: auto;
} */

#user_menu_theme_menu #purple_theme.purple_selected {
   border-bottom: 5px solid #6D7AE0;
   background-color: #eaeaea;
}

#user_menu_theme_menu #psodared_theme:hover {
   background-color: #f7f7f7;
}

/* #user_menu_theme_menu #psodared_theme .theme_image {
   background-image: url(/images/icon_theme_menu_psodared.svg);
   background-repeat: no-repeat;
   background-position: center;
   margin: auto;
} */

#user_menu_theme_menu #psodared_theme.psodared_selected {
   border-bottom: 5px solid #F58836;
   background-color: #eaeaea;
}

#user_menu_theme_menu #green_theme:hover {
   background-color: #f7f7f7;
}

/* #user_menu_theme_menu #green_theme .theme_image {
   background-image: url(/images/icon_theme_menu_green.svg);
   background-repeat: no-repeat;
   background-position: center;
   margin: auto;
} */

#user_menu_theme_menu #green_theme.green_selected {
   border-bottom: 5px solid #10332E;
   background-color: #eaeaea;
}

#user_menu_theme_menu #sky_theme:hover {
   background-color: #f7f7f7;
}

/* #user_menu_theme_menu #sky_theme .theme_image {
   background-image: url(/images/icon_theme_menu_sky.svg);
   background-repeat: no-repeat;
   background-position: center;
   margin: auto;
} */

#user_menu_theme_menu #sky_theme.sky_selected {
   border-bottom: 5px solid #364C60;
   background-color: #eaeaea;
}

#user_menu_theme_menu #osx_theme:hover {
   background-color: #f7f7f7;
}

/* #user_menu_theme_menu #osx_theme .theme_image {
   background-image: url(/images/icon_theme_menu_osx.svg);
   background-repeat: no-repeat;
   background-position: center;
   margin: auto;
} */

#user_menu_theme_menu #osx_theme.osx_selected {
   border-bottom: 5px solid #505050;
   background-color: #eaeaea;
}

#user_menu_theme_menu #normal_theme:hover {
   background-color: #f7f7f7;
}

/* #user_menu_theme_menu #normal_theme .theme_image {
   background-image: url(/images/icon_theme_menu_normal.svg);
   background-repeat: no-repeat;
   background-position: center;
   margin: auto;
} */

#user_menu_theme_menu #normal_theme.normal_selected {
   border-bottom: 5px solid #4B86B4;
   background-color: #eaeaea;
}

#user_menu_theme_menu #dark_theme:hover {
   background-color: #f7f7f7;
}

#user_menu_theme_menu #dark_theme .theme_image {
   background-image: url(/images/icon_theme_menu_dark.svg);
   background-repeat: no-repeat;
   background-position: center;
   margin: auto;
}

#user_menu_theme_menu #dark_theme.dark_selected {
   border-bottom: 5px solid #1f1f1f;
   background-color: #eaeaea;
}

#user_menu_theme_menu #highcontrast_theme:hover {
   background-color: #f7f7f7;
}

#user_menu_theme_menu #highcontrast_theme .theme_image {
   background-image: url(/images/icon_theme_menu_highcontrast.svg);
   background-repeat: no-repeat;
   background-position: center;
   margin: auto;
}

#user_menu_theme_menu #highcontrast_theme.highcontrast_selected {
   border-bottom: 5px solid #10a110;
   background-color: #626262;
}

#user_menu_theme_menu #text_high_themes:hover {
   background: none;
}

#user_menu_theme_menu #textonly_theme {
   background-image: url(/images/theme_menu_text_only_hover.svg);
   background-repeat: no-repeat;
   background-size: 20px 20px;
   background-position: 15px;
   padding-left: 50px;
   padding-top: 5px;
   padding-bottom: 5px;
   /* margin-bottom: 15px; */
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
}

#user_menu_theme_menu #textonly_theme:hover {
   background-color: #f7f7f7;
}

#user_menu_theme_menu #inverse_theme {
   background-image: url(/images/theme_menu_contrast_hover.svg);
   background-repeat: no-repeat;
   background-size: 20px 20px;
   background-position: 15px;
   padding-left: 50px;
   padding-top: 5px;
   padding-bottom: 5px;
   margin-bottom: 0px;
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
}

#user_menu_theme_menu #inverse_theme:hover {
   background-color: #f7f7f7;
}

#user_menu_theme_menu #text_high_themes {
   /* width: calc(100% - 10px); */
   width: 120px;
   margin-bottom: 0;
}

#text_high_themes a {
   /* display: inline-block; */
   /* width: calc(49% - 10px); */
   margin-left: 5px;
   margin-right: 5px;
}

#user_menu_theme_menu .individual_theme {
   cursor: pointer;
}

/* #menuDropdown li ul #menu_whats_new {
   background-image: url(/images/icon_whats_new_outline.svg);
   background-size: 18px 18px;
} */

#menuDropdown li ul #menu_whats_new.whats_new_notify {
   background-image: url(/images/icon_whats_new_colour.svg);
   background-size: 18px 18px;
}

#whats_new_confetti {
   height: 25px;
   width: 25px;
   background-image: url(/images/icon_whats_new_confetti.svg);
   float: right;
   margin-right: -7px;
   margin-top: -7px;
}

#whats_new_outer.whats_new_closed {
   display: none;
}

#whats_new_outer.whats_new_open {
   display: block;
}

#whats_new_lightbox {
   position: fixed;
   top: 0%;
   left: 0%;
   width: 100%;
   height: 100%;
   z-index: 10000;
   background-color: black;
   opacity: 0.5;
}

#whats_new_inner {
   height: 100vh;
   width: 400px;
   position: absolute;
   z-index: 10001;
   background-color: #f7f7f7;
   top: 0;
   left: 0;
   border-top-right-radius: 10px;
   border-bottom-right-radius: 10px;
   transition: .2s ease;
}

#whats_new_header {
   position: absolute;
   width: 360px;
   padding-top: 15px;
   height: 50px;
   background-color: #ffffff;
   top: 0;
   left: 0;
   border-top-right-radius: 10px;
   box-shadow: 0px 5px 10px #0000001a;
   transition: .2s ease;
   padding-left: 20px;
   padding-right: 20px;
}

#whats_new_footer {
   position: absolute;
   width: 400px;
   height: 50px;
   background-color: #ffffff;
   bottom: 0;
   left: 0;
   border-bottom-right-radius: 10px;
   box-shadow: 0px -5px 10px #0000001a;
   transition: .2s ease;
}

#whats_new_content {
   margin-top: 65px;
   height: calc(100vh - 65px - 50px);
   overflow: auto;
}

#whats_new_header_icon {
   display: inline-block;
}

#whats_new_header_icon img {
   vertical-align: middle;
}

#whats_new_header_text {
   font-weight: bold;
   font-size: 1.75em;
   display: inline-block;
   margin-left: 10px;
   vertical-align: middle;
  color: var(--font);
}

#whats_new_header_close {
   float: right;
   vertical-align: middle;
   margin-top: 3px;
   padding-top: 5px;
   padding-left: 5px;
   padding-right: 5px;
   border-radius: 5px;
   cursor: pointer;
}

#whats_new_header_close:hover {
   background-color: #eaeaea;
}

.whats_new_element_outer {
   padding: 10px;
   background-color: #fff;
   margin: 15px;
   border-radius: 5px;
   box-shadow: var(--box_shadow);
}

.whats_new_element_header {
   margin-bottom: 10px;
}

.whats_new_element_label {
   text-transform: uppercase;
   font-weight: bold;
   display: inline-block;
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 15px;
   padding-right: 15px;
   color: #ffffff;
   font-size: .85em;
   border-radius: 20px;
}

.whats_new_feature_element .whats_new_element_label {
   background: rgb(123, 204, 91);
}

.whats_new_video_element .whats_new_element_label {
   background: #f2b126;
}

.whats_new_release_note_element .whats_new_element_label {
   background: #2ba6ff;
}

.whats_new_element_date {
   float: right;
   font-size: .7em;
   color: #848484;
   margin-top: 5px;
}

.whats_new_element_pinned {
   /* background-image: url(/images/icons/darkgrey/pin.svg);
   background-size: 14px;
   background-repeat: no-repeat;
   background-position: left center;
   padding-left: 18px; */
   padding-top: 2px;
   padding-bottom: 2px;
}

.whats_new_element_pinned .psoda_icon {
   margin-right: 5px;
}

.whats_new_element_content {
   margin-bottom: 10px;
  color: var(--font);
}

.whats_new_element_title {
   margin-bottom: 10px;
   font-size: 1.25em;
}

.whats_new_element_descr {
   margin-bottom: 10px;
   font-size: .9em;
}

#siteutils .whats_new_element_descr a {
	color: var(--font_link);
}

.whats_new_element_img img {
   margin-bottom: 5px;
   margin-left: 2.5px;
   margin-right: 2.5px;
   vertical-align: top;
   cursor: pointer;
}

.whats_new_element_img img:hover {
   opacity: .75;
}

.whats_new_element_admin {
   font-size: .7em;
   color: #848484;
   text-align: right;
   vertical-align: middle;
}

.whats_new_element_admin .psoda_icon svg {
   display: inline-block;
   margin-right: 5px;
   vertical-align: middle;
}

.whats_new_element_admin div {
   display: inline-block;
   vertical-align: middle;
}

.whats_new_element_release_notes {
   padding: 0;
}

.whats_new_element_release_note::marker {
   color: #2ba6ff;
}

.whats_new_element_release_note {
   background-color: #eeeeee;
   padding: 10px;
   list-style-position: inside;
   margin-bottom: 10px;
   font-size: .9em;
   border-radius: 5px;
}

.whats_new_element_release_note_descr {
   display: inline-block;
   width: 300px;
   vertical-align: top;
}

/* .whats_new_element_release_note_date {
   width: 65px;
   text-align: right;
   float: right;
   vertical-align: top;
} */

.whats_new_element_thumbnail {
   position: relative;
   cursor: pointer;
}

.whats_new_element_thumbnail_img {
   width: 100%;
}

.whats_new_element_play_button {
   position: absolute;
   background-color: rgba(92, 92, 92, 0.75);
   width: 50px;
   height: 50px;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   margin: auto;
   border-radius: 25px;
}

.whats_new_element_play_button img {
   position: absolute;
   margin: auto;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
}

.whats_new_element_play_button svg {
	padding: 15px;
}

.whats_new_element_thumbnail_timestamp {
   position: absolute;
   background-color: rgba(92, 92, 92, 0.75);
   color: #ffffff;
   padding-left: 5px;
   padding-right: 5px;
   padding-top: 2.5px;
   padding-bottom: 2.5px;
   right: 10px;
   bottom: 0;
   border-top-right-radius: 5px;
   border-top-left-radius: 5px;
}

#whats_new_video_element {
   position: fixed;
   z-index: 10010;
   height: 80vh;
   width: auto;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   margin: auto;
}

#whats_new_image_element {
   position: fixed;
   z-index: 10010;
   height: 80vh;
   width: auto;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   margin: auto;
}

#whats_new_media_close {
   position: fixed;
   z-index: 10010;
   top: 30px;
   right: 30px;
   cursor: pointer;
   background: #00000085;
   display: flex;
   border-radius: 5px;
   padding: 5px;
}

#whats_new_search_input {
   display: inline-block;
   /* background-image: url(/images/icons/darkgrey/search.svg);
   background-repeat: no-repeat;
   background-position: left;
   background-size: 15px 15px;
   background-position-x: 10px; */
   outline: none;
   border-radius: 5px;
   padding: 7.5px 10px 7.5px 32px;
   width: 170px;
   border: 1.5px solid #d1d1d1;
   margin-top: 7.5px;
   margin-left: 20px;
}

#whats_new_search_icon {
   position: absolute;
   left: 30px;
   top: 17.5px;
}

#whats_new_search_input.hide_whats_new_search_input, #whats_new_feedback_input.hide_whats_new_feedback_input {
   display: none;
}

#whats_new_feedback_input {
   display: inline-block;
   outline: none;
   border-radius: 5px;
   padding: 7.5px 10px 7.5px 10px;
   width: 192px;
   border: 1.5px solid #d1d1d1;
   margin-top: 7.5px;
   margin-left: 20px;
   height: 67px;
   resize: none;
   color: var(--font);
}

#whats_new_feedback {
   background-color: #e4e4e4;
   color: var(--font);
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   padding-left: 10px;
   padding-right: 10px;
   float: right;
   margin-right: 20px;
   margin-top: 7.5px;
   border-radius: 5px;  
   cursor: pointer;
}

#whats_new_feedback:hover {
   background-color: #dbdbdb;
}

#whats_new_feedback.submit_feedback_button {
   color: #ffffff;
   background-color:var(--main_colour);
}

#whats_new_feedback.submit_feedback_button:hover {
   opacity: .9;
}

#whats_new_system_message_welcome {
   position: absolute;
   z-index: 10002;
   background-color: #ffffff;
   top: 10px;
   left: 415px;
   width: 350px;
   border-radius: 5px;
   padding: 15px;
}

#whats_new_system_message_icon {
   text-align: center;
   margin-left: auto;
   margin-right: auto;
   display: block;
}

#whats_new_system_message_text {
   text-align: center;
   font-size: 1.75em;
  color: var(--font);
   margin-top: 15px;
}

#whats_new_system_message_button {
   background-color: #eb5454;
   color: #ffffff;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   padding-left: 10px;
   padding-right: 10px;
   cursor: pointer;
   border-radius: 5px;
   text-align: center;
   margin-top: 15px;
   margin-left: auto;
   margin-right: auto;
   width: 90px;
}

#whats_new_system_message_button:hover {
   background-color: #e24c4c;
}

#whats_new_system_message_triangle {
   position: absolute;
   height: 18px;
   pointer-events: none;
   top: 12.5px;
   left: -12.5px;
   transform: rotate(-90deg);
}

#whats_new_scroll_to_element {
   opacity: 0;
   margin-top: -115px;
   padding-bottom: 100px;
}

#whats_new_content_load_more {
   text-align: center;
    display: block;
    margin: auto;
    width: 150px;
    background-color: #e4e4e4;
   color: var(--font);
    padding-top: 7.5px;
    padding-bottom: 7.5px;
    border-radius: 5px;
    cursor: pointer;
}

#whats_new_content_load_more:hover {
   background-color: #dbdbdb;
}

.whats_new_element_button {
   text-align: center;
   display: block;
   margin: auto;
   width: 150px;
   background-color: #e4e4e4;
   color: var(--font) !important;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   border-radius: 5px;
   cursor: pointer;
   margin-top: 10px;
   margin-bottom: 10px;
}

.whats_new_element_button:hover {
   background-color: #dbdbdb;
}


#menuDropdown li ul #logout,
#menuDropdown li ul #unimpersonate {
   padding: 0;
   /* background-image: url(/images/psoda_logo_main_2020.svg);
   background-repeat: no-repeat;
   background-position: calc(100% - 20px) center;
   background-size: 60px auto; */
   position: -webkit-sticky; /* Safari */
   position: sticky;
   bottom: 0px;
   background-color: #ffffff;
   padding-top: 10px;
   padding-bottom: 10px;
}

#menuDropdown li ul #logout:hover,
#menuDropdown li ul #unimpersonate:hover {
   background-color: #ffffff;
   cursor: default;
}

#menuDropdown li ul #logout .psoda_icon,
#menuDropdown li ul #unimpersonate .psoda_icon {
   padding-right: 10px;
}

#menuDropdown li ul #unimpersonate a .psoda_icon use {
   fill: var(--icon_red) !important;
}

#menuDropdown li ul #logout a,
#menuDropdown li ul #unimpersonate a {
   /* background-repeat: no-repeat;
   background-size: 18px 18px;
   background-position: 7.5px; */
   font-weight: bold;
   display: inline-block;
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 10px;
   padding-bottom: 10px;
   margin-left: 10px;
   border-radius: 5px;
   width: auto;
   height: 18.4px;
}

#menuDropdown li ul #logout a:hover,
#menuDropdown li ul #unimpersonate a:hover {
   background-color: #eaeaea;
}

#menuDropdown li ul #logout a {
   /* background-image: url(/images/icons/darkgrey/logout.svg); */
}

#menuDropdown li ul #unimpersonate a {
   /* background-image: url(/images/icons/red/unimpersonate.svg); */
   color: #F46464;
}


#menuDropdown li ul #user_menu_apps {
   float: right;
   padding-left: 37px;
   padding-right: 10px;
   padding-top: 10px;
   padding-bottom: 10px;
   margin-right: 10px;
   margin-left: 10px;
   border-radius: 5px;
   background-image: url(/images/user_menu_apps.svg);
   background-repeat: no-repeat;
   background-position: 7px center;
   background-size: 20px auto;
   cursor: pointer;
}

#menuDropdown li ul #user_menu_apps_caret {
   transform: rotate(-90deg);
   margin-left: 5px;
   transition: .2s ease;
}

#menuDropdown li ul #user_menu_apps:hover {
   background-color: #eaeaea;
}


#notificationDropdown li ul li:hover {
   background-color: #f7f7f7;
   filter: grayscale(0%);
   opacity: 1;
}

#menuDropdown li ul li.separator {
   border-top:1px solid #d7d7d7;
}

/**** Context menu ****/
.contextmenu_div {
	position:absolute;
	background:#FFFFFF;
	/* border:1px solid #555555; */
   -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px;
   padding-top:5px;
   padding-bottom:5px;
   -moz-box-shadow: var(--box_shadow);
    -webkit-box-shadow: var(--box_shadow);
    box-shadow: var(--box_shadow);
    min-width: 150px;
}

.contextmenu_div a {
	display:block;
	padding-left:10px;
   padding-right:10px;
   padding-top:5px;
	padding-bottom:5px;
	color:#404040;
}

.contextmenu_div a:hover {
   background-color: #f7f7f7;
   text-decoration:none;
}

/* Apps menu */
#user_menu_app_menu_outer {
   display: none;
   margin: 0px;
   padding: 10px 20px 10px 20px;
   width: 22.5em;
   position: absolute;
   bottom: 51px;
   left: calc(22.5em + 10px + 10px + 5px);
   background: white;
   text-align: left;
   z-index: 1500;
   font-size: 1em;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow); 
}

#user_menu_app_menu_outer.user_menu_app_open {
   display: block;
}

#user_menu_app_menu_header {
   font-weight: bold;
   font-size: 1.1em;
   margin-bottom: 10px;
}

.user_menu_app_menu_item {
   width: 16em;
   display: inline-block;
   vertical-align: middle;
   margin-top: 10px;
   margin-bottom: 10px;
}

.user_menu_app_menu_descr {
   color: #969696;
   font-size: .9em;
}

.user_menu_app_menu_launch {
   display: inline-block;
   vertical-align: middle;
   /* width: 4em; */
   padding: 5px 10px 5px 10px;
   background-color: #F58836;
   /* background-image: url(/images/icons/white/import.svg);
   background-repeat: no-repeat;
   background-position: 7.5px center;
   background-size: 16px; */
   border-radius: 5px;
   color: #ffffff;
}

.user_menu_app_menu_launch:hover {
   opacity: .9;
}

.user_menu_app_menu_launch .psoda_icon {
   margin-right: 5px;
}

#user_menu_app_menu_psodatime + a .user_menu_app_menu_launch {
   background-color: #464674;
}

#user_menu_app_menu_psodawatch + a .user_menu_app_menu_launch {
   background-color: #FBDE44;
   color: #28334A;
   /* background-image: url(/images/icons/darkgrey/import.svg); */
}

#user_menu_app_menu_psodawatch + a .user_menu_app_menu_launch use {
   fill: #28334A !important;
}

#user_menu_app_menu_psodaforms + a .user_menu_app_menu_launch {
   background-color: #5CA856;
}

#user_menu_app_menu_pocketvision + a .user_menu_app_menu_launch {
   background-color: #9659FE;
}

#user_menu_app_menu_pocketvision img {
   vertical-align: middle;
}

.user_menu_app_menu_pocketvision_beta {
   display: inline-block;
   background-color: #F58836;
   color: #ffffff;
   padding: 3px 10px 3px 10px;
   border-radius: 5px;
   vertical-align: middle;
   margin-left: 20px;
   font-size: .75em;
}

/**** Site utilities ****/

.navigator_expanded #siteutils {
   height: 45px;
   padding-right: 10px;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
}

#siteutils {
   background: var(--navigator_hover);
   color:var(--font);
   z-index:5;
   height: 100px;
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 5px;
   padding-right: 5px;
	border-bottom-right-radius: 10px;
}

#siteutils h1 {
   position:absolute;
   left:-9999px;
}

#siteutils a {
   text-decoration:none;
   color:var(--font);
}

#siteutils img {
   border:none;
}

/** WILLS NEW HEADER **/

#menuDropdown.menuOpen>li>ul,
#notificationDropdown.notificationOpen li ul {
   display: block;
}

#menuDropdown > li > .photo_thumbnail {
   height: 30px;
   width: 30px;
   vertical-align: top;  
   }
   
   /* #menuDropdown > li {
      padding-left: 12.5px;
      padding-right: 12.5px;
      cursor: pointer;
   } */

   #siteutils > .graphicsonly{
margin-left: 12.5px;
font-size: 20px;
vertical-align: middle;
color: #a1a1a1;
cursor: default;
   }

   /* .flag_uk, .flag_us, .flag_za, .flag_cn, .flag_ru, .flag_ja {
      display: inline-block;
      height: 25px;
      vertical-align: middle;
      padding-top: 5px;
      padding-left: 50px;
      padding-right: 12.5px;
      background-repeat:no-repeat;
      background-position:25px center;
      background-size:20px 20px;
   }

   .flag_uk:hover, .flag_us:hover, .flag_za:hover, .flag_cn:hover, .flag_ja:hover, .flag_ru:hover {
      opacity: 0.75;
      cursor: pointer;
   }
   
   #langDropdown.langOpen .flag_uk:hover, #langDropdown.langOpen .flag_us:hover, #langDropdown.langOpen .flag_za:hover, #langDropdown.langOpen .flag_cn:hover, #langDropdown.langOpen .flag_ja:hover, #langDropdown.langOpen .flag_ru:hover {
      opacity: 1;
   }
      
   #langDropdown.langOpen .flag_uk {
      background-image: url(/images/icon_lang_menu_nz.svg);
   }
   
   #langDropdown.langOpen .flag_us {
      background-image: url(/images/icon_lang_menu_us.svg);
   }
   
   #langDropdown.langOpen .flag_za {
      background-image: url(/images/icon_lang_menu_za.svg);
   }
   
   #langDropdown.langOpen .flag_cn {
      background-image: url(/images/icon_lang_menu_cn.svg);
   }
   
   #langDropdown.langOpen .flag_ja {
      background-image: url(/images/icon_lang_menu_ja.svg);
   }
   
   #langDropdown.langOpen .flag_ru {
      background-image: url(/images/icon_lang_menu_ru.svg);
   } */


   /* #themeDropdown li ul {
      margin:0px;
      padding:10px 0px 10px 0px;
      display:none;
      width:38.5em;
      position:absolute;
      right: 0px;
      background:white;
      text-align:left;
   font-size: 1.15em;
      -webkit-box-shadow:var(--box_shadow);
      -moz-box-shadow:var(--box_shadow);
      box-shadow:var(--box_shadow);
   }

.theme_image {
   height: 80px;
}

#themeDropdown li ul #night_theme:hover {
   background-color: #f7f7f7;
}

#themeDropdown li ul #night_theme .theme_image {
   background-image: url(/images/icon_theme_menu_night.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: auto;
}

#themeDropdown li ul #night_theme.night_selected {
   border-bottom: 5px solid var(--main_colour);
   background-color: #eaeaea;
}

#themeDropdown li ul #purple_theme:hover {
   background-color: #f7f7f7;
}

#themeDropdown li ul #purple_theme .theme_image {
   background-image: url(/images/icon_theme_menu_purple.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: auto;
}

#themeDropdown li ul #purple_theme.purple_selected {
   border-bottom: 5px solid #6D7AE0;
   background-color: #eaeaea;
}

#themeDropdown li ul #psodared_theme:hover {
   background-color: #f7f7f7;
}

#themeDropdown li ul #psodared_theme .theme_image {
   background-image: url(/images/icon_theme_menu_psodared.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: auto;
}

#themeDropdown li ul #psodared_theme.psodared_selected {
   border-bottom: 5px solid #F58836;
   background-color: #eaeaea;
} */

/* #themeDropdown li ul #charcoal_theme:hover {
   background-color: #f7f7f7;
}

#themeDropdown li ul #charcoal_theme .theme_image {
   background-image: url(/images/icon_theme_menu_charcoal.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: auto;
}

#themeDropdown li ul #charcoal_theme.charcoal_selected {
   border-bottom: 5px solid #FDF39C;
   background-color: #eaeaea;
} */

/* #themeDropdown li ul #green_theme:hover {
   background-color: #f7f7f7;
}

#themeDropdown li ul #green_theme .theme_image {
   background-image: url(/images/icon_theme_menu_green.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: auto;
}

#themeDropdown li ul #green_theme.green_selected {
   border-bottom: 5px solid var(--main_colour);
   background-color: #eaeaea;
} */

/* #themeDropdown li ul #sky_theme:hover {
   background-color: #f7f7f7;
}

#themeDropdown li ul #sky_theme .theme_image {
   background-image: url(/images/icon_theme_menu_sky.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: auto;
}

#themeDropdown li ul #sky_theme.sky_selected {
   border-bottom: 5px solid #364C60;
   background-color: #eaeaea;
} */

/* #themeDropdown li ul #osx_theme:hover {
   background-color: #f7f7f7;
}

#themeDropdown li ul #osx_theme .theme_image {
   background-image: url(/images/icon_theme_menu_osx.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: auto;
}

#themeDropdown li ul #osx_theme.osx_selected {
   border-bottom: 5px solid #737373;
   background-color: #eaeaea;
}

#themeDropdown li ul #normal_theme:hover {
   background-color: #f7f7f7;
}

#themeDropdown li ul #normal_theme .theme_image {
   background-image: url(/images/icon_theme_menu_normal.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: auto;
}

#themeDropdown li ul #normal_theme.normal_selected {
   border-bottom: 5px solid #4B86B4;
   background-color: #eaeaea;
}

#themeDropdown li ul #dark_theme:hover {
   background-color: #f7f7f7;
}

#themeDropdown li ul #dark_theme .theme_image {
   background-image: url(/images/icon_theme_menu_dark.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin: auto;
}

#themeDropdown li ul #dark_theme.dark_selected {
   border-bottom: 5px solid #1f1f1f;
   background-color: #eaeaea;
}

#themeDropdown li ul #text_high_themes:hover {
   background: none;
}

#themeDropdown li ul #textonly_theme {
   background-image: url(/images/theme_menu_text_only_hover.svg);
    background-repeat: no-repeat;
    background-size: 20px 20px;
    background-position: 15px;
    padding-left: 50px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 15px;
} */

/* #themeDropdown li ul #textonly_theme:hover {
   background-color: #f7f7f7;
}

#themeDropdown li ul #inverse_theme {
   background-image: url(/images/theme_menu_contrast_hover.svg);
    background-repeat: no-repeat;
    background-size: 20px 20px;
    background-position: 15px;
    padding-left: 50px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 0px;
}

#themeDropdown li ul #inverse_theme:hover {
   background-color: #f7f7f7;
} */

/* Notifications menu */

#notificationDropdown > .notification_menu_bell {
   display:inline-block;
   height:25px;
   vertical-align: middle;
   padding-top: 15px;
   padding-bottom: 5px;
   padding-left: 12px;
   padding-right: 12px;
   /* background-repeat:no-repeat;
   background-position:center center;
   background-size:20px 20px; */
}

#notificationDropdown > .notification_menu_bell {
   /* background-image: url(/images/icons/white/notification.svg); */
   cursor: pointer;
   /* vertical centering all menu items: */
   /* margin-top: 5px;
   margin-bottom: 5px; */
}

#notificationDropdown > .notification_menu_bell.notification_menu_bell_off {
   /* background-image: url(/images/icons/white/notification_off.svg) !important; */
   cursor: pointer;
   /* vertical centering all menu items: */
   /* margin-top: 5px;
   margin-bottom: 5px; */
}

#notificationDropdown > .notification_menu_bell:hover {
   /* opacity: 0.75; */
   cursor: pointer;
}

#notificationDropdown.notificationOpen>li:hover {
   opacity: 1;
}

#notificationDropdown.notificationOpen>.notification_menu_bell, #notificationDropdown > .notification_menu_bell.notify {
   /* background-image: url(/images/icons/darkgrey/notification_on.svg); */
}

.notification_menu_bell.notify .notification_menu_number {
   position: absolute;
   background: #ff3333;
   margin-left: 10px;
   margin-top: -12px;
   padding-top: 1px;
   padding-bottom: 0px;
   padding-left: 5px;
   padding-right: 5px;
   border-radius: 10px;
   font-size: 11px;
   font-weight: bold;
   color: #fff;
}

.notification_menu_bell.notify #notification_icon use {
   fill: #F2B126 !important;
}

#notificationDropdown li ul {
   margin:0px;
   padding:10px 0px 0px 0px;
   display:none;
   width:400px;
   position:absolute;
   height: calc(100vh - 185px);
   right: 0px;
   background:white;
   text-align:left;
font-size: 1.15em;
   -webkit-box-shadow:var(--box_shadow);
   -moz-box-shadow:var(--box_shadow);
   box-shadow:var(--box_shadow); /*CSS3 shadow*/
   cursor: default;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   border-radius: 10px;
}

#notificationDropdown a {
   text-decoration: none;
    color: var(--font_link);
}

#notificationDropdown a:hover {
   text-decoration: none;
    color: var(--font_link_hover);
}

.notification_menu_outer {
   padding-bottom: 10px;
}

.notification_menu_header {
   font-weight: bold;
   margin-left: 20px;
   font-size: 1.5em;
   display: inline-block;
   vertical-align: middle;
}

.notification_menu_options {
   float: right;
   vertical-align: middle;
   margin-right: 20px;
   margin-top: 5px;
   width: 24px;
   height: 24px;
   /* background-image: url(/images/icons/darkgrey/threedot.svg);
   background-size: 20px;
   background-repeat: no-repeat;
   background-position: center; */
   cursor: pointer;
}

.notification_menu_options:hover {
   /* background-image: url(/images/icon_actionmenu_dark.svg); */
}

.notification_menu_options_container {
   display: none;
   position: absolute;
   right: 20px;
   width: 300px;
   background-color: #fff;
   -webkit-box-shadow:var(--box_shadow);
   -moz-box-shadow:var(--box_shadow);
   box-shadow:var(--box_shadow); /*CSS3 shadow*/
   border-radius: 10px;
   padding-top: 10px;
   padding-bottom: 10px;
   z-index: 1;
}

.notification_menu_options_container.notification_submenu_open {
   display: block;
}

.notification_menu_options_container div {
   color: var(--font_grey);
   cursor: pointer;
   padding-left: 20px;
   padding-right: 20px;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   /* background-position: 20px center;
   background-repeat: no-repeat;
   background-size: 15px; */
}

.notification_menu_options_container .psoda_icon {
   padding-right: 10px;
}

.notification_menu_options_container .notification_menu_markall {
   /* background-image: url(/images/icons/darkgrey/tick.svg); */
}

.notification_menu_options_container .notification_menu_prefs {
   /* background-image: url(/images/icons/darkgrey/settings.svg); */
}

.notification_menu_options_container .notification_menu_viewall {
   /* background-image: url(/images/icons/darkgrey/risk_nochange.svg); */
}

.notification_menu_options_container .notification_menu_help {
   /* background-image: url(/images/icons/darkgrey/help.svg); */
}

.notification_menu_options_container div:hover {
   background-color: #f7f7f7;
   color: var(--font);
}

.notification_menu_off_content {
   text-align: center;
   margin:auto;
   margin-top: 50px;
}

.notification_menu_off_content img {
   width: 150px;
   height: auto;
   opacity: .5;
   text-align: center;
   margin-bottom: 20px;
}

.notification_menu_loader {
   height: calc(100% - 39px);
   width: 100%;
}

/* .notification_menu_loader_gif {
   background-image:url(/images/ajax-loader-night.gif);
   background-size:20px 20px;
   background-repeat:no-repeat;
   background-position:center center;
   margin: auto;
   width: 50px;
   height: 50px;
} */

.notification_menu_content_viewmore {
   margin-left: 20px;
   margin-right: 20px;
   padding: 5px;
   width: calc(100% - 50px);
   background-color: #f7f7f7;
   color: #9C9691;
   text-align: center;
   border-radius: 3px;
   margin-top: 20px;
   margin-bottom: 20px;
}

.notification_menu_content_viewmore.notification_menu_content_viewmore_with_number {
   background-color: #FFF8EA;
   color: #F2B126;
   font-weight: bold;
}

.notification_menu_content_viewmore:hover {
   background-color: #eaeaea;
   color: #7a7a7a;
}

.notification_menu_content_viewmore.notification_menu_content_viewmore_with_number:hover {
   background-color: #FDEDCA;
   color: #F2B126;
   font-weight: bold;
}

.notification_menu_content_viewmore div {
   display: inline-block;
   vertical-align: middle;
}

.notification_menu_content_viewmore_number {
   background: #ff3333;
   margin-left: 5px;
   /* padding-top: 1px; */
   padding-bottom: 0px;
   padding-left: 5px;
   padding-right: 5px;
   /* width: 10px;
   height: 10px; */
   border-radius: 10px;
   font-size: 11px;
   font-weight: bold;
   color: #fff;
}

.notification_menu_content_outer {
   overflow:auto;
   height: calc(100% - 39px);
}

.notification_item_container, .notification_item_container_new {
   padding-left: 20px;
   padding-right: 20px;
   padding-top: 10px;
   padding-bottom: 10px;
}

.notification_item_container_new {
   background-color: var(--light_transparent);
}

.notification_item_image_container {
   display: inline-block;
   vertical-align: top;
   width: 64px;
   height: 64px;
   margin-right: 10px;
   position: relative;
}

.notification_item_image_container img {
	border-radius: 32px;
}

.notification_item_image_container.notification_image_icon {
   background-color: #eaeaea;
   border-radius: 64px;
}

.notification_item_image_container .psoda_icon svg {
   /* border-radius: 64px;
   width: 64px;
   height: 64px; */
   padding: 17px;
}

.notification_item_image_container.notification_image_icon img {
   width: 32px;
   height: 32px;
   margin-top: 16px;
   margin-left: 16px;
   border-radius: 0px;
}

.notification_item_text_container {
   display: inline-block;
   vertical-align: middle;
   width: 200px;
}

.notification_item_text {
   margin-bottom: 5px;
   font-size: .9em;
}

.notification_item_time {
   color: #9C9691;
   font-size: .9em;
   display: inline-block;
   vertical-align: middle;
}

.notification_item_container_new .notification_item_time {
   color: var(--main_colour);
   font-weight: bold;
}

.notification_item_emailed {
   display: inline-block;
   width: 20px;
   height: 20px;
   /* background-image: url("/images/icons/lightgrey/email.svg");
   background-size: 15px;
   background-position: center;
   background-repeat: no-repeat; */
   vertical-align: middle;
   margin-left: 10px;
   /* opacity: .75; */
}

.notification_item_emailed .psoda_icon {
   vertical-align: sub;
}

.new_notification {
   float: right;
   background-color: var(--main_colour);
   color: white;
   font-weight: bold;
   font-size: 10px;
   text-align: center;
   /* padding: 5px; */
   padding-top: 2px;
   padding-bottom: 2px;
   border-radius: 20px;
   margin-top: 23px;
   width: 50px;
}

   /* #langDropdown li ul {
      margin:0px;
      padding:10px 0px 10px 0px;
      display:none;
      width:24.5em;
      position:absolute;
      right: 0px;
      background:white;
      text-align:left;
      z-index:1500;
   font-size: 1.15em;
      -webkit-box-shadow:var(--box_shadow);
      -moz-box-shadow:var(--box_shadow);
      box-shadow:var(--box_shadow);
   }

   #langDropdown li {
      text-decoration:none;
   } */

   #menuDropdown li ul {
      margin:0px;
      padding:10px 0px 0px 0px;
      display:none;
      width:22.5em;
      position:absolute;
      /* top:1.8em; */
      font-size: 1.15em;
      right:0px;
      background:#FFFFFF;
      text-align:left;
   
      /* -webkit-border-radius:5px;
      -moz-border-radius:5px;
      border-radius:5px; */
      -webkit-box-shadow:var(--box_shadow);
      -moz-box-shadow:var(--box_shadow);
      box-shadow:var(--box_shadow); /*CSS3 shadow*/
   }

   .user_avatar {
      position:relative;
   }

   .status_state {
      position:absolute;
      height: 10px;
      width: 10px;
      margin-left: 20px;
   }

   #menuDropdown .status_state {
      margin-top: 5px;
   }

   .displaydetails .status_state, .displaylist .status_state {
      margin-left: 16px;
      /* border: 1px solid #fff !important; */
   }

   .backArrow {
      text-decoration: none;
      color: var(--font_grey);
      /* padding-left: 12.5px;
      padding-right: 41px;
      padding-bottom: 10px; */
      display: inline-block;
      width: 40px;
      height: 20px;
      padding-top: 7.5px;
      padding-bottom: 7.5px;
      margin-left: 5px;
      margin-right: 5px;
      background-repeat: no-repeat;
      background-position: center;
      background-size: 20px 20px;
      vertical-align: middle;
	  cursor:pointer;
   }

   /* .backArrow {
      background-image: url(/images/header/navigator_back_icon.svg)
   } */

	.backArrow .psoda_icon svg {
		margin-left: 10px;
	}

	.backArrow .psoda_icon svg use {
		fill: var(--navigator_font) !important;
	}

   .backArrow:hover {
      background-color: var(--navigator_hover);
      border-radius: 5px;
   }


   .backArrow.disabled {
	   opacity:0.3;
	   pointer-events:none;
   }

   /* .backArrow:hover, .backArrow::before {
      background-image: url(/images/header/back_button_green.svg)
   } */

/* #langDropdown ul li a {
   display:block;
   padding-top:10px;
   padding-bottom:10px;
   text-align: center;
   width: 100px;
}

#themeDropdown ul li span {
   display:block;
   padding-top:10px;
   padding-bottom:10px;
   text-align: center;
} */

#notificationDropdown ul li span {
   display:block;
   padding-top:10px;
   padding-bottom:10px;
   text-align: center;
}

#menuDropdown ul li a, #user_menu_about_menu div li a {
   /* display: block;
   padding-top: 10px;
   padding-bottom: 10px;
   padding-left: 50px; */
   display: block;
   width: 100%;
   height: 100%;
   padding: 10px;
   padding-left: 0px;
}

#menuDropdown #guidedtour div, #menuDropdown #about div {
   padding: 10px;
   padding-left: 0px;
}

#menuDropdown #support a {
   padding: 0px;
}

/* About user menu */
#menuDropdown #user_menu_about_caret {
   margin-left: 7.5px;
   transform: rotate(-90deg);
}

#user_menu_about_menu {
   margin: 0px;
   padding: 10px 0px 0px 0px;
   display: none;
   width: 23.3em;
   position: absolute;
   /* font-size: 1.15em; */
   background: #FFFFFF;
   text-align: left;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
   bottom: 51px;
   left: 10px;
   top: auto;
   z-index: 6;
   border-radius: 10px;
}

#user_menu_about_menu.user_menu_about_open {
   display: block;
}

#about_menu_date {
   text-align: center;
   padding-top: 20px;
   padding-bottom: 20px;
   font-size: .9em;
}

#about_menu_date .about_menu_date_string {
   display: inline-block;
   /* background-image: url(/images/icons/darkgrey/roster.svg);
   background-position: left center;
   background-repeat: no-repeat;
   background-size: 16px; */
   padding-left: 10px;
}

#about_menu_date .about_menu_date_string .psoda_icon {
   padding-right: 10px;
}

#about_menu_date a {
   display: inline-block;
   color: var(--font_link);
   margin-left: 20px;
}

#about_menu_date a:hover {
   color: var(--font_link_hover);
}

#user_menu_about_menu #user_top {
   position: relative;
   font-size: 1.05em;
   padding-bottom: 30px;
   text-align: center;
}

#user_menu_about_menu #user_top .about_menu_logo {
   padding-bottom: 20px;
   padding-top: 20px;
}

#user_menu_about_menu #user_top .about_menu_go_back {
   text-align: left;
   vertical-align: middle;
   font-size: .8em;
   margin-left: 10px;
   cursor: pointer;
   padding: 5px;
   border-radius: 5px;
   width: max-content;
}

#user_menu_about_menu #user_top .about_menu_go_back:hover {
   background-color: #eaeaea;
}

#user_menu_about_menu #user_top .about_menu_go_back div {
   vertical-align: middle;
   display: inline-block;
}

#user_menu_about_menu #user_top .about_menu_go_back svg {
   transform: rotate(180deg);
   margin-right: 5px;
   vertical-align: middle;
   display: inline-block;
}

.user_menu_caret {
   padding-left: 10px;
   pointer-events: none;
   position: relative;
   top: -2px;
}

.user_menu_caret svg {
   transform: rotate(-90deg);
}

/* onclick menu animation (behind icon) */

#lang_animation_div {
   width: 20px;
   height: 20px;
   background: #eaeaea;
   border-radius: 100%;
   position: absolute;
   display: inline-block;
   top: 1px;
   z-index: -1;
   left: 25px;
   opacity: 0;
}

#theme_animation_div {
   width: 20px;
   height: 20px;
   background: #eaeaea;
   border-radius: 100%;
   position: absolute;
   display: inline-block;
   top: 1px;
   z-index: -1;
   left: 15px;
   opacity: 0;
}

#notification_animation_div {
   width: 20px;
   height: 20px;
   background: #eaeaea;
   border-radius: 100%;
   position: absolute;
   display: inline-block;
   top: 1px;
   z-index: -1;
   left: 15px;
   opacity: 0;
}

#menu_animation_div {
   width: 27px;
   height: 27px;
   background: #eaeaea;
   border-radius: 100%;
   position: absolute;
   display: inline-block;
   top: -3px;
   z-index: -1;
   left: 14px;
   opacity: 0;
}

#lang_animation_div.menu_animation,
#theme_animation_div.menu_animation,
#menu_animation_div.menu_animation,
#notification_animation_div.menu_animation {
   animation: menu_animation .3s ease;
}

@keyframes menu_animation {
   0% {
      transform: scale(.75);
      opacity: 0;
   }

   50% {
      transform: scale(1.5);
      opacity: 1;

   }

   100% {
      transform: scale(1.75);
      opacity: 0;

   }
}


/**** Main menu ****/

#mainmenu {
   height:24px;
   background:#6d99c0;
}

#mainmenu ul {
   padding-left:20px;
   padding-right:20px;
   margin:0px;
}

#mainmenu ul li {
   background:#6d99c0;
   list-style : none;
}

.selected {
   float:left;
   border-right:1px solid white;
}

.selected a {
   display:block;
   padding-top:0.3em;
   padding-bottom:0.3em;
   padding-left:5px;
   padding-right:5px;
   text-decoration:none;
   font-weight:bold;
   font-size:0.9em;
   color:white;
}

.selected a:hover {
   color:#233D7A;
   background:white;
}

.option {
   float:left;
   border-right:1px solid white;
}

.option a {
   display:block;
   padding-top:0.3em;
   padding-bottom:0.3em;
   padding-left:5px;
   padding-right:5px;
   text-decoration:none;
   font-weight:bold;
   font-size:0.9em;
   color:white;
}

.option a:hover {
   color:#233D7A;
   background:white;
}

.lastoption a {
   display:block;
   width:5.5em;
   padding-top:0.3em;
   padding-bottom:0.3em;
   padding-left:5px;
   padding-right:0px;
   text-decoration:none;
   font-weight:bold;
   font-size:0.9em;
   color:white;
}

.lastoption a:hover {
   color:#233D7A;
   background:white;
}

.lastoption img {
   margin-left:10px;
   vertical-align:bottom;
   border-top:none;
   border-left:solid 1px #233D7A;
   border-bottom:solid 1px #233D7A;
   border-right:solid 1px #233D7A;
}

/**** drop-menu ****/
hr {
   clear:both;
   margin-bottom:30px;
}
.left {
   clear:both;
}

/**** Content ****/

#content {
   position:relative;
   clear:left;
   height:400px;
/* border-top:1px solid #6D99C0; */
}

html>body #content {
   height:auto;
   min-height:400px;
}

#shiftedcontent {
   margin-left:200px;
}

#contentarea {
   height:400px;
}

html>body #contentarea {
   height:auto;
   min-height:400px;
}

#frontpage {
   font-size:1.4em;
   padding-top:180px;
   padding-bottom:182px;
   text-align:center;
   background:white;
}

html>body .normalview.loginpage, html>body .normalview.resetpassword {
   height: 100vh;
   background: #FEF9F5;
   padding-bottom: 0;
   background-image: url(/images/login_background.png);
   background-position: left bottom;
   background-repeat: no-repeat;
   background-size: 100vw;
	min-height:725px;
}

html>body .normalview.loginpage.login_app_psodatime, html>body .normalview.resetpassword.login_app_psodatime {
   background-image: url(/images/login_background_time.png);
}

html>body .normalview.loginpage.login_app_psodawatch, html>body .normalview.resetpassword.login_app_psodawatch {
   background-image: url(/images/login_background_watch.png);
}

html>body .normalview.loginpage.login_app_psodaforms, html>body .normalview.resetpassword.login_app_psodaforms {
   background-image: url(/images/login_background_forms.png);
}


.login_logo {
   height: 150px;
   width: 300px;
   background-image: url('/images/psoda_logo_main_2020.svg');
   background-repeat: no-repeat;
   background-position: center;
   background-size: 200px;
   text-align: center;
   margin: auto;
}

.login_app_psodatime .login_logo {
   background-image: url('/images/psodatime_logo.svg');
   background-size: 275px;
}

.login_app_psodatime .login_popup input[type="submit"], .login_app_psodatime .login_button_logoutpage {
	background-color: #464674;
}

.login_app_psodatime.loginpage .login_button:hover, .login_app_psodatime .login_button_logoutpage:hover {
	background-color: #4f4f80;
}

.login_app_psodawatch .login_logo {
   background-image: url('/images/psoda_watch_logo_text_dark.svg');
   background-size: 300px;
}

.login_app_psodawatch .login_popup input[type="submit"], .login_app_psodawatch .login_button_logoutpage {
	background-color: #FBDE44;
	color: #28334A !important;
}

.login_app_psodawatch.loginpage .login_button:hover, .login_app_psodawatch .login_button_logoutpage:hover {
	background-color: #f0d136;
}

.login_app_psodaforms .login_logo {
   background-image: url('/PsodaForms/images/psoda_forms_logo.svg');
   background-size: 300px;
}

.login_app_psodaforms .login_popup input[type="submit"], .login_app_psodaforms .login_button_logoutpage {
	background-color: #5CA856;
}

.login_app_psodaforms.loginpage .login_button:hover, .login_app_psodaforms .login_button_logoutpage:hover {
	background-color: #65b360;
}





.normalview .login_popup h1 {
   font-size: 1em;
   display: block;
    margin-block-start: 0.83em;
    margin-block-end: 0.83em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
    color: var(--font_grey);
    padding-left: 0px;
}

.loginpage .login_terms {
   color: #8a8a8a;
   font-size: .9em;
   bottom: 0;
   position: absolute;
   padding: 10px;
   margin-left: 30px;
    margin-right: 30px;
    margin-bottom: 0px;
}

#loginmessage {
   margin-bottom:5px;
   text-align:center;
   /* background:white; */
   padding: 3px;
   border-radius: 5px;
   padding-left: 5px;
   padding-right: 5px;
   background: #ffdddd;
   font-weight: bold;
   margin-left: 30px;
   margin-right: 30px;
}

#loginform {
   margin-top:40px;
   padding-top:20px;
   padding-bottom:20px;
   text-align:center;
   background:white;
   border-top:2px solid #BBBBBB;
   border-left:2px solid #BBBBBB;
   border-bottom:2px solid #888888;
   border-right:2px solid #888888;
   width:540px;
   margin-left:50%;
   position:relative;
   left:-270px;
}

#login_username {
   text-align:left;
   padding-left: 30px;
   font-weight: bold;
   margin-top: 20px;
}

#loginmessage + form #login_username {
   margin-top: 10px;
}

#login_username input {
    width:320px;
    height: 30px;
    background-color: #f7f7f7 !important;
    border: 2px solid #eaeaea;
    border-radius: 5px;
    padding: 5px;
    color: var(--font_grey);
    padding-left: 10px;
    margin-top: 5px;
}

#login_username input::placeholder, #login_password input::placeholder {
   color: #a0a0a0;
}

#login_password {
   text-align:left;
   padding-left: 30px;
   font-weight: bold;
   margin-top: 20px;
}

#togglePassword,#togglePassword1,#togglePassword2{
   cursor: pointer;
   height: 24px;
   width: 24px;
   display: block;
   margin-top: -34px;
   margin-left: 310px;
   position: absolute;
   background-size: 16px;
   background-repeat: no-repeat;
   background-position: center;
}


#login_password input::-ms-reveal,
#login_password input::-ms-clear {
        display: none;
      }

#login_password input {
   width:320px;
    height: 30px;
    background-color: #f7f7f7;
    border: 2px solid #eaeaea;
    border-radius: 5px;
    padding: 5px;
    color: var(--font_grey);
    padding-left: 10px;
    margin-top: 5px;
}



#logoutmessage {
   font-size:1em;
   margin-top:20px;
   text-align:center;
   font-weight: bold;
}

/**login button**/
.loginpage .login_button {
    background-color: #f58836;
    color: white;
    font-weight: bold;
    border: none;
    border-radius: 3px;
    padding: 6px;
    margin: auto;
    margin-bottom: 20px;
    margin-top: 25px;
    width: 336px;
    height: 44px;
    cursor: pointer; 
}

.loginpage .login_button:hover {
   background-color: #ec904b;
}

.login_button_logoutpage {
   background-color: #f58836;
   color: white;
   font-weight: bold;
   border: none;
   border-radius: 3px;
   padding: 6px;
   margin: auto;
   margin-bottom: 20px;
   margin-top: 50px;
   width: 336px;
   padding: 12px;
   cursor: pointer; 
}

.login_button_logoutpage:hover {
   background-color: #ec904b;
}

.login_failed_attempts {
   margin-top: -5px;
   margin-left: 30px;
   margin-right: 30px;
}

/*reset password*/

.reset_password_content {
   text-align: left;
   color: #8a8a8a;
    font-size: .78em;
    margin-left: 30px;
    margin-right: 30px;
}

.reset_password_message_text {
   /* color: #8a8a8a; */
   margin-left: 30px;
   margin-right: 30px;
}

/* login language */

.login_language {
   position: absolute;
   /* bottom: 10px; */
   top: 670px;
   margin-left: auto;
   margin-right: auto;
   left: 0;
   right: 0;
   text-align: center;
}

.login_language a {
   color: var(--font_grey);
}

.login_selected_lang_text {
   margin: 0;
   /* margin-top: 3px;
   margin-left: 3px; */
   color: var(--font_grey);
}

.login_language .theme_lang_menu_header {
	margin-left: 0px;
}

.login_language #langDropdown {
   position: static;
   margin: 0px;
   padding: 0px;
   text-decoration: none;
   font-size: 0.9em;
   display: inline-block;
}

.login_language #langDropdown.langOpen ul {
   display: block;
}

.login_language #langDropdown > li {
   text-decoration: none;
   display: inline-block;
   padding-left: 35px;
   /* margin-bottom: 10px; */
   /* margin-top: 17.5px; */
   /* height: 25px; */
   vertical-align: middle;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   padding-right: 10px;
   background-repeat: no-repeat;
   background-position: 10px center;
   background-size: 20px 20px;
   cursor: pointer;
   background-color: #ffffff;
   border-radius: 10px;
   vertical-align: middle;
}

.login_language #langDropdown li ul {
   bottom: 37px;
   margin-left: auto;
   margin-right: auto;
   left: 0;
   right: 0;
   text-align: center;
   padding: 10px 0px 10px 0px;
   display: none;
   width: 24.5em;
   position: absolute;
   background: white;
   z-index: 1500;
   font-size: 1.15em;
   -webkit-box-shadow: 0px 0px 10px rgb(0 0 0 / 30%);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: 0px 0px 10px rgb(0 0 0 / 30%);
   border-radius: 5px;
}

.login_language #langDropdown li ul li {
   display: inline-block;
   margin-bottom: 10px;
   margin-left: 10px;
   text-decoration: none;
   border-radius: 5px;
}

.login_language #langDropdown ul li a {
   display: block;
   padding-top: 10px;
   padding-bottom: 10px;
   text-align: center;
   width: 100px;
}

.login_language #langDropdown img {
   width: 40px;
   height: 40px;
   margin: auto;
   margin-bottom: 10px;
}

.login_language #langDropdown li ul li:hover {
   background-color: #f7f7f7;
}

.login_language .flag_uk {
   background-image: url(/images/icon_lang_menu_nz.svg);
}

.login_language .flag_us {
   background-image: url(/images/icon_lang_menu_us.svg);
}

.login_language .flag_za {
   background-image: url(/images/icon_lang_menu_za.svg);
}

.login_language .flag_cn {
   background-image: url(/images/icon_lang_menu_cn.svg);
}

.login_language .flag_ja {
   background-image: url(/images/icon_lang_menu_ja.svg);
}

.login_language .flag_ru {
   background-image: url(/images/icon_lang_menu_ru.svg);
}

.login_language #langDropdown .lang_selected {
   border-bottom: 5px solid var(--main_colour);
   background-color: #eaeaea;
   border-radius: 5px;
}

.login_language .user_menu_caret svg {
	transform: rotate(0deg);
}

.login_language .langOpen .user_menu_caret svg,
.login_language .login_app_switcher_open .user_menu_caret svg {
	transform: rotate(180deg);
}

#login_app_switcher {
	display: inline-block;
	margin-left: 20px;
	padding-left: 35px;
	padding-top: 7.5px;
	padding-bottom: 7.5px;
	padding-right: 10px;
	background-repeat: no-repeat;
	background-position: 10px center;
	background-size: 20px 20px;
	cursor: pointer;
	background-color: #ffffff;
	border-radius: 10px;
	font-size: 0.9em;
	background-image: url(/images/user_menu_apps.svg);
}

#login_app_switcher.login_app_switcher_open .login_app_switcher_menu {
	display: block;
}

.login_app_switcher_menu {
	display: none;
	bottom: 37px;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	text-align: center;
	padding: 10px 0px 10px 0px;
	display: none;
	width: 24.5em;
	position: absolute;
	background: white;
	z-index: 1500;
	font-size: 1.15em;
	-webkit-box-shadow: 0px 0px 10px rgb(0 0 0 / 30%);
	-moz-box-shadow: var(--box_shadow);
	box-shadow: 0px 0px 10px rgb(0 0 0 / 30%);
	border-radius: 5px;
}

#login_app_switcher ul {
	padding-left: 0;
}

#login_app_switcher li {
	display: inline-block;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: center;
	width: 100px;
	font-size: 1.05em;
	border-radius: 5px;
}

#login_app_switcher li img {
	vertical-align: top;
	display: block;
	margin: auto;
	margin-bottom: 10px;
}

#login_app_switcher li:hover {
	background-color: #f7f7f7;
}

/* TFA */

#login_tfa_code label {
   font-weight: bold;
}

#login_tfa_code input {
  
    height: 30px;
    background-color: #f7f7f7;
    border: 2px solid #eaeaea;
    border-radius: 5px;
    padding: 5px;
    color: var(--font_grey);
    padding-left: 10px;
    margin-top: 5px;
    letter-spacing: 40px;
    padding-left: 40px;
    font-size: 30px;
    width: 285px;
}

#login_tfa_code input::placeholder {
   color: #a0a0a0;
}

#login_tfa_code ~ .resend_button {
   text-decoration: none;
    color: var(--font_link) !important;
    background: none !important;
}

#login_tfa_code ~ .resend_button:hover {
    color: var(--font_link_hover) !important;
}

#errorpage {
   margin-top:40px;
   width:600px;
   margin-left:50%;
   position:relative;
   left:-300px;
   background:white;
   border-top:2px solid #BBBBBB;
   border-left:2px solid #BBBBBB;
   border-bottom:2px solid #888888;
   border-right:2px solid #888888;
}

#errorpage h1 {
   margin:0px;
   padding-bottom:2px;
   color:#FF0000;
   font-size:1em;
   text-align:center;
   background:#dddddd;
}

#errorpagecontent {
   padding-left:5px;
   padding-right:5px;
}

#elmsupport_col1 {
   margin-top:30px;
   width:45%;
   float:left;
   padding:10px;
}

#elmsupport_col2 {
   width:45%;
   margin-top:30px;
   float:right;
   padding:10px;
}

#elmsupport_clear {
   clear:both;
}

#pref_col1 {
   margin-top:30px;
   width:45%;
   float:left;
   padding:10px;
}

#pref_col2 {
   width:45%;
   margin-top:30px;
   float:right;
   padding:10px;
}

#pref_message {
   margin-top:80px;
   text-align:center;
}

#changepasswordmessage {
   margin-top:10px;
   text-align:center;
}

#changepasswordform {
   margin-top:10px;
   padding-bottom:20px;
   text-align:center;
   border:solid 1px black;
   margin-left:auto;
   margin-right:auto;
}

#changepasswordform form {
   display:inline;
}

#changepassword_who {
   background:#dddddd;
   padding-top:5px;
   padding-bottom:5px;
   margin-bottom:20px;
}

#changedetailsmessage {
   margin-top:40px;
   text-align:center;
}

#changedetailsform {
   margin-top:40px;
   padding-bottom:20px;
   text-align:center;
   border:solid 1px black;
   margin-left:auto;
   margin-right:auto;
}

#changedetailsform form {
   display:inline;
}

#changedetails_who {
   background:#dddddd;
   padding-top:5px;
   padding-bottom:5px;
   margin-bottom:20px;
}

.lastmessage {
   padding:25px;
   background-color: #ffffff;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
   border-radius: 5px;
   border-left: 12px solid var(--icon_green);
   display: table-cell;
   vertical-align: middle;
   position: fixed;
   right: 25px;
   bottom: 25px;
   width: 500px;
   z-index: 200;
   animation: lastmessage_animate 1s ease;
}

#lastmessage_error {
   border-left: 12px solid var(--icon_red);
}

#lastmessage_error em {
   color: #959595;
   font-style: normal;
}

.lastmessage.lastmessage_welcome {
   border-left: 12px solid var(--icon);
}

.lastmessage_content_img {
   width: 45px;
   height: 45px;
   display: inline-block;
   margin-right: 15px;
   vertical-align: top;
   margin-top: 5px;
	border: 2px solid var(--icon_green);
	border-radius: 45px;
}

#lastmessage_error .lastmessage_content_img {
	border: 2px solid var(--icon_red);
}

.lastmessage_welcome .lastmessage_content_img {
	border: 2px solid var(--icon);
}

.lastmessage_content_img svg {
	padding: 10px;
}

/* #lastmessage .lastmessage_content_img {
   background-image: url(/images/last_message_success_icon.svg);
}

#lastmessage_error .lastmessage_content_img {
   background-image: url(/images/last_message_error_icon.svg);
}

#lastmessage.lastmessage_welcome_morning .lastmessage_content_img {
   background-image: url(/images/last_message_morning_icon_night.svg);
}

#lastmessage.lastmessage_welcome_afternoon .lastmessage_content_img {
   background-image: url(/images/last_message_afternoon_icon_night.svg);
}

#lastmessage.lastmessage_welcome_evening .lastmessage_content_img {
   background-image: url(/images/last_message_evening_icon_night.svg);
} */

.lastmessage_content_inner {
   display: inline-block;
   width: calc(100% - 64px);
}

.lastmessage_content_title {
   color: var(--font);
   font-size: 20px;
   text-align: left;
   padding-bottom: 5px;
}

.lastmessage_content_message {
   color: var(--font_grey);
   font-size: 14px;
   text-align: left;
}

.lastmessage_content_close {
   position: absolute;
   top: 6px;
   right: 10px;
   color: var(--font_grey);
   font-size: 12px;
   text-transform: uppercase;
   /* background-image: url(/images/last_message_close_icon.svg);
   background-size: 9px;
   background-repeat: no-repeat; */
   padding-left: 15px;
   /* background-position: left 8px; */
   cursor: pointer;
   padding-top: 4px;
   padding-bottom: 4px;
}

.lastmessage_content_close:hover {
   color: #707070;
}

.lastmessage_content_close .psoda_icon {
	padding-right: 5px;
	vertical-align: top;
}

.lastmessage.closemessage {
    animation: lastmessage_close_animate 1s ease;
    bottom: -50px;
    opacity: 0;
}

/* lastmessage animation */

@keyframes lastmessage_animate {
    from {bottom: -50px; opacity: 0;}
    to {bottom: 25px; opacity: 1;}
}

@keyframes lastmessage_close_animate {
    from {bottom: 25px; opacity: 1;}
    to {bottom: -50px; opacity: 0;}
}

/*ACCESS DENIED PAGE */
.access_denied_outer {
   padding:25px;
   background-color: #ffffff;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
   border-radius: 5px;
   border-left: 12px solid #FB6060;
   width: 600px;
   margin: auto;
   margin-top: 65px;
}

.access_denied_img {
   width: 65px;
   height: 65px;
   display: inline-block;
   margin-right: 20px;
   vertical-align: top;
   margin-top: 5px;
   background-image: url(/images/icon_access_denied.svg);
}

.access_denied_inner {
   display: inline-block;
   width: calc(100% - 85px);
}

.access_denied_title {
   color: var(--font);
   font-size: 20px;
   text-align: left;
   padding-bottom: 5px;
}

.access_denied_message p {
   color: #959595;
   font-size: 14px;
   text-align: left;
}

.access_denied_button {
   text-align: center;
   color: #FB6060;
   border: 1px solid #FB6060;
   width: 150px;
   padding: 10px;
   border-radius: 5px;
   cursor: pointer;
   margin-top: 25px;
}

.access_denied_button:hover {
   color: #e23b3b;
   border: 1px solid #e23b3b;
}

.open_section {
   margin-bottom:5px;
   position:relative;
}

.open_section h2 {
   position:absolute;
   left:10px;
   top:-22px;
   background:white;
   padding-left:5px;
   padding-right:5px;
}

.open_section_content {
   padding-top:10px;
   border:1px solid gray;
}

.closed_section {
   background:#E7F1FB;
   padding-left:15px;
}

.welcome_message {
   background:#DDFFDD;
   border:1px solid #00FF00;
   -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px;
   margin-top:10px;
   margin-bottom:10px;
   padding:0px 10px 0px 10px;
   position:relative;
   width:800px;
   margin-left:auto;
   margin-right:auto;
}

.welcome_message h2 {
   text-align:center;
}

/**** Guided tour ****/
.guided_tour_close_button {
   display:block;
   width:16px;
   height:16px;
   overflow:hidden;
   /* background-image:url(/images/green_close_button_16.png);
   background-repeat:no-repeat;
   background-size:16px 16px; */
   position:absolute;
   top: 0px;
   right: 0px;
}

.guided_tour_close_button span {
   position:absolute;
   top:-9999px;
}

.guided_tour_next_button {
   font-weight:bold;
   color: #00AA00 !important;
   /* background-color:#00AA00; */ /*background color of tooltip*/
   border:2px solid #00AA00;
   border-radius:8px; /*CSS3 border radius*/
   -moz-border-radius:8px;
   -webkit-border-radius:8px;
   padding-top:3px;
   padding-bottom:3px;
   padding-left:10px;
   padding-right:10px;
   float:right;
}

.guided_tour_prev_button {
   font-weight:bold;
   color: #00AA00 !important;
   /* background-color:#00AA00; */ /*background color of tooltip*/
   border: 2px solid #00AA00;
   border-radius:8px; /*CSS3 border radius*/
   -moz-border-radius:8px;
   -webkit-border-radius:8px;
   padding-top:3px;
   padding-bottom:3px;
   padding-left:10px;
   padding-right:10px;
   float:left;
}

/**** NEW GUIDED TOUR ****/
.tour_popup {
   background: white;
   box-shadow: var(--popup_box_shadow);
   -webkit-box-shadow: var(--popup_box_shadow);
   -moz-box-shadow: var(--popup_box_shadow);
   height: 640px;
   width:700px;
   position: fixed;
   margin-left: auto;
   margin-right: auto;
   top: 39px;
   left: 0;
   right: 0;
   bottom: 0;
   z-index: 100;
   border-radius: 5px;
}

.tour_popup_anim_close {
   background: white;
   box-shadow: var(--popup_box_shadow);
   -webkit-box-shadow: var(--popup_box_shadow);
   -moz-box-shadow: var(--popup_box_shadow);
   height: 600px;
   width:700px;
   position: absolute;
   margin-left: auto;
   margin-right: auto;
   top: 59px;
   left: 0;
   right: 0;
   bottom: 0;
   z-index: 20;
   opacity: 0;
   transition: .5s ease;
}

.tour_header_outer {
   height: 40px;
}

.tour_gif_outer {
   height: 340px;
   background-color: #eaeaea;
   overflow: hidden;
      }

.tour_dots_outer {
   height: 10px;
   text-align: center;
   margin-top: 20px;
}

.tour_text_outer {
   height: 170px;
   overflow: hidden;
}

.tour_buttons_outer {
   height: 50px;
   
}

.tour_header_text {
   display: inline-block;
   float: left;
   margin-top: 10px;
   margin-left: 10px;
   font-family: var(--font_family);
   font-size: 1.17em;
   font-weight: bold;
   color: var(--font_grey);
}

.tour_header_close {
   /* background-image: url(/images/popup_x_grey.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 21px 21px; */
   display: inline-block;
   width: 21px;
   height: 21px;
   padding-bottom: 3px;
   padding-top: 5px;
   float: right;
   cursor: pointer;
   margin-left: 10px;
   margin-right: 10px;
}

/* .tour_header_close:hover {
   background-image: url(/images/popup_x_orange.svg);
} */

.tour_gif {
   background-color: #eaeaea;
   height: 340px;
   width: 5600px;
   transition: 1s ease;
}

.tour_gif_img {
   /* height: auto;
   width: 575px; */
   width: 100%;
   transition: 1s ease;
}

.tour_gif_div {
   height: 325.5px;
   margin-top: 10px;
   width: 575px;
   margin-left: 62.5px;
   margin-right: 62.5px;
   margin-bottom: 6.25px;
   float: left;
   transition: 1s ease; 
   left: 0px;
   top: 36.25px;
}

#tour_gif_div_7 {
   margin: 0px;
   padding-top: 6.25px;
   padding-bottom: 6.25px;
   padding-left: 86px;
   padding-right: 86px;
   background-color: #EAE5D1;
   transition: 1s ease;
}

.tour_text_inner {
   transition: 1s ease;
   width: 5600px;
}

.tour_text {
      height: 50px;
}

.tour_header {
   font-size: 20px;
   color: var(--main_colour);
   margin: 0px;
   padding-top: 17px;
   width:600px;
   padding-left: 50px;
   padding-right: 50px;
   float: left;
}

#tour_header_7 {
   color: #e9c843;
   transition: 1s ease;
}

.tour_descr {
   height: 120px;
}

.tour_descr_text {
   font-size: 16px;
   color: var(--font_grey);
   margin: 0px;
   padding-top: 10px;    
   width:600px;
   height:110px;
   padding-left: 50px;
   padding-right: 50px;
   float: left;
}

.tour_dots {
   width: 10px;
   height: 10px;
   background: #eaeaea;
   border-radius: 100%;
   -webkit-border-radius: 100%;
   -moz-border-radius: 100%;
   display: inline-block;
   text-align: center;
   margin-left: 15px;
   margin-right: 15px;
   cursor: pointer;
}

.tour_dots:hover {
   background-color: #d8d8d8;
}

.tour_dots.tour_selected {
   background-color:var(--main_colour);
}

.tour_dots.tour_completed {
   background-color: #919fb8;
}

.tour_dots.tour_completed:hover{
   background-color:var(--main_colour);
}

.tour_dots.tour_selected.tour_completed {
   background-color:var(--main_colour);
}

.tour_buttons {
   width: 100px;
   font-family: var(--font_family);
   height: 35px;
   text-align: center;
   margin-top: 7.5px;
   margin-left: 20px;
   margin-right: 20px;
   cursor: pointer;
}

.tour_buttons:focus {
   outline:none;
}

#tour_skip_button {
   float: left;
   border: none;
   background: none;
   color: #aaaaaa;
   font-size: 12px;
}

#tour_skip_button:hover, #tour_back_button:hover  {
   color: var(--font_grey);
} 

#tour_back_button {
   float: right;
   border: none;
   background: none;
   color: #797979;
   font-size: 16px;
   display: none;
}

#tour_next_button {
   float: right;
   background: transparent;
   border: 1px solid var(--main_colour);
   color: var(--main_colour);
   font-size: 16px;
   border-radius: 5px;
}

#tour_next_button:hover {
   background: #dee4ee;
}

#tour_finish_button {
   float: right;
   border: none;
   border: 1px solid #e9c843;
   background: #e9c843;
   color: white;
   font-size: 16px;
   display: none;
   border-radius: 5px;
}

#tour_finish_button:hover {
   border: 1px solid #d8ba43;
   background: #d8ba43;
}

#tour_finish_button.completed_button:hover {
   border: 1px solid #009264;
   background: #009264;
}

#tour_finish_button.completed_button {
   border: 1px solid #00a470;
   background: #00a470;
}



.tour_expand {
   margin-top: -40px;
   margin-left: 540px;
   height: 25px;
   width: 25px;
   position: relative;
   /* background-image: url(/images/guidedtour/tour_expand_icon.svg);
   background-size: 25px 25px;
   background-repeat: no-repeat; */
   cursor: pointer;
   transition: 1s ease; 
}

.tour_shrink {
   margin-top: 30px;
   margin-left: 360px;
   height: 25px;
   /* width: 85px; */
   position: relative;
   /* background-image: url(/images/guidedtour/tour_shrink_icon.svg);
   background-size: 25px 25px; */
   cursor: pointer;
   background-repeat: no-repeat;
   padding-left: 35px;
   font-size: 20px;
   color: white;
   transition: 1s ease; 
}

.tour_shrink .psoda_icon {
	margin-right: 10px;
}

.tour_shrink .psoda_icon use {
	fill: #ffffff !important;
}

.gif_div_expand {
   position: absolute;
   width: 854px;
   height: 480px;
   margin: 0;
   left: -77px;
   top: 30px;
   z-index: 5;
   
}

.gif_expand {
   height: 480px;
   width: auto;
}

#tour_expand_overlay {
   background: black;
   opacity: .5;
   position: fixed;
   height: 100%;
   width: 100%;
   top:0;
   left: 0;
}
/**** Speech bubble ****/

div.speechbubbles {
    background-color: white;
    border: 1px solid white;
    position: absolute;
    z-index: 100;
    line-height: 1.3em;
    padding: 8px;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    box-shadow: var(--popup_box_shadow);
    -moz-box-shadow: var(--popup_box_shadow);
    -webkit-box-shadow: 5px 5px 20px 7px rgba(0, 0, 0, 0.2);
}

div.speechbubbles h2 {
   color: #00AA00 !important;
   border-radius:8px; /*CSS3 border radius*/
   -moz-border-radius:8px;
   -webkit-border-radius:8px;
   text-align:center;
   padding:3px;
}

div.speechbubbles div.up-arrow{  /*shared CSS for arrow DIV (upwards pointing)*/
   border-color: transparent transparent #FFFFFF transparent; /*border color should be same as div.speechbubbles background color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:-19px;
   left:20px;
   z-index:101;
   _display:none; /*IE hack to hide arrow in IE6*/
}

div.speechbubbles div.up-arrow-border{ /*shared CSS for arrow border DIV*/
   border-color: transparent transparent #FFFFFF transparent; /*border color should be same as div.speechbubbles border color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:-20px;
   left:20px;
   z-index:101;
   _display:none; /*IE hack to hide arrow in IE6*/
}

div.speechbubbles div.up-arrow-right{  /*shared CSS for arrow DIV (upwards pointing)*/
   border-color: transparent transparent #FFFFFF transparent; /*border color should be same as div.speechbubbles background color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:-19px;
   right:20px;
   z-index:101;
   _display:none; /*IE hack to hide arrow in IE6*/
}

div.speechbubbles div.up-arrow-right-border{ /*shared CSS for arrow border DIV*/
   border-color: transparent transparent #FFFFFF transparent; /*border color should be same as div.speechbubbles border color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:-20px;
   right:20px;
   z-index:101;
   _display:none; /*IE hack to hide arrow in IE6*/
}

div.speechbubbles div.right-arrow{  /*shared CSS for arrow DIV (rightwards pointing)*/
   border-color: transparent transparent transparent #FFFFFF; /*border color should be same as div.speechbubbles background color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:20px;
   right:-19px;
   z-index:101;
   _display:none; /*IE hack to hide arrow in IE6*/
}

div.speechbubbles div.right-arrow-border{ /*shared CSS for arrow border DIV*/
   border-color: transparent transparent transparent #FFFFFF; /*border color should be same as div.speechbubbles border color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:20px;
   right:-20px;
   z-index:101;
   _display:none; /*IE hack to hide arrow in IE6*/
}


div.speechbubbles div.down-arrow{ /*down arrow DIV specific CSS*/
   border-color: #FFFFFF transparent transparent transparent; /*border color should be same as div.speechbubbles background color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:auto;
   bottom:-19px;
   left:20px;
   z-index:101;
_display:none; /*IE hack to hide arrow in IE6*/
}


div.speechbubbles div.down-arrow-border{ /*down arrow border DIV specific CSS*/
   border-color: #FFFFFF transparent transparent transparent; /*border color should be same as div.speechbubbles border color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:auto;
   bottom:-20px;
   left:20px;
   z-index:101;
_display:none; /*IE hack to hide arrow in IE6*/
}

div.speechbubbles div.down-arrow-right { /*down arrow DIV specific CSS*/
   border-color: #FFFFFF transparent transparent transparent; /*border color should be same as div.speechbubbles background color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:auto;
   bottom:-19px;
   right:20px;
   z-index:101;
_display:none; /*IE hack to hide arrow in IE6*/
}


div.speechbubbles div.down-arrow-right-border { /*down arrow border DIV specific CSS*/
   border-color: #FFFFFF transparent transparent transparent; /*border color should be same as div.speechbubbles border color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:auto;
   bottom:-20px;
   right:20px;
   z-index:101;
_display:none; /*IE hack to hide arrow in IE6*/
}

div.speechbubbles div.left-arrow {  /*shared CSS for arrow DIV (leftwards pointing)*/
   border-color: transparent #FFFFFF transparent transparent; /*border color should be same as div.speechbubbles background color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:20px;
   left:-19px;
   z-index:101;
   _display:none; /*IE hack to hide arrow in IE6*/
}

div.speechbubbles div.left-arrow-border{ /*shared CSS for arrow border DIV*/
   border-color: transparent #FFFFFF transparent transparent; /*border color should be same as div.speechbubbles border color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:20px;
   left:-20px;
   z-index:101;
   _display:none; /*IE hack to hide arrow in IE6*/
}

/* SYSTEM MESSAGE */ 

.system_message_popup {
   background-color: white;
   position: fixed;
   left: 0;
   right: 0;
   top: 10vh;
   /* bottom: 0; */
   margin: auto;
   z-index: 100;
   /* line-height: 1.3em; */
   border-radius: 3px;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
   box-shadow: var(--popup_box_shadow);
   -moz-box-shadow: var(--popup_box_shadow);
   -webkit-box-shadow: 5px 5px 20px 7px rgba(0, 0, 0, 0.2);
   /* height: 600px !important; */
}

.system_message_header_outer {
   height: 175px;
   width: 100%;
   background-image: url(/images/system_message_background.svg);
   background-repeat: no-repeat;
}

#viewdetails .system_message_header_outer h2 {
   color: #ffffff;
   font-size: 2.5em;
   font-weight: bold;
   text-align: center;
   margin-top: 0;
   padding-top: 64px;
   padding-left: 10px;
   padding-right: 10px;
}

.system_message_content_outer {
   padding: 20px;
   height: 45vh;
   overflow: auto;
}

.system_message_feature_left, .system_message_feature_right {
   display: block;
   margin-bottom: 30px;
}

.system_message_feature_left .system_message_feature_text {
   padding-right: 40px;
}

.system_message_feature_right .system_message_feature_text {
   padding-left: 40px;
}

.system_message_feature_text {
   display: inline-block;
   width: 500px;
   /* padding-left: 10px;
   padding-right: 10px; */
   vertical-align: top;
}

.system_message_feature_header {
   color: #f58836;
   font-size: 1.5em;
   font-weight: bold;
   margin-bottom: 10px;
}

.system_message_feature_description {
   color: #686868;
}

.system_message_feature_image {
   display: inline-block;
}

.system_message_feature_image img {
   width: 250px;
   height: auto;
   vertical-align: top;
}

.system_message_close_outer {
   text-align: center;
   box-shadow: 0px -5px 10px #00000036;
   margin-top: 5px;
}

.system_message_close_button div {
   width: 125px;
   background: #f58836;
   color: #ffffff;
   padding: 7px;
   text-align: center;
   margin-top: 9px;
   margin-bottom: 9px;
   border-radius: 3px;
   display: inline-block;
}

.system_message_x_button {
   position: absolute;
   right: 10px;
   top: 10px;
   width: 20px;
   height: 20px;
   background-image: url(/images/popup_x_white.svg);
}


/**** Back button ****/

#backbutton {
   text-align:right;
  /*  background:#E7F1FB; */
   padding-top:2px;
   padding-bottom:2px;
   font-size:1.0em;
}

#backbutton img {
   border:none;
}

/* help button */

/* .navigatorhelp:hover, .navigatorhelp::before, .navigatorhelp::after {
content: url(/images/icon_question.svg);
} */

/**** Register ****/
.license_table {
   background:white;
}

.license_table td {
   padding-left:5px;
   padding-right:5px;
   background:#EBEEF2;
}

.license_table th {
   padding-left:5px;
   padding-right:5px;
   background:#97b4ce;
}

/**** Progress indicator ****/
.progress_indicator {
   text-align:center;
}

.progress_indicator svg {
   margin-left:auto;
   margin-right:auto;
   height: 250px;
   width: 250px;
   transform: rotate(-90deg);
}

.progress_indicator .SVG_text {
    font-family: var(--font_family);
    /* transition: opacity 1s ease; */
    fill: var(--main_colour);
    /* stroke-width: .25px; */
    /* stroke: var(--main_colour); */
    font-style: normal;
}

.progress_indicator .green_animate {
    stroke: var(--main_colour);
    stroke-width: 5;
    fill: none;
    stroke-linecap: round;
    /* equal to circumference of circle 2 * 3.14 * 28(radius) */
    stroke-dasharray: 175.84;
    stroke-dashoffset: 175.84;
    /* speed of animation */
    transition: stroke-dashoffset .5s ease;
}

.progress_indicator .grey_circle {
    stroke: #eaeaea;
    stroke-width: 3;
    fill: none;
    position: absolute;
}



.scenario_progress {
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	/* background: white; */
	/* border-radius:5px; */
	z-index:10;
}

#custom_report_tab_loader {
   margin-top: -35px;
   height: calc(60vh - 56px);
}

#custom_report_tab_response_text {
   text-align: center;
   margin-top: -40px;
   font-size: 1.1em;
}

#create_wizard_holder {
   display: block;
   margin-top: -55px;
   margin-bottom: 30px;
}

#create_report_wizard {
   padding-top: 5px;
   padding-bottom: 5px;
   vertical-align: middle;
   background-color: #eaeaea;
   /* background-image: url(/images/icons/darkgrey/reportwizard.svg); 
   background-position: 10px, center;
   background-repeat: no-repeat;
   background-size: 20px; */
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 5px;
   color: var(--font_grey);
   cursor: pointer;
   border: none;
   font-family: var(--font_family);
}

#create_report_wizard:hover {
   background-color: #dddddd;
}

#create_report_wizard .psoda_icon {
   margin-right: 5px;
}

/**** Navigator ****/

#navigator {
   background-color: var(--main_colour);
   background-image:  var(--navigator_image_overlay), linear-gradient(to bottom right, var(--navigator_gradient1), var(--navigator_gradient2));
   background-repeat: no-repeat, no-repeat;
   background-size: auto 101vh, auto;
   position:fixed;
   top:45px;
   bottom:0px;
   left:0px;
   width:200px;
    z-index:25;
    padding-top: 7px;
   /* padding-bottom:25px; */
   border-top-right-radius: 10px;
   border-bottom-right-radius: 10px;
   /* border-right:5px solid #E7F1FB;
   border-bottom:24px solid #E7F1FB; */
   box-shadow: 0px 10px 10px var(--darker_shade_2);
}

#navigator.resizable:after {
   content: " ";
   background-color: transparent;
   position: absolute;
   top: 0;
   right: -4px;
   width: 4px;
   height: 100%;
   cursor: col-resize;
}

#navigator h1 {
    color: white;
   float:left;
   margin-top: -1px;
   margin-bottom: 0px;
   padding-left: 10px;
   padding-top: 0px;
   padding-bottom: 2px;
   display:block;
   font-size:1.0em;
}

/* #backbutton > a:nth-child(1) > img:hover {
   content:url(/images/header/back_button_green.svg);
} */

#navigatorcontent {
   height:calc(100vh - 170px);
   width:100%;
   overflow:hidden;
   /* background:var(--main_colour); */
   margin-top: 10px;
   /* padding-bottom:25px; */
}

.navigator_expanded #navigatorcontent {
   height:calc(100vh - 120px);
}

#navigatorcontent:hover {
   overflow-y: auto;
   overflow-y: overlay;
}

.navigator_expanded #navigatorcontent:hover {
    overflow: auto;
    overflow: overlay;
}

#navigatorcontent::-webkit-scrollbar {
   width: 7px;
   height: 7px;
}

#navigatorcontent::-webkit-scrollbar-thumb {
   background: rgba(255,255,255,0.3);
   border-radius: 5px;
}

#navigatorcontent::-webkit-scrollbar-thumb:hover {
   background: rgba(255,255,255,0.5);
}

#navigatorcontent::-webkit-scrollbar-track {
   display: none;
}

#navigatorcontent .psoda_icon svg use,
.hide_navigator_button .psoda_icon svg use,
.show_navigator_button .psoda_icon svg use,
.backarrow .psoda_icon svg use {
	fill: var(--navigator_font) !important;
}

.hide_navigator_button {
/*    position:relative;
   background-image:url(/images/icon_unpin.png);
   background-repeat:no-repeat;
   background-size: 16px 16px;
   background-position: 0px;
   padding-top: 7px; */
   /* position:absolute;
   top: 100px;
   right: -12.5px; */
   display: inline-block;
   width: 25px;
   height: 25px;
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 5px;
   padding-right: 5px;
   /* margin-top: 2.5px;
   margin-bottom: 2.5px; */
   vertical-align: middle;
   margin-left: 7.5px;
   margin-right: 7.5px;
}

.hide_navigator_button img {
   border:none;
/*    visibility: hidden;
   height: 25px; */
}

.hide_navigator_button:hover {
   background-color: var(--navigator_hover);
   border-radius: 5px;
}

.navigator_hovering .hide_navigator_button {
   transform: rotate(180deg);
}

/* .hide_navigator_button img:hover, .hide_navigator_button img::before {
   content: url(/images/icon_hide_night.svg);
} */

#navigator_hidden {
   position:absolute;
   top:9px;
   bottom:0px;
   left:0px;
   z-index:5;
   /* border-right:5px solid #E7F1FB;
   box-shadow: 0px 0px 15px rgba(0,0,0,0.3); */
}

.show_navigator_button {
  /*   position:relative;
    top: 67px; */
    /* right: -35px; */
   /*  height: 100%; */
    /* display:none; */
/*     background-image:url(/images/icon_pin.png);
    background-repeat:no-repeat;
    background-size: 16px 16px;
    background-position: 5px; */
    position: fixed;
    top: 40px;
    left: 39px;
    transform: rotate(180deg);
    background-color: var(--navigator_show_button);
    border-radius: 5px;
    padding: 3px;
}

.show_navigator_button:hover {
   background-color: var(--darker_shade_1);
}

.show_navigator_button .psoda_icon svg {
   border:none;
   width: 14px;
   height: 14px;
   padding-right: 2.5px;
   padding-left: 2.5px;
   margin-bottom: -2px;
/*    visibility: hidden;
   height: 25px;
   width: 25px; */
}

/* .show_navigator_button img:hover, .show_navigator_button img::before {
   content: url(/images/icon_hide_night.svg);
} */

/* #navigator_hidden a {
    background-image:url(/images/icon_pin_outlined.png);
    background-repeat:no-repeat;
    background-size: 16px 16px;
    background-position: 5px;
} */

#navigator.autohide > #backbutton > a.hide_navigator_button {
   /* content: url(/images/icon_nightnavigator.svg);
   cursor: default; */
display:none; 

}

/* .navigator_label {
   background-image: url(/images/icon_nightnavigator.svg);
   width: 16px;
   height: 100px;
   position: absolute;
   right: -16px;
   top: 45%;
} */

#navigator.autohide {
   border-right: 16px solid transparent;
   background-clip: padding-box;
}

#navigator.autohide:hover {
   border-right: 16px solid var(--main_colour);
   transition: .25s ease;
   transition-delay: .1s;
   /* background-clip: border-box; */
   animation: borderbox .5s forwards;
}

@keyframes borderbox {
   0%{
      background-clip: padding-box;
   }
   99% {
      background-clip: padding-box;
   }
   100% {
      background-clip: border-box;
   }
}

#navigator_search {
   /* margin-top:3px;
   margin-left:3px;
   margin-bottom:3px; */
}

.navigator_tree_clip {
   overflow:hidden;
}

.navigator_tree_div {
   /* height:35px; */
   height:auto;
    overflow:hidden;
    /* padding-left: 10px; */
    /* padding-top: 12.5px; */
    padding-top: 0px;
    margin-bottom: -6px;
    /* padding-top: 10px; */
    display: flex;
}

/* .navigator_tree_div:hover {
   background-color: #242b38;
} */

.navigator_tree_div img {
    vertical-align:top !important;
    margin-top: -10px;
}

.navigator_tree_div > img {
   width: 10px;
   height: auto;
   /* margin-top: 14px; */
   margin-right: 4px;
   cursor: pointer;
   padding-left: 10px;
}

.popup .navigator_tree_div > a > img {
   width: 10px;
   height: auto;
   /* margin-top: 14px; */
   margin-right: 4px;
   cursor: pointer;
   padding-left: 10px;
}

.popup .navigator_tree_div > a {
   flex: none;
   -ms-flex: none;
   -webkit-flex: none;
   -moz-flex: none;
}

.popup .navigator_tree_div > img {
   width: 20px; 
   margin-top: -7.5px !important; 
}

.popup .navigator_tree_div > img:hover {
   opacity: 1;
}

.navigator_tree_div > img.nav_img_notrunk {
   cursor: default;
}

.navigator_tree_div > img:hover {
   opacity: .5;
}


/** making the icon in navigator stay inline with the text **/
.navigator_tree_div a img, .navigator_tree_div span img, .navigator_tree_div .psoda_icon {
   margin-top: 0px;
   margin-right: 10px;
	vertical-align: top;
}

.nav_loader {
   margin-top:-2px !important;
}

.navigator_tree_div .nav_loader {
	width:auto;
	height:15px;
   margin-top:12px !important;
   margin-right:15px;
}

/* .tree ul ul {
   background: rgb(37 37 37 / 25%);
} */

.navigator_expanded #quick_keywords {
   padding-left: 32px;
   /* padding-right: 45px; */
}

.navigator_expanded #quick_keywords.quick_keywords_focused {
	padding-right: 45px;
	width: calc(100% - 102px);
}

#quick_keywords {
   background: var(--darker_shade_1);
   /*   border:2px solid #c3e5f7; */
   border-radius: 5px;
   /* width: calc(100% - 102px); */
   width: calc(100% - 57px);
   border: none;
   height: 25px;
   margin-top: 5px;
   margin-bottom: 5px;
   /* padding-left: 5px; */
   padding-top: 5px;
   padding-bottom: 5px;
   padding-right: 5px;
   margin-left: 10px;
   color: #ffffff;
   /* background-image: url(/images/icons/lightgrey/search.svg);
   background-repeat: no-repeat;
   background-size: 15px 15px;
   background-position: 7.5px center; */
   padding-left: 25px;
   transition: .25s ease;
}

#quick_keywords::placeholder {
   font-family: var(--font_family);
   color: #AAAAAA;
}

#navigator_search_icon {
	position: absolute;
	top: 15px;
	left: 17.5px;
	z-index: 1;
}

.navigator_expanded #navigator_search_icon {
	left: 20px;
}

#quick_search {
    display: none;
}

#quick_search_form {
   position: relative;
}

#focused_navigator_search_button {
   display: inline-block;
   background-color: unset;
   color:#FFFFFF;
   position: absolute;
   right: 35px;
   top: 13.5px;
   height:18px;
   width:0px;
   line-height: 18px;
   border-radius: 2px;
   -webkit-transition: all .1s;
   -moz-transition: all .1s;
   transition: all .1s;
   text-align: center;
   font-size: 10px;
   cursor: pointer;
   padding: 0px;
   border: 0px;
   letter-spacing: .5px;
	overflow: hidden;
   /* background-image: url(/images/icons/white/risk_nochange.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: auto 14px; */
   /* width: 20px; */
}

#focused_navigator_search_button .psoda_icon {
	position: absolute;
	left: 0;
	left: 4.5px;
	top: 1.5px;
	pointer-events: none;
}

#focused_navigator_search_button input {
	background: none;
	border:none;
	cursor: pointer;
}

#focused_navigator_search_clear {
   display: inline-block;
   /* background-image: url(/images/icons/white/closepopup.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 50%; */
   position:absolute;
   height:24px;
   width:0px;
   right:15px;
   top:12.5px;
   -webkit-transition: all .1s;
	-moz-transition: all .1s;
   transition: all .1s;
   cursor: pointer;
   /* width: 20px; */
	overflow: hidden;
}

#focused_navigator_search_clear .psoda_icon {
	margin-left: 7.5px;
}

.navigator_expanded .quick_keywords_focused ~ #focused_navigator_search_button, .navigator_expanded .quick_keywords_focused ~ #focused_navigator_search_clear {
   width: 24px;
}

/*NEW NAV ADDITIONS 2022*/

/* Nav favourites outer */
#navigatorcontent #local_tree > ul > #node_0 {
   border-bottom: 1px solid #ffffff79;
   padding-bottom: 5px;
   margin-bottom: 5px;
   margin-left: 5px;
   margin-right: 5px;
}

/* Nav favourites title parent div */
#navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div {
   text-transform: uppercase;
   font-size: .9em;
   font-weight: bold;
   letter-spacing: 1.1px;
   display: inline-block;
   margin-bottom: -5px;
   height: 32px;
}

/* Nav favourites title a tag */
.navigator_expanded #navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div a {
   padding-right: 0px;
	vertical-align: middle;
}

#navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div a {
   color: white;
   opacity: .7;
   padding-top: 5px;
   padding-bottom: 0px;
   padding-left: 5px !important;
}

/* Nav favourites title icon */
#navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div a img,
#navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div a .psoda_icon {
   display: none;
}

/* Nav favourites title text */
#navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div .navigator_text {
   width: auto !important;
}

/* Nav favourites title open/close arrow */
#navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div > .psoda_icon svg {
   margin-top: 0px;
   padding: 8px;
   width: 8px;
   margin-left: 0px;
   margin-right: 0px;
   display: none;
   background-color: unset;
	vertical-align: middle;
}

#navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div > .psoda_icon {
	padding: 0px;
	margin-right: 0px;
	width: 24px;
	vertical-align: middle;
}

#navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div > .psoda_icon use {
	fill: rgba(255,255,255,0.5) !important;
}

#navigatorcontent .favs_colour_icon {
	margin-right: 12.5px;
}

#navigatorcontent .favs_colour_icon path {
	stroke: #ffffff !important;
}

.added_favourite_link path {
	stroke: #ffffff !important;
}

.favourites_colour_default path {
   fill: transparent !important;
	stroke: var(--icon_amber) !important;
}

.favourites_colour_red path {
   fill: #E01E1E !important;
}

.favourites_colour_pink path {
   fill: #e01ece !important;
}

.favourites_colour_green path {
   fill: #1ee02c !important;
}

.favourites_colour_blue path {
   fill: #1e7fe0 !important;
}

.favourites_colour_yellow path {
   fill: #ddb91f !important;
}

.favourites_colour_orange path {
   fill: #f58836 !important;
}

.favourites_colour_purple path {
   fill: #851fdd !important;
}

.favourites_colour_darkblue path {
   fill: #1c1ce8 !important;
}

.favourites_colour_lightgrey path {
   fill: #c4c4c4 !important;
}

.favourites_colour_aquablue path {
   fill: #21c6db !important;
}

.favourites_colour_darkgrey path {
   fill: #1c1c1c !important;
}

.navigator_expanded #navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div > .psoda_icon svg {
   display: inline-block;
}

#navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div > .psoda_icon:hover {
   background-color: unset;
   opacity: .5;
}

/* Nav favourites title hover */
#navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div:hover, #navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div a:hover, #navigatorcontent #local_tree > ul > #node_0 > .navigator_tree_div a:hover .navigator_text {
   text-decoration: underline;
   background-color: unset;
}

/* all favs a tags */
.navigator_expanded #navigatorcontent #local_tree > ul > #node_0 .navigator_tree_div a {
   padding-left: 8px;
}

#navigatorcontent #local_tree > ul > #node_0 .navigator_tree_div a {
   margin-left: 0px;
   margin-right: 0px;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   padding-left: 12.5px;
}

#navigatorcontent #local_tree > ul > #node_0 .navigator_tree_div a.navigator_item_drop_favourites_above {
   padding-top: 5.5px;
   transition: 0s;
}

#navigatorcontent #local_tree > ul > #node_0 .navigator_tree_div a.navigator_item_drop_favourites_below {
   padding-bottom: 5.5px;
   transition: 0s;
}

#navigatorcontent .nav_disable_all_on_element {
	opacity: .5 !important;
	pointer-events: none !important;
}

/* All favs star icon */
#navigatorcontent #local_tree > ul > #node_0 .navigator_tree_div a img, 
#navigatorcontent #local_tree > ul > #node_0 .navigator_tree_div a .psoda_icon svg {
   width: 15px;
   height: 15px;
   margin-right: 2.5px;
}

/* All favs text */
#navigatorcontent #local_tree > ul > #node_0 .navigator_tree_div .navigator_text {
   vertical-align: top;
   width: calc(100% - 27.5px);
}

/* all favs indent tag */
#navigatorcontent #local_tree > ul > #node_0 .navigator_tree_div .navigator_indent {
   display: none;
}

/* #navigatorcontent #local_tree > ul > #node_0 .navigator_tree_div .navigator_text {
   vertical-align: auto;
} */

/* all navigator parent divs */
#navigatorcontent #local_tree ul .navigator_tree_div {
   /* margin-left: 5px;
   padding-left: 5px;
   margin-right: 5px;
   padding-right: 5px;
   margin-bottom: 0px;
   padding-top: 10px;
   padding-bottom: 10px;
   font-size: 1.1em;
   border-radius: 5px; */
   margin-bottom: 0px;
}

/* all navigator a's */
.navigator_expanded #navigatorcontent .tree .navigator_tree_div a {
   padding-left: 5px;
}

#navigatorcontent .tree .navigator_tree_div a {
   height: auto;
   margin-left: 5px;
   padding-left: 9px;
   margin-right: 5px;
   padding-right: 5px;
   margin-bottom: 0px;
   padding-top: 10px;
   padding-bottom: 10px;
   font-size: 1.1em;
   border-radius: 5px;
   overflow: hidden;
   text-overflow: clip;
   transition: 0.25s ease;
}

/* all navigator text */
/* .navigator_expanded #navigatorcontent .tree .navigator_tree_div .navigator_text {
   display: inline-block;
} */

#navigatorcontent .tree .navigator_tree_div .navigator_text {
   display: inline-block;
   vertical-align: middle;
   width: calc(100% - 30px);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

#navigatorcontent .tree .navigator_tree_div .navigator_org_image ~ .navigator_text {
   width: calc(100% - 32px);
}

/* all navigator open/close icons */
#navigatorcontent .tree .navigator_tree_div > .psoda_icon {
   padding: 0px;
   margin: 0px;
   width: 16px;
   height: auto;
   /* margin-left: 5px; */
   margin-right: 5px;
   padding-left: 5px;
   padding-right: 5px;
	cursor: pointer;
   display: none;
}

#navigatorcontent .tree .navigator_tree_div > .psoda_icon svg {
	padding: 3px;
	border-radius: 10px;
	margin-top: 12px;
}

#navigatorcontent .tree .navigator_tree_div > .navigator_open_node svg {
	background-color: rgba(0, 0, 0, 0.25);
	transform: rotate(-90deg);
}

#navigatorcontent .tree .navigator_tree_div > .navigator_open_node svg use {
	fill: rgba(255, 255, 255, 0.5) !important;
}

#navigatorcontent .tree .navigator_tree_div > .navigator_close_node svg {
	background-color: #ffffff;
}

#navigatorcontent .tree .navigator_tree_div > .navigator_close_node svg use {
	fill: var(--main_colour) !important;
}

.navigator_expanded #navigatorcontent .tree .navigator_tree_div > .psoda_icon {
   display: inline-block;
}

#navigatorcontent .tree .navigator_tree_div > .psoda_icon:hover {
   background-color: var(--navigator_hover);
   border-radius: 5px;
   opacity: 1;
}

.navigator_tree_div .navigator_org_image {
   border-radius: 50%;
   border: 1px solid #ffffff;
}

#navigatorcontent .navigator_indent {
   /* background-color: rgba(255, 255, 255, 0.2);
   width: 1px; */
   /* border-right: 1px solid rgba(255, 255, 255, 0); */
   display: inline-block;
   /* margin-left: 25px;
   margin-right: 20px; */
}

.navigator_expanded #navigatorcontent .navigator_indent {
   border-right: 1px solid rgba(255, 255, 255, 0);
   margin-left: 20px;
   margin-right: 0px;
}

.navigator_expanded #navigatorcontent:hover .navigator_indent {
   border-right: 1px solid rgba(255, 255, 255, 0.2);
}

/* navigator drag and drop */

.navigator_item_drop_allowed {
   background-color: #00a470;
   position: relative;
}

.navigator_item_drop_notallowed {
	background-color: var(--icon_red);
   position: relative;
}

#navigator_item_dnd_label {
   position: absolute;
    right: 0;
    margin: auto;
    width: 50px;
    border-radius: 5px;
    text-align: center;
    height: calc(100% - 4px);
    font-weight: bold;
    top: 0;
    padding-top: 4px;
    transition: .25s ease;
    white-space: normal;
}

.navigator_item_drop_favourites_above {
   border-top: 2px solid rgba(255,255,255,0.2);
}

.navigator_item_drop_favourites_below {
   border-bottom: 2px solid rgba(255,255,255,0.2);
}

/* Circle loader */
.circle_loader {
   width: 14px;
   height: 14px;
   border: 1px solid;
   border-color: #ffffff #ffffff #ffffff transparent;
   border-radius: 50%;
   animation: circle_loader 1.2s linear infinite;
}

#navigator.navigator_expanded .circle_loader {
   margin-right: 10px;
   margin-left: 5px;
	display: block;
	margin-top: 13px;
}

#navigator .circle_loader {
	display: none;
}

@keyframes circle_loader {
   0% {
     transform: rotate(0deg);
   }
   100% {
     transform: rotate(360deg);
   }
}

/**** Tree ****/

.tree {
   width:auto;
   padding-right:0;
}

.popup .tree {
   min-width:600px;
   /* padding-right:5px; */
}

.tree {
   text-align:left;
  /*  padding-left:5px; */
   /* padding-right:5px; */
   padding-top:0px;
   padding-bottom:0px;
   font-size:0.8em;
   /* width:600px; */
   color: white;
   margin-bottom:45px;
}

.tree h2 {
   font-size:8pt;
   background:black;
   color:white;
   padding-left:5px;
   padding-right:5px;
   padding-top:3px;
   padding-bottom:3px;
   margin:0px;
   margin-left:-5px;
}

.tree ul {
   list-style-type:none;
   padding:0px;
   margin:0px;
}

.tree img {
   border:none;
   vertical-align:middle;
}

.tree a {
   text-decoration:none;
   color: var(--navigator_font);
   height: 35px;
   display: inline-block;
   flex: 1;
   -ms-flex: 1;
   -webkit-flex: 1;
   -moz-flex: 1;
   padding-top: 12.5px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.tree a:hover {
    /* background: #242b38; */
    background-color: var(--navigator_hover);
}

.tree a:visited {
    color: var(--navigator_font);
}

.popup .tree, .popup .tree a, .popup .tree a:visited {
   color: #ffffff;
}

/* .liselected {
   background: #242b38;
} */

.treeselected {
   /*  padding:2px;
    border:1px solid #BBBBBB; */
    /* background: #242b38; */
    /* color: #00a470 !important; */
    background-color: var(--navigator_selected);
    font-weight: bold;
    /* -webkit-box-shadow:1px 1px 5px #CECECE;
    -moz-box-shadow:1px 1px 5px #CECECE;
    box-shadow:1px 1px 5px #CECECE; */
 }

 .tree a.treeselected:hover {
   background-color: rgba(255, 255, 255, 0.2);
}

/* .navigator_tree_div < .treeselected {
    background: #242b38;
} */

/* .treeselected < .navigator_tree_div < .navigator_tree_clip {
    background: blue;
} */

/* .liselected:hover .treeselected, .treeselected:hover {
   background: #242b38;
} */

.treenoselect {
   padding:5px;
   background:#D86666;
   color: white;
}

.popup .treenoselect {
   padding-top: 13px;
}

.popup .treeselected .treenoselect {
   margin-top: 20px;
   vertical-align: sub;
   padding-top: 5px;
}

.selectassettree {
   width:100%;
   height:300px;
 
   margin-left:auto;
   margin-right:auto;
   overflow:auto;
   background: var(--main_colour);
   /* border:2px solid #c3e5f7; 
   -webkit-border-radius:6px;
   -moz-border-radius:6px;
   border-radius:6px; */
}

/* html>body .selectassettree {
   height:auto;
   min-height:300px;
} */

.tree_controls {
   font-size:0.8em;
}

/* .tree_controls a {
   width: 24px;
   display: inline-block;
   padding-top: calc(0.8em - 24px);
   padding-bottom: calc(0.8em - 24px);
} */

.selectassettree .navigator_tree_div img {
   margin-top:0px;
}

.selectassettree .asset_icon {
   margin-top:-2px;
}

.selectassettree .treeselected {
   padding:5px;
   background:#00A470;
   color: white;
}

.selectassettree .treeselected a:hover {
   background:#00A470;
}

.popup .selectassettree .treeselected a:hover {
   background:none;
}

.popup .selectassettree .treeselected {
   margin-top: 5px;
   height: 20px;
}

#node_-1 > div > span {
   cursor: pointer;
   height: 35px;
   margin-top: 14px;
   width: 100%;
}

#node_0 > div > span {
   height: 30px;
   margin-top: 14px;
   width: 100%;
}

.navigator_link {
   display: inline-block;
}

/* New move destination tree CSS */
.popup .selectassettree {
   border:1px solid #bababa;
   background: transparent;
   height: 50vh;
   border-top-right-radius: 5px;
   border-bottom-left-radius: 5px;
   border-bottom-right-radius: 5px;
}

.popup .selectassettree .tree a {
   color: var(--font_grey);
}

.popup .selectassettree .tree ul ul {
   background: transparent;
}

.popup .selectassettree .navigator_tree_div:hover {
   background-color: #eaeaea;
}

.popup .selectassettree .tree a {
   font-size: 12px;
	z-index:1;
}

.popup .selectassettree .tree_closed_node img, .popup .selectassettree .tree_open_node img {
   padding-left: 5px;
}

.popup .selectassettree .tree_closed_node, .popup .selectassettree .tree_open_node {
   padding-top: 15px;
   z-index: 1;
}

.popup .selectassettree .asset_icon {
   width: 20px;
   margin-top: -3px !important;
}

.popup .selectassettree .tree a.tree_closed_node:hover, .popup .selectassettree .tree a.tree_open_node:hover {
   background-color: #eaeaea;
}

.popup .selectassettree .navigator_tree_div .notrunk {
   padding-left:0px;
   margin-right: 0px;
   width: 19px;
}

.popup .selectassettree .navigator_tree_div > img {
   padding-left: 5px;
   cursor: default;
}

.popup .selectassettree .treeitemdiv {
   width: 100%;
   color: var(--font_grey);
}

.popup .selectassettree .treeitem, .popup .selectassettree .treeitemdiv a {
   /* flex: auto; */
   width: 100%;
}

.popup .selectassettree .tree a:hover {
   font-weight: bold;
   background-color: transparent;
}

.popup .selectassettree .treeselected {
   background:transparent;
   font-weight: bold;
   padding-left: 0px;
}

.popup .selectassettree .treeselected a {
   color: var(--main_colour);
   padding-top: 2.5px;
}

.popup .selectassettree .navigator_tree_div.treedivselected {
   background-color: var(--lightest_shade_1);
   /* background-image: url(/images/icon_tick_circle_night.svg);
   background-size: 20px;
   background-repeat: no-repeat;
   background-position: 95% 12px; */
} 

.popup .selectassettree .treeselected_tick {
   display: none;
}

.popup .selectassettree .treedivselected .treeselected_tick {
   background-color: var(--main_colour);
   width: 20px;
   height: 20px;
   float: right;
   border-radius: 10px;
   margin-top: 12px;
   margin-right: 10px;
   display: block;
}

.popup .selectassettree .treedivselected .treeselected_tick svg {
   padding: 5px;
}

.popup .selectassettree .treenoselect {
   background:transparent;
   color: var(--font_grey);
}

.popup .selectassettree .navigator_tree_clip {
   position: relative;
}

.popup .selectassettree .treenoselect_div {
   width: 100%;
   height: 44px;
   background-color: rgba(232, 232, 232, 0.5);
   position: absolute;
   top: 0;
   left: 0;
   z-index: 0;
   /* background-image: url(/images/icon_x_circle_grey.svg);
   background-size: 20px;
   background-repeat: no-repeat;
   background-position: 95% 12px; */
}

.popup .selectassettree .treenoselect_div_inner {
   width: 20px;
   height: 20px;
   background-color: grey;
   float: right;
   border-radius: 10px;
   margin-top: 12px;
   margin-right: 10px;
}

.popup .selectassettree .treenoselect_div_inner svg {
   padding: 5px;
}

.popup .selectassettree .navigator_tree_div {
   margin-bottom: 0;
   height: 44px;
}

.popup .selectassettree .tree .up_one_level div {
   border: 1px solid var(--main_colour);
   color: var(--main_colour);
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
   border-radius: 3px;
   /* background-image: url(/images/icons/theme_night/sort-up.svg);
   background-size: 16px;
   background-repeat: no-repeat;
   background-position: 5px center; */
}

.popup .selectassettree .tree .up_one_level .psoda_icon {
   margin-right: 5px;
}

.popup .selectassettree .tree .up_one_level {
   padding-top: 5px;
   margin-left: -45px;
   width: 110px;
}

.popup .selectassettree .tree .up_one_level:hover {
   font-weight: 100 !important;
}

.popup .selectassettree .tree .up_one_level:hover div {
   background-color: var(--main_colour);
   color: #ffffff;
   /* background-image: url(/images/icons/white/sort-up.svg); */
}

.popup .selectassettree .tree .up_one_level:hover div use {
   fill: #ffffff !important;
}

.popup .selectassettree .waiting_image_small {
   /* height: 44px; */
   background-position: center,center;
   margin-left: 7px;
   height: 14px;
   width: 14px;
   margin-top: 14px;
   margin-bottom: 14px;
}

.popup .selectassettree .closed_node .psoda_icon, .popup .selectassettree .open_node .psoda_icon {
   padding-left: 10px;
   padding-right: 10px;
}

.popup .selectassettree .asset_icon {
   padding-right: 5px;
   padding-top: 15px;
}

.selectassettree_filter {
   margin-top:8px;
   position: relative;
}

.selectassettree_filter input {
   /* background-image: url(/images/icons/darkgrey/search.svg);
   background-repeat: no-repeat;
   background-position: left;
   background-size: 15px 15px;
   background-position-x: 10px; */
   outline: none;
   font-size: 100%;
   width: 200px;
   border: solid 1px #bababa;
   border-bottom: none;
   padding: 9px 10px 9px 32px;
   height: 14px;
   /* margin-bottom: -1px; */
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
}

.popup .selectassettree .nodeitem_noselect {
   padding-top: 12.5px;
   margin-left: 5px;
   height: 31.5px;
}

.popup .selectassettree_filter .psoda_icon {
   position: absolute;
   top: 7.5px;
   left: 7.5px;
}


/** Use for active tree only **/

/* .tree ul li ul {
    background-color: var(--font);
}

.tree ul li ul li ul {
    background-color: #242b38;
} */

/**** Members control ****/

.notselected_members select {
   width:500px;
}

.selected_members select {
   width:500px;
}

.members_buttons {
   margin-left:175px;
}

.members_buttons input {
   margin-right:20px;
}

/**** Icon selector control ****/
.iconselector {
   width: 640px;
   padding-left: 10px !important;
   /* overflow: hidden; */
   height: 300px;
   overflow: auto;
}

.iconselector div {
   /* display:box; */
   position: relative;
   float:left;
    margin-right: 5px;
    margin-bottom: 5px;
}

.iconselector div .psoda_icon {
   position: absolute;
   width: 30px;
   height: 30px;
    /* margin-left: -23px;
    margin-bottom: -6px; */
    padding: 0px;
    cursor: default;
    border-radius: 5px;
    border: 2px solid transparent;
    left: 0;
    top: 0;
    padding: 5px;
    pointer-events: none;
}

.iconselector div .psoda_icon svg {
   padding: 5px;
}

.iconselector div input {
   width: 30px;
   height: 30px;
   margin: 5px;
   opacity: 0;
}

.iconselector div input[type=radio]:checked + .psoda_icon {
    border: 2px solid var(--main_colour);
    border-radius: 5px;
    background: unset;
    outline: none;
}

.iconselector div input:hover + .psoda_icon {
    background-color: #eaeaea;
}

.iconselector .fieldset_label, .iconselector .iconselector_filter_outer {
   float: none;
}

.iconselector .iconselector_filter_outer input {
   width: 200px;
   height: auto;
   margin: 5px;
   opacity: 1;
   border-radius: 5px;
   border: 1px solid #bdbdbd;
   background: #f9f9f9;
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
}



/**** Form buttons ****/

.formbuttons {
   text-align:center;
}

/**** Help menu ****/

#helpmenu {
   background:white;
   margin:0px;
   padding:0px;
   padding-bottom: 10px;
   border-bottom: 1px solid #eaeaea;
}

#helpmenu ul {
   list-style-type:none;
   padding:0px;
   margin:0px;
}

#helpmenu li {
   display:inline;
   padding:0px;
   margin:0px;
}

#helpmenu a {
   padding-left:5px;
   padding-right:5px;
   text-decoration:none;
   color: var(--font_grey);
   font-weight:bold;
}

#helpmenu a:hover {
   color:#a0a0a0;
}

#helpmenu img {
   vertical-align:middle;
   border:none;
}

html>body #helpmenu img {
   vertical-align:sub;
}

/**** Help pages ****/

#helppages table {
   border:1px solid black;
   border-collapse:collapse;
}

#helppages table th {
   border:1px solid black;
}

#helppages table td {
   border:1px solid black;
}

/**** Dashboard ****/

.user_timezone > select {
   width:250px;
}

.user_language > select {
   width:150px;
}

.riskmaps {
   padding-left: 7px;
}

.customise_riskmaps {
   margin-bottom: 10px;
}

.customise_riskmaps a {
   margin-left: 10px;
   border-radius: 5px;
   vertical-align: middle;
   background-color: #eaeaea;
   cursor: pointer;
   color: var(--font_grey);
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
}

.customise_riskmaps a .psoda_icon {
	margin-right: 5px;
}

.customise_riskmaps a:hover {
   background-color: #dddddd;
}


.risk_probability_tooltips .tooltip_description{
	/* border: 1px solid black ; */
}

.risk_probability_tooltips .likelihood_tooltip_label{
	text-align: center;
}

.risk_probability_tooltips td {
	/* height:100px; */
	padding: 10px;
	vertical-align: top;
}

.risk_probability_tooltips th {
	vertical-align: top;
	padding: 10px;
}

.risk_consequence_tooltips th {
	vertical-align: top;
	padding: 10px;
}

.risk_consequence_tooltips tr:nth-child(1) th, .risk_probability_tooltips tr:nth-child(1) th {
	border-bottom: 1px solid #dddddd;
	border-right: 0px;
}

.risk_consequence_tooltips tr th, .risk_probability_tooltips tr th {
	border-right: 1px solid #dddddd;
}

.risk_consequence_tooltips td {
	/* border: 1px solid black;
	height:100px;
	min-height:100px; */
	padding: 10px;
	vertical-align: top;
}


.risk_tooltip_table_header {
	text-align: center;
	font-weight: bold;
	font-size: 15pt;
}

.risk_consequence_tooltips table {
	table-layout: fixed;
}

.probability_option:hover::after {
    content: attr(title);
    position: absolute;
    padding: 5px;
    border: 1px solid gray;
    background: whitesmoke;
    font-size: 14px;
}

.dashboard {
   /* background-color: #f9f9f9; */
/*    padding-top: 25px; */
   padding-top: 35px;
   padding-left: 7px;
   /* margin-left: -25px; */
/*    margin-top: -25px; */
   margin-top: -50px;
   margin-right: -20px;
}

.customise_dashboard a {
   position: absolute;
   margin-top: -59px;
   margin-left: 10px;
   border-radius: 5px;
   vertical-align: middle;
   background-color: #eaeaea;
   cursor: pointer;
   color: var(--font_grey);
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
}

.customise_dashboard .psoda_icon {
   vertical-align: middle;
   margin-right: 5px;
}

.customise_dashboard a:hover {
   background-color: #dddddd;
}

.customise_dashboard.right_align {
   margin-top: -10px;
   margin-right: 10px;
   padding-bottom: 0px;
}

.dashlet {
   /* -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow); */
   border: 1px solid #cbcbcb;
   border-radius: 10px;
}

.dashlet ::-webkit-scrollbar, .dashlet::-webkit-scrollbar {
   width: 7px;
   height: 7px;
}

.load_dashlet {
   /* width:0px; */
   text-align:center;
   /* border-top: 2px solid var(--main_colour); */
	height: 250px;
	position: relative;
	border-radius: 10px;
}

.layout_dashlet .load_dashlet {
	height: calc(100% - 20px);
	margin: 10px;
}

.load_dashlet .circle_loader {
	width: 20px;
	height: 20px;
	border-color: #505050 #505050 #505050 transparent;
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

.dashlet {
   background:#ffffff;
   float:left;
   margin-right:2%;
   margin-bottom:2%;
   overflow:hidden;
}

.dashlet_refresh_div{
   cursor:pointer;
   /* float: right; */
   display: inline-block;
   vertical-align: middle;
   margin-top: 5px;
   margin-right: 3px;
   margin-left: 5px;
   padding-left: 5px;
   padding-right: 5px;
   padding-top: 3px;
   padding-bottom: 3px;
}

.dashlet_refresh_div svg {
   transition: transform .2s ease;
   /* padding-left: 10px; */
   /* vertical-align: middle; */
}

.dashlet_refresh_div:hover svg {
   /* content: url(/images/icons/green/refresh.svg); */
   transform: rotate(25deg);
}

.dashlet_refresh_div:hover svg use {
   fill: var(--icon_green) !important;
}

.dashlet_lastupdate {
   display: inline-block;
   font-size: .75em;
   vertical-align: middle;
   padding-left: 5px;
   color: #888888;
}

.dashlet_refresh_div:hover .dashlet_lastupdate {
   text-decoration: underline;
}

.placeholder {
   background:#ffffff;
   float:left;
   margin-right:20px;
   margin-bottom:40px;
   overflow:hidden;
   outline:1px solid #bbbbbb;
}

.dashlet_dragger {
   display: inline-block;
   vertical-align: top;
   /* width: 25px; */
   padding: 5px;
   height: 2.5em;
   /* background: black; */
   cursor:move;
   /* background-image:url(/images/icons/darkgrey/drag.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 15px; */
}

.dashlet_dragger svg {
   vertical-align: middle;
}

.dashlet_header {
   display: inline-block;
   vertical-align: middle;
   background: white;
/*   background-image:url(/images/dashlet_header.png);
   background-repeat:repeat-x; */
   width: calc(100% - 35px);
   min-height:2.5em;
   text-align:left;
   /* margin-top: -8px; */
   margin-bottom: 0px; 
   cursor:default;
   color: var(--font);
/*    -webkit-border-top-left-radius:6px;
   -webkit-border-top-right-radius:6px;
   -webkit-border-bottom-right-radius:0px;
   -webkit-border-bottom-left-radius:0px;
   -moz-border-radius:6px 6px 0px 0px;
   border-radius:6px 6px 0px 0px;
   border-bottom: 1px solid #eaeaea; */
   position: relative;
}

.dashlet_header h3 {
   display: inline-block;
   /* float:left; */
   /* margin-left:15px; */
   margin-right:5px;
   margin-top:5px;
   margin-bottom:5px;
   max-width: calc(100% - 115px);
   max-height:100%;
}

.dashlet_header a {
   /* float:right; */
}

.dashlet_header img {
   border:none;
   /* margin-top:6px;
   padding-right:10px; */
   /* float:right; */
   /* visibility: hidden; */
}


/* .dashlet:hover .dashlet_header img {
    visibility: visible;
} */

.dashlet_content {
   overflow:auto;
   margin-left: 10px;
   margin-right: 10px;
   margin-bottom: 10px;
}

.dashlet_content table {
	width: 99.8%;
}

.dashlet_content table.kanban {
    width: 99.8%;
}

.dashlet_content table.pipeline {
    width: auto;
   max-width:99.8%;
}


.layout_section .dashlet_content table.pipeline {
	height: inherit;
}

.layout_section .dashlet_content .pipeline_state_div{
	height: 100%;
}

.dashlet_options_right {
   float: right;
}

.dashlet_menu_button {
   /* float: right; */
   display: inline-block;
   vertical-align: middle;
   margin-top: 5px;
   margin-right: 5px;
   /* background-image: url(/images/icons/darkgrey/threedot.svg);
   background-position: center;
   background-repeat: no-repeat;
   background-size: 17px; */
   width: 24px;
   height: 24px;
   cursor: pointer;
}

.dashlet_menu_button .psoda_icon {
   pointer-events: none;
} 

.dashlet_menu_button svg {
   padding: 3.5px;
}

/* .dashlet_menu_button img {
   vertical-align: middle;
} */

/* .dashlet_menu_button:hover {
   background-image: url(/images/icon_actionmenu_dark.svg);
} */

.dashlet_menu {
   display: none;
   position: absolute;
   background-color: #ffffff;
   box-shadow: var(--box_shadow);
   z-index: 10;
   padding: 10px 5px 10px 5px;
   border-radius: 5px;
   text-align: left;
   /* right: 5px;
   top: 30px; */
}

.dashlet_menu.dashlet_menu_open {
   display: block;
}

.dashlet_menu a {
   display: block;
   cursor: pointer;
   color: var(--font_grey);
   padding: 7px 20px 7px 20px;
}

.dashlet_menu a:hover {
   background-color: #f0f0f0;
   border-radius: 5px;
}

.dashlet_menu .psoda_icon {
   margin-right: 10px;
   vertical-align: middle;
   margin-top: -2px;
}

option.chart_dashlet {
   background-image: url(/images/icons/darkgrey/chart.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   background-position: left;
   padding-left: 35px;
}

option.new_chart_dashlet {
   background-image: url(/images/icons/darkgrey/chart.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   background-position: left;
   padding-left: 35px;
}

option.new_chart_dashlet:checked {
   background-image: url(/images/icons/darkgrey/chart.svg);
}

option.report_dashlet {
   background-image: url(/images/icons/darkgrey/report.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   background-position: left;
   padding-left: 35px;
}

option.new_report_dashlet {
   background-image: url(/images/icons/darkgrey/report.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   background-position: left;
   padding-left: 35px;
}

option.new_report_dashlet:checked {
   background-image: url(/images/icons/darkgrey/report.svg);
}

option.table_dashlet {
   background-image: url(/images/icons/darkgrey/table.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   background-position: left;
   padding-left: 35px;
}

option.new_table_dashlet {
   background-image: url(/images/icons/darkgrey/table.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   background-position: left;
   padding-left: 35px;
}

option.new_table_dashlet:checked {
   background-image: url(/images/icons/darkgrey/table.svg);
}


/**** DisplayList ****/

.displaylist_container {
   /* -webkit-box-shadow:-5px 0px 15px #e8e8e8;
   -moz-box-shadow:-5px 0px 15px #e8e8e8;
   box-shadow:-5px 0px 15px #e8e8e8; */
   /* margin-top: 30px; */
}

.layout_dashlet .displaylist_container {
   margin-left: 10px;
   margin-right: 10px;
}

.displaylist {
    margin-top: 25px;
   position:relative;
   text-align:left;
   /* width:auto; */
   /* margin-right:12px; */
   overflow-x:auto;
   overflow-y:hidden;
}

.gantt_enabled .displaylist { 
   margin-top: 0;
}

.displaylist table {
   background:white;
   border-collapse:separate;
   border-spacing:0px;
   width:99.7%;
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
   table-layout: fixed;
   /* -webkit-box-shadow:0px 0px 15px #e8e8e8;
   -moz-box-shadow:0px 0px 15px #e8e8e8;
   box-shadow:0px 0px 15px #e8e8e8; */
}

.displaylist table.fixed_table_footer {
   table-layout: auto;
}

.popup .displaylist table {
	background: #f9f9f9;
}

.mock_psoda_table table {
   table-layout: auto;
}

.displaylist tr {
   /* background:#FFFFFF; */
   background: linear-gradient(to bottom, #f7f7f7, #ffffff);
}

.displaylist tr:hover {
   background: linear-gradient(to bottom, #f1f1f1, #e7e7e7);
}

.displaylist tr.archived_row {
   filter: grayscale(100%);
   opacity: .6;
   background: linear-gradient(to bottom, #f1f1f1, #e7e7e7);
}

.displaylist tr.archived_row:hover {
   background: linear-gradient(to bottom, #dfdfdf, #d3d3d3);
}

.displaylist tr.non_match_row {
   opacity: .6;
}

.displaylist tr.non_match_row:hover {
   background: linear-gradient(to bottom, #dfdfdf, #d3d3d3);
}

/* .displaylist tr.even {
   background:#f9f9f9;
}

.displaylist tr.even:hover {
   background:#eaeaea;
} */

#tr_placeholder {
   display: none;
}

.displaylist_container ::-webkit-scrollbar {
   width: 7px;
   height: 7px;
}

.displaylist_container ::-webkit-scrollbar-thumb {
   border-radius: 5px;
}

.displaylist_container ::-webkit-scrollbar-track {
   display: none;
}

.displaylist_container:hover ::-webkit-scrollbar {
   width: 10px;
   height: 10px;
}

/*
.displaylist tr td.greyscale img {
   -webkit-filter: grayscale(100%);
   -moz-filter: grayscale(100%);
   filter: grayscale(100%);
   opacity: 0.3;
}

.displaylist tr:hover td.greyscale img {
   -webkit-filter: grayscale(0%);
   -moz-filter: grayscale(0%);
   filter: grayscale(0%);
   opacity: 1;
}

.displaylist tr td.greyscale a:focus img {
   -webkit-filter: grayscale(0%);
   -moz-filter: grayscale(0%);
   filter: grayscale(0%);
   opacity: 1;
}
*/

.displaylist td {
   vertical-align:top;
   padding-left:10px;
   padding-right:10px;
   padding-top:10px;
   padding-bottom:10px;
   background-color:inherit;
   overflow: hidden;
}

.tabbed_control_content .displaylist_title:nth-child(1) {
	padding-top: 6px;
	padding-bottom: 6px;
	margin-top: -5px;
}

.displaylist_title {
   text-align: center;
}

.displaylist_title_long {
   text-align: center;
   width: 60%;
   margin: auto;
}

.layout_dashboard .displaylist_title {
   margin-bottom: 10px;
}

.subtab_view_outer ~ .displaylist_title, .subtab_view_outer ~ .displaylist_title_long, #report_tab .displaylist_title {
   margin-top: -53.5px;
}

.subtab_view_outer_with_gantt ~ .displaylist_title, .subtab_view_outer_with_gantt ~ .displaylist_title_long {
   margin-bottom: 50px;
   margin-top: -128.5px;
}

.displaylist_title ~ .displaylist_title {
   margin-top: 20px;
}

.displaylist_header_row {
	font-size: 1.25em;
	font-weight: bold;
	/* color: var(--font); */

	border-top:1px solid #dddddd;
	border-bottom:1px solid #dddddd;
}

.displaylist_group_by_row {
	background: #FFFFFF !important;
}

.scheduled_reports_title {
   text-align: center;
   margin-bottom: 0;
}

.history_table {
   padding-bottom: 10px;
}

.displaylist_title_riskmap {
   text-align: center;
   margin-top: -53.5px;
   margin-bottom: -10px;
}

.displaylist_title_riskmap + .risk_map_button, .displaylist_title_riskmap_nosubview + .risk_map_button {
   display: inline-block;
   background-color: #eaeaea;
   color: var(--font_grey);
   font-size: 0.9em;
   /* border: 1px solid #F2B126; */
   /* color: #F2B126; */
   margin-left: 110px;
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
   border-radius: 5px;
   vertical-align: middle;
   margin-top: -15px;
}

.displaylist_title_riskmap + .risk_map_button:hover, .displaylist_title_riskmap_nosubview + .risk_map_button:hover {
   background: #dddddd;
}

.displaylist_title_riskmap + .risk_map_button .psoda_icon, .displaylist_title_riskmap_nosubview + .risk_map_button .psoda_icon {
   vertical-align: middle;
   margin-right: 5px;
}

.displaylist_title_riskmap_nosubview {
   text-align: center;
   margin-top: -5px;
   margin-bottom: -28px;
}

.displaylist_title_riskmap_nosubview + .risk_map_button {
   margin-bottom: 30px;
   margin-top: 3px;
}

.displaylist_title_riskmap ~ .displaylist_top_filters_container, .displaylist_title_riskmap_nosubview ~ .displaylist_top_filters_container {
   margin-top: 5px;
}


.collapse_table_container {
   background-color: #eaeaea;
   height: 30px;
   border-radius: 5px;
   width: 90px;
}

.dashlet .collapse_table_container{
   margin-top: 5px;
   margin-bottom: -20px;
}

.dashlet.layout_dashlet .collapse_table_container {
   margin-top: -30px;
   margin-left: 10px;
   margin-bottom: 0px;
}

.popup .collapse_table_container{
   margin-top: 5px;
   margin-bottom: -20px;
   /* margin-left: 15px; */
   width: 90px;
}

.subtab_view_outer ~ .collapse_table_container {
   position: absolute;
   margin-top: -65px;
}

.dashlet .displaylist_title {
   margin-top: 10px;
}

.dashlet.layout_dashlet .displaylist_title {
   margin-top: 5px;
}

.dashlet .collapse_table_container + .displaylist_top_filters_container {
   margin-top: 25px;
}

.dashlet .saved_tables_outer {
   margin-top: -20px;
}

.dashlet.layout_dashlet .displaylist_title ~ .collapse_table_container {
   margin-top: 0px;
}

.dashlet.layout_dashlet .collapse_table_container {
   margin-top: -0px;
}

.dashlet.layout_dashlet .saved_tables_outer {
   margin-top: -35px;
}

.dashlet.layout_dashlet .displaylist_title ~ .collapse_table_container {
   margin-top: -30px;
}

.dashlet .displaylist_title ~ .saved_tables_outer {
   margin-top: -35px;
}

.displaylist_title ~ .collapse_table_container, .displaylist_title_long ~ .collapse_table_container {
   position: absolute;
   margin-top: -25px;
}

.displaylist_title_riskmap ~ .collapse_table_container {
   margin-top: -30px;
}

.displaylist_title_riskmap_nosubview ~ .collapse_table_container {
   margin-top: -60px;
   width: 90px;
}

.subtab_view_outer_with_gantt ~ .collapse_table_container {
   margin-top: -75px;
}

.collapse_table_container .psoda_icon svg {
   padding: 5px;
}

#expand_table_button {
   height: 30px;
   width: 30px;
   /* background-image: url(/images/icons/darkgrey/expand_table.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 20px; */
   display: inline-block;
   /* margin-right: 10px; */
   cursor: pointer;
   border-radius: 5px;
   /* opacity: .25; */
}

#collapse_1_table_button {
   height: 30px;
   width: 30px;
   /* background-image: url(/images/icons/darkgrey/collapse_1_table.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 20px; */
   display: inline-block;
   /* margin-right: 10px; */
   cursor: pointer;
   border-radius: 5px;
   /* opacity: .25; */
}

#collapse_2_table_button {
   height: 30px;
   width: 30px;
   /* background-image: url(/images/icons/darkgrey/collapse_2_table.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 20px; */
   display: inline-block;
   cursor: pointer;
   border-radius: 5px;
   /* opacity: .25; */
}

#expand_table_button:hover, #collapse_1_table_button:hover, #collapse_2_table_button:hover {
   background-color: #dddddd;
}

#expand_table_button.current_table_collapse {
   /* background-image: url(/images/icons/white/expand_table.svg); */
   background-color: var(--main_colour);
}

#collapse_1_table_button.current_table_collapse {
   /* background-image: url(/images/icons/white/collapse_1_table.svg); */
   background-color: var(--main_colour);
}

#collapse_2_table_button.current_table_collapse {
   /* background-image: url(/images/icons/white/collapse_2_table.svg); */
   background-color: var(--main_colour);
}

.current_table_collapse .psoda_icon use {
   fill: #ffffff !important;
}


/* #expand_table_button.current_table_collapse, #collapse_1_table_button.current_table_collapse, #collapse_2_table_button.current_table_collapse {
   opacity: 1;
} */

.displaylist td .collapse_table {
   /* transition: .1s ease; */
}

.displaylist td.td_overflow {
   background-image: url(/images/icons/lightgrey/vnext.svg);
   background-size: 8px;
   background-repeat: no-repeat;
   background-position: right+5px bottom+10px;
}

.displaylist td.td_overflow.textedit, .displaylist td.td_overflow.dateedit, .displaylist td.td_overflow.textareaedit, .displaylist td.td_overflow.wysiwygedit, .displaylist td.td_overflow.dropdown {
   background-image: url(/images/icons/lightgrey/edit.svg), url(/images/icons/lightgrey/vnext.svg);
   background-position: calc(100% - 5px) 10px, right+5px bottom+10px;
   background-size: 10px, 8px;
   background-repeat: no-repeat, no-repeat;
}

.inline_edit_icon_hover .displaylist td.td_overflow.textedit, .inline_edit_icon_hover .displaylist td.td_overflow.dateedit, .inline_edit_icon_hover .displaylist td.td_overflow.textareaedit, .inline_edit_icon_hover .displaylist td.td_overflow.wysiwygedit, .inline_edit_icon_hover .displaylist td.td_overflow.dropdown {
   background-image: url(/images/icons/lightgrey/vnext.svg);
   background-position: right+5px bottom+10px;
}

.inline_edit_icon_hover .displaylist td.td_overflow.textedit:hover, .inline_edit_icon_hover .displaylist td.td_overflow.dateedit:hover, .inline_edit_icon_hover .displaylist td.td_overflow.textareaedit:hover, .inline_edit_icon_hover .displaylist td.td_overflow.wysiwygedit:hover, .inline_edit_icon_hover .displaylist td.td_overflow.dropdown:hover {
   background-image: url(/images/icons/darkgrey/edit.svg), url(/images/icons/lightgrey/vnext.svg);
   background-position: calc(100% - 5px) 10px, right+5px bottom+10px;
}

/* .displaylist .collapse_1_enabled td.td_overflow {
   background-position: right 95px;
}

.displaylist .collapse_2_enabled td.td_overflow {
   background-position: right 21px;
} */

.displaylist .collapse_1_enabled .collapse_table {
   max-height: 95px !important;
   /* white-space: nowrap; */
   overflow: hidden;
   /* text-overflow: ellipsis; */
}

.displaylist .collapse_2_enabled .collapse_table {
   max-height: 20px !important;
   /* white-space: nowrap; */
   overflow: hidden;
   /* text-overflow: ellipsis; */
}

.displaylist .wysiwygedit_active .collapse_table {
   max-height: none !important;
   overflow: auto !important;
}

.displaylist .collapse_2_enabled .actions_dropdown_img {
   margin-top: -5px;
}

.table_tooltip_container {
   position: absolute;
   z-index: 1000;
}

.table_tooltip_inner {
   background-color: #eaeaea;
	background: linear-gradient(to bottom, #f7f7f7, #ffffff);
   color: var(--font);
   width: max-content;
   /* max-width: 400px; */
   box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);;
   padding: 10px;
   margin-left: -10px;
   margin-top: -10px;
   border-radius: 5px;
}

.table_tooltip_inner .status_state {
   margin-left: 16px;
   border: 1px solid #eaeaea !important;
}

/* .table_tooltip_hidden_container {
   position: absolute;
   z-index: 1000;
   opacity: 0;
}

.table_tooltip_hidden_container div {
   background-color: blue;
   color: var(--font_grey);
   width: max-content;
   box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);;
   padding: 10px;
   border-radius: 3px;
} */

/* .table_tooltip_inner {
   background-color: var(--lighter_shade_1);
   color: #ffffff;
   padding: 10px;
   border-radius: 3px;
   width: max-content;
   max-width: 400px;
}

.displaylist .collapse_1_enabled .table_tooltip_inner {
   margin-top: 95px;
}

.displaylist .collapse_2_enabled .table_tooltip_inner {
   margin-top: 21px;
} */

.subtab_view_outer_with_gantt ~ .displaylist_top_filters_container {
   min-height: 25px;
   margin-top: -40px;
   width: calc(100% - 100px);
}

.table_parent_gantt_enabled .subtab_view_outer_with_gantt ~ .displaylist_top_filters_container {
   margin-bottom: 15px;
}

/* displaylist filter */
.displaylist_top_filters_container {
   margin-top: 10px;
   margin-bottom: -10px;
   font-size: .9em;
}

.layout_dashboard .displaylist_top_filters_container { 
	margin-bottom:10px;
   margin-left: 10px;
}

.filter_top_container {
   display: inline-block;
   margin-right: 10px;
   border: 1px solid var(--main_colour);
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 7.5px;
   padding-right: 5px;
   border-radius: 5px;
   text-align: center;
   margin-top: 10px;
}

.filter_top_title {
   text-transform: uppercase;
   font-size: .75em;
   text-align: center;
   margin-top: -11px;
   /* background: #ffffff; */
   background: var(--main_colour);
   width: max-content;
   padding-left: 5px;
   padding-right: 5px;
   margin-left: -3px;
   /* color: #969696; */
   color: #ffffff;
   /* font-weight: bold; */
   border-radius: 3px;
}

.filter_top_operator {
   font-weight: bold;
   display: inline-block;
}

.filter_top_phrase {
   display: inline-block;
   font-weight: 100;
   color: var(--font);
   max-width:500px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   vertical-align: top;
}

.filter_top_remove {
   /* border: 1px solid var(--main_colour); */
   display: inline-block;
   width: 24px;
   height: 24px;
   margin-left: 7.5px;
   margin-top: -4px;
   margin-bottom: -4px;
   vertical-align: top;
   border-radius: 5px;
   /* background-image: url(/images/icons/theme_night/closepopup.svg);
   background-size: 12px;
   background-repeat: no-repeat;
   background-position: center; */
   cursor: pointer;
}

.filter_top_remove svg {
   margin-top: 5px;
}

.filter_top_remove:hover {
   background-color: var(--main_colour);
   /* background-image: url(/images/icons/white/closepopup.svg); */
}

.filter_top_remove:hover use {
   fill: #ffffff !important;
}

.displaylist_top_clear_filters {
   font-size: 1.1em;
   font-weight: bold;
   cursor: pointer;
   display: inline-block;
}

.displaylist_top_clear_filters:hover {
   color: var(--darker_shade_1);
}

.displaylist th {
   padding-left:5px;
   padding-right:5px;
   padding-top:10px;
   padding-bottom:10px;
   background:#ffffff;
   color:var(--main_colour);
/*   background-image:url(/images/normal/table_header.png);
   background-repeat:repeat-x;
   background-position:center;
   background-size:100% 100%;*/
   /* border-right:1px solid var(--main_colour); */
   vertical-align:top;
   font-weight:bold;
   text-align:left;
   position:relative;
   z-index:1;
   border-bottom: 1px solid #dddddd;
   overflow: hidden;
   /* border-right:2px solid transparent; */
}

.displaylist th:hover .resize_handle {
   /* border-right:2px solid #dddddd; */
   background: #dddddd;
}

.displaylist th.sortfield {
   /* background:var(--lightest_shade_2); */
   border-bottom: 1.5px solid var(--main_colour);
   /*background-image:url(/images/normal/table_header_sorted.png);
   background-repeat:repeat-x;
   background-position:center;
   background-size:100% 100%;*/
   /* border-right:1px solid #acacac; */
}

.displaylist th a {
   color:var(--main_colour);
   text-decoration:none;
   font-weight:bold;
}

.displaylist img {
   border:none;
   margin-right: 3px;
}

.displaylist td.displaylistcontrols {
   background:#FFFFFF;
   padding-left:0px;
   padding-right:0px;
   padding-top:10px;
   padding-bottom:10px;
   border-top: 1px solid #dddddd;
}

.displaylist_th {
   font-weight:bold;
   padding-left:5px;
   padding-right:5px;
   background:#ffffff !important;
   color: var(--main_colour);
   border: 1px solid #dddddd;
}

.displaylist_tree_clip {
   position:relative;
   overflow:hidden;
}

.displaylist_tree_div {
   position:absolute;
   /* top:0px; */
   left:0px;
   width:1000px;
   height:100%;
}

.displaylist_tree_div img {
   vertical-align:middle;
   /* margin-top: -10px; */
}

.displaylist_tree_div .closed_node, .displaylist_tree_div .open_node {
   padding-left: 6px;
   padding-right: 6px;
   padding-top: 3px;
   padding-bottom: 3px;
}

.disable_table_tree_node {
	opacity: 0;
	pointer-events: none;
}

.table_tree_node_loader {
	position: absolute;
	top: 0px;
	height: 12px;
	width: 12px;
	border-color: var(--icon) var(--icon) var(--icon) transparent;
	margin-left: 4px;
	margin-right: 4px;
	margin-top: 3px;
	margin-bottom: 3px;
}

.displaylist_tree_div .notrunk {
   padding-left: 10px;
}

.displaylistcontrols form {
   padding:0px;
   margin:0px;
   display: inline-block;
}

.displaylistcontrols img {
   border:none;
   padding-right:7px;
   padding-left:7px;
   margin-right: 0px;
   vertical-align: middle;
}

.displaylistcontrols input {
    margin-right:5px;
}

.displaylist_parent {
   font-weight:bold;
}

.displaylist .displaylist_no_items_tr:hover {
   background: linear-gradient(to bottom, #f7f7f7, #ffffff);
}

.displaylist_no_items {
   height: 300px;
}

.displaylist_no_items_header {
   padding-top: 200px;
   background-image: url(/images/displaylist_no_items.svg);
   background-repeat: no-repeat;
   background-size: auto 180px;
   background-position: center 10px;
   font-size: 2em;
   text-align: center;
}

.displaylist_no_items_text {
   color: #828282;
   text-align: center;
}

.displaylist_no_items_filterbutton {
   text-align: center;
   background: #eaeaea;
   color: var(--font_grey);
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
   width: 150px;
   margin: auto;
   margin-top: 10px;
   cursor: pointer;
}

.displaylist_no_items_filterbutton:hover {
   background: #DBDBDB;
}

.displaylist_header_text {
   display: inline-block;
   vertical-align: top;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.displaylist_header_text_sort_filter {
   width: calc(100% - 50px);
}

.displaylist_header_text_sort_only, .displaylist_header_text_filter_only {
   width: calc(100% - 24px);
}

.displaylist_header_text_no_sort_filter {
   width: 100%;
}

.table_header_sort_filter_container {
   width: 50px;
   margin-left: 0px;
   display: inline-block;
   vertical-align: top;
}

.table_header_sort_container, .table_header_filter_container {
   width: 24px;
   margin-left: 0px;
   display: inline-block;
   vertical-align: top;
}

.displaylist .table_header_sort_filter_container a, .displaylist .table_header_filter_container a, .displaylist .table_header_sort_container a {
   padding-top: 3.5px;
   padding-bottom: 2.5px;
   padding-left: 6px;
   padding-right: 6px;
   border-radius: 5px;
}

.displaylist .table_header_sort_filter_container a:nth-child(2) {
   margin-left: -2px;
}

.displaylist .table_header_sort_filter_container a:hover, .displaylist .table_header_filter_container a:hover, .displaylist .table_header_sort_container a:hover {
   background: #eaeaea;
}

.displaylist .table_header_sort_filter_container img, .displaylist .table_header_filter_container img, .displaylist .table_header_sort_container img {
   margin:0;
   width: 10px;
}

/* active filters and sorting */
.displaylist .table_active_sorting a:first-of-type, .displaylist .table_active_filter {
   background-color: var(--main_colour);
}

.displaylist .table_active_sorting a:first-of-type:hover, .displaylist .table_active_filter:hover {
   background-color: var(--lighter_shade_1) !important;
}

/* empty table for dashlets */

.dashlet .displaylist_no_items {
   height: 40px;
}

.dashlet .displaylist_no_items_header {
   padding-top: 10px;
   background-image: none;
   background-repeat: no-repeat;
   background-size: auto 90px;
   background-position: center 5px;
   font-size: 1em;
}

.dashlet .displaylist_no_items_text {
   font-size: .9em;
}

.dashlet .displaylist_no_items_filterbutton {
   text-align: center;
   background: #eaeaea;
   color: var(--font_grey);
   padding-left: 5px;
   padding-right: 5px;
   padding-top: 2.5px;
   padding-bottom: 2.5px;
   width: 120px;
   margin: auto;
   margin-top: 7px;
   cursor: pointer;
   font-size: .9em;
}

/* dashboard no items */
.dashboard_no_items {
   height: 300px;
	display: block;
}

.dashboard_no_items_hidden {
	display: none;
}

.dashboard_no_items_header {
	width: calc(100% - 15px);
   padding-top: 200px;
   background-image: url(/images/dashboard_no_items.svg);
   background-repeat: no-repeat;
   background-size: auto 180px;
   background-position: center 10px;
   font-size: 2em;
   text-align: center;
}

.dashboard_no_items_text {
	width: calc(100% - 15px);
   color: #828282;
   text-align: center;
}

.displaylist_NA {
   color:#dddddd !important;
}

.displaylist_purple {
   border-left:6px solid #8A2BE2 !important;
   padding-left:6px;
}

.displaylist_red {
   border-left:6px solid #ff3b3b !important;
   padding-left:6px;
}

.displaylist_red13 {
   background-color:#dddddd !important;
   border-left:6px solid #b20000 !important;
   padding-left:6px;
}

.displaylist_red25 {
   background-color:#BBBBBB !important;
   border-left:6px solid #960000 !important;
   padding-left:6px;
}

.displaylist_red50 {
   background-color:#999999 !important;
   border-left:6px solid #7c060c !important;
   padding-left:6px;
}

.displaylist_yellow {
   border-left:6px solid #d8e50c !important;
   padding-left:6px;
}

.displaylist_amber {
   border-left:6px solid #ff8b2b !important;
   padding-left:6px;
}

.displaylist_green {
   border-left:6px solid #4ec66a !important;
   padding-left:6px;
}

.displaylist_green13 {
   background-color:#dddddd !important;
   border-left:6px solid #008800;
   padding-left:6px;
}

.displaylist_green25 {
   background-color:#BBBBBB !important;
   border-left:6px solid #046400;
   padding-left:6px;
}

.displaylist_green50 {
   background-color:#999999 !important;
   border-left:6px solid #0f5604;
   padding-left:6px;
}

.displaylist_blue {
   border-left:6px solid #0c78e5 !important;
   padding-left:6px;
}

.displaylist_indigo {
   border-left:6px solid #7B1FFF !important;
   padding-left:6px;
}

.displaylist_violet {
   border-left:6px solid #AC2CFF !important;
   padding-left:6px;
}

.displaylist_transparent {
   border-left:6px solid rgba(0,0,0,0) !important;
   padding-left:6px;
}

.displaylist_lightgrey {
   color:#000000 !important;
   background-color:#dddddd !important;
}

.displaylist_grey {
/*   color:#000000 !important;
   background-color:#BBBBBB !important; */
   border-left:6px solid #BBBBBB;
   padding-left:6px;
}

.displaylist_darkgrey {
   color:#000000 !important;
   background-color:#999999 !important;
}

.displaylist_bottom_border {
   border-bottom:1px solid black;
}

/* .displaylist-top-left {
   background:transparent url(/images/top-left-white.gif);
   background-position:top left;
   background-repeat:no-repeat;
}

.displaylist-top-right {
   padding:10px 20px 0px 20px;
   background:transparent url(/images/top-right-white.gif);
   background-position:top right;
   background-repeat:no-repeat;
}

.displaylist-bottom-left {
   background:transparent url(/images/bottom-left-white.gif);
   background-position:bottom left;
   background-repeat:no-repeat;
}

.displaylist-bottom-right {
   background:transparent url(/images/bottom-right-white.gif);
   background-position:bottom right;
   background-repeat:no-repeat;
   padding-left:5px;
   padding-right:5px;
   padding-top:2px;
   padding-bottom:2px;
} */

.displaylist-bottom {
   padding-left:5px;
   padding-right:5px;
   padding-top:2px;
   padding-bottom:2px;
}

.displaylist_waiting {
   z-index:15;
   text-align:center;
   position:absolute;
   top:0px;
   bottom:0px;
   left:0px;
   right:0px;
   /* Mozilla ignores crazy MS image filters, so it will skip the following */
   /* filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='/images/50p_white.png'); */
}

/* .displaylist_waiting[class] {
   background-image:url(/images/50p_white.png);
} */

.displaylist_waiting img {
   /* margin-top:40px; */
   position:absolute;
   top:0px;
   bottom:0px;
   margin:auto;
}

.waiting_image {
   /*margin-top:18px;
   background-image:url(/images/ajax-loader.gif);
   background-repeat:no-repeat;
   background-position:center top;
   height:64px; */
   margin: auto;
   background-image:url(/images/night_loader.gif);
   background-repeat:no-repeat;
   background-position:center;
   background-size:64px 64px;
   height:100px;
   width: 100px;
   position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

.disable_animations .waiting_image {
   background-image:url(/images/night_loader.png);
}

#tmp_popup .waiting_image {
   margin: auto;
   background-image:url(/images/popup_loader.gif);
   background-repeat:no-repeat;
   background-position:center;
   background-size:80px 80px;
   height:100px;
   width: 100px;
}

.disable_animations #tmp_popup .waiting_image {
   background-image:url(/images/popup_loader.png);
}

/* .waiting_image_small {
   margin-left:50px;
   background-image:url(/images/ajax-loader-night.gif);
   background-size:16px 16px;
   background-repeat:no-repeat;
   background-position:left top;
   height:16px;
} */

.rotate_90 {
   -webkit-transform-origin:0 0;
   -webkit-transform:rotate(-90deg) translate(-14.8em, -4px);
   -moz-transform-origin:0 0;
   -moz-transform:rotate(-90deg) translate(-14.8em, -4px);
   -o-transform-origin:0 0;
   -o-transform: rotate(-90deg) translate(-14.8em, -4px);
   transform-origin:0 0;
   transform:rotate(-90deg) translate(-14.8em, -4px);
   position:absolute;
   width:20em;
}

#displaylist_budget_ .budget_quarter_header, #displaylist_budget_ .budgetlist_quarter {
   color: white !important;
   background: var(--lighter_shade_3) !important;
}

#displaylist_budget_ .budget_year_header, #displaylist_budget_ .budgetlist_year {
   background: var(--lighter_shade_2) !important;
    color: white !important;
}

#displaylist_budget_ .budget_total_header, #displaylist_budget_ .budgetlist_total {
   color: white !important;
   background: var(--main_colour) !important;
}

.displaylist_show_hide_icon {
   cursor: pointer;
}

.budget_sticky_1, .budget_sticky_2, .budget_sticky_3, .budget_sticky_4, .budget_sticky_5, 
.sticky_column_1, .sticky_column_2, .sticky_column_3, .sticky_column_4, .sticky_column_5, .sticky_column_6, .sticky_column_7, .sticky_column_8, .sticky_column_9, .sticky_column_10, .last_sticky_column {
   position: -webkit-sticky !important;
   position: sticky !important;
   z-index: 2 !important;
   background-color: #ffffff !important;
}

th.budget_sticky_1, th.budget_sticky_2, th.budget_sticky_3, th.budget_sticky_4, th.budget_sticky_5,
th.sticky_column_1, th.sticky_column_2, th.sticky_column_3, th.sticky_column_4, th.sticky_column_5, th.sticky_column_6, th.sticky_column_7, th.sticky_column_8, th.sticky_column_9, th.sticky_column_10, th.last_sticky_column {
   z-index: 3 !important;
}

.budget_sticky_1 {
   left: 0px;
   left: var(--budget_sticky_1-left) !important;
}

.budget_sticky_2 {
   left: 73px;
   left: var(--budget_sticky_2-left) !important;
}

.budget_sticky_3 {
   left: 113px;
   left: var(--budget_sticky_3-left) !important;
}

.budget_sticky_4 {
   left: 203px;
   left: var(--budget_sticky_4-left) !important;
}

.budget_sticky_5 {
   left: 261px;
   left: var(--budget_sticky_5-left) !important;
   border-right: 1px solid #ccc;
}

/* .sticky_column_1 {
   left: 0px;
   left: var(--sticky_column_1-left);
}

.sticky_column_2 {
   left: 50px;
   left: var(--sticky_column_2-left);
}

.sticky_column_3 {
   left: 100px;
   left: var(--sticky_column_3-left);
}

.sticky_column_4 {
   left: 150px;
   left: var(--sticky_column_4-left);
}

.sticky_column_5 {
   left: 200px;
   left: var(--sticky_column_5-left);
}

.sticky_column_6 {
   left: 250px;
   left: var(--sticky_column_6-left);
}

.sticky_column_7 {
   left: 300px;
   left: var(--sticky_column_7-left);
}

.sticky_column_8 {
   left: 350px;
   left: var(--sticky_column_8-left);
}

.sticky_column_9 {
   left: 400px;
   left: var(--sticky_column_9-left);
}

.sticky_column_10 {
   left: 450px;
   left: var(--sticky_column_10-left);
} */

.last_sticky_column {
   /* left: 0px;
   left: var(--last_sticky_column-left); */
   border-right: 1px solid #ccc;
}

.selected_column, .displaylist_tree_clip {
   position: var(--selected_column-position) !important;
   position: relative;
   left: 0px;
   z-index: 3 !important;
}

th.selected_column, th.displaylist_tree_clip {
   z-index: 4 !important;
}

#displaylist_budget_ .selected_column {
   background-color: #ffffff !important;
}

.displaylist_coloured_bars_outer {
   border-radius: 3px;
   /* margin-top: 2px; */
   margin-bottom: 4px;
}

.displaylist_coloured_bars_inner {
   border-radius: 3px;
   color:white;
   font-weight:bold;
   overflow:visible;
   white-space:nowrap;
   padding-top:2px;
   padding-bottom:2px;
   text-align:center;
}

/* bottom table buttons/page/max rows css */

.displaylistcontrols .addbutton {
   /* vertical-align: text-bottom; */
   padding-left: 0px;
}

.addbutton:hover {
   opacity: .75;
}

.multiple_add_buttons_div {
   display: inline-block;
   z-index: 2;
   /* cursor: pointer; */
   /* position: relative; */
   transition: .2s ease;
   /* margin-right: 7px; */

   /* background-image: url(/images/icons/white/new.svg);
   background-repeat: no-repeat;
   background-position: left;
   background-size: 15px 15px; */
   width: 65px;
   font-size: 1em;
   border-radius: 5px;
   cursor: pointer;
   background-color: var(--main_colour);
   color: #FFFFFF;
   background-position-x: 5px;
   /* padding-left: 27.5px; */
   padding-top: 2.5px;
   padding-bottom: 2.5px;
   padding-left: 5px;
   padding-right: 5px;
   line-height: 25px;
   margin-left: 3px;
   margin-right: 3px;
   position: relative;
}

.multiple_add_buttons_div #table_add_icon {
   margin-right: 5px;
}

#table_add_caret {
   padding-left: 10px;
   /* margin-top: -3px; */
}

#table_add_caret svg {
   margin-bottom: 2px;
   transition: .1s ease;
}

.multiple_add_buttons_div.open #table_add_caret svg {
   transform: rotate(180deg);
   /* padding-right: 10px;
   padding-left: 0px; */
}

.multiple_add_buttons_div:hover {
   background-color: var(--lighter_shade_1);
}

.multiple_add_buttons_div img {
   margin-right: 0px;
   padding-right: 0px;
   padding-left: 0px;
}

.multiple_add_buttons_div.open {
margin-right: 0px;
}

/* .multiple_add_buttons_div.open img, .multiple_add_buttons_div img::before {
   content: url(/images/icon_add_button_x.svg);
} */


.multiple_add_button {
   vertical-align: top;
   background: var(--lightest_shade_1);
   color: var(--main_colour);
   transition: .2s ease;
   margin-left: -100px;
   display: inline-block;
   opacity: 0;
   height: 20px;
    padding: 5px;
    padding-left: 10px;
    padding-right: 10px;
    z-index: 1;
    pointer-events: none;
    position: absolute;
}

.multiple_add_button.open {
   margin-left: -0px;
   opacity: 1;
   pointer-events: auto;
   /* color: #00a470; */
   width: auto;
   position: relative;
}


.multiple_add_button.open:hover {
   /* background: #d6dce7; */
   background: var(--lightest_shade_2);
   color: var(--main_colour);
}

.multiple_add_button.open .psoda_icon {
   margin-right: 5px;
}

.multiple_add_button img {
   vertical-align: bottom;
}

.table_addbutton {
   display: inline-block;
   z-index: 2;
   /* background-image: url(/images/icons/white/new.svg);
   background-repeat: no-repeat;
   background-position: left;
   background-size: 15px 15px; */
   width: 50px;
   font-size: 1em;
   border-radius: 5px;
   cursor: pointer;
   background-color: var(--main_colour);
   color: #FFFFFF;
   background-position-x: 5px;
   padding-left: 5px;
   padding-right: 5px;
   padding-top: 2.5px;
   padding-bottom: 2.5px;
   line-height: 25px;
   margin-left: 3px;
   margin-right: 3px;
   position: relative;
}

.table_addbutton:hover {
   background-color: var(--lighter_shade_1);
   color: #ffffff;
}

.table_addbutton .psoda_icon {
   margin-right: 5px;
}

#renumberteststeps_button {
   margin-left: 10px;
}

/* .displaylistcontrols .importfromcsv:hover, .displaylistcontrols .importfromcsv::before {
   content: url(/images/icons/darkgrey/import_from_csv.svg);
} */

.displaylistcontrols .settings {
   transition: .2s ease;
   margin-left: 3px;
   margin-right: 5px;
   padding-left: 4px;
}

/* .displaylistcontrols .settings:hover, .displaylistcontrols .settings::before {
   content: url(/images/icon_settings_dark.svg);
   transform: rotate(25deg); */
/* } */

/* .multiple_add_button.open:hover {
   background: #BAE6D8;
} */

/* .multiple_add_button img {
   vertical-align: bottom;
} */

/* .displaylistcontrols .importfromcsv:hover, .displaylistcontrols .importfromcsv::before {
   content: url(/images/icons/darkgrey/import_from_csv.svg);
} */

.displaylistcontrols .settings {
   transition: .2s ease;
   margin-left: 3px;
   padding-left: 4px;
}

/* .displaylistcontrols .settings:hover, .displaylistcontrols .settings::before { */
   /* content: url(/images/icon_settings_dark.svg); */
/* } */

/* .displaylistcontrols .exporttoexcel:hover, .displaylistcontrols .exporttoexcel::before {
   content: url(/images/icon_export_to_excel.svg);
}

.displaylistcontrols .exporttocsv:hover, .displaylistcontrols .exporttocsv::before {
   content: url(/images/icon_export_to_csv.svg);
} */

#refresh_button, .refresh_button {
   transition: .2s ease;
   margin-left: 3px;
   padding-left: 3px;
   margin-right: 3px;
   padding-right: 3px;
}

#refresh_button:hover, #refresh_button::before, .refresh_button:hover, .refresh_button::before, .displaylist_refresh_button:hover #refresh_button {
   /* content: url(/images/icons/green/refresh.svg); */
   transform: rotate(25deg);
}

.displaylist_refresh_button {
   padding-top: 3px;
   padding-bottom: 3px;
}

/* Three dot other options menu on bottom of table */

.other_options_button_div {
   position: relative;
   display: inline-block;
   margin-left: 5px;
   margin-right: 5px;
   cursor: pointer;
   padding-top: 2px;
   padding-bottom: 2px;
   padding-left: 2px;
   padding-right: 2px;
}

/* #other_options_button:hover, #other_options_button::before {
   content: url(/images/icon_actionmenu_dark.svg);
} */

#other_options_button svg, .displaylist_refresh_button svg {
   vertical-align: middle;
}

#displaylist_other_options.other_options_closed {
   display:none;
}

#displaylist_other_options.other_options_open {
   display:block;
}

#displaylist_other_options {
   position: absolute;
   /* top: 20px;
   left: 0; */
   /* width: 200px; */
   box-shadow: var(--box_shadow);
   z-index: 15;
   text-align: left;
   background: #fff;
   border-radius: 10px;
}

#displaylist_other_options p {
   padding: 7px 20px 7px 20px;
   margin-top: 5px;
   margin-bottom: 5px;
}

#displaylist_other_options p:hover {
   background: #f9f9f9;
}

#displaylist_other_options p a {
   width: 100%;
   display: block;
   height: 100%;
   color: var(--font_grey);
}

/* format options on bottom of tables */

.displaylist_format_options {
   display: inline-block;
   width: 100%;
   padding-top: 10px;
   margin-left: -7px;
}

.displaylist_format_options div {
   display: inline-block;
   padding: 5px;
   padding-left: 10px;
   padding-right: 10px;
   margin: 5px;
   margin-left: 7.5px;
   margin-right: 7.5px;
   background-color: #eaeaea;
   color: #A3A3A3;
   border-radius: 3px;
   z-index: 1;
   font-size: 0.9em;
}

.displaylist_format_options div:hover {
   color: var(--main_colour);
}

.displaylist_format_options .format_tick_icon {
   display: none;
   margin-top: -2px;
   margin-bottom: -2px;
}

.displaylist_format_options .format_showing_new .format_tick_icon, .displaylist_format_options .format_showing .format_tick_icon {
   display: inline-block;
   padding-right: 5px;
}

.displaylist_format_options .format_showing div, .displaylist_format_options .format_showing_new{
   color: var(--main_colour);
   background-color: var(--lightest_shade_2);
  font-weight: bold;
   /* padding-left: 30px;
   background-image: url(/images/icons/theme_night/tick.svg);
   background-repeat: no-repeat;
   background-position: 9px center;
   background-size: 12px; */
   z-index: 2;
}

.displaylist_format_options .format_button, .displaylist_format_options div.format_joined_first, .displaylist_format_options div.format_joined_last{
	cursor: pointer;
}


.displaylist_format_options .format_joined_first div, .displaylist_format_options div.format_joined_first{
   margin-right: -1px;
}

.displaylist_format_options .format_joined_last div, .displaylist_format_options div.format_joined_last{
	margin-left: -1px;
}

.displaylist_format_options .format_estimate div {
   margin-left: -4px;
}

.displaylist_format_options .format_popuplink {
   background-color: #ffffff;
   border: 1px solid  var(--main_colour);
}

.displaylist_format_options .format_popuplink a {
   color: var(--main_colour);
}

.displaylist_format_options .textedit {
   padding-right: 20px;
   background-position: calc(100% - 5px) 5px;
}

#remove_filters_button {
	margin-left: 3px;
	padding-left: 4px;
	cursor: pointer;
	width: 20px;
	height: 20px;
}

#remove_filters_button:hover, #remove_filters_button::before {
/*	filter:grayscale(100%) */
	transform: scale(1.1);
}

/* .displaylistcontrols .next:hover, .displaylistcontrols .next::before {
   content: url(/images/icon_next.svg);
}

.displaylistcontrols .previous:hover, .displaylistcontrols .previous::before {
   content: url(/images/icon_previous.svg);
}

.displaylistcontrols .first:hover, .displaylistcontrols .first::before {
   content: url(/images/icon_first.svg);
}

.displaylistcontrols .last:hover, .displaylistcontrols .last::before {
   content: url(/images/icon_last.svg);
} */

.displaylistcontrols .next, .displaylistcontrols .previous, .displaylistcontrols .first, .displaylistcontrols .last {
   display: inline-block;
   padding: 7px;
   cursor: pointer;
}

.displaylistcontrols .next .psoda_icon, .displaylistcontrols .previous .psoda_icon, .displaylistcontrols .first .psoda_icon, .displaylistcontrols .last .psoda_icon {
   /* pointer-events: none; */
}

.pagenumbers, .maxrows {
   display: inline-block;
   vertical-align: top;
}

.pagenumbers {
   margin-right: 20px;
   margin-left: 20px;
}

.pagenumbers img {
   vertical-align: baseline;
   cursor: pointer;
   padding-top: 7px;
   padding-bottom: 7px;
   margin-bottom: -7px;
}

.pagenumbers input[type="text"] {
   border-radius: 5px;
}

.column_selector img {
   vertical-align: baseline;
   cursor: pointer;
   padding-top: 6px;
   padding-bottom: 6px;
   margin-bottom: -8px;
}

.maxrows {
   margin-right: 20px;
}

.maxrows .textedit {
   padding-right: 20px;
   background-position: calc(100% - 5px) 5px;
}

.maxrows input {
   border-radius: 5px;
}

.show_rows_dropdown {
   width: 65px;
   min-width: 65px;
   max-width: 65px;
   border-radius: 5px;
}

.column_selector {
   display: inline-block;
    vertical-align: middle;
    /* margin-right: 10px; */
    /* margin-top: 4px; */
    margin-top: -2px;
}

.column_selector span {
vertical-align: middle;
}

.actiononselected {
   display: none;
   background-color: #ffffff;
   /* padding-top: 10px;
   padding-bottom: 10px; */
   height: 23px;
   position: absolute;
   left: 0px;
   z-index: 3;
   width: 100%;
   /* bottom: 0px; */
   top: 0px;
}

.actiononselected_inner {
   background-color: var(--lightest_shade_1);
   width: max-content;
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   margin-top: 10px;
   border-radius: 5px;
}

/* #displaylist_budget_ #clearselectedactions {
   margin-top: -23px
} */

.actiononselected_imgs_divs {
   display: inline-block;
   margin-left: 5px;
   margin-right: 5px;
	vertical-align: middle;
}

.actiononselected_imgs_divs .psoda_icon {
   position: absolute;
   pointer-events: none;
   padding-left: 2px;
}

.actiononselected_imgs {
   /* padding-left: 7px;
   padding-right: 7px;
   margin-right: 0px !important;
   vertical-align: middle;
   padding-top: 3px;
   padding-bottom: 3px; */
   width: 24px;
   height: 24px;
   cursor: pointer;
   background: none;
   border: none;
   color: var(--lightest_shade_1);
}

#selecteditemsnumber {
   font-weight: bold;
   color: var(--main_colour);
   margin-left: 10px;
}

#clearselectedactions {
   /* margin-right: 10px; */
   /* height: 100%; */
   vertical-align: middle;
   background-color: var(--main_colour);
   text-align: center;
   color: #fff;
   /* padding: 3px;
   padding-left: 10px;
   padding-right: 10px;
   margin-top: -2px; */
   cursor: pointer;
   border-radius: 50%;
   width: 24px;
   height: 24px;
   display: inline-block;
   /* background-image: url(/images/icons/white/closepopup.svg);
   background-repeat: no-repeat;
   background-size: 10px;
   background-position: center; */
}

#clearselectedactions svg {
   vertical-align: middle;
}

tr.selected_row, tr.selected_row:hover {
   background: var(--lightest_shade_1);
}

.displaylist tr.archived_row.selected_row, .displaylist tr.archived_row.selected_row:hover {
   background: #cdcdcd;
}

/* budget float right issue with scrollable table fix */

/* #displaylist_budget_ .displaylistcontrols .floatright {
   position: absolute;
    right: 10px;
} */


.popup .displaylist th, .popup .displaylist td.displaylistcontrols {
   background: #f9f9f9;
}

.popup .displaylist tr {
   background: linear-gradient(to bottom, #f1f1f1, #e7e7e7);
}

.popup .displaylist tr:hover {
   background: linear-gradient(to bottom, #d9d9d9, #dfdfdf);
}

/*************/
/* Login log */
/*************/

.loginlog {
   background:white;
   /* -webkit-box-shadow:0px 0px 15px #e8e8e8;
   -moz-box-shadow:0px 0px 15px #e8e8e8;
   box-shadow:0px 0px 15px #e8e8e8; */
}

.loginlog td {
   padding-left:5px;
   padding-right:5px;
   background:#EBEEF2;
   text-align:right;
}

.loginlog th {
   padding-left:5px;
   padding-right:5px;
   /* background:#666666; */
   background: var(--main_colour);
   color: #ffffff;
   font-weight: 100;
}

/****************/
/* Asset header */
/****************/
.breadcrumbs {
   font-size:0.8em;
   color: var(--font_grey);
}

.breadcrumbs a {
   color: var(--font_grey);
}

.breadcrumbs a:hover {
   text-decoration: underline;
}

.breadcrumb_menu a {
   color: var(--font_link);
   font-weight: 100;
}

.breadcrumb_menu a:hover {
   color: var(--font_link_hover);
   text-decoration: none;

}

.first_asset_header {
   float:left;
    min-height:120px;
    min-width: 20%;
    max-width: 30%;
    /*  background-color: #F9F9F9; */
    border-right: 1px solid #eaeaea;
    position: relative;
    padding: 10px;
    padding-right: 20px;
    padding-left: 0px;
}

.first_asset_header .displaydetails {
    margin-bottom:20px;
    margin-top: 20px;
    margin-left: 30px;
}

.displaydetails {
    margin-top: 20px;
    margin-left: 20px;
}

.history_displaydetails {
   margin-top: 0px;
   margin-left: 0px;
}

.change_history_header_outer {
	float: right;
}

.change_history_header_inner {
	display: inline-block;
	margin-left: 20px;
}

.change_history_img {
	display: inline-block;
	margin-right: 5px;
	vertical-align: middle;
}

.change_history_img .status_state {
	margin-left: 20px;
}

.change_history_info {
	display: inline-block;
	vertical-align: middle;
}

.restore_history_button {
   display: inline-block;
}

.restore_history_button .psoda_icon {
   margin-right: 5px;
}

.first_asset_header .displaydetails td, .first_asset_header .displaydetails td {
   word-break: break-word;
}

.first_asset_header legend {
   background:white;
   color: var(--font_grey);
}


.first_asset_header h2 {
   /* background:white; */
   color: var(--font_grey);
   position:absolute;
   top:0px;
   left:10px;
   font-size:0.9em !important;
   font-weight:normal;
   padding-left:5px;
   padding-right:5px;
}

.first_asset_header .hierarchy_highlight a + span {
   max-width: 75%;
}

.first_asset_header .hierarchy_highlight a {
   vertical-align: top;
}

.asset_header {
   float:left;
   margin-left:20px;
   max-width: calc(59% - 40px);
   min-height:145px;
    min-width: 20%;
    /*     background-color: #F9F9F9; */
    border-right: 1px solid #eaeaea;
    position: relative;
    padding: 10px;
    padding-right: 20px;
    padding-left: 0px;
    display: none;
}

.asset_header ~ .asset_header {
   margin-left:20px;
   max-width: calc(39% - 40px);
}

.asset_header .displaydetails {
   margin-left: 0px;
}

.asset_header legend {
   background:white;
   color: var(--font_grey);
}

.asset_header h2 {
   /* background:white; */
   color: var(--font_grey);
   position:absolute;
   top:0px;
   /* left:10px; */
   font-size:0.9em !important;
   font-weight:normal;
   /* padding-left:5px; */
   padding-right:5px;
}

.follow_buttons {
   text-align:right;
   position:absolute;
   right:10px;
   bottom:10px;
}

.follow_buttons a {
   text-decoration:none;
   color: white;
   background-color: #00a470;
   padding: 2px 10px;
 /*   -webkit-border-radius:3px;
   -moz-border-radius:3px;
   border-radius:3px; */
   /* -webkit-box-shadow:1px 1px 5px #CECECE;
   -moz-box-shadow:1px 1px 5px #CECECE;
   box-shadow:1px 1px 5px #CECECE; */
}

.follow_buttons a:hover{
background: #6cc5a9;
}

.follow_buttons a:nth-child(2) {
   text-decoration:none;
   color: white;
   background-color: #ea6928;
   padding: 2px 10px;
 /*   -webkit-border-radius:3px;
   -moz-border-radius:3px;
   border-radius:3px; */
   /* -webkit-box-shadow:1px 1px 5px #CECECE;
   -moz-box-shadow:1px 1px 5px #CECECE;
   box-shadow:1px 1px 5px #CECECE; */
}

.follow_buttons a:nth-child(2):hover{
   background-color:rgba(234, 105, 40, 0.76);
}


/******************/
/* Comment Stream */
/******************/

.commententry {
   text-align:left;
   padding-top:20px;
   padding-bottom:20px;
   border-bottom:1px solid #BBBBBB;
}

.commententry a {
   text-decoration:none;
   color: var(--font_link);
}

.commententry a:hover {
   color: var(--font_link_hover);
}

.commentcontext {
   float:right;
   text-align:right;
   color:#BBBBBB;
   margin-bottom:10px;
   margin-left:20px;
}

.commentcontext a {
   text-decoration:none;
   color: var(--font_link);
}

.commentcontext a:hover {
   color: var(--font_link_hover);
}

/**** Conversation ****/

#conversation table {
   width:100%;
   max-width:1024px;
   margin-left:auto;
   margin-right:auto;
}

#conversation td {
   vertical-align:top;
}

#conversation .somebody {
   padding-right:20px;
   text-align:right;
   width:50px;
}

#conversation .me {
   padding-left:20px;
   width:50px;
}

#conversation .datestamp {
   color:#BBBBBB;
   text-align:center;
   padding-bottom:10px;
}

#conversation .timestamp {
   color:#BBBBBB;
}

#conversation .context {
   color:#BBBBBB;
}

#conversation .context a {
   color:#BBBBBB;
}

#conversation .speechbubble_right {
    background-color: #E7F1FB;
    border: 1px solid #E7F1FB;
    position: relative;
    line-height: 1.3em;
    padding: 15px 25px 15px 25px;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
   margin-bottom:40px;
   float:right;
}

#conversation .speechbubble_left {
    background-color: white;
    border: 1px solid white;
    position: relative;
    line-height: 1.3em;
    padding: 15px 25px 15px 25px;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    box-shadow: 2px 2px 20px 3px rgba(0,0,0,0.1);
    -moz-box-shadow: 2px 2px 20px 3px rgba(0,0,0,0.1);
    -webkit-box-shadow: 2px 2px 20px 3px rgba(0, 0, 0, 0.1);
   margin-bottom:40px;
   float:left;
}

#conversation .speechbubble_left .left-arrow {
   border-color: transparent #FFFFFF transparent transparent; /*border color should be same as div.speechbubbles background color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:15px;
   left:-19px;
}

#conversation .speechbubble_right .right-arrow{
   border-color: transparent transparent transparent #E7F1FB; /*border color should be same as div.speechbubbles background color*/
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top:15px;
   right:-19px;
}

#add_comment_div {
   width:400px;
   margin-left:auto;
   margin-right:auto;
   margin-bottom:20px;
}

#add_comment_button {
   border:none;
   margin-top:10px;
   margin-left:auto;
   margin-right:auto;
   padding-top:5px;
   padding-bottom:5px;
   padding-left:15px;
   padding-right:15px;
   background:var(--main_colour);
   text-align:center;
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
   color:white;
   width:100px;
   cursor: pointer;
}

/**** viewdetails ****/

#viewdetails {
   position:relative;
   /* padding-bottom:20px; */
   height:400px;
   /* background:white; */
   background: #f9f9f9;
}

html>body #viewdetails {
   height:auto;
   min-height:400px;
}

#viewdetails .blue_corner_bottom_left {
   bottom:0px;
}

#viewdetails .blue_corner_bottom_right {
   bottom:0px;
}

#viewdetails h1 {
   margin-top:0px;
   margin-bottom:0px;
   padding-left:17px;
   padding-top:2px;
   padding-bottom:2px;
   display:block;
   font-size:1.0em;
   background:#6d99c0;
   color:white;
   
   position:absolute;
   top:-9999px;
}

#viewdetails img {
   border:none;
}

.viewdetailsbuttons {
   font-size:0.8em;
}

.viewdetailsbuttons a {
   text-decoration:none;
   font-weight:bold;
   color: var(--font_grey);
}

.toolbar_holder {
   padding-bottom:25px;
}

.toolbar_holder.autohide {
   height: 15px;
   margin-bottom: 10px !important;
   padding-bottom: 0px !important;
}

.toolbar_clip {
   background: #4c576b;
   position:relative;
   overflow:hidden;
   z-index:4;
}

.toolbar_clip.autohide {
    background: transparent;

/* border-bottom:1px solid #E7F1FB;
   box-shadow: 0px 0px 15px #6d99c0; */

 /*   border-bottom:2px solid transparent; */
/*    width: 100px;
    margin: auto;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px; */
    transition: background .25s ease;
}

.toolbar_holder:hover .toolbar_clip.autohide, .toolbar_clip.autohide:hover {
   background: #4c576b !important;
   transition: .25s ease;
   transition-delay: .1s;
} 

.toolbar_clip h2 {
   position:absolute;
   left:0px;
   right:0px;
   bottom:-10px;
   text-align:center;
   font-size:0.9em !important;
   color: white;
}

.toolbar_clip.autohide h2 {
   background: var(--main_colour);
   width: 100px;
   margin-left: auto;
   margin-right: auto;
   transition: .25s ease;
   border-bottom-left-radius: 5px;
   border-bottom-right-radius: 5px;
}

.toolbar_holder:hover .toolbar_clip.autohide h2, .toolbar_clip.autohide:hover h2 {
   background: #4c576b;
   transition: .25s ease;
   transition-delay: .1s;
}

.toolbar {
   bottom:0px;
   left:0px;
   right:0px;
   padding-left:17px;
   padding-bottom:14px;
}

.toolbar a {
   color:white;
   text-decoration:none;
   border:1px solid transparent;
}

.toolbar a:hover {
   background-color:var(--main_colour);
    border: 1px solid var(--main_colour);
   -webkit-border-radius:2px;
   -moz-border-radius:2px;
   border-radius:2px;
}

.toolbar_section {
   position:relative;
   border-right:1px solid #8a8a8a;
   float:left;
   padding-left:3px;
   padding-right:3px;
    padding-top:10px;
    margin-top: 10px;
  /*  background-image:url(/images/toolbar_section_title.png);
   background-repeat:repeat-x;
   background-position:top; */
}

.toolbar_section h3 {
    padding-left: 5px;
    padding-right: 5px;
    font-size: 0.8em;
    position: absolute;
    top: -15px;
    color: #acaebf;
    left: 0px;
    right: 0px;
    text-align: center;
    background-color: var(--main_colour);
}

.toolbar_button {
   font-size:8pt;
}

.toolbar_button img {
   width:16px;
   height:16px;
}

.toolbar_button a {
   margin-left:10px;
   margin-top:3px;
   padding-top:2px;
   margin-bottom:3px;
   padding-bottom:2px;
   margin-right:5px;
   padding-right:5px;
   float:left;
   display:block;
   background-repeat:no-repeat;
   background-position:2px;
   padding-left:22px;
}

.toolbar_button:hover {
   background:#fff9cf;
}

.blue_button {
   background:#97b4ce;
   float:left;
}

/* .blue_button div.left {
   float:left;
   display:block;
   background-image:url("/images/lightblue_button_left.gif");
   background-repeat:no-repeat;
   background-position:left top;
   text-align:center;
}

html>body .blue_button div.left {
   background-image:url("/images/lightblue_button_left.png");
}

.blue_button div.right {
   float:left;
   background-image:url("/images/lightblue_button_right.gif");
   background-repeat:no-repeat;
   background-position:right top;
}

html>body .blue_button div.right {
   background-image:url("/images/lightblue_button_right.png");
}

.blue_button div.background {
   float:left;
   margin-left:8px;
   margin-right:8px;
   height:35px;
   padding-top:3px;
   background-image:url("/images/lightblue_button_background.gif");
   background-repeat:repeat-x;
}

html>body .blue_button div.background {
   margin-left:17px;
   margin-right:18px;
   background-image:url("/images/lightblue_button_background.gif");
} */

.blue_button a {
   float:left;
   background-repeat:no-repeat;
   background-position:center top;
   padding-top:17px;
}

.blue_button .background div {
   float:left;
   background-repeat:no-repeat;
   background-position:center top;
   padding-top:17px;
}

.lightblue_button {
   float:left;
}

/* .lightblue_button>a {
   display:block;
   background-image:url("/images/lightblue_button_left.png");
   background-repeat:no-repeat;
   background-position:left top;
   color:white;
   text-decoration:none;
   text-align:center;
}

.lightblue_button>a>div {
   background-image:url("/images/lightblue_button_right.png");
   background-repeat:no-repeat;
   background-position:right top;
}

.lightblue_button>a>div>div {
   margin-left:18px;
   margin-right:18px;
   height:37px;
   padding-top:3px;
   background-image:url("/images/lightblue_button_background.png");
   background-repeat:repeat-x;
}

.lightblue_button>a>div>div>div {
   background-repeat:no-repeat;
   background-position:center top;
   padding-top:17px;
} */

.toolbar_tiny_button {
   margin:0px;
   padding:0px;
   /* overflow:hidden;
   background-image:url("/images/button_lightblue_tiny.gif");
   background-repeat:no_repeat;
   background-position:top left; */
   float:left;
}

.toolbarbutton {
   background-size:16px 16px;
}

.widetoolbarbutton {
   background-size:16px 16px;
}

.widetoolbarbutton_nolabel {
   background:transparent;
   display:block;
   padding:0px;
   width:24px;
   height:24px;
   background-repeat:no-repeat;
   background-position:center center;
   background-size:16px 16px;
   text-align:center;
   font-size:0px;
   color:#FFFFFF!important;
}

.widetoolbarbutton_nolabel img {
   margin-top:4px;
}

.toolbarbutton_nolabel {
   background:transparent;
   display:block;
   width:24px;
   height:24px;
   background-repeat:no-repeat;
   background-position:center center;
   background-size:16px 16px;
   text-align:center;
   font-size:0px;
   color:#FFFFFF!important;
}

.toolbarbutton_noicon {
   background:#97b4ce;
   border-top:1px solid #BBBBBB;
   border-left:1px solid #BBBBBB;
   border-bottom:1px solid #999999;
   border-right:1px solid #999999;
   padding-left:5px;
   padding-right:5px;
   padding-top:2px;
   padding-bottom:2px;
   float:left;
   text-align:center;
}

.selfimage {
   padding-top:0px !important;
   padding-left:0px !important;
}

.selfimage span {
   position:relative;
   top:-2px;
}

#viewdetailsbuttons a:hover {
   color:#0000FF;
}

#viewdetailsseparator {
   clear:left;
}

#viewdetails h2 {
   font-size:1.3em;
}

#viewdetailscontent {
   /* padding-top:10px; */
   padding-left:17px;
   padding-right:10px;
}

#viewdetailscontent pre {
   font-family : var(--font_family);
   margin:0px;
}

#viewdetailscontent textarea {
   font-size:1em;
}

/**** displaydetails ****/

.displaydetails th {
   text-align:right;
   vertical-align:top;
}

.displaydetails_twocols {
	column-count:2;
}

@media (max-width:1000px) {
	.displaydetails_twocols {
		column-count:1;
	}
}

.displaydetails_stats th {
   padding-left:10px;
   padding-right:10px;
   text-align:center;
}

.displaydetails_stats td {
   padding-left:10px;
   padding-right:10px;
   text-align:center;
}

.displaydetails_section_gap {
   height:1em;
   background:none !important;
   border:none !important;
}

.displaydetails_section {
   text-align:center !important;
   background:#eaeaea;
}

/**** hierarchy ****/
.hierarchy_highlight {
   font-size:1.4em;
}

/**** releasenoteslist ****/

.col1 {
   padding-left:5px;
   padding-right:5px;
   text-align:right;
}

.col2 {
   text-align:left;
   padding-left:5px;
   padding-right:5px;
}

/**** Advanced risk map table ****/
.advancedriskmaptable td {
   text-align:right;
}

.advancedriskmaptable select {
   width:75px;
   min-width:75px;
}

.simplifiedriskmaptable td {
   text-align:right;
}

.simplifiedriskmaptable select {
   width:75px;
   min-width:75px;
   text-align:right;
   border-radius: 5px;
}

.calculated_risk {
   color:black;
   font: 400 13.3333px Arial;
   /* border:1px solid #eaeaea; */
    max-width:450px;
    padding: 5px;
    border-radius: 5px;
    padding-top: 7.5px;
    padding-bottom: 7.5px;
    margin-top: 5px;
}

.risk_map_tab_td {
   margin:0;
   padding: 10px;
   min-width: 75px;
   text-align: center !important;
   word-spacing: 2px;
}

/**** dialog ****/

.dialog {
   margin-left:auto;
   margin-right:auto;
   position:relative;
   margin-top:5px;
   margin-bottom:5px;
   height:300px;
   width:600px;
   border-top:1px solid #BBBBBB;
   border-left:1px solid #BBBBBB;
   border-bottom:1px solid #888888;
   border-right:1px solid #888888;
}

html>body .dialog {
   height:auto;
   min-height:300px;
}

.dialog h1 {
   margin-top:0px;
   padding-left:5px;
   padding-bottom:2px;
   display:block;
   font-size:0.9em;
   background:#BBBBBB;
}

.dialogcontent {
   padding-left:5px;
   padding-right:5px;
}

.dialogerrormessage {
   text-align:left;
}

.popup .dialogerrormessage em {
   padding: 3px;
   border-radius: 5px;
   padding-left: 5px;
   padding-right: 5px;
   background: #ffdddd;
}

.locked_for_editing_em {
   display: inline-block;
   margin-top: 10px;
   padding: 3px;
   border-radius: 5px;
   padding-left: 5px;
   padding-right: 5px;
   background: #ffdddd;
}

.popup .dialogerrormessage .green {
   background: #cef5ce;
}

/**** dialogtable ****/
.dialogtable {
   /* margin-left:10px; */
   text-align:left;
}

.dialogtable th {
   text-align:right;
}

.mandatorymessage {
   text-align:center;
}

.mandatorystar {
   color: #FF3333;
}

.dialogmessage {
   text-align:center;
   padding-top:5px;
   padding-bottom:5px;
   margin-bottom:20px;
}

.popup_reference_button {
   display: inline-block;
   width: 16px;
   height: 16px;
   cursor: pointer;
   vertical-align: middle;
   margin-left: 10px;
   margin-right: 2px;
   padding: 4px;
   background-size: 16px;
   background-position: center;
   background-repeat: no-repeat;
}

.input_help {
   border:none;
   vertical-align: middle;
   padding: 5px;
}

.input_help svg {
   margin-top: 4px;
}

.input_help_calendar svg {
   margin-top: 0px;
}

.dialogbuttons {
   padding-top:20px;
   /* text-align:center; */
   padding-bottom:20px;
   border-top:1px solid #eaeaea;
   position:relative;
}

.popup .dialogbuttons {
   background-color: #ffffff;
   border-top: none;
   box-shadow: 0px -4px 3px rgb(50 50 50 / 10%);
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
   min-height: 33.4px;
}

.popup_psonar .dialogbuttons {
   border-bottom-right-radius: 0px;
}

.popup .dialogbuttons_tabbed {
   padding-left: 225px;
}

.popup .dialogbuttons_tabbed .popup_button_submit {
   margin-left: 20px;
}



/** dialogbuttons AND update matrix button AND add meeting buttons ("required" etc)**/

.dialogbuttons input, #viewdetailscontent > div.tabbed_control > div.tabbed_control_content-left > div > div.tabbed_control_content > form > label:nth-child(26) > input[type="submit"]:nth-child(32) {
   /*border:2px solid #00a470;*/
   border:none;
   margin-right:10px;
   padding-top:5px;
   padding-bottom:5px;
   padding-left:15px;
   padding-right:15px;
   background:#00a470;
   text-align:center;
   color:white !important;
   cursor:pointer;
   border-radius: 3px;
}

.popup .popup_button_submit {
   padding-top:7.5px;
   padding-bottom:7.5px;
   padding-left:30px;
   padding-right:30px;
   margin-left: 33px;
}

.dialogbuttons .cancel_button {
   background-color:transparent !important;
   color: var(--font) !important;
   float: right;
   margin-right: 265px;
}

.dialogbuttons .cancel_button:hover,.dialogbuttons .cancel_button:focus {
   background-color:transparent !important;
   color:#2d2d2d !important;
}

.dialogbuttons .back_button_outer   {
   display: inline-block;
   margin-left: 20px;
}

.dialogbuttons .popup_button_back {
   /* background-image: url(/images/icons/darkgrey/back.svg) !important;
   background-size: 14px auto !important;
   background-position: 15px !important;
   background-repeat: no-repeat !important; */
   background-color:transparent !important;
   color: var(--font) !important;
   margin-left: 10px;
   padding-left: 30px;
   margin-left: -20px;
}

/* .popupdialog_addmore + .popup_button_back {
   background-position: left !important;
   padding-left: 20px;
} */

.popupdialog_addmore + .back_button_outer {
   margin-left: 0px;
}

.dialogbuttons .popup_button_back:hover {
   background-color:transparent !important;
   color:#2d2d2d !important;
}


.dialogbuttons input:focus { 
   background:#6cc5a9;
}

.dialogbuttons input:hover {
   background:#6cc5a9;
}

.scroll_icon {
   position:absolute;
   top:-82px;
   right:15px;
   width:32px;
   height:72px;
}

#navigator_width {
    padding: 5px;
}


/**** dialog tabs ****/

.dialog_tab_button {
   border:none;
   margin:0px;
   background-color:transparent;
   background-repeat:no-repeat;
   padding-left: 5px;
}

.dialog_tab_image {
   padding:0px;
   background-size:16px 16px;
}

.dialog_tab_selected_image {
   padding:0px 0px 0px 20px;
   background-size:16px 16px;
}

/**** popup ****/

#popupmanager_minimised {
   position:fixed;
   bottom:0px;
   right:10px;
   z-index:16;
}

.popup-minimised {
   background:white;
   /* padding-right:3px; */
   -webkit-box-shadow:var(--popup_box_shadow);
   -moz-box-shadow:var(--popup_box_shadow);
    box-shadow:var(--popup_box_shadow); /*CSS3 shadow*/
   float:right;
   margin-top: 10px;
   margin-left: 10px;
   width: 140px;
   background:#FFFFFF;
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
}

.popup-minimised:hover {
   background:#f7f7f7;
}

.maximise_button {
   padding-left:10px;
   padding-top:5px;
   padding-bottom:5px;
   height: 17px;
   width: 95px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   display: inline-block;
   margin-right: 5px;
   font-weight:bold;
   cursor:pointer;
}

.popup-minimised .close_button {
   float:none;
   margin:0px;
   padding-bottom:0px;
   /* background-image:url(/images/popup_x_night.svg); */
   vertical-align: top;
    margin-top: 3px;
}

.minimised_progress {
   height: 6px;
   margin-top: -6px;
   background-color: var(--main_colour);

   transition: .5s ease;
}

.minimised_animation {
   -webkit-animation: minimised_complete 3s ease;  /* Safari 4+ */
   -moz-animation: minimised_complete 3s ease;  /* Fx 5+ */
   -o-animation: minimised_complete 3s ease;  /* Opera 12+ */
   animation: minimised_complete 3s ease;
}

@keyframes minimised_complete {

   0%{
      background-color: #ffffff;
      color: var(--font_grey);
      }

   20% {
     background-color: var(--main_colour);
     color: white;   
   }

   40%{
     background-color: #ffffff;
     color: var(--font_grey);
     }

     60% {
      background-color: var(--main_colour);
      color: white;    
    }

    80% {
      background-color: #ffffff;
      color: var(--font_grey);
      }

 }

 /* .minimised_complete_close_button {
   -webkit-animation: minimised_complete_close_button 3s ease; 
   -moz-animation: minimised_complete_close_button 3s ease;  
   -o-animation: minimised_complete_close_button 3s ease; 
   animation: minimised_complete_close_button 3s ease;
} */

 /* @keyframes minimised_complete_close_button {

   0%{
      background-image:url(/images/popup_x_grey.svg);
      }

   20% {
      background-image:url(/images/popup_x_white.svg);  
   }

   40%{
      background-image:url(/images/popup_x_grey.svg);
     }

     60% {
      background-image:url(/images/popup_x_white.svg);
   }

    80% {
      background-image:url(/images/popup_x_grey.svg);
      }

 } */

 .popup.minimise_down_animation {
   transition: .2s ease;
   opacity: 0;
   top: 20vh !important;
   margin-left: 60% !important;
 }

.close_button {
   /* background-image:url(/images/popup_x_night.svg);
   background-repeat:no-repeat;
   background-position:center;
   background-size:21px 21px;  */
   display: inline-block;
   width: 24px;
   height: 24px;
   /* padding-bottom:3px; */
   margin-top: 2px;
   margin-bottom: 2px;
   /* padding-top:5px; */
   /* float:right; */
   cursor:pointer;
   margin-left:5px;
   margin-right:5px;
   vertical-align: middle;
}

.close_button .psoda_icon, .help_button .psoda_icon {
   margin-left: 5px;
}

.minimise_button .psoda_icon {
   margin-left: 4px;
}

.close_button .psoda_icon svg, .help_button .psoda_icon svg, .minimise_button .psoda_icon svg {
   vertical-align: middle;
}

/* .close_button:hover {
   background-image:url(/images/popup_x_orange.svg);
} */

.help_button {
   /* background-image:url(/images/icons/theme_night/help.svg);
   background-repeat:no-repeat;
   background-position:center;
   background-size:14px;  */
   display: inline-block;
   width: 24px;
   height: 24px;
   /* padding-bottom:3px; */
   margin-top: 2px;
   margin-bottom: 2px;
   /* padding-top:5px; */
   /* float:right; */
   cursor:pointer;
   margin-left:5px;
   margin-right:5px;
   vertical-align: middle;
}

/* .help_button:hover {
   background-image:url(/images/popup_help_blue.svg);
} */

.minimise_button {
   /* background-image:url(/images/popup_minimise_night.svg);
   background-repeat:no-repeat;
   background-position:center;
   background-size:16px 21px; */
   display: inline-block;
   width: 24px;
   height: 24px;
   /* padding-bottom:3px; */
   margin-top: 2px;
   margin-bottom: 2px;
   /* padding-top:5px; */
   /* float:right; */
   cursor:pointer;
   margin-left:5px;
   margin-right:5px;
   vertical-align: middle;
}

.popup {
   position:absolute;
  /*   -webkit-border-radius:10px;
   -moz-border-radius:10px; 
   border-radius:10px; */
   -webkit-box-shadow:var(--popup_box_shadow);
   -moz-box-shadow:var(--popup_box_shadow);
    box-shadow:var(--popup_box_shadow); /*CSS3 shadow*/
   /* background:white; */
   

}

.popup .top {
   cursor:move;
   /* height:25px; */
   overflow:hidden;
   /* background:white; */
    /* border-bottom:1px solid #eaeaea; */
   
  /*  -webkit-border-radius:10px 10px 0px 0px;
   -moz-border-radius:10px 10px 0px 0px;
   border-radius:10px 10px 0px 0px; */
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
}

.popup_psonar .top {
   border-top-right-radius: 0px;
}

.popup .top h2 {
   margin-top:8px;
   margin-left:20px;
   font-family:var(--font_family);
   font-size: 1.25em;
   font-weight:bold;
   color: var(--font_grey);
   display:block;
   float:left;
   background-color: white;
}

.popup .top img {
   border:none;
   padding-top:6px;
   padding-right:6px;
   float:right;
   
}


/*
.popup .top .close-button {
   position:relative;
   right:-3px;
}

.popup .top .help-button {
   padding-top:8px;
}
*/

.popup .content_background {
   position:absolute;
   left:25px;
   top:38px;
   right:25px;
   bottom:25px;
   background:white;
   z-index:-1;
}

.popup .content {
   background:#f9f9f9;
   position: relative;
/*    -webkit-border-radius:0px 0px 10px 10px;
   -moz-border-radius:0px 0px 10px 10px;
   border-radius:0px 0px 10px 10px; */
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
}

.popupdialogue {
   /* max-height:65vh; */
   overflow:auto;
   padding-left:30px;
   padding-right:50px;
   padding-top:0px;
   padding-bottom:15px;
   position: relative;
   margin-right: 225px;
   /* min-height: 65vh; */
   height: 65vh; 
}

.popup .logincontent {
   padding-top:20px;
   padding-bottom:10px;
   text-align:center;
   background:white;
/*    -webkit-border-radius:0px 0px 10px 10px;
   -moz-border-radius:0px 0px 10px 10px;
   border-radius:0px 0px 10px 10px; */
}

#popupcontent_viewhelp {
    padding: 20px;
}


/**ALL popups max-height and overflows **/

/* .popup {
      max-height: 85%;
      overflow: auto;
} */

#popupcontent_userpreferences_ {
    padding-top: 0px;
}

/**LOGIN popup - for when error message hits**/
#normalviewcontent .popup {
    position: relative;
}

#normalviewcontent > p {
    top: 8px !important;
}

/* new popup CSS WILL START */

#tmp_popup {
   min-width: 0px;
   margin: auto !important;
   top: 0 !important;
   left: 0 !important;
   right: 0 !important;
   bottom: 0 !important;
   height: 100px;
   width: 100px;
   -webkit-box-shadow:none;
   -moz-box-shadow:none;
    box-shadow:none; /*CSS3 shadow*/
}

.popup {
   width: 980px;
   top: 10vh !important;
  position: fixed;
  animation: fadein .5s;
  border-radius: 10px;
  opacity: 1;
}

/* @media (max-width:1280px) {
   .popup {
      width: 90px !important;
   }
} */

@keyframes fadein {
   0%{
      opacity: 0;
   }
   100%{
      opacity: 1;
   }
}

.loginpage .login_popup {
   /* position:absolute; */
    -webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);
    -moz-box-shadow:0px 0px 10px rgba(0,0,0,0.2);
     box-shadow:0px 0px 10px rgba(0,0,0,0.2); /*CSS3 shadow*/
    background:white;
    margin: auto !important;
    top: 140px !important;
    left: 0 !important;
    position: absolute;
    right: 0 !important;
    text-align: center;
    /* padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 30px;
    padding-top: 10px; */
    padding: 10px;
    height: 500px;
    width: 400px !important;
    border-radius: 10px;
}

.login_popup {
   /* position:absolute; */
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
     box-shadow:none; /*CSS3 shadow*/
    background:transparent;
    margin: auto !important;
    top: 0px !important;
    left: 0 !important;
    position: relative;
    right: 0 !important;
    text-align: center;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 30px;
    padding-top: 10px;
    /* padding: 10px; */
    height: auto;
    width: 400px !important;
}

.login_popup input[type="submit"] {
   border: none;
   /* margin-right: 10px; */
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 15px;
   padding-right: 15px;
   background-color: #f58836;
   text-align: center;
   color: white !important;
   cursor: pointer;
} 

.login_popup {
	color: #101010;
}

.login_popup h1 {
	color: #101010 !important;
}

.resetpassword .login_popup {
   /* position:absolute; */
    -webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.2);
    -moz-box-shadow:0px 0px 10px rgba(0,0,0,0.2);
     box-shadow:0px 0px 10px rgba(0,0,0,0.2); /*CSS3 shadow*/
    background:white;
    margin: auto !important;
    top: 140px !important;
    left: 0 !important;
    position: absolute;
    right: 0 !important;
    text-align: center;
    /* padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 30px;
    padding-top: 10px; */
    padding: 10px;
    height: 500px;
    width: 400px !important;
    border-radius: 10px;
}

#newpassword1, #newpassword2 {
   text-align:left;
   padding-left: 30px;
   font-weight: bold;
   margin-top: 20px;
}

#newpassword1 input, #newpassword2 input {
    width:320px;
    height: 30px;
    background-color: #f7f7f7 !important;
    border: 2px solid #eaeaea;
    border-radius: 5px;
    padding: 5px;
    color: #4f4f4f;
    padding-left: 10px;
    margin-top: 5px;
}

.resetpassword .new_password_button {
   background-color: #f58836;
   color: white;
   font-weight: bold;
   border: none;
   border-radius: 3px;
   padding: 6px;
   margin: auto;
   margin-bottom: 20px;
   margin-top: 25px;
   width: 336px;
   height: 44px;
   cursor: pointer; 
}

.resetpassword .new_password_button:hover {
  background-color: #ec904b;
}

#togglePassword span, #togglePassword svg, #togglePassword use {
   pointer-events: none;
}

#togglePassword svg, #togglePassword1 svg, #togglePassword2 svg {
   padding: 4px;
}

/* .password_eye_on{
   background-image: url(/PsodaForms/images/psoda_forms_icon_private.svg);
}

.password_eye_off{
   background-image: url(/PsodaForms/images/psoda_forms_icon_preview_grey.svg);
} */

.password_eye_on, .password_eye_off {
	cursor: pointer;
}

.popup .password_eye_on, .popup .password_eye_off {
	margin-left: -20px;
}

.loginpage .login_button {
   background-color: #f58836;
   color: white;
   font-weight: bold;
   border: none;
   border-radius: 3px;
   padding: 6px;
   margin: auto;
   margin-bottom: 20px;
   margin-top: 25px;
   width: 336px;
   height: 44px;
   cursor: pointer; 
}

.loginpage .login_button:hover {
  background-color: #ec904b;
}

#newpassword1 input::-ms-reveal, #newpassword2 input::-ms-reveal,
#newpassword1 input::-ms-clear ,#newpassword2 input::-ms-clear {
        display: none;
   }




.popup .dialogtable td input:first-of-type, .popup .dialogtable td select, .popup .dialogtable td .wysiwyg {
margin-bottom: 5px;
}

.popup .dialogtable td .members_buttons input {
   margin-bottom: 0px;
}

.popup .dialogtable td {
   position: relative;
}

.popup .dialogtable td label {
   /* font-weight: bold; */
    font-size: .9em;
    /* color: #a3a3a3; */
}

.popup .dialogtable .input_focus label {
   font-weight: bold;
   color: var(--main_colour);
}

.popup .wysiwyg_buttons {
   position: absolute;
   left: 313px;
   top: -6px;
}

.popup .listfield_buttons {
   position: absolute;
   left: 453px;
   top: -6px;
}

/*small visual fix for this wysiwyg that doesn't have an input label to create the usual space for the wysiwyg buttons*/
.popup .benefit_actual_evidence .wysiwyg_buttons {
   top: -32.5px;
}

.popup .wysiwyg, .popup .listfield {
   /* width: 100% !important; */
   width: 500px;
   min-width: 500px;
   /* max-width: 800px; */
   max-height: 200px;
}

.popup .dialogtable .popup_label_parent {
   margin-top: 8px;
}

.popup .dialogmessage, .popup .mandatorymessage, .popup .dialog_additional_content, .popup .displaylist_container {
   /* width: 66%; */
   text-align: left;
   /* margin-left: 15px; */
   /* margin-bottom: 5px; */
}

.popup .dialogmessage {
   margin:0;
   font-style: italic;
   /* padding:0;
   margin-left: 15px; */
}

.popup .dialogmessage .displaylist {
   font-style: normal;
}

.popup .mandatorymessage {
   font-size: .75em;
   display: none;
}

.popup .mandatorystar {
   font-size: 1.25em;
   color: #FF3333;
}

.popup em {
   font-weight: bold;
}

.popup fieldset {
   /* width: 80%; */
    padding-left: 0;
}

/* New div fieldset */
.popup .fieldset {
   margin-top: 10px;
   padding: 10px;
   background: var(--lightest_shade_1);
   border-radius: 5px;
}

.popup .fieldset .fieldset {
   background: var(--light_transparent);
}

.popup .fieldset_label {
   padding-left: 3px;
   font-size: 1.25em;
   color: var(--main_colour);
}

.popup h2 {
   margin-top: 0;
   margin-bottom: 0;
   font-size: 1.75em;
   color: var(--main_colour);
}

.popup_h2_tabbed, .popup_h2_tabbed + .dialogmessage {
   margin-left: 210px;
}

.popup #selected_result_details_div_header h2 {
   margin-top: 13px;
   margin-bottom: 13px;
}

.popup .top-left {
   background-color: #f9f9f9;
   width: calc((100% / 2) - 29px);
   float: left;
   height: 25px;
   position: relative;
}

.popup .top-right {
   background-color: #f9f9f9;
   float: left;
   height: 25px;
   margin-left: 58px;
   width: calc((100% / 2) - 29px - 225px);
   position: relative;
}

.popup .top-left::after, .popup .top-right::before {
   content: "";
   position: absolute;
   height: 29px;
   width: 50px;
   bottom: 0;
}

.popup .top-left::after {
   right: -50px;
   border-radius: 0 0 0 29px;
   box-shadow: -25px 0 0 0 #f9f9f9;
}

.popup .top-right::before {
   left: -50px;
   border-radius: 0 0 29px 0;
   box-shadow: 25px 0 0 0 #f9f9f9;
}

.popup .top-right-buttons {
   background-color: var(--lightest_shade_2);
   width: 225px;
   float: right;
   height: 25px;
   position: relative;
}

.popup .top-right-buttons-inner {
   float: right;
}  

.popup .top-right-buttons-inner div:hover, .popup .top-right-buttons-inner a:hover {
   background-color: var(--lightest_shade_1);
   border-radius: 5px;
}

.popup-minimised .close_button:hover {
   background-color: var(--lightest_shade_2);
   border-radius: 5px;
}

#popup_lightbox {
   display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    /* z-index: 1001; */
    z-index: 50;
    background-color: black;
    opacity: 0.5;
}

.popup .top-icon-center {
   width: 50px;
   height: 50px;
   position: absolute;
   margin-left: auto;
   margin-right: auto;
   left: 0;
   right: 0;
   top: -29px;
   pointer-events: none;
   background-color: #f9f9f9;
   border-radius: 25px;
   background-size: auto 25px;
   background-position: center;
   background-repeat: no-repeat;
   background-image: url(/images/psoda_icon_only.svg);
}

.popup .top-icon-center .psoda_icon {
   margin: 12.5px;
   display: block;
}

.popup.popupaction_edit .top-icon-center {
   /* background-image: url(/images/icons/theme_night/edit.svg); */
   background-image: unset;
}

.popup.popupaction_add .top-icon-center {
   /* background-image: url(/images/icons/theme_night/new.svg); */
   background-image: unset;
}

.popup.popup_delete .top-icon-center, .popup.popupaction_delete .top-icon-center, #popup_bulkdelete .top-icon-center, [id^="popup_deleteobject"] .top-icon-center {
   /* background-image: url(/images/icons/white/delete.svg); */
   background-color: #E02020;
   background-image: unset;
}

.popup.popupaction_copy .top-icon-center {
   /* background-image: url(/images/icons/theme_night/copy.svg); */
   background-image: unset;
}

.popup.popupaction_move .top-icon-center {
   /* background-image: url(/images/icons/theme_night/move.svg); */
   background-image: unset;
}

.popup.popupaction_merge .top-icon-center {
   /* background-image: url(/images/icons/theme_night/merge.svg); */
   background-image: unset;
}

.popup.popup_report .top-icon-center {
   /* background-image: url(/images/icons/theme_night/report.svg); */
   background-image: unset;
}

.popup.popupaction_import .top-icon-center {
   /* background-image: url(/images/icons/theme_night/import.svg); */
   background-image: unset;
}

.popup.popupaction_search .top-icon-center, .popup.popup_search .top-icon-center {
   /* background-image: url(/images/icons/theme_night/search.svg); */
   background-image: unset;
}

.popup.popup_confirmation .top-icon-center, .popup.popupaction_confirm .top-icon-center {
   /* background-image: url(/images/icons/theme_night/tick.svg); */
   background-image: unset;
}

.popup.popupaction_cancel .top-icon-center .psoda_icon {
   /* background-image: url(/images/icons/theme_night/closepopup.svg);
   background-size: auto 30px; */
   background-image: unset;
   margin: 10px;
}

.popup.popupaction_link .top-icon-center {
   /* background-image: url(/images/icons/theme_night/link.svg); */
   background-image: unset;
}

.popup.popupaction_unlink .top-icon-center {
   /* background-image: url(/images/icons/theme_night/unlink.svg); */
   background-image: unset;
}

.popup.popupaction_settings .top-icon-center {
   /* background-image: url(/images/icons/theme_night/settings.svg); */
   background-image: unset;
}

.popup.popup_progress .top-icon-center {
   /* background-image: url(/images/icons/theme_night/history.svg); */
   background-image: unset;
}

.popup.popup_progress .popup_image, .popup.popup_delete .popup_image, .popup.popup_confirmation .popup_image {
   background-image: unset !important;
}

.popup .popup_left_outer {
   width: 225px;
   /* height: 325px; */
   /* position: fixed;
   left: 64%; */
   position: absolute;
   /* right: 30px;
    top: calc(50% - 162.5px); */
    /* top: 60px;
    height: calc(65vh + 119px); */
    height: calc(65vh + 66px + 18px);
    right: 0;
    top: 0;
    border-bottom-right-radius: 10px;
}

.popup .top_image_outer {
   width: 225px;
   height: 25px;
   float: left;
}

.popup .popup_image, 
.popup_left_outer svg {
   height: 265px;
   width: 265px;
   background-repeat: no-repeat;
   background-position: 7.5px 0px;
   margin-left: -40px;
   position: absolute;
   bottom: 0;
   pointer-events: none;
}

/* popup image colour shade 1 */
.popup_left_outer svg .cls-2 {
   fill: var(--popup_image_colour_1);
}

/* popup image colour shade 2 (lighter) */
.popup_left_outer svg .cls-37 {
   fill: var(--popup_image_colour_2);
}

/* popup image colour shade 3 (lightest) */
.popup_left_outer svg .cls-33 {
   fill: var(--popup_image_colour_3);
}


.popup .popup_image_bottom {
   height: 75px;
   width: 75px;
   background-repeat: no-repeat;
   background-position: center;
   bottom: 10px;
   right: 0px;
   position: absolute;
   opacity: .5;
}

.popup .popup_image_text_info {
   width: 30px;
   height: 30px;
   background-color: #ffffff;
   margin: auto;
   margin-top: 25px;
   border-top-left-radius: 15px;
   border-top-right-radius: 15px;
   position: relative;  
   /* background-image: url(/images/i_night.svg);
   background-size: auto 16px;
   background-position: center;
   background-repeat: no-repeat; */
}

.popup .popup_image_text_info svg {
   width: 20px;
   height: 20px;
   margin-left: 5px;
   margin-top: 5px;
   position: static;
}

.popup .popup_image_text_info::before {
   left: -30px;
   border-radius: 0 0 7.5px 0;
   box-shadow: 5px 0 0 0 #fff;
}

.popup .popup_image_text_info::after {
   right: -30px;
   border-radius: 0 0 0 7.5px;
   box-shadow: -5px 0 0 0 #fff;
}

.popup .popup_image_text_info::before, .popup .popup_image_text_info::after {
   content: "";
   position: absolute;
   height: 15px;
   width: 30px;
   bottom: 0;
}

.popup .popup_image_text {
   text-align: left;
   font-size: .8em;
   /* font-weight: bold; */
   /* position: absolute; */
   /* bottom: 0px; */
   width: 155px;
   /* padding-left: 20px;
   padding-right: 20px; */
   word-wrap:break-word;
   max-height:175px;
   overflow:auto;
   background-color: #ffffff;
   padding: 10px;
   margin-left: 25px;
   margin-right: 25px;
   border-radius: 5px;
}

.popup_left_outer h2 {
   width: 185px;
   padding-left: 20px;
   padding-right: 20px;
	overflow:auto;
}

.popup .checkboxcontainer + div {
   display: inline-block;
   margin-bottom: 5px;
   margin-top: 10px;
}

.popup .checkboxcontainer + .popup_label_parent label {
   color: var(--font_grey);
}

.popup .input_checked .checkboxcontainer + .popup_label_parent label {
   font-weight: bold;
   color: var(--main_colour);
}

#popup_lightbox {
   display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    /* z-index: 1001; */
    z-index: 50;
    background-color: black;
    opacity: 0.5;
}

#popup_lightbox.open {
   display: block;
}

.popupdialog_addmore {
   display: inline-block;
   /* float: left; */
   /* left: 50px;
   position: absolute; */
   margin-right: 20px;
   margin-left: 20px;
}

.popupdialog_addmore label {
   font-weight: bold;
   cursor: pointer;
   -moz-user-select: none;
   -webkit-user-select: none;
   -ms-user-select:none;
   user-select:none;
   -o-user-select:none;
}

.popup .formlocation {
   font-weight: bold;
}

#popupcontent_viewhelp {
   height: 65vh;
   overflow: auto;
}

.tr_contextobject > td > div {
   display: none;
} 

.popupbreadcrumbs {
   height: 30px;
   cursor: default;
}

.popupbreadcrumbs span {
   font-weight: bold;
   font-size: .9em;
}

.popupbreadcrumbs span img {
   padding-left: 10px;
   padding-right: 10px;
}

.popup input[type="text"], .popup .wysiwyg, .popup select, .popup .listfield, .popup textarea, .popup input[type="password"] {
   /* background: #f8f9fb;
   border: 1px solid #c2c8d2; */
   background: none;
   border: none;
   border-bottom: 1.5px solid #bababa;
   padding-left: 0;
   height: auto !important;
}

.popup input[type="text"]:focus, .popup .wysiwyg:focus, .popup select:focus, .popup .listfield:focus, .popup textarea:focus, .popup input[type="password"]:focus  {
   border-bottom: 1.5px solid  var(--main_colour);
   outline: none;
}

.popup .wysiwyg_buttons, .popup .listfield_buttons {
   /* background: #f8f9fb;
   border: 1px solid #c2c8d2; */
   border: none;
   border-bottom: 1.5px solid  var(--main_colour);
   transition: .25s ease;
   opacity: 0;
   visibility: hidden;
   background: unset;
}

.popup .input_focus > .wysiwyg_buttons, .popup .input_focus > .listfield_buttons {
   height: 21px;
   padding: 3px;
   opacity: 1;
   visibility: visible;
}

.popup input.color {
   border-radius: 5px;
   text-align: center;
   padding: 5px;
   margin-top: 5px;
   border: none;
}

.popup select.coloured_dropdown {
   border: none;
   border-radius: 5px;
   margin-top: 5px;
}

.popup .reporttemplate_template #template {
   background: #1E1E1E;
   border: none;
   color: #67CDFE;
   border-radius: 5px;
   padding: 5px;
}

.popup .popup_phased_steps_outer {
   margin-top: 5px;
   margin-bottom: 5px;
   margin-left: -5px;
}

.popup .popup_phased_steps_inner {
   display: inline-block;
   vertical-align: middle;
   padding: 5px;
}

.popup .popup_phased_steps_inner_clickable:hover {
   background-color: #eaeaea;
   cursor: pointer;
   border-radius: 5px;
}

.popup .popup_phased_steps_number {
   width: 25px;
   background-color: #aaaaaa;
   color: #ffffff;
   display: inline-block;
   margin-right: 10px;
   border-radius: 15px;
   text-align: center;
   vertical-align: middle;
   font-size: 10px;
   padding-top: 5.7px;
   padding-bottom: 5.7px;
}

.popup .popup_phased_steps_number_current, .popup .popup_phased_steps_number_complete {
   background-color: var(--main_colour);
}

.popup .popup_phased_steps_number_complete {
	height: 13.6px;
   /* background-image: url(/images/icons/white/tick.svg);
   background-size: 13px;
   background-position: center;
   background-repeat: no-repeat;
   padding-top: 12.5px;
   padding-bottom: 12.5px; */
}

.popup .popup_phased_steps_name {
   color: #aaaaaa;
   display: inline-block;
   vertical-align: middle;
}

.popup .popup_phased_steps_number_current + .popup_phased_steps_name {
   color: var(--main_colour);
   font-weight: bold;
}

.popup .popup_phased_steps_number_complete + .popup_phased_steps_name {
   color: var(--font_grey);
}

.popup .popup_phased_steps_spacer {
   width: 75px;
   height: 3px;
   background-color: #d8d8d8;
   display: inline-block;
   margin-left: 15px;
   margin-right: 15px;
   vertical-align: middle;
   border-radius: 3px;
}

.popup .popup_phased_steps_spacer.small_spacer {
   width: 30px;
	margin-left: 10px;
	margin-right: 10px;
}

.popup .popup_phased_step_of {
   color: #aaaaaa;
   font-size: .9em;
   margin-top: 10px;
   margin-left: 5px;
}

#popup_search ~ #popup_edit_columns {
   z-index: 1001 !important;
}

#popup_search .displaylistcontrols_inner {
   width: auto !important;
}

/* template assets styling */
.template_select_option_blank {
   display: inline-block;
   width: 250px;
   vertical-align: top;
   padding-right: 50px;
}

.template_select_options {
   display: inline-block;
   width: 350px;
   vertical-align: top;
}

.template_select_outer {
   margin-bottom: 12px;
}

.template_select_inner {
   position: relative;
   display: inline-block;
   vertical-align: middle;
}

.template_select_inner input {
   height: 50px;
   width: 300px;
   margin: 0;
   opacity: 0;
   cursor: pointer;
}

.template_select_overlay {
   height: 50px;
   width: 300px;
   position: absolute;
   top: 0;
   pointer-events: none;
   background-color: #ffffff;
   box-shadow: 0px 0px 10px #00000040;
   border-radius: 5px;
   border: 2px solid transparent;
   overflow: hidden;
}

.template_select_option_blank input {
   height: 250px;
   width: 250px;
   margin: 0;
}

.template_select_option_blank .template_select_overlay {
   height: 250px;
   width: 250px;
}

.template_selected .template_select_overlay {
   border: 2px solid var(--main_colour);
}

.template_select_inner input:hover + .template_select_overlay {
   background-color: #f7f7f7;
}

.template_select_option_blank .template_select_overlay_icon {
   background-image: url(/images/template_blank_night.svg);
   background-size: 200px auto;
   width: 250px;
   height: 200px;
}

.template_select_overlay_icon {
   width: 50px;
   height: 50px;
   display: inline-block;
   background-size: 30px;
   background-repeat: no-repeat;
   background-position: center;
   opacity: .75;
   vertical-align: middle;
}

.template_select_overlay_icon .psoda_icon {
   padding: 10px;
   display: block;
}

.template_selected .template_select_overlay_icon {
   opacity: 1;
}

.template_select_option_blank .template_select_overlay_text {
   text-align: center;
   display: block;
   margin-left: 0px;
   width: 100%;
}

.template_select_overlay_text {
   display: inline-block;
   font-size: 1.15em;
   color: #8c8c8c;
   vertical-align: middle;
   margin-left: 10px;
   width: 75%;
}

.template_selected .template_select_overlay_text {
   font-weight: bold;
   color: var(--main_colour);
}

.template_select_description {
   display: inline-block;
   vertical-align: middle;
}

.template_select_description .popup_label_parent {
   margin-top: 0px !important;
   margin-left: 5px;
}

.template_select_description .field_tooltip {
   width: 20px;
   height: 20px;
}


legend {
   color: var(--main_colour);
}

.popup .formlocation {
   color: var(--main_colour);
}

fieldset {
   border: 1px solid var(--main_colour);
}

fieldset:hover {
   border: 1px solid var(--main_colour);
}

fieldset:hover>legend {
   border: 1px solid var(--main_colour);
   background: var(--main_colour);
   color: white;
}

.popupbreadcrumbs span {
   color: var(--main_colour);
}

.popup .dialogbuttons input {
   background: var(--main_colour);
   font-family: var(--font_family);
   /* vertical-align: middle; */
}

.popup .dialogbuttons input:hover {
   background: var(--lighter_shade_1);
}

.popup .popup_left_outer, .popup .top_image_outer {
   background: var(--lightest_shade_2);
}

.popup .user_password input, .popup .user_repeatpassword input, .popup .user_oldpassword input {
   width: 400px;
   padding-top: 5px;
   padding-bottom: 5px;
   padding-right: 5px;
}

#popup_viewhelp .top_image_outer {
   display: none;
}

.popup.popup_search {
   width: 1180px !important;
   left: -590px !important;

}

.field_tooltip {
   width: 15px;
   height: 15px;
   /* background-image: url(/images/icon_question_outlined.svg);
   background-size: 15px;
   background-repeat: no-repeat;
   background-position: center; */
   display: inline-block;
   margin-left: 2px;
   margin-bottom: -7.5px;
   position: relative;
   padding: 2.5px;
	opacity: .5;
}

.field_tooltip svg {
	border: 1px solid var(--icon_grey);
	border-radius: 15px;
   padding: 2px;
}

.field_tooltip .psoda_icon {
	pointer-events: none;
}

.field_tooltip.field_tooltip_hovered, .input_focus .field_tooltip {
	opacity: 1;
}

.input_focus .field_tooltip svg {
	border: 1px solid var(--main_colour);
}

.input_focus .field_tooltip svg use {
	fill: var(--main_colour) !important;
}

.field_tooltip.field_tooltip_hovered svg {
	border: 1px solid var(--main_colour);
	background-color: var(--main_colour);
}

.field_tooltip.field_tooltip_hovered svg use {
	fill: #ffffff !important;
}

.field_tooltip_container {
   position: absolute;
   left: 0px;
   padding-left: 25px;
   z-index: 1;
}

.field_tooltip_inner {
   background-color: var(--main_colour);
   color: #ffffff;
   padding: 10px;
   border-radius: 3px;
   width: max-content;
   max-width: 400px;
}

/* popup tabs */

.popup .tabbed_control {
   text-align: left;
   margin-left: 0px;
   margin-bottom: 5px;
   margin-top: 10px;
}

.popup .tabbed_control_menu>ul>li {
   /* padding-right: 8px; */
   text-overflow: ellipsis;
   white-space: nowrap;
   overflow: hidden;
   display: block;
   float: none;
   height: auto;
   margin-bottom: 5px;
   margin-left: 0px;
   /* padding-right: 10px;
   padding-top: 10px;
   padding-bottom: 10px;
   padding-left: 30px; */
   width: auto;
   text-align: left;
}

.popup .tabbed_control_menu {
   float: left;
   padding-right: 0px;
   padding-left: 20px;
   padding-top: 25px;
   /* margin-left: -5px; */
   /* border-right: 1px solid #eaeaea; */
   position: fixed;
   width: 200px; 
   /* box-shadow:none; */
   /* overflow: auto; */
   background-color: #ffffff;
   z-index:1;
   margin-left: -30px;
   margin-top: -25px;
   border-top-left-radius: 10px;
   box-shadow: 4px 0px 3px rgb(50 50 50 / 10%);
}

.popup .tabbed_control_menu .dialog_tabs_offset {
   overflow-y: overlay;
   height: calc(65vh + 5px);
   padding-top: 10px;
   position: relative;
}

.popup .tabbed_control_menu::after {
   content: "";
   position: absolute;
   width: 20px;
   height: 10px;
   right: -20px;
   bottom: 0px;
   border-radius: 0 0 0 5px;
   box-shadow: -5px 0 0 0 #ffffff;
}

.popup .tabbed_control_menu + .dialogmessage {
   margin-left: 200px;
   padding-left: 15px;
}

.popup .tabbed_control_menu ~ .dialogerrormessage {
   margin-left: 200px;
}

.popup .tabbed_control_content {
   float: left;
   padding-top: 0px;
   height: 65vh;
   margin-left: 200px;
}

.popup .dialogtable_tabbed {
   /* padding-left: 10px; */
   padding-bottom: 10px;
   margin-bottom: 10px;
   /* width: 400px; */
}

.popupdialogue > table.dialogtable_tabbed {
   border-bottom: 1px solid #eaeaea;
   margin-left: 200px;
   padding-left: 10px;
   width: 500px;
   }

.popup .unselected_tab {
   background: none;
   margin-top: 0;
    /* padding-top: 5px;
    padding-bottom: 5px; */
}

.popup .unselected_tab .tab-right input:hover {
   background-color: #eaeaea;
   border-radius: 5px;
   font-weight: 100;
   color: var(--font);
}

.popup .tabbed_control_menu .selected_tab {
   background: #f9f9f9;
   /* border: none;
   box-shadow: none;
   border-radius: 0; */
   color: var(--main_colour);
   box-shadow: var(--box_shadow);
   border-top: none;
   border-left: 5px solid var(--main_colour);
   border-top-left-radius: 5px;
   border-bottom-left-radius: 5px;
   position: relative;
   overflow: unset;
   padding-left: 25px;
   padding-right: 10px;
   padding-top: 10px;
   padding-bottom: 10px;
}

/* .popup .tabbed_control_menu .selected_tab::after, .popup .tabbed_control_menu .selected_tab .tab-left::after {
   content: "";
   position: absolute;
   height: 20px;
   width: 10px;
   right: 0;
} */

/* .popup .tabbed_control_menu .selected_tab::before {
   top: -10px;
   border-radius: 0 0 5px 0;
   box-shadow: 2.5px 0 0 0 black;
} */

.popup .tabbed_control_menu .selected_tab:before, .popup .tabbed_control_menu .selected_tab:after {
   display: none;
}

/* .popup .tabbed_control_menu .selected_tab::after {
   content: "";
   position: absolute;
   width: 25px;
   height: 100%;
   background-color: black;
   right: -12.5px;
   top: 0px;
   border-radius: 0px;
   display: none;
} */

/* .popup .tabbed_control_menu .selected_tab::after {
   top: -20px;
   border-radius: 0 0 10px 0;
   box-shadow: 5px 0 0 0 #f9f9f9;
}

.popup .tabbed_control_menu .selected_tab .tab-left::after {
   bottom: -20px;
   border-radius: 0 0 10px 0;
   box-shadow: 5px 0 0 0 black;
} */

.popup .dialog_tab_image {
   /* margin-left: 25px; */
}

.popup .dialog_tab_selected_image {
   padding-left: 0px;
   background: none;
}

.popup .tab-overlay {
   display: none;
}

/*popup tabs end */

/* PSONAR POPUPS */
.popup_risk.psonar_animation, .popup_risk.psonar_animation .popupdialogue, .popup_risk.psonar_animation .popup_left_outer, .popup_risk.psonar_animation .top_image_outer,
.popup_issue.psonar_animation, .popup_issue.psonar_animation .popupdialogue, .popup_issue.psonar_animation .popup_left_outer, .popup_issue.psonar_animation .top_image_outer,
.popup_lesson.psonar_animation, .popup_lesson.psonar_animation .popupdialogue, .popup_lesson.psonar_animation .popup_left_outer, .popup_lesson.psonar_animation .top_image_outer {
   transition: .1s ease;
}

.popup_psonar {
   width: 570px !important;
}

.popup_psonar .popupdialogue {
   /*height: auto;*/

   padding-right:5px;
   margin-left: 0px;
   width: calc(100% - 35px);
}

.popup_psonar .popup_left_outer, .popup_psonar .top_image_outer {
   opacity: 0;
   display: none;
}

.popup_psonar .dialogbuttons .cancel_button {
   margin-right: 10px;
}

.popup_psonar .top-right-buttons {
   background-color: #f9f9f9 !important;
}

/* confirmation popups */

.popup_delete,
.popup_restore,
.popup_removefilters,
.popup_deescalate,
.popup_dependant,
.popup_confirmation {
   width: 650px !important;
   left: -325px !important;
   top: 150px !important;
   margin-left: 50% !important;
}

.popup_delete .popupdialogue,
.popup_restore .popupdialogue,
.popup_removefilters .popupdialogue,
.popup_deescalate .popupdialogue,
.popup_dependant .popupdialogue,
.popup_confirmation .popupdialogue {
   height: auto;
   margin-left: 0px;
   margin-right: 0px;
   max-height: 50vh;
   padding-right: 30px;
   padding-top: 5px;
}

.popup_delete .dialogmessage, .popup_delete .dialog_additional_content,
.popup_restore .dialogmessage, .popup_restore .dialog_additional_content,
.popup_removefilters .dialogmessage, .popup_removefilters .dialog_additional_content,
.popup_deescalate .dialogmessage, .popup_deescalate .dialog_additional_content,
.popup_dependant .dialogmessage, .popup_dependant .dialog_additional_content,
.popup_confirmation .dialogmessage, .popup_confirmation .dialog_additional_content {
   text-align: center;
} 

.popup_delete .dialogtable,
.popup_restore .dialogtable,
.popup_removefilters .dialogtable,
.popup_deescalate .dialogtable, 
.popup_dependant .dialogtable,
.popup_confirmation .dialogtable {
   margin: auto;
}

.popup_delete .dialogtable tr,
.popup_restore .dialogtable tr,
.popup_removefilters .dialogtable tr,
.popup_deescalate .dialogtable tr, 
.popup_dependant .dialogtable tr,
.popup_confirmation .dialogtable tr {
   text-align: center;
}

.popup_delete .popup_left_outer, .popup_delete .top_image_outer,
.popup_restore .popup_left_outer, .popup_restore .top_image_outer,
.popup_removefilters .popup_left_outer, .popup_removefilters .top_image_outer,
.popup_deescalate .popup_left_outer, .popup_deescalate .top_image_outer,
.popup_dependant .popup_left_outer, .popup_dependant .top_image_outer,
.popup_confirmation .popup_left_outer, .popup_confirmation .top_image_outer {
   display: none;
}

.popup_delete .top,
.popup_restore .top,
.popup_removefilters .top,
.popup_deescalate .top,
.popup_dependant .top,
.popup_confirmation .top {
   cursor: default;
}

.popup_delete h2,
.popup_restore h2,
.popup_removefilters h2,
.popup_deescalate h2,
.popup_dependant h2,
.popup_confirmation h2 {
   text-align: center;
}

.popup_delete .top-right-buttons,
.popup_restore .top-right-buttons,
.popup_removefilters .top-right-buttons,
.popup_deescalate .top-right-buttons,
.popup_dependant .top-right-buttons,
.popup_confirmation .top-right-buttons {
   background-color: #f9f9f9 !important;
}

.popup_delete .dialogbuttons,
.popup_restore .dialogbuttons,
.popup_removefilters .dialogbuttons,
.popup_deescalate .dialogbuttons,
.popup_dependant .dialogbuttons,
.popup_confirmation .dialogbuttons {
   text-align: center;
}

.popup_delete .dialogbuttons input,
.popup_restore .dialogbuttons input,
.popup_removefilters .dialogbuttons input,
.popup_deescalate .dialogbuttons input,
.popup_dependant .dialogbuttons input,
.popup_confirmation .dialogbuttons input {
   margin-left: 0px;
}

.popup_delete .dialogbuttons .cancel_button,
.popup_restore .dialogbuttons .cancel_button,
.popup_removefilters .dialogbuttons .cancel_button,
.popup_deescalate .dialogbuttons .cancel_button,
.popup_dependant .dialogbuttons .cancel_button,
.popup_confirmation .dialogbuttons .cancel_button {
   float: unset;
   margin-right: 0px;
}

/* delete button red and icon css */
.popup.popup_removefilters .dialogbuttons input:first-of-type,
.popup.popup_delete .dialogbuttons input:first-of-type {
   background-color:#e02020;
   background-image: url(/images/icons/white/exception.svg);
    padding-left: 45px;
    background-position: 20px center;
    background-repeat: no-repeat;
    background-size: 18px;
}

.popup.popup_removefilters .dialogbuttons input:first-of-type:hover,
.popup.popup_delete .dialogbuttons input:first-of-type:hover {
   background-color:#ee3838; 
   /* background-image: url(/images/icon_exception_light.svg);
   padding-left: 45px;
   background-position: 25px center;
   background-repeat: no-repeat;
   background-size: 15px; */
}

/* confirmation popups end */

/* progress popups */

.popup_progress {
   width: 650px !important;
   left: -325px !important;
   top: 150px !important;
   margin-left: 50% !important;
}

#popup_runreport.popup_progress {
   top: 60px !important;
}

#popup_runreport.popup_progress h2 {
   display: none;
}

.popup_progress .popupdialogue {
   height: auto;
   margin-left: 0px;
   margin-right: 0px;
   padding-bottom: 10px;
   padding-right: 30px;
}

.popup_progress .dialogmessage {
   text-align: center;
   margin-left: 0px;
} 

#popup_runreport.popup_progress .dialogmessage {
   margin-top: 60px;
}

.popup_progress .dialogtable {
   margin: auto;
}

.popup_progress .popup_left_outer, .popup_progress .top_image_outer {
   display: none;
}

.popup_progress .top {
   cursor: default;
}

.popup_progress tr.popupbreadcrumbs {
   display: none;
}

#popup_runreport.popup_progress tr.popupbreadcrumbs {
   display: block;
   position: absolute;
    top: 0px;
    left: 0;
    right: 0;
}

#popup_runreport.popup_progress tr.popupbreadcrumbs #runreport_breadcrumbs {
   left: 0;
   right: 0;
   margin-left: auto;
   margin-right: auto;
   text-align: center;
   position: absolute;
}

.progress_mainmessage {
   text-align: center;
   font-style: normal;
}

.progress_asset {
   text-align: center;
   font-size: 1.5em;
   font-weight: bold;
   font-style: normal;
}

.popup_report .progress_mainmessage, .popup_report .progress_asset, .popup_report .dialogmessage #runreport_queue {
   display: none;
}

.popup_progress .progress_mainmessage, .popup_progress .progress_asset {
   display: block;
}

.popup_progress .progress_indicator {
   margin-top: -30px;
   margin-bottom: -30px;
}

.popup_progress .dialogtable .popup_label_parent {
   margin-top: 20px;
}

.popup_progress h2 {
   text-align: center;
}

.popup_progress .top-right-buttons {
   background-color: #f9f9f9 !important;
}

.popup_progress .dialogbuttons {
   text-align: center;
}

.popup_progress .dialogbuttons .cancel_button {
   float: unset;
   margin-right: 0px;
}

.popup_progress .dialogbuttons input {
   margin-left: 0px;
   margin-right: 0px;
}


/* report queue */
.report_queue_icon {
   width: 30px;
   height: auto;
   vertical-align: middle;
   margin-right: 5px;
}

.report_queue_icon + p {
   display: inline-block;
   margin: 0;
   padding: 0;
   vertical-align: middle;
   font-style: normal;
}

#runreport_queue {
   text-align: left;
   margin-top: 10px;
}

.popup_progress #runreport_queue {
   text-align: center;
   margin-top: 0px;
   display: block !important;
}

.popup .tabbed_control_menu .selected_tab .tab-left {
    padding: 0;
}

#popup_runreport #runreport_parameters {
   font-style: italic;
}

.dialogbuttons #runreport_queue {
   display: inline-block;
   margin-top: 0px;
   vertical-align: middle;
   margin-left: 20px;
}

.dialogbuttons .report_queue_icon {
   width: 25px;
}

.popupaction_save #runreport_queue {
   display: none;
}

/* scenario planner save popup */
#popup_saveprojectstartdates .top, #popup_saveprojectstartdates .top h2 {
   background: #f9f9f9;
}

#popup_saveprojectstartdates .popupdialogue {
   padding-left: 0px;
   padding-right: 0px;
}

/* update permissions popup - apply to any progress popups that need a height due to long content */
#popupcontent_updatepermissions .popupdialogue {
   max-height: 50vh;
}

/* new popup CSS WILL END

/**** widedialog ****/

.widedialog {
   margin-left:auto;
   margin-right:auto;
   position:relative;
   height:300px;
   width:750px;
   background:white;
   border-top:1px solid #BBBBBB;
   border-left:1px solid #BBBBBB;
   border-bottom:1px solid #888888;
   border-right:1px solid #888888;
}

html>body .widedialog {
   height:auto;
   min-height:300px;
}

.widedialog h1 {
   margin-top:0px;
   padding-left:5px;
   padding-bottom:2px;
   display:block;
   font-size:0.9em;
   background:#BBBBBB;
}

.widedialogcontent {
   padding-left:5px;
   padding-right:5px;
}

/**** normalview ****/

.normalview {
   position:relative;
   padding-bottom:20px;
   height:450px;
   background:white;
}

html>body .normalview {
   height:auto;
   min-height:450px;
}

.normalview .blue_corner_top_left {
   top:20px;
}

.normalview .blue_corner_top_right {
   top:20px;
}

.normalview .blue_corner_bottom_left {
   bottom:0px;
}

.normalview .blue_corner_bottom_right {
   bottom:0px;
}

.blue_corner_top_left, .blue_corner_top_right, .blue_corner_bottom_left, .blue_corner_bottom_right {
    display: none;
 }

.normalview h1 {
   margin-top:0px;
   margin-bottom:0px;
   padding-left:15px;
   padding-top:2px;
   padding-bottom:2px;
   display:block;
   font-size:1.0em;
   background: white;
   color:white;
}

.normalviewcontent {
   padding:10px;
}

/**** register ****/

.register {
   height:300px;
   border-top:1px solid #BBBBBB;
   border-left:1px solid #BBBBBB;
   border-bottom:1px solid #888888;
   border-right:1px solid #888888;
   background:white;
}

html>body .register {
   height:auto;
   min-height:300px;
}

.register h1 {
   margin-top:0px;
   padding-left:5px;
   padding-bottom:2px;
   display:block;
   font-size:0.9em;
   background:#BBBBBB;
}

.registercontent {
   width:800px;
   margin-top:20px;
   margin-bottom:20px;
   margin-left:auto;
   margin-right:auto;
}

.registercontent th {
   text-align:left;
}

.registercontent a {
   text-decoration:none;
}

/**** Import ****/
.user_import_col select {
   width:150px;
}

.program_import_col select {
   width:150px;
}

.project_import_col  select{
   width:150px;
}

.taskgroup_import_col  select{
   width:150px;
}

.risk_import_col select {
   width:150px;
}

/**** Organisation ****/

.organisation_address textarea {
   width:426px;
}

html>body .organisation_address textarea {
   width:422px;
}

.organisation_country select {
   width:426px;
}

.organisation_contact select {
   width:326px;
}

/**** Program ****/

.program_owner select {
   width:200px;
}

/**** Product ****/

.product_owner select {
   width:200px;
}

.product_lifecycle select {
   width:200px;
}

/**** Project ****/

.project_manager select {
   width:200px;
}

.project_owner select {
   width:200px;
}

.project_sponsor select {
   width:200px;
}

.project_lifecycle select {
   width:200px;
}

/**** Benefit ****/
.benefit_original_baseline input {
   text-align:right;
}

.benefit_adjusted_baseline input {
   text-align:right;
}

.benefit_original_target input {
   text-align:right;
}

.benefit_adjusted_target input {
   text-align:right;
}

/**** RAG box ****/
.rag_box {
   text-align:center;
   border:none;
   -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px;
   padding:10px;
}

/**** sub-project ****/

.subproject_owner select {
   width:200px;
}

.subproject_lifecycle select {
   width:200px;
}

/**** Start/End selectors ****

#startdate {
   float:left;
   width:250px;
}

#startdate td {
   text-align:center;
}

#enddate {
   float:left;
   width:250px;
}

#enddate td {
   text-align:center;
}

/**** Statistics ****/
.statistics {
   text-align:center;
}

.statistic_item {
   margin-right:10px;
   margin-bottom:10px;
   float:left;
}

/***** New dropzone for tables *****/

.displaylist_dropzone_hover {
	display: block !important;
	border: var(--main_colour) dashed 2px;
	border-radius: 10px;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/* background: var(--lightest_shade_1); */
	z-index: 1000;
	/* pointer-events: none !important; */

}
.dropzone {
	display: none !important;
	/* pointer-events: none !important; */

}
.displaylist_dropzone_background_hover {
	pointer-events: none !important;
	width: 100%;
	height: 100%;	
	background: var(--lightest_shade_1);
	border-radius: 10px;
	opacity: .75;

}

.displaylist_dropzone_message_hover {
	position: absolute;
	width: 100px;
	height: 21px;
	background-color: var(--main_colour);
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	z-index: 100;
	color: white;
	width: fit-content;
	padding: 7.5px 10px;
	border-radius: 4px;
	pointer-events: none !important;
}

.displaylist_dropzone_message_icon {
	margin-right: 5px;
	display: inline-block !important;
}

.displaylist_dropzone {
	position: relative;
}

.uploader_popup_container {
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: 1000;
}

.uploader_progress_popup {
	background-color: white;
	width: 300px;
	height: fit-content;
	-webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
	border-radius: 5px 5px 0px 0px;
	padding: 5px 10px;
	display: inline-block;
	margin-right: 10px;
	margin-bottom: -5px;
}

.uploader_progress_popup.popup_minimised {
	cursor: pointer;
	width: 200px !important;
}

.uploader_progress_popup.popup_minimised:hover {
	background: #f7f7f7;
}

.uploader_progress_popup_title_text {
	font-weight: bold;
}

.uploader_progress_popup_topbar_inner_right {
	float: right;
}

.uploader_progress_popup_topbar_inner_left {
	float: left;
}

.uploader_progress_popup_minimise {
	display: inline-block;
	margin: 0px;
	margin-right: 5px;
	margin-top: -2.5px;
	cursor: pointer;
	padding: 2px 5px;
}

.popup_minimised .uploader_progress_popup_minimise {
	display: none;
}

.uploader_progress_popup_close {
	display: inline-block;
	margin: 0px;
	margin-top: -2.5px;
	cursor: pointer;
	padding: 2px 5px;
}

.uploader_progress_popup_minimise:hover, .uploader_progress_popup_close:hover {
	background-color: var(--lightest_shade_2);
	border-radius: 5px;
}

.popup_minimised .uploader_progress_popup_content {
	display: none;
}

.uploader_progress_popup_content {
	display: inline-block;
   font-size: .9em;
	width: 100%;
	padding-top: 5px;
	max-height: 400px;
	overflow: auto;
}

.uploader_progress_popup_content::-webkit-scrollbar {
   width: 7px;
   height: 7px;
}

.new_folder_div {
	display: block;
	width: auto;
	padding-bottom: 5px;
	padding-top: 5px;
}

.new_file_div {
	display: block;
	width: auto;
	padding-bottom: 5px;
	padding-top: 10px;
}

.new_file_info_div {
	display: inline-block;
	vertical-align: top;
	margin-left: 7.5px;
	margin-top: -5px;
	max-width: calc(100% - 25px - 30px - 10px);
}

.new_folder_info_div {
	display: inline-block;
	vertical-align: top;
	margin-left: 7.5px;
	margin-top: 4px;
	max-width: calc(100% - 25px - 81px - 10px);
}

.new_file_icon_div {
	display: inline-block;
	vertical-align: top;
	/* margin-left: 10px; */
}

.new_folder_icon_div {
	display: inline-block;
	vertical-align: top;
	/* margin-left: 10px; */
}

.new_file_error .new_file_icon_div, .new_file_error .new_folder_icon_div, .new_file_error .new_file_title_div, .new_file_error .new_folder_title_div {
	opacity: .5;
}

.new_file_error .new_file_size_div {
	color: var(--icon_red);
}

.new_file_progress_div, .new_folder_progress_div {
	float: right;
	vertical-align: top;
}

.new_folder_progress_success {
	color: var(--icon_green);
	font-size: .8em;
	margin-top: 6px;
}

.new_folder_progress_existing {
	color: var(--icon_grey);
	font-size: .8em;
	margin-top: 6px;
}

.new_folder_progress_success .psoda_icon {
	margin-right: 2.5px;
}

.new_file_size_div {
	color: #8d8d8d;
}

.uploader_progress_indicator svg {
	/* margin-right: -5px; */
	height: 30px;
	width: 30px;
	transform: rotate(-90deg);
}

.uploader_progress_indicator .SVG_text {
	font-size: 30px;
	fill: var(--font);
}

.uploader_progress_indicator .grey_circle {
	stroke-width: 5px;
}

.uploader_progress_indicator .green_animate {
	/* equal to circumference of circle 2 * 3.14 * 38(radius) */
	stroke-dasharray:238.64; 
	stroke-dashoffset: 238.64;
	stroke: var(--icon_green);
	stroke-width: 10px;
}

.new_file_structure_line {
	float: left;
	width: 2px;
	background: lightgray;
	height: 24px;
	margin: 0 4px;
	/* border-right: 1px solid rgba(255, 255, 255, 0);
    margin-left: 20px;
    margin-right: 0px; */
}

.folder_child {
	padding-left: 10px;
	margin-left: 10px;
	border-left: 2px solid #eaeaea;
}

/**** Attachments ****/
.attachment_url input {
   width:322px;
}



#dropzone {
   margin-top:20px;
    /* width:300px; */
    margin-right: 100px;
    margin-left: 100px;
   height:150px;
   position:relative;
}

#dropzone_progress {
   background:#00a470;
 /*   background-image:url(/images/normal/table_header_sorted.png);
   background-repeat:repeat-x;
   background-position:center;
   background-size:100% 100%; 
   position:absolute;
   top:10px;
   left:10px; */
   width:0%;
   height:129px;
    z-index:10;
    transition: all 1s ease;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
}


.filedrop {
   position:absolute;
   top:0px;
   left:0px;
   background:transparent;
   border:2px dashed #eaeaea;
   /* -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px; */
   text-align:center;
   font-size:1.5em;
   width:100%;
   height:75px;
   padding-top:50px;
/* line-height:100px;
   position:relative;
   z-index:0; */
}

.asset_header > .filedrop {
   border:none;
   height:100%;
   padding-top:15px;
}

.filedrop span {
   font-size:0.7em;
}

.filedrop_hover {
   position:absolute;
   top:0px;
   left:0px;
    background:#00a470;
    color: white;
    border:2px dashed white;
   /* -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px; */
   text-align:center;
   font-size:1.5em;
/* line-height:100px;
   position:relative;
   z-index:0;*/
   width:100%;
   height:75px;
   padding-top:50px;
}

.filedrop img {
    height: 85%;
    width: auto !important;
    border: 1px solid #eaeaea !important;
}

.filedrop_hover span {
   font-size:0.7em;
}

.asset_header > .filedrop_hover {
   border:none;
   height:100%;
   padding-top:15px;
   background:none;
}

.asset_header > #dropzone_progress {
   height:145px;
}

.attachment_download_button {
   border: 1px solid var(--main_colour);
   padding-left: 20px;
   padding-right: 20px;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   border-radius: 5px;
   margin-top: 5px;
   display: block;
}

.attachment_download_button img {
   transform: rotate(180deg);
   width: auto;
   height: 16px;
   vertical-align: middle;
}

.attachment_download_button span {
   color: var(--main_colour);
   margin-left: 10px;
   vertical-align: middle;
}

/**** Test Coverage ****/

.testcoverage {
   border:1px solid black;
   background:#777777;
   width:100px;
}

/**** Risks ****/

#importrisks {
   height:300px;
   width:600px;
   margin-left:auto;
   margin-right:auto;
   background:white;
   border-top:1px solid #BBBBBB;
   border-left:1px solid #BBBBBB;
   border-bottom:1px solid #888888;
   border-right:1px solid #888888;
}

html>body #importrisks {
   height:auto;
   min-height:300px;
}

#importrisks h1 {
   margin-top:0px;
   padding-left:5px;
   padding-bottom:2px;
   display:block;
   font-size:0.9em;
   background:#BBBBBB;
}

#importriskscontent {
   padding-left:5px;
   padding-right:5px;
}

.risk_owner select {
   width:250px;
}

/* .risk_treatment {
   border:1px solid #888888;
   -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px;
} */

/**** Requirements ****/

#importrequirements {
   height:300px;
   width:600px;
   margin-left:auto;
   margin-right:auto;
   background:white;
   border-top:1px solid #BBBBBB;
   border-left:1px solid #BBBBBB;
   border-bottom:1px solid #888888;
   border-right:1px solid #888888;
}

html>body #importrequirements {
   height:auto;
   min-height:300px;
}

#importrequirements h1 {
   margin-top:0px;
   padding-left:5px;
   padding-bottom:2px;
   display:block;
   font-size:0.9em;
   background:#BBBBBB;
}

#importrequirementscontent {
   padding-left:5px;
   padding-right:5px;
}

.requirement_category_dd select {
   width:250px;
}

.requirement_reference_sel select {
   width:150px;
}

.requirement_category_sel select {
   width:150px;
}

.requirement_description_sel select {
   width:150px;
}

.requirement_priority_sel select {
   width:150px;
}

.requirement_lifecycle select {
   width:200px;
}

/**** TestCases ****/

#importtestcases {
   height:300px;
   width:700px;
   margin-left:auto;
   margin-right:auto;
   background:white;
   border-top:1px solid #BBBBBB;
   border-left:1px solid #BBBBBB;
   border-bottom:1px solid #888888;
   border-right:1px solid #888888;
}

html>body #importtestcases {
   height:auto;
   min-height:300px;
}

#importtestcases h1 {
   margin-top:0px;
   padding-left:5px;
   padding-bottom:2px;
   display:block;
   font-size:0.9em;
   background:#BBBBBB;
}

#importtestcasescontent {
   padding-left:5px;
   padding-right:5px;
}

#edittestcase {
   margin-left:50%;
   position:relative;
   left:-300px;
   margin-top:5px;
   margin-bottom:5px;
   height:300px;
   width:600px;
   border:1px solid #BBBBBB;
}

html>body #edittestcase {
   height:auto;
   min-height:300px;
}

#edittestcase h1 {
   margin-top:0px;
   padding-left:5px;
   padding-bottom:2px;
   display:block;
   font-size:0.9em;
   background:#BBBBBB;
}

#edittestcasecontent {
   padding-left:5px;
   padding-right:5px;
}

.testcase_title input {
   width:300px;
}

.testcase_lifecycle select {
   width:200px;
}

/**** Test-runs ****/

.testrun_status input {
   width:100px;
}

/**** Test-case results ****/

.testcaseresult_title input {
   width:300px;
}

.testcaseresult_status select {
   width:100px;
}

/**** Test Step Result ****/

.teststepresult_status select {
   width:100px;
}

/**** Traceability matrix ****/

.traceability_matrix {
   padding:10px;
   padding-top: 0;
    margin-top: -10px;
}

.traceability_matrix table td {
   background:#eaeaea;
   text-align:center;
}

.traceability_matrix th {
   background:#eaeaea;
   text-align:left;
   padding-left:5px;
   padding-right:5px;
}

.traceability_matrix .noborder {
   background:none;
   border:none;
}

.traceability_matrix .sameobj {
   background:transparent;
}

.traceability_matrix .highlight {
   background:var(--lightest_shade_1);
}

.traceability_matrix .thhighlight {
   background:var(--lightest_shade_2);
}

.vertical_heading {
   vertical-align:top;
   text-align:center;
   height:15em;
   min-width:12px;
   position:relative;
   overflow:hidden;
}

.vertical_heading a {
   text-decoration:none;
}

.traceability_matrix_hbuttons {
   padding-left:1.5em;
}

.traceability_matrix_hbuttons img {
   vertical-align:text-bottom;
   margin-left:5px;
   margin-right:5px;
}

.traceability_matrix_vbuttons {
   text-align:center;
   float:left;
}

.traceability_matrix_vbuttons img {
   margin-top:5px;
   margin-bottom:5px;
}

.traceability_matrix_actions {
   /* background:white; */
   margin-top: 20px;
}

.traceability_matrix_actions a {
   background: #eaeaea;
   color: var(--font_grey);
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 10px;
   padding-right: 10px;
   margin-right: 5px;
   border-radius: 3px;
}

.traceability_matrix_actions a .psoda_icon {
   padding-right: 5px;
}

.traceability_matrix_actions a:hover {
   background: #dddddd;
}

.traceability_matrix_action_toggle_on, .traceability_matrix_action_toggle_off {
   display: inline-block;
   vertical-align: middle;
   background-color: var(--lightest_shade_2);
	color: var(--main_colour);
	padding: 3px;
	padding-left: 10px;
	padding-right: 10px;
   /* min-width: 125px; */
   border-radius: 3px;
   /* font-weight: bold; */
   font-size: 0.9em;
   /* text-transform: uppercase; */
   /* margin-left: -20px; */
   margin-bottom: 5px;
   margin-left: 5px;
   margin-right: 5px;
   cursor: pointer;
	border: none;

}

.traceability_matrix_action_toggle_off {
	background-color: #eaeaea;
	color: #A3A3A3;
}

.traceability_matrix_action_toggle_off:hover {
	color: var(--main_colour);
}

.traceability_matrix_action_toggle_on img, .traceability_matrix_action_toggle_on label, .traceability_matrix_action_toggle_off img, .traceability_matrix_action_toggle_off label {
   vertical-align: middle;
   pointer-events: none;
}

.traceability_matrix_action_toggle_on img:nth-child(1) {
   padding-left: 5px;
   padding-right: 2.5px;
}

.traceability_matrix_action_toggle_on img:nth-child(4) {
   padding-right: 5px;
   padding-left:5px;
   float: right;
}

/* .traceability_matrix_action_toggle_off label {
   padding-left: 20px;
} */

.traceability_matrix_action_toggle_off img {
   opacity: .5;
   padding-right: 5px;
   padding-left:5px;
   float: right;
}

.traceability_matrix_action_toggle_on .psoda_icon {
	margin-right: 5px;
	vertical-align: sub;
	pointer-events: none;
}

#tracebility_actions_form .traceability_matrix_checkbox {
   width: 125px;
   height: 21px;
   cursor: pointer;
   margin-top: -2px;
}

.traceability_matrix_action_toggle_on .traceability_matrix_checkbox {
   margin-left: -20px;
}

#tracebility_actions_form .checkboxcontainer {
   opacity: 0;
   position: absolute;
}

.traceability_matrix_showrows {
   float: right;
   margin-top: 10px;
   font-weight: bold;
   padding-right: 10px;
}

.traceability_matrix_action_container {
   display: inline-block;
   width: calc(100% - 300px);
   vertical-align: text-top;
}

/**** Dependency matrix ****/

.dependency_matrix {
   padding:10px;
   padding-top: 0;
    margin-top: -10px;
}

.dependency_matrix table td {
   background:#dddddd;
   text-align:center;
}

.dependency_matrix table td a {
   text-decoration:none;
}

.dependency_matrix th {
   background:var(--lightest_shade_2);
   text-align:left;
   padding-left:5px;
   padding-right:5px;
}

.dependency_matrix .noborder {
   background:none;
   border:none;
}

.dependency_matrix .sameobj {
   background:transparent;
}

.dependency_matrix .highlight {
   background:#FFBBBB;
}

.dependency_matrix .thhighlight {
   background:#FF9999;
}

.dependency_matrix_hbuttons {
   padding-left:1.5em;
}

.dependency_matrix_hbuttons img {
   vertical-align:text-bottom;
   margin-left:5px;
   margin-right:5px;
}

.dependency_matrix_vbuttons {
   text-align:center;
   float:left;
}

.dependency_matrix_vbuttons img {
   margin-top:5px;
   margin-bottom:5px;
}

.dependency_matrix_actions {
   /* background:white; */
   margin-top: 20px;
}

.dependency_matrix_actions a {
   background: #eaeaea;
   color: var(--font_grey);
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 10px;
   padding-right: 10px;
   margin-right: 5px;
   border-radius: 3px;
}

.dependency_matrix_showrows {
   margin-top: 20px;
   font-weight: bold;
}

.dependency_matrix_showrows form {
   display: inline-block;
   margin-right: 10px;
}

.dependency_matrix .open_node, .dependency_matrix .closed_node {
   margin-right: 5px;
}

.dependency_matrix_edit_icon {
   float: right;
   margin-left: 5px;
}

.dependency_matrix_percent {
   background: #F46464;
   padding-left: 3px;
   padding-right: 3px;
   border-radius: 100px;
   color: white;
   font-size: .8em;
   font-weight: bold;
}

.dependency_matrix .displaylist_tree_div {
   margin-top: -5px;
}

.dependency_matrix_actions .psoda_icon {
   margin-right: 5px;
   vertical-align: middle;
}

.dependency_matrix_actions a:hover {
    background: #dddddd;
}


/**** ACL ****/

.acl_fieldset {
   position: relative;
    border: none;
    border-top: solid 1px #bdbdbd;
}

.acl_fieldset label {
   text-align: left;
   display: inline-block;
   color: #f46464;
}

.acl_fieldset_outer {
   column-count: 3;
}

.acl_fieldset_inner .checkboxcontainer input[type="checkbox"]:checked + .fancyCheckbox{
   background-color: transparent !important;
   border: 1px solid transparent !important;
   color: #00a470 !important;
   font-size: 15px;
   margin-top: -5px;
}

.acl_fieldset_inner .checkboxcontainer input[type="checkbox"] + .fancyCheckbox{
   background-color: transparent !important;
   border: 1px solid transparent !important;
   color: #f7f7f7 !important;
   margin-top: -5px;
}

.acl_fieldset_inner .checkboxcontainer input[type="checkbox"] + .fancyCheckbox::after {
   content: "✖";
   color: #f46464;
   margin-left: -5px;
   font-size: 14px;
}

.acl_fieldset_inner .checkboxcontainer input[type="checkbox"]:checked + .fancyCheckbox::after {
   content: "";
}

.acl_fieldset_inner .checkboxcontainer input[type="checkbox"]:checked:focus + .fancyCheckbox, .acl_fieldset_inner .checkboxcontainer input[type="checkbox"]:checked:hover + .fancyCheckbox {
   background: none;
}

.acl_fieldset_inner .checkboxcontainer input[type="checkbox"]:focus + .fancyCheckbox, .acl_fieldset_inner .checkboxcontainer input[type="checkbox"]:hover + .fancyCheckbox {
   background: none;
}

.acl_fieldset_inner .label_checked {
   color: #00a470;
}

.acl_fieldset .psoda_icon {
    vertical-align: middle;
    width: 50px;
    margin-right: 5px;
    margin-bottom: 5px;
}

.acl_fieldset legend {
   font-weight: bold;
   color: var(--font_grey);
   text-align: center;
	/* margin-left: 45%; */
}

.acl_fieldset input[type=checkbox]:checked + .fancyCheckbox{
   opacity: 1;
}

.acl_fieldset:hover>legend {
    border: 1px solid transparent;
    background: transparent;
    color: var(--font_grey);
}

.acl_fieldset:hover {
   border: none;
   border-top: solid 1px #bdbdbd;
}

/* .no_fieldset_top-right {
   position:absolute;
   width:15px;
   height:15px;
   background-image:url(/images/top-right-corner.gif);
   background-repeat:no-repeat;
}

.no_fieldset_bottom-left {
   position:absolute;
   width:14px;
   height:15px;
   background-image:url(/images/bottom-left-corner.gif);
   background-repeat:no-repeat;
}

.no_fieldset_bottom-right {
   position:absolute;
   width:13px;
   height:14px;
   background-image:url(/images/bottom-right-corner.gif);
   background-repeat:no-repeat;
} */

/**** Notifications ****/

.notification_fieldset label {
   width:400px;
}

/**** Action ****/

.action_owner select {
   width:250px;
}

.action_status select {
   width:150px;
}

/**** Change request ****/

.changerequest_origin input {
   width:300px;
}

.changerequest_owner select {
   width:200px;
}

.changerequest_status select {
   width:100px;
}

/**** Issues ****/

.issue_impact select {
   width:100px;
}

.issue_origin input {
   width:300px;
}

.issue_owner select {
   width:200px;
}

.issue_status select {
   width:100px;
}

/**** Defects ****/

.defect_defect_type_dd select {
   width:473px;
}

.defect_type input {
   width:473px;
}

.defect_title input {
   width:473px;
}

.defect_module_dd select {
   max-width:473px;
   min-width:200px;
}

.defect_module input {
   width:200px;
}

.defect_version_dd select {
   max-width:473px;
   min-width:200px;
}

.defect_version input {
   width:200px;
}

.defect_build_dd select {
   max-width:473px;
   min-width:200px;
}

.defect_build input {
   width:200px;
}

.defect_priority input {
   max-width:473px;
   min-width:200px;
}

.defect_impact select {
   max-width:473px;
   min-width:200px;
}

.defect_resolution_dd select {
   max-width:473px;
   min-width:200px;
}

.defect_resolution input {
   width:200px;
}

.defect_origin input {
   max-width:473px;
   min-width:300px;
}

.defect_owner select {
   max-width:473px;
   min-width:200px;
}

.defect_status select {
   max-width:473px;
   min-width:200px;
}

.defect_lifecycle select {
   max-width:473px;
   min-width:200px;
}


/**** Task ****/
#allocated_users {
   width:400px;
   height:7em;
}

#allocated_groups {
   width:400px;
   height:7em;
}

/**** Timesheet Task ****/
.timesheettask_reference input {
   width:300px;
}

#addtimesheettasks_tasks select {
   max-width:500px;
   width:500px;
}

/**** Report template ****/

.reporttemplate_status select {
   width:100px;
}

/**** Report parameter ****/

.reportparameter_type select {
   width:100px;
}

/**** Lifecycle ****/

.lifecycle_status select {
   width:100px;
}

.lifecycle_default_state select {
   width:100px;
}

/**** Lifecycle transition ****/

.lifecycletransition_from_state select {
   width:200px;
}

.lifecycletransition_to_state select {
   width:200px;
}

/**** Transition matrix ****/
.transition_matrix td {
   background:#dddddd;
   text-align:center;
}

.transition_matrix th {
   background:var(--lightest_shade_2);
   text-align:left;
   padding-left:5px;
   padding-right:5px;
}

.transition_matrix th.horizontal_heading {
   text-align:left;
}

.transition_matrix td.self {
   background: transparent;
}

/**** Request transition ****/

.request_transition_transition select {
   width:200px;
}

.request_transition_owner select {
   width:200px;
}

.workflow {
   width: calc(99% + 10px);
   padding-left:10px;
   padding-right:10px;
   padding-top:10px !important;
}

.workflow td div {
   background:#e5e5e5;
   text-align:center;
   /* -webkit-border-radius:0px 20px 20px 0px;
   -moz-border-radius:0px 20px 20px 0px;
   border-radius:0px 20px 20px 0px; */
   font-size:0.75em;
   /* height:20px; */
   position: relative;
   text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: bold;
   color: #969696;
   border-top-right-radius: 20px;
   border-bottom-right-radius: 20px;
   border-top-left-radius: 5px;
   border-bottom-left-radius: 5px;
   box-shadow: 0px 0px 10px #00000047;
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
   white-space: nowrap;
}

.workflow_current div {
   background:var(--main_colour) !important;
   color:#FFFFFF !important;
}

.workflow_available div {
   background:#ffffff !important;
}

.workflow_available.workflow_available_requested div {
   padding-right: 20px;
}

.workflow_available a {
   color: var(--main_colour) !important;
}

.workflow_available a:hover {
   color: var(--darker_shade_1) !important;
}

.workflow_requested_icon {
   background:var(--main_colour);
   padding: 2px;
   width: auto;
   height: 14px;
   border-radius: 100%;
   position: absolute;
   right: 4px;
   top: 2.8px;
}


/* .workflow_name {
   margin-left: 11px;
} */

.workflow_arrow_left {
   display: inline-block;
   left: 0;
   top: 0;
   position: absolute;
   width: 0;
   height: 0;
   border-top: 11px solid transparent;
   border-bottom: 11px solid transparent;
   border-left: 11px solid #ffffff;
}

.workflow_arrow_left.workflow_2_lines {
   border-top: 15px solid transparent;
   border-bottom: 15px solid transparent;
   border-left: 15px solid #ffffff;
}

.workflow_arrow_left.workflow_3_lines {
   border-top: 19px solid transparent;
   border-bottom: 19px solid transparent;
   border-left: 19px solid #ffffff;
}

.workflow_arrow_right {
   display: inline-block;
   right: -11px;
   top: 0;
   position: absolute;
   width: 0;
   height: 0;
   border-top: 11px solid transparent;
   border-bottom: 11px solid transparent;
   /* border-left: 11px solid green; */
   z-index: 1;
}

.workflow_arrow_right.workflow_2_lines {
   border-top: 15px solid transparent;
   border-bottom: 15px solid transparent;
   right: -15px;
}

.workflow_arrow_right.workflow_3_lines {
   border-top: 19px solid transparent;
   border-bottom: 19px solid transparent;
   right: -19px;
}

.workflow td.workflow_current .workflow_arrow_right {
   border-left: 11px solid var(--main_colour);
}

.workflow td.workflow_current .workflow_arrow_right.workflow_2_lines {
   border-left: 15px solid var(--main_colour);
}

.workflow td.workflow_current .workflow_arrow_right.workflow_3_lines {
   border-left: 19px solid var(--main_colour);
}

.workflow td.workflow_available .workflow_arrow_right {
   border-left: 11px solid #eaeaea;
}

.workflow td.workflow_available .workflow_arrow_right.workflow_2_lines {
   border-left: 15px solid #eaeaea;
}

.workflow td.workflow_available .workflow_arrow_right.workflow_3_lines {
   border-left: 19px solid #eaeaea;
}

.workflow td .workflow_arrow_right {
   border-left: 11px solid #eaeaea;
}

.workflow td .workflow_arrow_right.workflow_2_lines {
   border-left: 15px solid #eaeaea;
}

.workflow td .workflow_arrow_right.workflow_3_lines {
   border-left: 19px solid #eaeaea;
}

.workflow td:nth-child(2) .workflow_arrow_left {
   display: none !important;
}

.workflow td.workflow_td_spacer {
   background: #f9f9f9;
   width: 1px;
   display: none;
}



.workflow_transition_details {
	margin-left: 10px;
	margin-right:20px;
}
.note_details {
	display:flex;
	justify-content: center;
	align-items: flex-start;
	/* background-color:rgba(0,233,0,0.05); */
 background-color:rgba(0, 164, 112,0.1);

	padding: 0.5em;
	width: fit-content;
	max-width: 100%;
	border-radius: 5px;
	font-size:11px;
	margin-top: 10px;
}



.note_image .status_state{
	margin-left:16px;
	border: 2px solid rgba(0, 164, 112,0.1);
}

.note_content {
	margin-top:2.5px;
	margin-left: 7px;
	font-weight: bold;
	margin-top:3px;
}

.note_content #note_header {
	color:rgba(0, 164, 112);
}

.reason_details {
	display:flex;
	justify-content: center;
	align-items:flex-start;
	/* background-color:rgba(234,166,13,0.2); */
	background-color:rgba(234,166,13,0.1);
	padding: 0.5em;
	width: fit-content;
	border-radius: 5px;
	font-size:11px;
	margin-top: 10px;
}

.reason_image .status_state{
	margin-left:17.5px;	
}

.reason_content {
	margin-left: 7px;
	font-weight: bold;
	margin-top:3px;
}

.reason_content #reason_header {
	color:rgba(234,166,13,1);
}



.workflow_builder_button_outer {
   float: right;
   border-radius: 5px;
   color: #ffffff;
   margin-top: -5px;
   cursor: pointer;
   height: 30px;
   vertical-align: middle;
}

.workflow_builder_button_outer:hover {
   opacity: .95;
}

.workflow_builder_button_right {
   padding-left: 10px;
   padding-right: 10px;
   display: inline-block;
   vertical-align: middle;
}

.workflow_builder_button_left {
   /* border-radius: 3px;
   width: 30px;
   height: 25px; */
   margin-top: 4px;
   margin-left: 10px;
   /* background-color: #ffffff; */
   /* background-image: url(/images/workflow_builder_icon_night.svg);
   background-size: 20px;
   background-repeat: no-repeat;
   background-position: center; */
   display: inline-block;
   vertical-align: middle;
   /* box-shadow: 0px 0px 5px #0000003d; */
}

/**** Report ****/

#report em {
  color:inherit;
}

.report_page_margins {
   position:absolute;
   top:0px;
   left:0px;
   border-collapse:collapse;
   z-index:-1;
   /* box-shadow:var(--popup_box_shadow);
   -moz-box-shadow:var(--popup_box_shadow);
   -webkit-box-shadow:var(--popup_box_shadow); */
}

.report_page_margins td {
   padding:0px;
   background:#FFFFFF;
}

.report_section {
   position:relative;
   z-index:1;
}

.report_section h1 {
   display:block;
   top:0px;
   text-align:left !important;
}

#report h1 {
   background:none;
   color:black;
   font-size:1.5em;
   position:relative;
   top:0px;
   padding:0px;
}

#report .dropdown {
        border:none;
}

#report .textedit {
        border:none;
}

#report .textareaedit {
        border:none;
}

#report .wysiwygedit {
        border:none;
        /* height: 30px; */
}

/*
#report td {
	overflow-wrap:anywhere;
}
*/

/**** Report cards  ****/

.report_cards .section, td.section {
   clear:both;
   text-align:center;
   border-bottom:1px solid #dddddd;
   padding-top:40px;
}

.report_card {
   margin-left:25px;
   margin-top:25px;
   position:relative;
   width:195px;
   height:110px;
   float:left;
   color: var(--font_grey);
}

.report_card_front {
   background:white;
   color: var(--font_grey);
   position:absolute;
   top:0px;
   left:0px;
   width:180px;
   height:85px;
   padding-top:10px;
   padding-bottom:10px;
   padding-left:5px;
   padding-right:5px;
   text-align:center;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
}

.report_card_front:hover {
   border-color:#BBBBBB;
   -webkit-box-shadow: 0px 0px 15px #bababa;
   -moz-box-shadow: 0px 0px 15px #bababa;
   box-shadow: 0px 0px 15px #bababa;
}

.report_card_front:focus {
   border-color:#BBBBBB;
   -webkit-box-shadow: 0px 0px 15px #bababa;
   -moz-box-shadow: 0px 0px 15px #bababa;
   box-shadow: 0px 0px 15px #bababa;
}

.report_card_front img {
   -webkit-filter: grayscale(100%);
   -moz-filter: grayscale(100%);
   filter: grayscale(100%);
   opacity: 0.3;
}

.report_card_front:hover img {
   -webkit-filter: grayscale(0%);
   -moz-filter: grayscale(0%);
   filter: grayscale(0%);
   opacity: 1;
}

.report_card_front:focus img {
   -webkit-filter: grayscale(0%);
   -moz-filter: grayscale(0%);
   filter: grayscale(0%);
   opacity: 1;
}

.report_card_back {
   background:white;
   position:absolute;
   top:0px;
   left:0px;
   width:180px;
   height:85px;
   padding-top:10px;
   padding-bottom:10px;
   padding-left:5px;
   padding-right:5px;
   text-align:center;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
   overflow:auto;
   z-index:-1;
}

.report_card_back:hover {
   border-color:#BBBBBB;
   -webkit-box-shadow: 0px 0px 15px #bababa;
   -moz-box-shadow: 0px 0px 15px #bababa;
   box-shadow: 0px 0px 15px #bababa;
}

.report_card_back:focus {
   border-color:#BBBBBB;
   -webkit-box-shadow: 0px 0px 15px #bababa;
   -moz-box-shadow: 0px 0px 15px #bababa;
   box-shadow: 0px 0px 15px #bababa;
}

.report_card_back img {
   -webkit-filter: grayscale(100%);
   -moz-filter: grayscale(100%);
   filter: grayscale(100%);
   opacity: 0.3;
}

.report_card_back:hover img {
   -webkit-filter: grayscale(0%);
   -moz-filter: grayscale(0%);
   filter: grayscale(0%);
   opacity: 1;
}

.report_card_back:focus img {
   -webkit-filter: grayscale(0%);
   -moz-filter: grayscale(0%);
   filter: grayscale(0%);
   opacity: 1;
}

.report_card_swap {
   position:absolute;
   bottom:10px;
   left:7px;
   background:#EEEEEE;
   -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px;
   padding:0px 5px 0px 5px;
}

.report_card .report_card_swap:hover {
   background:#BBBBBB;
   color:#FFFFFF;
}

.runreport_link {
   display: inline-block;
}

.loginlog + .runreport_link {
   margin-top: 10px;
   display: inline-block;
   border-radius: 5px;
   vertical-align: middle;
   background-color: #eaeaea;
   cursor: pointer;
   color: var(--font_grey);
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
   /* background-image: url(/images/icons/darkgrey/report.svg);
   background-position: 10px center;
   background-size: 20px;
   background-repeat: no-repeat; */
}

.loginlog + .runreport_link:hover {
   background-color: #dddddd;
}

.loginlog + .runreport_link .psoda_icon {
   margin-right: 5px;
}

/**** Calendar control ****/

.dateselectorcontrol {
   width:19em;
   text-align:center;
}

.dateselectorcontrol table {
   margin-bottom:5px;
   border-collapse:collapse;
}

.dateselectorcontrol input {
   float:none;
   border-left:1px solid #BBBBBB;
   border-top:1px solid #BBBBBB;
   border-right:1px solid #888888;
   border-bottom:1px solid #888888;
   padding:0px;
}

.dateselectorcontrol tr {
   background:#BBBBBB;
}

.othermonth input {
   color:#777777;
}

.selected_date input {
   background:#FF5555;
}

.today input {
   border:1px solid red;
}

/**** License selector ****/
.license_selector table {
   background:#EBEEF2;
   border-collapse:collapse;
   border-radius: 5px;
}

.license_selector input {
   float:none;
}

.license_selector th.firstcolumn {
   text-align:right;
   border:none;
}

.license_selector td.firstcolumn {
   text-align:right;
   border:none;
}

/**** Feature ****/

.feature_owner select {
   width:250px;
}

.feature_status select {
   width:150px;
}

/**** Meeting ****/

.notrequired_invites select {
   width:400px;
}

.required_invites select {
   width:400px;
}

.optional_invites select {
   width:400px;
}

.resources_invites select {
   width:400px;
}

/**** Pipeline ****/
.pipeline {
   border-collapse:collapse;
}

.pipeline th {
   padding:0px;
	background:#FFFFFF;
	min-width:150px;
	max-width:25vw;
}

.pipeline td {
   padding:0px;
	min-width:150px;
	max-width:25vw;
	vertical-align:top;
}

.pipeline span {
   color: var(--font_grey);
   background:#DDDDFF;
   display:block;
   border:1px solid #BBBBFF;
   -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px;
   padding-top:5px;
   padding-bottom:5px;
   margin-bottom:5px;
   margin-left:5px;
   margin-right:5px;
}

.pipeline .kanban_description span {
   background:none;
   display:inline-block;
   border:none;
   padding: 0;
   margin: 0;
   -webkit-border-radius:0px;
   -moz-border-radius:0px;
   border-radius:0px;
}

.pipeline span.red {
   color:#CC0000 !important;
   background:#FFBBBB !important;
   border:1px solid #CC0000;
}

.pipeline span.amber {
   color:#BF6000 !important;
   background:#FFC080 !important;
   border:1px solid #BF6000;
}

.pipeline span.green {
   color:#008800 !important;
   background:#BBFFBB !important;
   border:1px solid #008800;
}

.pipeline span.blue {
   color:#000088 !important;
   background:#BBBBFF !important;
   border:1px solid #000088;
}

#pipeline_placeholder {
   background:#888888;
}

.pipeline a {
   text-decoration:none;
}

.pipeline a:hover {
   text-decoration:underline;
   color:blue;
}

.pipeline_button {
   width:80px;
   display:block;
   padding-top:5px;
   padding-bottom:3px;
   margin-left:auto;
   margin-right:auto;
   background:#00a470;
   text-align:center;
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
}

.pipeline_button a {
   text-decoration:none;
   color:white;
}

.pipeline_button a:hover {
   text-decoration:none !important;
   color:white !important;
}

#quick_add_reference, #quick_add_title {
   border-radius: 5px;
}

.group_by_row .pipeline_state_div {
	height:300px;
}

.pipeline_state_div {
	height:75vh;
	overflow-y:auto;
	padding:5px;
}

.kanban_card_skeleton  {
	height: 10px;
	background: #b4b4b4;
	border-radius: 5px;
    margin-bottom: 10px;
    table-layout: fixed;
}


.group_by_column {
	vertical-align: middle !important;
	font-weight: bold;
	text-align: right;
	padding-right:10px !important;
	min-width:80px !important;
}

.group_by_header_column {
	min-width:80px !important;
	width:fit-content;
}

.group_by_row {
	border-bottom: 1px solid rgb(187, 187, 187);
}


/**** Kanban ****/

.kanban_settings a {
   position: absolute;
   margin-top: -30px;
   padding-top: 5px;
   padding-bottom: 5px;
   vertical-align: middle;
   background-color: #eaeaea;
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 5px;
   color: var(--font_grey);
   cursor: pointer;
}

.kanban_settings a:hover {
   background-color: #dddddd;
}

.kanban_settings .psoda_icon {
   margin-right: 5px;
   vertical-align: middle;
}

.kanban {
   margin-top: 10px;
   border-collapse:collapse;
}

.kanban th {
   /* text-transform: uppercase; */
    letter-spacing: .5px;
    /* font-weight: 100; */
    font-size: 1em;
    position: relative;
    z-index: 2;
    background: #ffffff;
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: left;
    padding-left: 16px;
    min-width: 200px;
   max-width:25vw;
}

.kanban>tbody>tr>td {
	border-left:1px solid #bbbbbb;
	border-right:1px solid #bbbbbb;
	vertical-align:top;
   min-width:150px;
   max-width:25vw;
   /* background: #ffffff; */
   padding: 10px;
   /* -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    border-radius: 5px; */
}

/*
.kanban span {
   color: var(--font_grey);
   background:#DDDDFF;
   display:block;
   border:1px solid #BBBBFF;
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
   padding-top:5px;
   padding-right:5px;
   padding-bottom:5px;
   padding-left:5px;
   margin-bottom:5px;
   margin-left:5px;
   margin-right:5px;
}

.kanban span.red {
   color:#CC0000 !important;
   background:#FFBBBB !important;
   border:1px solid #CC0000;
}

.kanban span.amber {
   color:#BF6000 !important;
   background:#FFC080 !important;
   border:1px solid #BF6000;
}

.kanban span.green {
   color:#008800 !important;
   background:#BBFFBB !important;
   border:1px solid #008800;
}

.kanban span.blue {
   color:#000088 !important;
   background:#BBBBFF !important;
   border:1px solid #000088;
}
*/

.kanban a {
   text-decoration:none;
}

.kanban a:hover {
   text-decoration:none;
   color:var(--font_link);
}

.kanban_card .status_state {
   margin-left: 15px;
}

.pipeline_state_div .kanban_card_overlay {
   width: 100%; 
   height: auto;
   background: #fff9eb;
}

.kanban_card_overlay {
   width: 100%; 
   height: 100%;
   background: #fff9eb;
}

table.kanban_card {
	border-collapse:separate;
	border-spacing:0px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
	width:97%;
   user-select:none;
   touch-action: none;
   border: none;
   -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
   box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
   cursor: pointer;
   table-layout: fixed;
   background-color: #ffffff;
   border-radius: 5px;
}

.milestone_kanban_card {
   background-color: transparent !important;
}

table.kanban_card:active {
   cursor: grabbing;
   background: #f0f0f0;
}

table.kanban_card:hover, table.kanban_card:hover .card_topleft, table.kanban_card:hover .card_bottomleft, table.kanban_card:hover .card_bottom, table.kanban_card:hover .card_left, table.kanban_card:hover .card_card_right, table.kanban_card:hover .kanban_4_col, table.kanban_card:hover .kanban_3_col{
   background: #f0f0f0;
}
td.card_topleft {
	-webkit-border-radius:3px 0px 0px 0px;
	-moz-border-radius:3px 0px 0px 0px;
	border-radius:3px 0px 0px 0px;
	color: var(--font_grey);
	background:#FFFFFF;
	/* border-left:1px solid #BBBBBB;
	border-top:1px solid #BBBBBB; */
	border-right:none;
	border-bottom:none;
	padding-left:10px;
	/* padding-right:10px; */
	padding-top:5px;
   /* padding-bottom:5px; */
   position: relative;
}
.milestone_kanban_card td.card_topleft, .milestone_kanban_card .kanban_3_col {
   background-color: transparent !important;
}

td.card_bottomleft {
	-webkit-border-radius:0px 0px 0px 3px;
	-moz-border-radius:0px 0px 0px 3px;
	border-radius:0px 0px 0px 3px;
	color: var(--font_grey);
	background:#FFFFFF;
	/* border-left:1px solid #BBBBBB; */
	border-top:none;
	/* border-bottom:1px solid #BBBBBB; */
	border-right:none;
	padding-left:10px;
	padding-right:10px;
	padding-top:5px;
	padding-bottom:5px;
}
.milestone_kanban_card td.card_bottomleft {
   background-color: transparent !important;
}

td.card_bottom {
	color: var(--font_grey);
	background:#FFFFFF;
	border-left:none;
	border-top:none;
	/* border-bottom:1px solid #BBBBBB; */
	border-right:none;
	padding-left:10px;
	padding-right:10px;
	padding-top:5px;
	padding-bottom:5px;
}
.milestone_kanban_card td.card_bottom {
   background-color: transparent !important;
}

td.card_left {
	-webkit-border-radius:3px 0px 0px 3px;
	-moz-border-radius:3px 0px 0px 3px;
	border-radius:3px 0px 0px 3px;
	color: var(--font_grey);
	background:#FFFFFF;
	/* border-left:1px solid #BBBBFF;
	border-top:1px solid #BBBBFF;
	border-bottom:1px solid #BBBBFF; */
	border-right:none;
	padding-left:10px;
	padding-right:10px;
	padding-top:5px;
	padding-bottom:5px;
}

.milestone_kanban_card td.card_left {
   background-color: transparent !important;
}

td.card_right {
	-webkit-border-radius:0px 3px 3px 0px;
	-moz-border-radius:0px 3px 3px 0px;
	border-radius:0px 3px 3px 0px;
	/* border:1px solid #BBBBFF; */
}

/*table.kanban_card .card_topleft a img {
   height: 150px !important;
   width: auto !important;
   text-align: center;
   margin-top: -5px;
   display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5px;
}*/

table.kanban_card .card_topleft a img {
   height: auto !important;
   width: 100% !important;
   text-align: center;
   margin-top: 5px;
   display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5px;
}

table.kanban_card .card_left a img {
   height: auto !important;
   width: 100% !important;
   text-align: center;
   margin-top: 5px;
   display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5px;
}

table.kanban_card .card_left .attachments_kanban_icon_outer a img {
   max-width: 75px !important;
}

table.kanban_card:hover .kanban_menu {
   display: block;
}

table.kanban_card .card_topleft .milestone_kanban_attachments a img {
   width: 28px !important;
    height: 28px !important;
    text-align: left;
    margin-left: unset;
}

.kanban_menu {
   display: none;
   position: absolute;
   top: 5px;
   right: 0px;
   padding-left: 5px;
   padding-right: 5px;
   background: #f0f0f0;
   border-radius: 5px;
   padding-top: 2px;
   padding-bottom: 2px;
}

.kanban_menu:hover {
   background: #d6d6d6;
}

.kanban_menu img {
   width: 16px;
   height: auto;
   vertical-align: middle;
   padding-bottom: 5px;
}

.kanban_context {
   font-size: .75em;
   margin-top: 5px;
   margin-bottom: 5px;
}

.kanban_description {
   /* text-overflow: ellipsis;
   white-space: nowrap;
   overflow: hidden;
   line-height: 1.25em; */
   overflow: hidden;
   display: -webkit-box;
   -webkit-line-clamp: 4;
   -webkit-box-orient: vertical;  
   margin-top: 5px;
   margin-bottom: 5px;
}

.kanban_comment {
   /* text-overflow: ellipsis;
   white-space: nowrap;
   overflow: hidden;
   line-height: 1.25em; */
   overflow: hidden;
   display: -webkit-box;
   -webkit-line-clamp: 4;
   -webkit-box-orient: vertical;  
   margin-top: 0px;
   margin-bottom: 0px;
}

.kanban_4_col {
   text-align: center;
   background: #ffffff;
   vertical-align: top;
}

.kanban_4_col > div {
   height: 16px;
   overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kanban_4_col img {
   vertical-align: top;
   height: 16px;
   width: auto;
   opacity: .75;
}

.priority_img img {
   padding-top: 2.75px;
   height: 12px;
}  

.kanban_comment img {
   vertical-align: top;
   width: 16px;
   height: auto;
   padding-right: 5px;
}

.kanban_3_col {
   text-align: center;
   background: #ffffff;
   vertical-align: top;
   padding: 1%;
}

/* .kanban_progress_outer {
   width: 75%;
   display: inline-block;
   margin-right: 4%;
   position: relative;
}

.kanban_progress_track {
   background: #eaeaea;
   width: 100%;
   height: 7px;
   border-radius: 7px;
}

.kanban_progress_bar {
   background: #00a470;
   height: 7px;
   width: 0%;
   border-radius: 7px;
   position: absolute;
   left:0;
   top: 0;
}

.kanban_progress_number img {
   vertical-align: sub;
}

.kanban_progress_number {
   width: 20%;
   display:inline-block;
   text-align: center;
   font-weight: 600;
   color: #00a470;
} */

.kanban_progress_dates_outer {
   width: 100%;
   display: inline-block;
   margin-right: 4%;
   position: relative;
}

.kanban_progress_dates_track {
   background: #d6d6d6;
   width: 100%;
   height: 7px;
   border-radius: 7px;
}

.kanban_progress_dates_bar {
   background: #00a470;
   height: 7px;
   width: 0%;
   border-radius: 7px;
   position: absolute;
   left:0;
   top: 0;
}

.kanban_progress_dates_today_bar {
   background: rgba(0, 0, 0, 0.15);
   height: 7px;
   width: 0%;
   border-radius: 7px;
   position: absolute;
   left:0;
   top: 0;
}

.kanban_progress_dates_right_circle, .kanban_progress_dates_left_circle {
   position: absolute;
   height: 10px;
   width: 10px;
   background: #ffffff;
   top: -6.5px;
   border-radius: 20px;
   z-index: 2;
}

table.kanban_card:hover .kanban_progress_dates_right_circle, table.kanban_card:hover .kanban_progress_dates_left_circle {
   background: #f0f0f0;
}

.kanban_progress_dates_right_circle {
   right: 0;
   border: 5px solid #d6d6d6;
}

.kanban_progress_dates_left_circle {
   left: 0;
   border: 5px solid #00a470;
}

.kanban_progress_dates_outer.notstarted .kanban_progress_dates_right_circle, .kanban_progress_dates_outer.notstarted .kanban_progress_dates_left_circle {
   border: 5px solid #d6d6d6;
}

.kanban_progress_dates_outer.complete .kanban_progress_dates_right_circle, .kanban_progress_dates_outer.complete .kanban_progress_dates_left_circle {
   border: 5px solid #00a470;
}

.kanban_progress_dates_container {
   position: relative;
}

.kanban_progress_dates_startdate, .kanban_progress_dates_enddate {
   position: absolute;
   top: -5px;
   font-size: 0.75em;
}

.kanban_progress_dates_startdate {
   left: 0;
}

.kanban_progress_dates_enddate {
   right: 0;
}

.kanban_progress_dates_number img {
   vertical-align: sub;
}

.kanban_oval {
   border-radius: 30px;
   margin: auto;
   margin-bottom: 3px;
   text-align: center;
   font-weight: 500;
   font-size: 10px;
   color: #ffffff;
   padding: 3px;
   padding-left: 5px;
   padding-right: 5px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.kanban_progress_dates_number {
   /* width: 20%;
   display:inline-block; */
   width: 50px;
   border-radius: 50px;
   margin: auto;
   margin-top: 10px;
   margin-bottom: 5px;
   background: #00a470;
   text-align: center;
   font-weight: 600;
   color: #ffffff;
}

.kanban_progress_dates_notstarted {
   width: 50px;
   border-radius: 50px;
   margin: auto;
   margin-top: 10px;
   margin-bottom: 5px;
   /* height: 15.9px;
   padding-top: 2.5px; */
   background: #d6d6d6;
   text-align: center;
   font-weight: 600;
   /* font-size: .8em; */
   color: #ffffff;
}

.kanban_progress_dates_complete {
   width: 50px;
   border-radius: 50px;
   margin: auto;
   margin-top: 10px;
   margin-bottom: 5px;
   background: #00a470;
   text-align: center;
   font-weight: 600;
   color: #ffffff;
}

.kanban_progress_dates_complete img {
   vertical-align: sub;
    /* padding-right: 5px; */
    padding-bottom: 1px;
}

/* .kanban_allocated_border {
   position: relative;
   text-align: center;
   width: 110px;
   height: 110px;
   border-radius: 100%;

   background-color:#39B4CC;
   background-image:
       linear-gradient(180deg, transparent 50%, #A2ECFB 50%),
       linear-gradient(90deg, #A2ECFB 50%, transparent 50%);
}

.kanban_allocated_inner {
   position: relative;
   top: 5px;
   left: 5px;
   text-align: center;
   width: 100px;
   height: 100px;
   border-radius: 100%;
   background-color: #ffffff;
} */

.gantt_allocation {
	cursor: default;
	pointer-events: none;
}

.gantt_allocation > div {
	pointer-events: auto;
}

.gantt_allocation_img_delay {
	height: 22.5px;
	width: 22.5px;
	margin-left: 8.5px;
	margin-top: 8.5px;
	border-radius: 30px;
}

.photo_circle_allocated_outer {
   position: relative;
   height: 45px;
   width: 45px;
   display: inline-block;
   vertical-align: middle;
}

.gantt_allocation .photo_circle_allocated_outer {
   height: 40px;
   width: 40px;
	margin-right: -5px;
}

.photo_circle_allocated_outer img {
   margin-left: 9.75px;
   margin-top: 10px;
   text-align: center;
}

.gantt_allocation .photo_circle_allocated_outer img {
	height: 22.5px;
	width: 22.5px;
	margin-left: 8.5px;
	margin-top: 8.5px;
}

.allocated_to_plus_more {
	background: #eaeaea;
	width: 38px;
	height: 20px;
	margin: 2.5px;
	border-radius: 100px;
	font-size: 14px;
	text-align: center;
	padding-top: 9px;
	padding-bottom: 9px;
	font-weight: bold;
	color: var(--font_grey);
}

.gantt_allocation .allocated_to_plus_more {
	width: 30px;
	height: 16px;
	font-size: 12px;
	padding-top: 7px;
	padding-bottom: 7px;
	margin-left: 5px;
	margin-top: 0px;
}

.gantt_allocation .photo_circle_allocated_outer .photo_letters  {
	height: calc(22.5px - 8.3px);
	width: 22.5px !important;
	margin-left: 8.5px;
	margin-top: 8.5px;
	font-size: 10.5px !important;
}

.photo_circle_allocated_outer .psoda_icon svg {
	padding: 12.5px;
	height: 20px;
	width: 20px;
}

.gantt_allocation .photo_circle_allocated_outer .psoda_icon svg {
	padding: 10px;
	height: 20px;
	width: 20px;
}

.photo_circle_allocated_outer .photo_letters  {
   margin-left: 9.75px;
   margin-top: 10px;
   text-align: center;
}

table.kanban_card .status_state {
   display: none;
}

.gantt_allocation  .status_state {
	border: 1px solid white;
	margin-left: 24px;
	height: 5px;
	width: 5px;
	margin-top: 9px;
}

.photo_circle_allocated_outer .progress_indicator {
   text-align:center;
   position: absolute;
   top: 0;
   left: 0;
}

.photo_circle_allocated_outer .progress_indicator svg {
	margin-left:auto;
	margin-right:auto;
	height: 45px;
	width: 45px;
	transform: rotate(-90deg);
}

.gantt_allocation .photo_circle_allocated_outer .progress_indicator svg {
   height: 40px;
   width: 40px;
}

.photo_circle_allocated_outer .progress_indicator .SVG_text {
    font-family: var(--font_family);
    /* transition: opacity 1s ease; */
    fill: #4c4c4c;
    stroke-width: .25px;
    stroke: #4c4c4c;
}

.photo_circle_allocated_outer .progress_indicator .green_animate {
    stroke: var(--main_colour);
    stroke-width: 5;
    fill: none;
    stroke-linecap: round;
    /* equal to circumference of circle 2 * 3.14 * 38(radius) */
    stroke-dasharray:238.64; 
    stroke-dashoffset: 238.64;
    /* speed of animation */
    transition: stroke-dashoffset 1s ease;
}

.photo_circle_allocated_outer .progress_indicator .grey_circle {
    stroke: #eaeaea;
    stroke-width: 3;
    fill: none;
    position: absolute;
}

.add_kanban_card {
   margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
    margin-top: 0;
    /* background: #fff; */
    height: 30px;
    width: 97%;
    /* -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2); */
    border: 1.5px solid #eaeaea;
    /* background-image: url(/images/icons/darkgrey/new.svg);
    background-repeat: no-repeat;
    background-size: 18px 18px;
    background-position: center; */
    display: block;
    border-radius: 5px;
}

.add_kanban_card .psoda_icon {
   text-align: center;
   display: block;
   margin-top: 5px;
}

.add_kanban_card:hover .psoda_icon use {
   fill: var(--icon_green) !important;
}

.add_kanban_card  a {
   width: 100%;
   height: 100%;
   display: block
}

.add_kanban_card:hover {
   background-color: #eaeaea;
   /* background-image: url(/images/icons/green/new.svg); */
   cursor: pointer;
}

.quick_add_kanban_task {
   display: none;
   border-collapse:separate;
	border-spacing:0px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
   width:97%;
   min-width: 200px;
   user-select:none;
   touch-action: none;
   border: none;
   -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
   box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
   table-layout: fixed;
   background-color: #ffffff;
   /* height: 160px; */
   padding-bottom: 5px;
   position: relative;
}

.quick_add_kanban_task.open {
   display: block;
}

.quick_add_kanban_task .quick_add_kanban_workflow {
   width: 90%;
   max-width: none;
   min-width: 0;
   margin-left: 2%;
   margin-right: 2%;
   margin-top: 10px;
   margin-bottom: 10px;
}

.quick_add_kanban_task .quick_add_reference {
   width: 25%;
   max-width: 25%;
   margin-left: 2%;
   margin-right: 2%;
   margin-top: 10px;
   margin-bottom: 10px;
}

.quick_add_kanban_task .quick_add_title {
   width: 50%;
   max-width: 50%;
   margin-left: 2%;
   margin-right: 2%;
   margin-top: 10px;
   margin-bottom: 10px;
}

.quick_add_kanban_button {
   background-color: var(--main_colour);
   color: #ffffff;
   padding: 5px 10px;
   border-radius: 5px;
   margin-bottom: 5px;
}

.quick_add_kanban_button .psoda_icon {
   height: 16px;
   width: auto;
   vertical-align: middle;
   margin-right: 5px;
 }

 .quick_add_kanban_button:hover {
      background-color: var(--darker_shade_1);
    color: #ffffff !important;
 }

.quick_add_kanban_buttons a, .quick_add_kanban_buttons div {
   display: inline-block;
   margin-left: 5px;
   margin-right: 5px;
   vertical-align: middle;
}

.quick_add_kanban_cancel {
   cursor: pointer;
}

.quick_add_kanban_buttons {
   width: 100%;
   text-align: center;
   margin-top: 5px;
}

.quick_add_kanban_task_right {
   position: absolute;
   height: 100%;
   width: 6px;
   background: #c7c7c7;
   top: 0;
   right: 0;
   border-top-right-radius: 3px;
   border-bottom-right-radius: 3px;
}

.dummy_kanban_card {
   height: 75px;
}

.dummy_kanban_card .card_right{
   background: #c7c7c7;
   width: 5px;
}

.dummy_kanban_card tr {
   height: 100%;
}

.dummy_kanban_card td.card_topleft {
   vertical-align: top;
}

#fade_animation.dummy_kanban_card td.card_topleft{
   -webkit-animation: dummy_kanban_fade 1s ease;  /* Safari 4+ */
   -moz-animation: dummy_kanban_fade 1s ease;  /* Fx 5+ */
   -o-animation: dummy_kanban_fade 1s ease;  /* Opera 12+ */
   animation: dummy_kanban_fade 1s ease;
}

@keyframes dummy_kanban_fade {

   0%{
      /* background-color: #ffffff;
      color: var(--font_grey); */
      opacity: 0;
      }

     50% {
      /* background-color: #00a470;
      color: white;     */
      /* opacity: .25; */
    }

    100% {
      /* background-color: #ffffff;
      color: var(--font_grey); */
      opacity: 1;
      }

 }

/**** Kanban Photo ****/
#kanban_photo {
	position:relative;
	min-height:520px;
}

#kanban_attachments {
	width:520px;
	margin-left:auto;
	margin-right:auto;
}

#kanban_frame {
	width:500px;
	-webkit-box-shadow:0px 0px 20px rgba(0,0,0,0.3);
	-moz-box-shadow:0px 0px 20px rgba(0,0,0,0.3);
	box-shadow:0px 0px 20px rgba(0,0,0,0.3); /*CSS3 shadow*/
	padding:10px;
	position:relative;
}

#kanban_clipping {
	overflow:hidden;
}

#kanban_canvas {
	position:absolute;
	top:35px;
	left:10px;
	width:500px;
	height:428px;
}

#kanban_board {
	width:50000px;
	min-height:379px;
	padding-top:25px;
	padding-bottom:25px;
}

#kanban_board img {
	width:500px;
   /* background-image:url(/images/ajax-loader.gif);
   background-size:32px 32px;
   background-repeat:no-repeat;
   background-position:center center; */
}

#kanban_board_buttons {
	width:500px;
	margin-top:20px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	width:500px;
}

#kanban_board_buttons div {
	border:none;
	margin:0px;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:15px;
	padding-right:15px;
	background:#00a470;
	text-align:center;
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
	color:white;
}

#kanban_board_left {
	position:absolute;
	left:15px;
	top:-258px;
	width: 32px !important;
   border-radius: 50% !important;
   padding: 0px !important;
   height: 32px !important;
   font-size: 23px;
   font-weight: bold;
   background: rgba(0,0,0,0.5) !important;
}

#kanban_board_left:hover {
   background: #00A470 !important;
	box-shadow:0px 0px 20px rgba(0,0,0,0.5);
	cursor:pointer;
}

#kanban_board_right {
	position:absolute;
	right:15px;
	top:-258px;
	width: 32px !important;
   border-radius: 50% !important;
   padding: 0px !important;
   height: 32px !important;
   font-size: 23px;
   font-weight: bold;
   background: rgba(0,0,0,0.5) !important;
}

#kanban_board_right:hover {
   background: rgba(0,164,112,1) !important;
	box-shadow:0px 0px 20px rgba(0,0,0,0.5);
	cursor:pointer;
}

#kanban_board_process {
	position:absolute;
	left:185px;
	width:100px;
}

#kanban_progress_indicator {
	padding-top:80px;
	text-align:left;
}

#kanban_progress_indicator>svg {
	margin-left:150px;
    height: 300px;
    width: 300px;
}

#card_container {
	float:left;
	margin-left:60px;
}

#card_frame {
	width:375px;
	-webkit-box-shadow:0px 0px 20px rgba(0,0,0,0.3);
	-moz-box-shadow:0px 0px 20px rgba(0,0,0,0.3);
	box-shadow:0px 0px 20px rgba(0,0,0,0.3); /*CSS3 shadow*/
	padding:10px;
}

#card_clipping {
	overflow:hidden;
}

#card_board {
	width: 37500px;
   min-height: 426px;
   padding-top: 3px;
}

#card_board img {
	width:375px;
   /* background-image:url(/images/ajax-loader.gif);
   background-size:32px 32px;
   background-repeat:no-repeat;
   background-position:center center; */
}

#card_board_buttons {
	margin-top:20px;
	position:relative;
	width:395px;
	height:50px;
}

#card_board_discard {
	border:none;
	margin:0px;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:15px;
	padding-right:15px;
	background:#a40032;
	text-align:center;
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
	color:white;
	position:absolute;
	left:132px;
	width:100px;
}

#card_board_left {
	position:absolute;
	left:25px;
	top:-258px;
	width: 32px !important;
   border-radius: 50% !important;
   padding: 0px !important;
   height: 32px !important;
   font-size: 23px;
   font-weight: bold;
   background: rgba(0,0,0,0.5) !important;
	text-align:center;
	color:#FFFFFF;
}

#card_board_left:hover {
   background: #00A470 !important;
	box-shadow:0px 0px 20px rgba(0,0,0,0.5);
	cursor:pointer;
}

#card_board_right {
	position:absolute;
	right:25px;
	top:-258px;
	width: 32px !important;
   border-radius: 50% !important;
   padding: 0px !important;
   height: 32px !important;
   font-size: 23px;
   font-weight: bold;
   background: rgba(0,0,0,0.5) !important;
	text-align:center;
	color:#FFFFFF;
}

#card_board_right:hover {
   background: #00A470 !important;
	box-shadow:0px 0px 20px rgba(0,0,0,0.5);
	cursor:pointer;
}

#kanban_task_actions {
	float:left;
	margin-left:60px;
}

#kanban_task_actions input {
	width:350px;
   -webkit-border-radius:5px 5px 0px 0px;
   -moz-border-radius:5px 5px 0px 0px;
   border-radius:5px 5px 0px 0px;
}

#update_task_button {
	border:none;
	margin:20px 0px 0px 110px;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:15px;
	padding-right:15px;
	background:#00a470;
	text-align:center;
   -webkit-border-radius:5px;
   -moz-border-radius:5px;
   border-radius:5px;
	color:white;
	width:100px;
}

#kanban_task_dropdown {
	border:2px solid #c3e5f7;
	border-top:none;
	height:294px;
	width:350px;
	overflow:auto;
	margin-bottom:20px;
   -webkit-border-radius:0px 0px 5px 5px;
   -moz-border-radius:0px 0px 5px 5px;
   border-radius:0px 0px 5px 5px;
}

#kanban_task_dropdown .option {
	float:none;
	padding:5px 10px 5px 10px;
}

#kanban_task_dropdown .option img {
	margin-right:20px;
}

#kanban_task_dropdown .selected_option {
	float:none;
	padding:5px 10px 5px 10px;
	background:#1e90ff;
	color:#FFFFFF;
}

#kanban_task_dropdown .selected_option img {
	margin-right:20px;
}

#kanban_task_actions select {
	width:350px;
}
/**** TabbedControl ****/

#ajax_tab_line {
   position: absolute;
   bottom: 0px;
   border-top: 3px solid var(--main_colour);
}

.tabbed_control {
   margin-top: 10px;
}

.tabbed_control_menu {
   margin-left:-17px;
   position:relative;
   /* box-shadow: 0px 7px 7px -7px rgba(0, 0, 0, 0.3); */
   width: calc(100% + 27px);
}

#tabbed_control_menu {
   /* background: #ffffff; */
} 

.tabbed_control_menu ul li a {
   text-decoration:none;
   color: var(--font_grey);
}

.tabbed_control_menu ul {
   margin:0px;
   padding:0px;
   list-style:none;
   clear:both;
}

.tabbed_control_menu>ul>li {
   /* margin-left:20px;
   padding-right:8px; */
   margin-left: 15px;
   list-style:none;
   display:inline-block;
   /* float:left; */
   width: 135px;
   height: 45px;
   text-align: center;
   position: relative;
   vertical-align: top;
}

/* .tabbed_control_menu>ul>li:hover {
   background: #f7f7f7;
} */

.tabbed_control_menu select {
   z-index:10;
}

.tabbed_control_menu .tab_ajax {
   display: inline-block;
   padding-top: 3px;
   padding-bottom: 3px;
}

.tabbed_control .tabbed_control_tabs {
   /* display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  width: 90%; */
  white-space: nowrap;
  overflow-x: hidden;
  overflow-y: hidden;
  /* max-width: 89%; */
  max-width: calc(100% - 110px - 27px);
  height: 40px;
  /* width: fit-content; */
  margin-left: 17px;
}

.unselected_tab .psoda_icon {
   display: none;
}

.unselected_tab img {
    display: none;
    /* opacity: 0; */
    width:22px;
    height:22px;
    margin-right: 3px;
   /* -webkit-filter: grayscale(100%);
   -moz-filter: grayscale(100%);
   filter: grayscale(100%);
   opacity: 0.5; */
}


 .unselected_tab a:hover, #tabbed_dropdown > li > ul > li > a:hover {
    font-weight: bold;
    color: var(--font_grey);
}  

/* .unselected_tab a:hover, #tabbed_dropdown > li > ul > li > a:hover .dropdown_tab_bold_hover_fix{
   font-weight: bold;
}

.dropdown_tab_bold_hover_fix {
   margin-top: -22px;
   margin-left: 20px;
   font-weight: bold;
   opacity: 0 !important;
   visibility: hidden !important;
   display: none !important;
}   */

/**hover for preferences tabs **/
.unselected_tab input {
    font-family: var(--font_family);
	 color: var(--font);
}

.unselected_tab input:hover {
    font-weight: bold;
    color: var(--font_grey);
    cursor: pointer;
}  

div.tab-right > strong > img.graphicsonly {
   width: 20px;
   height: 22px;
   vertical-align: top;
   margin-right: 3px;
   margin-top: -2px;
}

div.tab-right a > img.graphicsonly {
   width:20px;
   height: 20px;
   vertical-align: top;
}

.tab_main_icon {
   margin-right: 5px;
}

.tab_main_icon svg {
   height: 20px;
   width: 20px;
}

.favourites_on_tab, .favourites_on_tab_placeholder {
   width: 14px;
   height: 16px;
   display: inline-block;
   margin-bottom: 18px;
   padding-left: 5px;
   padding-right: 5px;
   padding-top: 4px;
   padding-bottom: 4px;
}

.favourites_colour_default .favourites_on_tab_selected {
   width: 14px;
   height: 16px;
}

.favourites_on_tab_selected {
   width: 16px;
   height: 16px;
   display: inline-block;
   margin-bottom: 2px;
   padding-left: 5px;
   padding-right: 5px;
   padding-top: 4px;
   padding-bottom: 4px;
}

.favourites_on_tab svg, .favourites_on_tab_selected g {
	pointer-events: none;
}

/* .favourites_on_tab, .favourites_on_tab_placeholder {
   opacity: .5;
} */

.favourites_on_tab:hover {
   opacity: .8;
} 

.favourites_on_list, .favourites_on_list_selected  {
   width: 16px;
   height: 16px;
}

.favourites_on_list {
   opacity: .3;
}

.favourites_on_list:hover {
   opacity: .75;
}

.list_page_favourite{
   display: inline-block;
   margin-right: 10px;
	vertical-align: middle;
}

.tabbed_control_tabs .refresh_button { 
   opacity: .7;
   width: 14px;
   height: 14px;
}

.tabbed_control_tabs .refresh_on_tab_placeholder {
   opacity: .7;
   /* width: 14px;
   height: 14px; */
   /* margin-bottom: 4px; */
   position: relative;
   bottom: 7px;
}


/* selected tab styling */
.tabbed_control_menu .selected_tab {
   /* font-size:1.1em; */
   /* margin-top:1px; */
   /* position:relative; */
   /* border-left:1px solid #E7F1FB;
   border-top:1px solid #E7F1FB;
   border-right:1px solid #E7F1FB;
   -moz-border-top-left-radius:3px;
   -moz-border-top-right-radius:3px;
   border-top-left-radius:3px;
   border-top-right-radius:3px; */
   height: 40px;
   width: 180px;
   background: #ffffff;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
   border-top-left-radius: 7.5px;
   border-top-right-radius: 7.5px;
   z-index: 1;
   border-top: 2.5px solid var(--main_colour);
   color: var(--main_colour);
}

/* selected tab rounded bottom left and right*/
.tabbed_control_menu .selected_tab:before,
.tabbed_control_menu .selected_tab:after {
    content: "";
    position: absolute;
    height: 10px;
    width: 20px;
    bottom: 2px;
}

.tabbed_control_menu .selected_tab:after {
    right: -20px;
    border-radius: 0 0 0 10px;
    -moz-border-radius: 0 0 0 10px;
    -webkit-border-radius: 0 0 0 10px;
    -webkit-box-shadow: -10px 0 0 0 #fff;
    box-shadow: -5px 0 0 0 #fff;
}

.tabbed_control_menu .selected_tab:before {
    left: -20px;
    border-radius: 0 0 10px 0;
    -moz-border-radius: 0 0 10px 0;
    -webkit-border-radius: 0 0 10px 0;
    -webkit-box-shadow: 10px 0 0 0 #fff;
    box-shadow: 5px 0 0 0 #fff;
}

/* LIGHT ORANGE selected tab */
/* .selected_tab.schedule_tab, .selected_tab.history_tab, .selected_tab.vendors_tab, .selected_tab.changerequests_tab,
.selected_tab.releases_tab, .selected_tab.products_tab, .selected_tab.programprojects_org_tab, .selected_tab.assumptions_tab,
.selected_tab.workflows_tab, .selected_tab.workflowacls_tab, .selected_tab.workflowactions_tab, .selected_tab.gantt_tab, 
.selected_tab.timesheets_tab, .selected_tab.holidays_tab, .selected_tab.roles_tab, .selected_tab.releaseforms_tab,
.selected_tab.workflowtimeline_tab, .selected_tab.resourcescenarios_tab, .selected_tab.scenarios_tab, .selected_tab.productivity_tab,
.selected_tab.timelog_tab, .selected_tab.details_tab, .selected_tab.scheduledcommands_tab, .selected_tab.scheduledcommand_tab, .selected_tab.deliverables_tab,.selected_tab.skills_tab {
   border-top: 2px solid #f7ac63;
   color: #f7ac63;
} */

/* LIGHT RED selected tab */
/* .selected_tab.issues_tab, .selected_tab.leaveapplications_tab, .selected_tab.defaultroster_tab, .selected_tab.workflowstates_tab,
.selected_tab.indicators_tab, .selected_tab.indicatorvalues_tab, .selected_tab.exceptions_tab, .selected_tab.evaluations_tab, 
.selected_tab.evaluationresults_tab, .selected_tab.defects_tab, .selected_tab.escalated_tab, .selected_tab.benefits_tab,
.selected_tab.calendar_tab, .selected_tab.holidaycalendars_tab, .selected_tab.advancedestimates_tab, .selected_tab.defectsoverview_tab,
.selected_tab.statistics_tab {
   border-top: 2px solid #f46464;
   color: #f46464;
} */

/* YELLOW selected tab */
/* .selected_tab.milestones_tab, .selected_tab.releasenotes_tab, .selected_tab.orgchart_tab, .selected_tab.dependencymap_tab,
.selected_tab.riskdistribution_tab, .selected_tab.risks_tab,  .selected_tab.purchaseorders_tab, .selected_tab.follows_tab,
.selected_tab.features_tab, .selected_tab.expenses_tab, .selected_tab.costallocation_tab, .selected_tab.budgetgroups_tab,
.selected_tab.favourites_tab, .selected_tab.riskmaps_tab, .selected_tab.messages_tab, .selected_tab.benefitsmap_tab,
.selected_tab.visualise_tab {
   border-top: 2px solid #f2b126;
   color: #f2b126;
} */

/* GREEN selected tab */
/* .selected_tab.dashboard_tab, .selected_tab.dependencies_tab, .selected_tab.requirements_tab, .selected_tab.map_tab,
.selected_tab.traceabilitymatrix_tab, .selected_tab.dependencymatrix_tab, .selected_tab.votes_tab, .selected_tab.impacts_tab,
.selected_tab.dependants_tab, .selected_tab.determinants_tab, .selected_tab.subrequirements_tab, .selected_tab.sources_tab,.selected_tab.transactions_tab,.selected_tab.skillrating_tab {
   border-top: 2px solid #00a470;
   color: #00a470;
} */

/* BLUE selected tab */
/* .selected_tab.budgets_tab, .selected_tab.testcases_tab, .selected_tab.testcaseoverview_tab, .selected_tab.testruns_tab,
.selected_tab.testcaseresults_tab, .selected_tab.teststeps_tab, .selected_tab.teststepresults_tab, .selected_tab.transitions_tab,
.selected_tab.reports_tab, .selected_tab.reporttemplates_tab, .selected_tab.reportparameters_tab, .selected_tab.reportrunlogs_tab,
.selected_tab.forms_tab, .selected_tab.formtemplates_tab, .selected_tab.gatewaychecklist_tab, .selected_tab.healthcheck_tab,
.selected_tab.meetings_tab, .selected_tab.groups_tab, .selected_tab.contracts_tab, .selected_tab.comments_tab, .selected_tab.users_tab,
.selected_tab.radarcharts_tab, .selected_tab.schedulecharts_tab, .selected_tab.budgetcharts_tab, .selected_tab.directreportsworkload_tab, 
.selected_tab.budgetitems_tab, .selected_tab.workload_tab, .selected_tab.assets_tab, .selected_tab.companyideation_tab, .selected_tab.stakeholders_tab, 
.selected_tab.directreports_tab, .selected_tab.loginhistory_tab, .selected_tab.conflicts_tab, .selected_tab.charts_tab, .selected_tab.resourceestimates_tab,
.selected_tab.subgroups_tab, .selected_tab.members_group_tab, .selected_tab.resourcepools_tab, .selected_tab.testvelocity_tab, .selected_tab.resourcesummary_tab, .selected_tab.reporttemplate_tab {
   border-top: 2px solid #475f83;
   color: #475f83;
} */

/* BLACK selected tab */
/* .selected_tab.customfields_tab, .selected_tab.whiteboards_tab, .selected_tab.decisions_tab, .selected_tab.actions_tab, 
.selected_tab.deletedassets_tab, .selected_tab.matrix_tab, .selected_tab.assets_workflow_tab, .selected_tab.formfields_tab {
   border-top: 2px solid #303030;
   color: var(--font);
} */

/* GREY selected tab */
/* .selected_tab.subprojects_tab, .selected_tab.tasks_tab, .selected_tab.materials_tab, .selected_tab.projects_tab,
.selected_tab.programprojects_prog_tab, .selected_tab.organisations_tab, .selected_tab.acls_tab, .selected_tab.attachments_tab,
.selected_tab.members_tab, .selected_tab.filehistory_tab, .selected_tab.downloadlog_tab,.selected_tab.preferences_tab  {
   border-top: 2px solid #828282;
   color: #828282;
} */

/* BROWN selected tab */
/* .selected_tab.portfolios_tab, .selected_tab.lessons_tab, .selected_tab.measurements_tab {
   border-top: 2px solid #8e5729;
   color: #8e5729;
} */

/* .subtab {
   margin-left:3px;
   opacity: .4;
}

.subtab:hover {
    opacity: 1;
}

.selected_subtab {
   margin-left:3px;
   border-bottom:3px solid #00a470;
} */

.tabbed_control_menu .unselected_tab .tab-left {
   height: 100%;
   padding-right: 15px;
}

.tabbed_control_menu .unselected_tab .tab-right {
   /* padding-left:5px;
   padding-right:5px; */
   padding-top: 11px;
   height:18px;
   white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  height: auto;
}

.popup .tabbed_control_menu .unselected_tab .tab-right {
   padding-top: 0px;
}

.tabbed_control_menu .selected_tab .tab-left {
   height: 100%;
   padding: 5px;
}

.tabbed_control_menu .selected_tab .tab-right {
   padding-top: 6px;
   height: auto;
   white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  width: 120px;
}

.popup .tabbed_control_menu .selected_tab .tab-right {
   padding-top: 0px;
  width: auto;
  display: block;
}

#tabbed_dropdown .tab-right {
   width: 90px;
   height: 20px;
   background: #eaeaea;
   border-radius: 50px;
   margin: auto;
   margin-top: 17px;
   /* text-transform: uppercase;
   font-weight: bold; */
   font-size: 11px;
}

#tabbed_dropdown #tabbed_dropdown_button {
   cursor: pointer;
   height: 45px;
   float: right;
   margin-top: -45px;
   
   /* width: 10%; */
   width: 90px;
   margin-right: 20px;
   /* padding-left: 20px; */

   position: static;
   animation: none;
}

#tabbed_dropdown #tabbed_dropdown_button:hover .tab-right {
   background: #d4d4d4;
}

#tabbed_dropdown #tabbed_dropdown_button .tab-left img {
   /* padding-top: 5.5px; */
   transform: rotate(0deg);
   transition: .2s ease;
   margin-left: 5px;
   margin-top: 1px;
   vertical-align: middle;
}

#tabbed_dropdown #tabbed_dropdown_button.sfhover .tab-left img {
   transform: rotate(180deg);
}

#tabbed_dropdown #tabbed_dropdown_button .all_tabs_text {
   vertical-align: middle;
   display: inline-block;
   color: var(--font_grey);
}

#tabbed_dropdown #tabbed_dropdown_button .all_tabs_caret svg {
   transform: rotate(0deg);
   transition: .2s ease;
   margin-left: 5px;
   vertical-align: middle;
}

#tabbed_dropdown #tabbed_dropdown_button.sfhover .all_tabs_caret svg {
   transform: rotate(180deg);
}

.tabbed_dropdown_gradient_overlay {
   background-image: linear-gradient(to right, rgba(249, 249, 249, 0), rgba(249, 249, 249, 1));
   width: 80px;
    height: 20px;
    position: absolute;
    /* right: calc(10% - 17px); */
    right: 110px;
    top: 13px;
    pointer-events: none;
}

/* .tab-overlay {
   position:absolute;
   left:1px;
   right:1px;
   height:1px;
   bottom:-1px;
   background:#FFFFFF;
} */

.remove_tab_button {
   display: none;
   width: 10px;
   height: 10px;
   padding: 7px;
   /* margin-top: 5px; */
   margin-left: 10px;
   position: absolute;
   right: 0;
   top: 8px;
   cursor: pointer;
}

.remove_tab_button .psoda_icon {
   display: block;
}

.remove_tab_animation {
   width:0px;
   transition: .1s ease;
}

.remove_tab_button_hidden {
   display: none !important;
}

/* .sfhover img {
    filter: grayscale(100%);
    opacity: .75;
}

.sfhover ul li a:hover img {
    filter: grayscale(0%);
    opacity: 1;
} */

.tabbed_control_content-left {
   /* background-color: #f9f9f9;
   margin-left: -17px;
   padding-left: 17px;
   padding-right: 10px;
   width: 100%; */
   background-color: #ffffff;
   margin-right: 17px;
   padding-right: 10px;
   width: calc(100% - 17px);
   -webkit-box-shadow:var(--box_shadow);
   -moz-box-shadow:var(--box_shadow);
   box-shadow:var(--box_shadow);
   border-radius: 10px;
}

.popup .tabbed_control_content-left {
   background-color: transparent;
   margin-left: 0;
   padding-left: 0;
   padding-right: 0;
   width: auto;
}

.tabbed_control_content {
   padding-top:15px;
   padding-left:10px;
   padding-right:10px;
   padding-bottom:15px;
   height:200px;
}

html>body .tabbed_control_content {
   height:auto;
   min-height:175px;
}

.tabbed_control_top {
   height:15px;
   /* border-top:1px solid #E7F1FB; */
}

.tabbed_control_top-right {
   height:15px;
}

.tabbed_control_bottom-left {
   /* height:15px; */
}

.tabbed_control_bottom-right {
   /* height:15px; */
}

.section_header {
   position:relative;
   top:1px;
   width:200px;
   border-left:1px solid black;
   border-top:1px solid black;
   border-right:1px solid black;
   border-bottom:1px solid white;
   margin-top:10px;
   margin-left:5px;
   padding-left:5px;
   padding-right:5px;
}

.section_content {
   border-left:1px solid black;
   border-top:1px solid black;
   border-right:1px solid black;
   border-bottom:1px solid black;
   margin-bottom:10px;
   padding:10px;
}

.tabbed_link a {
   text-decoration:none;
   color: var(--font_grey);
}

.tabbed_control_menu form {
   display:inline;
   vertical-align:top;
   margin-left:5px;
}

#tabbed_dropdown .dropdown-tab {
   text-align: left;
}

#tabbed_dropdown .dropdown-tab a {
   display: inline-block;
   font-size: 0.9em;
   width:calc(100% - 10px);
   height:18px;
   padding: 5px;
   border-left: 4px solid transparent;
   margin-left:5px;
   margin-right:5px;
   background-color: #fff;
   border-radius: 3px;
   white-space: nowrap;
}

#tabbed_dropdown.tabbed_dropdown.vertical .dropdown-tab a {
   width: 100%;
   margin-left: 0px;
   margin-right: 0px;
}

#tabbed_dropdown.tabbed_dropdown.vertical .dropdown-tab {
   margin-top: 2px;
}

#tabbed_dropdown .dropdown-tab a img {
   width: 18px;
   height: 18px;
   display: inline-block;
   vertical-align: middle;
}

#tabbed_dropdown .dropdown-tab .psoda_icon svg {
   vertical-align: middle;
}

#tabbed_dropdown .dropdown-tab a div {
   display: inline-block;
   vertical-align: middle;
   margin-left: 5px;
   overflow: hidden;
   width: calc(100% - 14px);
   text-overflow: ellipsis;
   white-space: nowrap;
}

#tabbed_dropdown .dropdown-tab a:hover {
   font-weight: bold;
   color: var(--main_colour);
   background-color: var(--lightest_shade_1);
   border-left: 4px solid var(--main_colour);
}

/* #tabbed_dropdown .dropdown-tab a.dropdown_tab_blue:hover {
   color: #475f83;
   background-color: #EDEFF3;
   border-left: 4px solid #475f83;
} */

/* Green tab dropdown hovers */
/* #tabbed_dropdown a.dropdown_dashboard:hover, #tabbed_dropdown a.dropdown_dashboard1:hover, #tabbed_dropdown a.dropdown_dashboard2:hover,
#tabbed_dropdown a.dropdown_dependencies:hover, #tabbed_dropdown a.dropdown_dependencymatrix:hover, #tabbed_dropdown a.dropdown_requirements:hover,
#tabbed_dropdown a.dropdown_map:hover, #tabbed_dropdown a.dropdown_traceabilitymatrix:hover, #tabbed_dropdown a.dropdown_votes:hover,
#tabbed_dropdown a.dropdown_impacts:hover, #tabbed_dropdown a.dropdown_dependants:hover, #tabbed_dropdown a.dropdown_determinants:hover, #tabbed_dropdown a.dropdown_sources:hover, #tabbed_dropdown a.dropdown_transactions:hover,#tabbed_dropdown a.dropdown_skillrating:hover {
   color: #00a470;
   background-color: #E6F6F1;
   border-left: 4px solid #00a470;
} */


/* Light orange tab dropdown hovers */
/* #tabbed_dropdown a.dropdown_changerequests:hover, #tabbed_dropdown a.dropdown_deliverables:hover, #tabbed_dropdown a.dropdown_details:hover,
#tabbed_dropdown a.dropdown_interactivegantt:hover, #tabbed_dropdown a.dropdown_gantt:hover, #tabbed_dropdown a.dropdown_history:hover, #tabbed_dropdown a.dropdown_programprojects_org:hover, #tabbed_dropdown a.dropdown_roles:hover,
#tabbed_dropdown a.dropdown_scheduledcommands:hover, #tabbed_dropdown a.dropdown_vendors:hover, #tabbed_dropdown a.dropdown_workflows:hover,
#tabbed_dropdown a.dropdown_releases:hover, #tabbed_dropdown a.dropdown_products:hover, #tabbed_dropdown a.dropdown_assumptions:hover,
#tabbed_dropdown a.dropdown_workflowacls:hover, #tabbed_dropdown a.dropdown_workflowactions:hover, #tabbed_dropdown a.dropdown_timesheets:hover,
#tabbed_dropdown a.dropdown_holidays:hover, #tabbed_dropdown a.dropdown_releaseforms:hover, #tabbed_dropdown a.dropdown_workflowtimeline:hover,
#tabbed_dropdown a.dropdown_betaresourcescenarios:hover, #tabbed_dropdown a.dropdown_scenarios:hover, #tabbed_dropdown a.dropdown_productivity:hover, #tabbed_dropdown a.dropdown_timelog:hover, #tabbed_dropdown a.dropdown_acl:hover,
#tabbed_dropdown a.dropdown_resourcescenarios:hover,#tabbed_dropdown a.dropdown_skills:hover{ 
   color: #f7ac63;
   background-color: #FFF7F0;
   border-left: 4px solid #f7ac63;
} */

/* Light red tab dropdown hovers */
/* #tabbed_dropdown a.dropdown_benefits:hover, #tabbed_dropdown a.dropdown_defaultroster:hover, #tabbed_dropdown a.dropdown_holidaycalendars:hover,
#tabbed_dropdown a.dropdown_indicators:hover, #tabbed_dropdown a.dropdown_issues:hover, #tabbed_dropdown a.dropdown_leaveapplications:hover,
#tabbed_dropdown a.dropdown_workflowstates:hover, #tabbed_dropdown a.dropdown_indicatorvalues:hover, #tabbed_dropdown a.dropdown_exceptions:hover,
#tabbed_dropdown a.dropdown_evaluations:hover, #tabbed_dropdown a.dropdown_evaluationresults:hover, #tabbed_dropdown a.dropdown_defects:hover,
#tabbed_dropdown a.dropdown_escalated:hover, #tabbed_dropdown a.dropdown_calendar:hover, #tabbed_dropdown a.dropdown_advancedestimates:hover,
#tabbed_dropdown a.dropdown_defectsoverview:hover, #tabbed_dropdown a.dropdown_statistics:hover, #tabbed_dropdown a.dropdown_states:hover {
   color: #f46464;
   background-color: #FEF0F0;
   border-left: 4px solid #f46464;
} */

/* Yellow tab dropdown hovers */
/* #tabbed_dropdown a.dropdown_dependencymap:hover, #tabbed_dropdown a.dropdown_expenses:hover, #tabbed_dropdown a.dropdown_milestones:hover,
#tabbed_dropdown a.dropdown_orgchart:hover, #tabbed_dropdown a.dropdown_purchaseorders:hover, #tabbed_dropdown a.dropdown_riskdistribution:hover,
#tabbed_dropdown a.dropdown_riskmaps:hover, #tabbed_dropdown a.dropdown_risks:hover, #tabbed_dropdown a.dropdown_schedule:hover,
#tabbed_dropdown a.dropdown_releasenotes:hover, #tabbed_dropdown a.dropdown_follows:hover, #tabbed_dropdown a.dropdown_features:hover,
#tabbed_dropdown a.dropdown_costallocation:hover, #tabbed_dropdown a.dropdown_budgetgroups:hover, #tabbed_dropdown a.dropdown_favourites:hover,
#tabbed_dropdown a.dropdown_messages:hover, #tabbed_dropdown a.dropdown_benefitmap:hover, #tabbed_dropdown a.dropdown_visualise:hover, #tabbed_dropdown a.dropdown_notifications:hover {
   color: #f2b126;
   background-color: #FEF8EB;
   border-left: 4px solid #f2b126;
} */

/* Black tab dropdown hovers */
/* #tabbed_dropdown a.dropdown_actions:hover, #tabbed_dropdown a.dropdown_customfields:hover, #tabbed_dropdown a.dropdown_decisions:hover, #tabbed_dropdown a.dropdown_deletedassets:hover,
#tabbed_dropdown a.dropdown_whiteboards:hover, #tabbed_dropdown a.dropdown_formfields:hover, #tabbed_dropdown a.dropdown_decisions:hover, #tabbed_dropdown a.dropdown_deletedassets:hover, 
#tabbed_dropdown a.dropdown_assets:hover {
   color: var(--font);
   background-color: #EBEBEB;
   border-left: 4px solid #303030;
} */

/* Grey tab dropdown hovers */
/* #tabbed_dropdown a.dropdown_programprojects_prog:hover, #tabbed_dropdown a.dropdown_timesheettasks:hover,
#tabbed_dropdown a.dropdown_attachments:hover, #tabbed_dropdown a.dropdown_subprojects:hover, #tabbed_dropdown a.dropdown_tasks:hover,
#tabbed_dropdown a.dropdown_materials:hover, #tabbed_dropdown a.dropdown_projects:hover, #tabbed_dropdown a.dropdown_organisations:hover,
#tabbed_dropdown a.dropdown_acls:hover, #tabbed_dropdown a.dropdown_members:hover, #tabbed_dropdown a.dropdown_filehistory:hover, #tabbed_dropdown a.dropdown_downloadlog:hover,#tabbed_dropdown a.dropdown_preferences:hover {
   color: #828282;
   background-color: #F3F3F3;
   border-left: 4px solid #828282;
} */


/* Brown tab dropdown hovers */
/* #tabbed_dropdown a.dropdown_lessons:hover, #tabbed_dropdown a.dropdown_portfolios:hover, #tabbed_dropdown a.dropdown_measurements:hover {
   color: #8e5729;
   background-color: #F4EFEA;
   border-left: 4px solid #8e5729;
} */

/* .tabbed_dropdown.horizontal #tabbed_dropdown_button {
   position: static;
   width: 50px;
} */

/* .tabbed_dropdown.vertical li ul li.closetabs, .tabbed_dropdown.horizontal li ul li.closetabs {
   background-image: url(/images/popup_x_grey.svg);
   background-size: 15px 15px;
   background-repeat: no-repeat;
   background-position: center;
} */

#tabbed_dropdown_menu::-webkit-scrollbar {
   width: 7px;
   height: 7px;
}

/*** tabbed dropdown horizontal ***/

.tabbed_dropdown.horizontal {
   display: inline;
   /*  position:relative; */
}

.tabbed_dropdown.horizontal li #tabbed_dropdown_menu {
   display: block;
   width: calc(100% - 12px - 30px);
   /* border: solid 1px #E7F1FB; */
   position: absolute;
   top: -9999px;
   left: -9999px;
   background: white;
   z-index: -10;
}

.tabbed_dropdown.horizontal li.sfhover #tabbed_dropdown_menu {
   left: 12px;
   top: 100%;
   z-index: 30;
   padding: 5px 10px 5px 10px;
   /*    -moz-border-bottom-left-radius: 10px;
   -moz-border-bottom-right-radius: 10px;
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px; */
   border-radius: 10px;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
   text-align: left;
   cursor: default;
}



.page_history_menu.page_history_open{
	display:flex;
}

.page_history_menu{
	display:none;
	min-width:250px;
	width: max-content;
	height: fit-content;
	background: #FFFFFF;
	border-radius: 5px;
	position: absolute;
	z-index:100;
	flex-direction: column;
	justify-content: center;
	padding:10px;
	left:10px;
	box-shadow:var(--box_shadow);

}

.page_history_button_container {
	display:flex;
	gap:10px;
	padding: 5px;
	border-radius: 5px;
	pointer-events: none;
}

.page_history_button_container:hover {
	background: #E8E8E8;
}

.page_history_menu_button, .page_history_menu_button:hover {
	color: var(--font_grey);
	pointer-events: auto;
}

.page_history_icon {
	width: 16px;
	height: 16px;
}

#navigator.navigator_expanded + #shiftedcontent .tabbed_dropdown.horizontal li.sfhover #tabbed_dropdown_menu_items {
   column-count: 6;
}

.tabbed_dropdown.horizontal li.sfhover #tabbed_dropdown_menu_items {
   column-count: 8;
}

.tabbed_dropdown #tabbed_dropdown_menu_items {
   padding-top: 5px;
}

.tabbed_dropdown.horizontal li ul li {
   display: block;
   /* display: inline-block; */
   border: none;
   background: white;
   /* float: left; */
   /* padding-right: 20px;
   padding-bottom: 10px;
   padding-top: 6px; */

}

.tabbed_dropdown.horizontal li ul li.closetabs {
   position: absolute;
   top: 0px;
   right: 12.5px;
   padding-top: 20px;
}

.tabbed_dropdown.horizontal li ul li.edittabs {
   position: absolute;
   /* bottom: 0px; */
   top: 12.5px;
   right: 15px;
   /* padding-right: 13px;
   margin-top: 7.5px; */
}

.tabbed_dropdown.horizontal li ul li.edittabs a {
   padding-top: 3px;
   padding-bottom: 3px;
   padding-left: 4px;
   padding-right: 4px;
}

/*** tabbed dropdown vertical ***/

.tabbed_dropdown.vertical {
   display: inline;
   /*  position:relative; */
}

.tabbed_dropdown.vertical #tabbed_dropdown_menu > li:nth-child(1) {
   width: 125px !important;
}

.tabbed_dropdown.vertical #tabbed_dropdown_menu #toggle_tabs_vertical {
   float: none;
   display: inline-block;
   margin-left: 9.5px;
   margin-top: 10px;
}

.tabbed_dropdown.vertical li {
   margin-top: 5px;
}

.tabbed_dropdown.vertical li #tabbed_dropdown_menu {
   display: block;
   width: 95%;
   /*   border:solid 1px #E7F1FB; */
   width: 200px;
   /* height: 500px !important;*/
   overflow-y: scroll !important;
   position: absolute;
   top: -9999px;
   right: 30px;
   /* left:-9999px; */
   background: white;
   z-index: -10;
   max-height: 500px;
}

.tabbed_dropdown.vertical li.sfhover #tabbed_dropdown_menu {
   top: 100%;
   z-index: 30;
   right: 15px;
   padding: 0px 10px 5px 10px;
   /*  -moz-border-bottom-left-radius:10px;
   -moz-border-bottom-right-radius:10px;
   border-bottom-left-radius:10px;
   border-bottom-right-radius:10px; */
   border-radius: 10px;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
   cursor: default;
}

.tabbed_dropdown.vertical li ul li {
   width: 175px;
   display: block;
   border: none;
   background: white;
   float: left;
   /*    padding-right:20px;
   padding-bottom:10px; */
}

.tabbed_dropdown.vertical li ul li a {
   display: block;
   padding-top: 7.5px;
   padding-bottom: 5px;
}

.tabbed_dropdown.vertical li ul li a img {
   vertical-align: top;
   margin-right: 5px;
}

.tabbed_dropdown.vertical li ul li.closetabs {
   position: sticky;
   top: 0px;
   cursor: pointer;
   right: 0px;
   float: right;
   width: 10px;
   margin: 0px;
   padding-top: 40px;
}

.tabbed_dropdown.vertical li ul li.edittabs {
   position: sticky;
   bottom: 10px;
   right: -50px;
   width: 24px;
   float: right;
   padding: 0;
}

/** first LI in tab drop down **/
/* #tabbed_dropdown.vertical>li>ul>li:nth-child(2) {
   margin-top: 10px;
} */

#toggle_tabs_vertical {
   cursor: pointer;
   /* background-image: url(/images/icons/darkgrey/tabbedvertical.svg);
   background-repeat: no-repeat;
   background-size: 20px; */
   height: 24px;
   width: 24px;
   position: relative;
   transition: .25s ease;
   margin-top: 7.5px;
}

#toggle_tabs_vertical:hover {
   transform: rotate(90deg);
}

.tabbed_dropdown.horizontal #toggle_tabs_vertical {
   padding: 0;
   position: absolute;
   right: 40px;
   top: 3px;
   /* top: 30px; */ 
}

/* new subtab view dropdown */

.subtab_view_outer {
   text-align: right;
   position: relative;
   /* margin-top:-10px; */
   margin-bottom:30px;
   margin-left: auto;
   width: 300px;
   width: fit-content;
}

.subtab_view_button {
   background-color: var(--main_colour);
   color: #FFFFFF;
   vertical-align: middle;
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 5px;
   font-weight: bold;
   cursor: pointer;
   -webkit-user-select: none;        
   -moz-user-select: none; 
   -ms-user-select: none;
	width: 200px;
	width: max-content;
	margin-left: auto;
/*   width: auto;
   float: right;*/
}

.subtab_view_button:hover {
   background-color: var(--lighter_shade_1);
}

.subtab_view_button .subtab_view_image.psoda_icon {
   display: inline-block;
   height: 18px;
   width: 18px;
   /* border-radius: 50%; */
   vertical-align: middle;
   margin-right: 10px;
   margin-top: -3px;
   margin-left: 0px;
   /* margin-bottom: 5px; */
   /* background-color: var(--main_colour); */
   /* background-size: 18px;
   background-repeat: no-repeat;
   background-position: center; */
}

.subtab_view_button img {
   margin-left: 10px;
}

.subtab_view_button .psoda_icon {
   margin-left: 10px;
}

.gantt_view_button {
   background-color: #eaeaea;
	color: var(--font_grey) !important;
   vertical-align: middle;
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 5px;
   /* font-weight: bold; */
   cursor: pointer;
   -webkit-user-select: none;        
   -moz-user-select: none; 
   -ms-user-select: none;
	width: 200px;
	width: max-content;
	/* margin-left: auto; */
/*   width: auto;
   float: right;*/
}

.gantt_view_dropdown_button{
	float:left;
}

.gantt_selected_span{
	padding-left:10px;
	float:right;
}

.gantt_view_button:hover {
   background-color: #dddddd;

}

.gantt_view_button .gantt_view_image.psoda_icon {
   display: inline-block;
   height: 18px;
   width: 18px;
   /* border-radius: 50%; */
   vertical-align: middle;
   margin-right: 10px;
   margin-top: -3px;
   margin-left: 0px;
   /* margin-bottom: 5px; */
   /* background-color: var(--main_colour); */
   /* background-size: 18px;
   background-repeat: no-repeat;
   background-position: center; */
}

.gantt_view_button img {
   margin-left: 10px;
}

.gantt_view_button .psoda_icon {
   margin-left: 10px;
}

#table_view + #subtab_view_dropdown_outer #table_dropdown, 
#kanban_view + #subtab_view_dropdown_outer #kanban_dropdown,  
#kanban_v2_view + #subtab_view_dropdown_outer #kanban_v2_dropdown,  
#gantt_view + #subtab_view_dropdown_outer #gantt_dropdown,  
#interactive_gantt_view + #subtab_view_dropdown_outer #interactive_gantt_dropdown,  
#workload_view + #subtab_view_dropdown_outer #workload_dropdown,  
#chart_view + #subtab_view_dropdown_outer #chart_dropdown,  
#cumulative_diagram_view + #subtab_view_dropdown_outer #cumulative_diagram_dropdown,  
#kanban_photo_view + #subtab_view_dropdown_outer #kanban_photo_dropdown,  
#map_view + #subtab_view_dropdown_outer #map_dropdown,  
#overview_view + #subtab_view_dropdown_outer #overview_dropdown,  
#conversation_view + #subtab_view_dropdown_outer #conversation_dropdown,  
#cards_view + #subtab_view_dropdown_outer #cards_dropdown,  
#layout_view + #subtab_view_dropdown_outer #layout_dropdown,  
#basic_view + #subtab_view_dropdown_outer #basic_dropdown {
	font-weight: bold;
}

/* #table_view .subtab_view_image {
   background-image: url(/images/icons/white/table.svg);
}

#kanban_view .subtab_view_image {
   background-image: url(/images/icons/white/kanban.svg);
}

#kanban_v2_view .subtab_view_image {
   background-image: url(/images/icons/white/kanban.svg);
}

#gantt_view .subtab_view_image {
   background-image: url(/images/icons/white/gantt.svg);
}

#interactive_gantt_view .subtab_view_image {
   background-image: url(/images/icons/white/gantt.svg);
}

#workload_view .subtab_view_image {
   background-image: url(/images/icons/white/workload.svg);
}

#chart_view .subtab_view_image {
   background-image: url(/images/icons/white/chart.svg);
}

#cumulative_diagram_view .subtab_view_image {
   background-image: url(/images/icons/white/chart.svg);
}

#kanban_photo_view .subtab_view_image {
   background-image: url(/images/icons/white/camera.svg);
}

#map_view .subtab_view_image {
   background-image: url(/images/icons/white/visualise.svg);
}

#overview_view .subtab_view_image {
   background-image: url(/images/icons/white/report.svg);
}

#conversation_view .subtab_view_image {
   background-image: url(/images/icons/white/comment.svg);
}

#cards_view .subtab_view_image {
   background-image: url(/images/icons/white/vcard.svg);
}

#layout_view .subtab_view_image {
   background-image: url(/images/icons/white/dashboard.svg);
}

#basic_view .subtab_view_image {
   background-image: url(/images/icons/white/move.svg);
} */


.load_scenario_container {
	display:inline-block;
	opacity:0.5;
	pointer-events: none;
	position: absolute;
	margin-top: -57px;
}

.load_scenario_container .save_dashboard_button {
	margin-top: -6px;
}

#gantt_div.scenarios_chart {
	margin-top: -25px;
}

.tabbed_control_content .collapse_table_container:nth-child(1) + .saved_tables_outer {
	margin-top: -40px;
}

.saved_tables_outer {
   display: inline-block;
   position: absolute;
   margin-top: -35px;
   margin-left: 100px;
}

.group_by_outer {
   display: inline-block;
   position: absolute;
   margin-top: -40px;
   margin-left: 220px;
}

.displaylist_title ~ .group_by_outer {
	margin-top: -35px;
}

.risk_map_button ~ .saved_tables_outer {
   margin-top: -22px;
   margin-left: 10px;
}

.displaylist_title_riskmap_nosubview + .risk_map_button ~ .saved_tables_outer {
   margin-left: 220px;
   margin-top: -40px;
}

.subtab_view_outer_with_gantt ~ .saved_tables_outer {
   margin-top: -84px;
}


.save_dashboard_button, .save_table_button{
	float:left;
	margin-left:10px;
   background-color: #eaeaea;
   padding-top: 5px;
   padding-bottom: 1px;
   padding-left: 5px;
   padding-right: 5px;
   border-radius: 5px;
   cursor: pointer;
   margin-top: -6px;
}

.save_dashboard_button:hover, .save_table_button:hover {
   background-color: #dddddd;
}

.save_dashboard_button {
   margin-top: 5px;
}

.save_table_button {
   margin-top: 10px;
   /* margin-right: 20px; */
}

.load_table_button {
   margin-top: 15px;
   font-size:10pt;
}

.layout_dashlet .load_table_button {
   margin-top: 10px;
}

.layout_dashlet .save_table_button {
   margin-top: 5px;
}

.save_dashboard_button:hover, .save_dashboard_button:hover {
   background-color: #dddddd;
}

.save_dashboard_button div, .save_table_button div {
   display: inline-block;
   margin-left: 10px;
   color: var(--font_grey);
   vertical-align: middle;
}

.save_dashboard_button img, .save_table_button img {
   vertical-align: middle;
}

.load_dashboard_outer, .load_table_outer, .load_scenarios_outer,.load_table_button {
	margin-left:10px;
   text-align: left;
   position: relative;
   float:left;
   font-weight: bold;
   cursor: pointer;
}

.load_dashboard_outer {
   margin-left: 140px;
   margin-top: 8px;
}

.load_dashboard_outer.load_dashboard_outer_layout {
   margin-left:10px;
}

.load_scenarios_outer {
   margin-left: 20px;
}


.filter_separator {
	transform: scale(2, 3);
    display: inline-block;
    margin-right: 20px;
    padding-bottom: 6px;
	margin-left: 20px;
}

.load_dashboard_outer_arrow,.load_table_outer_arrow {
	margin-left: 5px;
   vertical-align: top;
   pointer-events: none;
}

#load_dashboard_dropdown_outer,#load_table_dropdown_outer,#load_group_by_dropdown_outer {
   width: 420px;
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 10px;
   padding-bottom: 10px;
   background: white;
   -moz-box-shadow: var(--box_shadow);
    -webkit-box-shadow: var(--box_shadow);
    box-shadow: var(--box_shadow);
    position: absolute;
    z-index: 20;  
    left: 0;
    display: none;
    top: 35px;
    border-radius: 10px;
    font-weight: 100;
    cursor: default;
}

#load_group_by_dropdown_outer {
	width:300px;
}

#load_dashboard_dropdown_outer>div,#load_table_dropdown_outer>div {
	/* margin-bottom:10px; */
}

#load_dashboard_dropdown_outer a, #load_table_dropdown_outer a,#load_group_by_dropdown_outer a {
	color: var(--font_grey);
}



#load_dashboard_dropdown_outer.open, #load_table_dropdown_outer.open, #load_group_by_dropdown_outer.open {
   display: block;
}


.load_dashboard_private, .load_dashboard_public, .load_table_private, .load_table_public {
   opacity: .75;
   width: 16px;
   height: 16px;
   margin-left:10px;
   margin-bottom: -2px;
}

.load_dashboard_dropdown_option > div, .load_table_dropdown_option > div,.load_group_by_dropdown_option > div  {
   width: 350px;
   display: inline-block;
   padding: 5px;
   border-radius: 5px;
   cursor:pointer;
}


.load_group_by_dropdown_option > div {
   width: 290px;
}

.table_group_by_selected {
	font-weight: bold;
}

.table_group_by_selected .psoda_icon {
	vertical-align:top;
	margin-left:5px;
	float: right;
}

.load_dashboard_dropdown_option > div:hover, .load_table_dropdown_option > div:hover {
   background-color: #f7f7f7;
}

.load_dashboard_dropdown_option > div:hover, .load_group_by_dropdown_option > div:hover {
   background-color: #f7f7f7;
}



.load_dashboard_dropdown_option_delete, .load_table_dropdown_option_delete, .load_dashboard_dropdown_option_edit, .load_table_dropdown_option_edit {
   float: right;
}

.load_dashboard_dropdown_option_delete > div, .load_table_dropdown_option_delete > div {
   background-color: #F46464;
   padding-top: 2px;
   padding-left: 5px;
   padding-right: 5px;
   border-radius: 5px;
   margin-top: 4px;
}

.load_dashboard_dropdown_option_edit > div, .load_table_dropdown_option_edit > div {
   background-color: #eaeaea;
   padding-top: 2px;
   padding-left: 5px;
   padding-right: 5px;
   border-radius: 5px;
   margin-top: 4px;
   margin-right: 5px;
}

.load_dashboard_no_items, .load_table_no_items {
   text-align: center;
   padding: 10px;
}

.load_dashboard_no_items img, .load_table_no_items img {
   width: 300px;
   height: auto;
}

.load_dashboard_no_items_header, .load_dashboard_no_items_header {
   font-size: 1.25em;
   padding-top: 5px;
   padding-bottom: 5px;
}

.load_dashboard_no_items_text, .load_dashboard_no_items_text {
   font-size: .9em;
}

#saved_dashboard_filter, #saved_table_filter {
   width: 405px;
   border: 1px solid #eaeaea;
   padding: 5px;
   font-family: var(--font_family);
   float: left;
   border-radius: 5px;
   margin-bottom: 10px;
}

#subtab_view_dropdown_outer {
   width: 200px;
   padding-top: 10px;
   padding-bottom: 10px;
   padding-left: 5px;
   padding-right: 5px;
   background: white;
   -moz-box-shadow: var(--box_shadow);
    -webkit-box-shadow: var(--box_shadow);
    box-shadow: var(--box_shadow);
    position: absolute;
    z-index: 20;  
    right: 0;
    display: none;
    top: 35px;
    border-radius: 10px;
}

#subtab_view_dropdown_outer.open {
   display: block;
}

#table_view + #subtab_view_dropdown_outer {
   top: unset;
}

.subtab_view_dropdown {
   padding:10px;
   /* padding-left: 40px; */
   color: var(--font_grey);
   background-size: 20px 20px;
   background-repeat: no-repeat;
   background-position: 10px center;
   text-align: left;
   border-radius: 5px;
}

.subtab_view_dropdown:hover {
   background-color: #f7f7f7;
}

.subtab_view_dropdown .psoda_icon {
   margin-right: 10px;
}

.subtab_view_dropdown .subtab_view_dropdown_tick {
   margin-right: 0px;
   float: right;
}

.subtab_view_dropdown .subtab_view_dropdown_tick svg {
   vertical-align: middle;
}

#kanban_view ~ .toggle_gantt_container, #gantt_view ~ .toggle_gantt_container, #interactive_gantt_view ~ .toggle_gantt_container,
#workload_view ~ .toggle_gantt_container, #chart_view ~ .toggle_gantt_container, #kanban_photo_view ~ .toggle_gantt_container,  #cumulative_diagram_view ~ .toggle_gantt_container, #kanban_v2_view ~ .toggle_gantt_container {
   display: none;
}

#kanban_view, #gantt_view, #interactive_gantt_view, #workload_view, #chart_view, #kanban_photo_view, #kanban_v2_view {
   margin-bottom: -30px;
}

#gantt_view_dropdown_container {
	width: 200px;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 5px;
	padding-right: 5px;
	background: white;
	-moz-box-shadow: var(--box_shadow);
	-webkit-box-shadow: var(--box_shadow);
	box-shadow: var(--box_shadow);
	position: absolute;
	z-index: 20;
	/* right: 0; */
	display: none;
	/* top: 35px; */
	border-radius: 10px;
	bottom: -10px;
}

#gantt_view_dropdown_container.open {
   display: block;
}

#baseline_view + #gantt_view_dropdown_container {
   top: unset;
}

.gantt_view_dropdown {
   padding:10px;
   /* padding-left: 40px; */
   color: var(--font_grey);
   background-size: 20px 20px;
   background-repeat: no-repeat;
   background-position: 10px center;
   text-align: left;
   border-radius: 5px;
	cursor:pointer;
}

.gantt_view_dropdown:hover {
   background-color: #f7f7f7;
}

.gantt_view_dropdown .psoda_icon {
   margin-right: 10px;
}

.gantt_view_dropdown .gantt_view_dropdown_tick {
   margin-right: 0px;
   float: right;
}

.gantt_view_dropdown .gantt_view_dropdown_tick svg {
   vertical-align: middle;
}

#baseline_view ~ .toggle_gantt_container, #estimate_view ~ .toggle_gantt_container, #forecast_view ~ .toggle_gantt_container,
#actual_view ~ .toggle_gantt_container {
   display: none;
}

#baseline_view, #estimate_view, #forecast_view, #actual_view {
   margin-bottom: -30px;
}


/** pop-up tabs **/

.popupdialogue .unselected_tab .tab-right input {
   background: none;
   padding-right: 10px;
   padding-top: 10px;
   padding-bottom: 10px;
   padding-left: 30px;
   text-align: left;
   width: 100%;
}

/* .popupdialogue .tabbed_control_menu {
   margin-left: 0px;
} */

/**** Import ****/

#importerrors th {
   text-align:left;
   background:#BBBBBB;
}

#importerrors td {
   text-align:left;
   background:#dddddd;
}

#importtable th {
   text-align:left;
   background:#BBBBBB;
}

#importtable td {
   text-align:left;
   background:#dddddd;
}

/*** Portfolio plot ****/
.portfolio_plot {
   float:left;
   text-align:center;
   margin-left:10px;
   margin-right:10px;
   margin-bottom:20px;
}

/**** Footer ****/

#footerseperator {
    height: 0px;
    /* background: #848484;
    border-bottom: 1px solid #848484; */
}

#footercontact {
   color:#404040;
   padding-top:10px;
   padding-left:20px;
   padding-right:20px;
   float:left;
   font-size:0.8em;
   width:450px;
}

#footercontact a {
   color:#404040;
   background:#f9f9f9;
}

#footercontact h2 {
   display:inline-block;
   font-size:1.1em;
   margin-top:0px;
   margin-bottom:0px;
   padding-left:5px;
   padding-right:5px;
   background:#f9f9f9;
}

#footercontact p {
   margin-top:0px;
   padding-left:5px;
   padding-right:5px;
}

#footer {
   color:#404040;
   background:#f9f9f9;
   /* background-image:url(/images/footer_background.png);
   background-repeat:no-repeat;
   background-size:690px 94px;
   background-position:center 0px; */
   padding-top:10px;
   padding-right:20px;
   text-align:right;
   /* font-weight:bold; */
   font-size:0.8em;
   height:7em;
   padding-bottom: 20px;
}

#footer a {
   text-decoration:none;
   color:#404040;
}

#footermenu a {
   background:#f9f9f9;
   padding-left:5px;
   padding-right:5px;
}

#footermenu span {
   background:#f9f9f9;
   padding-left:5px;
   padding-right:5px;
}

#footermenu span span {
   padding-right:0px;
}

#wai {
   color:#8A0000;
}

.resize_corner {
   position:absolute;
   top:0px;
   left:0px;
   width:11px;
   height:11px;
   background-image:url(/images/icons/darkgrey/resize.svg);
   background-size:11px 11px;
   background-repeat:no-repeat;
   cursor:nw-resize;
}

#tab_container {
   margin: 0;
}

/********/
/* Wrap */
/********/
#wrap {
   overflow:auto;
   height:400px;
}

/****************/
/* Table freeze */
/****************/

table.freeze {
   display: none;
}

.freeze_table_placeholder {
   width: 100%;
}

/* version 1 */
.freezediv {
   position:relative;
}

.freeze_scrolldiv {
   overflow-y:scroll;
}

.freeze_toptable {
   background:white;
   position:absolute;
   top:0px;
   left:0px;
}

.freeze_toptable table {
   margin:0px;
}

.freeze_bottomtable {
   background:white;
/* position:absolute;
   bottom:0px;
   left:0px;*/
}

.freeze_bottomtable table {
   margin:0px;
}

.word_break{
   word-break: break-word;
}

/****************/
/* Table resize */
/****************/
.resize_header {
   position:relative;
   width:100%;
   height:100%;
}

.resize_handle {
   position:absolute;
   width:4px;
   height:calc(100% + 30px);
   /* top:-50%; */
   right:-5px;
   cursor:col-resize;
   border-radius: 4px;
}

#debug {
   display:none;
   position:fixed;
   border:1px solid red;
   padding:10px;
   background:#FFFF88;
   top:0px;
   left:400px;
}

/*****************/
/* User calendar */
/*****************/

.large_calendar {
   width:100%;
   border-collapse:collapse;
}

.large_calendar th {
    vertical-align:top;
    padding-bottom: 10px;
    padding-top: 10px;
}

.large_calendar td {
   border: 1px solid #eaeaea;
   vertical-align:top;
   height: 150px;
   padding: 0;
   width: 14%;
}

.large_calendar .other_month .calender_day_string {
   color:#BBBBBB;
}

.large_calendar .selected_date {
   background:#69ce7f !important;
}

.large_calendar .today .calender_day_string {
    color: #fff;
    border-radius: 10px;
   padding-left: 10px;
    padding-right: 10px;
}

.large_calendar .calender_day_string {
   color: var(--font_grey);
   display:block;
   float:left;
   text-align:center;
   margin-top:10px;
   margin-left: 10px;
   margin-bottom: 8px;
   pointer-events: none;
}

.large_calendar .date {
   display:block;
   width:100%;
   height: 100%;
   max-height: 150px;
   overflow: auto;
   cursor: pointer;
   border: 1px solid transparent;
}

.large_calendar .date::-webkit-scrollbar, .calendar_day_container::-webkit-scrollbar {
   width: 5px;
   height: 5px;
}

.large_calendar .date:hover {
   background-color: #eaeaea;
}

.large_calendar .holiday {
   background: #F2F2F2;
}

.large_calendar .holiday .calender_day_string {
   display: inline-block;
}

.large_calendar .holiday img {
   display: inline-block;
   vertical-align: sub;
}

.large_calendar .holiday .calendar_public_holiday {
   display: inline-block;
   vertical-align: middle;
   font-size: .8em;
   width: calc(99% - 31px);
   font-weight: bold;
   margin-top: 10px;
   margin-left: 5px;
   color: var(--main_colour);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.calendar_tab_top_container {
   margin-bottom: 30px;
}

.calendar_tab_current_month, .calendar_tab_current_year {
   font-size: 1.75em;
   display: inline-block;
   vertical-align: middle;
   font-weight: bold;
   cursor: pointer;
   border: none;
   background: transparent;
   min-width: 0px;
   padding: 0;
}

.calendar_tab_current_month:hover, .calendar_tab_current_year:hover {
   color: #202329;
}

.calendar_tab_current_year + img {
   width: 8px;
   height: 8px;
   padding-left: 5px;
   margin-top: 5px;
   vertical-align: sub;
}

.calendar_tab_prev_month, .calendar_tab_next_month {
   display: inline-block;
   vertical-align: middle;
   width: 20px;
   height: 20px;
   border-radius: 20px;
	pointer-events: none;
   /* background-size: 5px;
   background-position: center;
   background-repeat: no-repeat; */
}

.calendar_tab_prev_month svg, .calendar_tab_next_month svg {
	padding: 5px;
}

.calendar_tab_prev_month {
   margin-right: 20px;
	transform: rotate(90deg);
   /* background-image:url(/images/left_arrow_night.svg); */
}

.calendar_tab_next_month {
   margin-left: 20px;
	transform: rotate(-90deg);
   /* background-image:url(/images/right_arrow_night.svg); */
}

.calendar_today {
   display: inline-block;
   vertical-align: middle;
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 20px;
   padding-right: 20px;
   border-radius: 3px;
   font-weight: bold;
   font-size: 0.9em;
   margin-left: 20px;
	pointer-events: none;
}

.calendar_tab_toggles {
   float: right;
   vertical-align: middle;
   margin-top: 4px;
}

.calendar_layer {
   display: inline-block;
   vertical-align: middle;
   background-color: var(--lightest_shade_2);
   padding-top: 2.5px;
   padding-bottom: 2.5px;
   width:125px;
   border-radius: 3px;
   color: #fff;
   /* font-weight: bold; */
   font-size: 0.9em;
   /* text-transform: uppercase; */
   margin-left: 20px;
	pointer-events: none;
}

.calendar_layer_show {
	font-weight: bold;
}

.calendar_layer img, .calendar_layer div {
   display: inline-block;
   vertical-align: top;
}

.calendar_layer .calendar_layer_icon {
   float: right;
   margin-right: 10px;
}

.calendar_layer .calendar_layer_tick {
   margin-left: 10px;
}

.calendar_layer div {
   margin-left: 5px;
   text-align: left;
}

.calendar_layer.calendar_actions, .calender_item.calendar_actions  {
   background-color: #303030;
   border: none;
   /* background-color: #EBEBEB;
   border: 1px solid #EBEBEB;
   border-left: 3px solid #303030;
   color: var(--font); */
}

.calendar_layer.calendar_tasks, .calender_item.calendar_tasks {
   background-color: #828282;
   border: none;
   /* background-color: #F3F3F3;
   border: 1px solid #F3F3F3;
   border-left: 3px solid #828282;
   color: #828282; */
}

.calendar_layer.calendar_milestones, .calender_item.calendar_milestones  {
   background-color: #F2B126;
   border: none;
   /* background-color: #FEF8EB;
   border: 1px solid #FEF8EB;
   border-left: 3px solid #F2B126;
   color: #F2B126; */
}

.calendar_layer.calendar_meetings, .calender_item.calendar_meetings  {
   background-color: #475f83;
   border: none;
   /* background-color: #EDEFF3;
   border: 1px solid #EDEFF3;
   border-left: 3px solid #475f83;
   color: #475f83; */
}



.calendar_layer.calendar_risks{ 
   background-color: #F46464;
   border: none;
}

.calender_item.calendar_risks {
   background-color: #F46464;
   border: none;
}

.calendar_layer.calendar_leave {
   background-color: #F46464;
   border: none;
}

.calender_item.calendar_leave  {
   /* background-color: #F46464;
   border: 1px solid #F46464; */
   /* background-color: #FEF0F0;
   border: 1px solid #FEF0F0;
   border-left: 3px solid #F46464;
   color: #F46464; */
   color: var(--font_grey);
   background: none;
}

.calender_item.calendar_leave a {
   font-weight: 100;
   font-size: 1em;
   color: var(--font_link);
}

.calender_item.calendar_leave a:hover {
   color: var(--font_link_hover);
}

.calendar_layer.calendar_layer_hide {
   border: none;
   background-color: #eaeaea !important;
   color: #A3A3A3;
   opacity: 1;
}

.calendar_layer.calendar_layer_hide div {
   margin-left: 15px;
}

.calendar_layer_hide .psoda_icon {
	opacity: .5;
}

.large_calendar th {
   font-weight: normal;
}


.calendar_risk_row {
	display:flex;
	justify-content: space-between;
	margin-top: 5px;
	width:250px;
}


.risk_overall_header_div {
	font-weight: bold;
}

/* .large_calendar .today {
   background-color: var(--lightest_shade_2) !important;
}

.large_calendar .today a:hover {
   background-color: #b5bfd3 !important;
} */

.calendar_today_text {
   text-transform: uppercase;
   font-weight: bold;
   color: var(--main_colour);
   font-size: .9em;
   padding-top: 11px;
   padding-left: 50px;
   pointer-events: none;
}

.large_calendar th.calendar_todays_day {
   font-weight: bold;
}

.calender_item {
   display: inline-block;
   vertical-align: middle;
   background-color: var(--lightest_shade_2);
   padding-top: 2.5px;
   padding-bottom: 2.5px;
   padding-left: 5px;
   padding-right:5px;
   width:calc(99% - 20px);
   border-radius: 3px;
   color: #fff;
   margin-left: 5px;
   margin-bottom: 3px;
   display: -webkit-box;
   overflow: hidden;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
	font-size: 0.9em;
}

.calender_item .calendar_item_icon {
   margin-right: 5px;
   display: inline-block;
   vertical-align: sub;
}

.calender_item a {
   margin-right: 5px;
   font-weight: bold;
   color: #B3D6FF;
   font-size: 0.7em;
}

.calender_item a:hover {
   color: #80abdd;
}

/* Calendar day side popup */
.calendar_day_container {
   height: 100vh;
   width: 400px;
   position: fixed;
   background: #fff;
   top: 0;
   right: 0;
   z-index: 1000;
   box-shadow: 10px 0px 15px #242424;
   overflow: auto;
   border-right: 5px solid #fff;
}

.calendar_day_header {
   float: left;
   vertical-align: top;
   margin-top: 40px;
   margin-left: 30px;
}

.calendar_day_text {
   font-size: 1.5em;
}

.calendar_day_date_text {
   font-size: 2.25em;
   font-weight: bold;
}

.calendar_day_close_button {
   float: right;
   vertical-align: top;
   margin-top: 40px;
   margin-right: 30px;
   width: 30px;
   height: 30px;
   /* background-image: url(/images/popup_x_grey.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 30px; */
   border-radius: 30px;
   cursor: pointer;
}

.calendar_day_close_button svg {
	padding: 7.5px;
}

.calendar_day_close_button:hover {
   background-color: #eaeaea;
}

.large_calendar td .calendar_day_selected {
   border: 1px solid var(--main_colour);
}

.large_calendar td .calendar_day_selected .calender_day_string {
   background-color: var(--main_colour);
   color: #fff;
   font-weight: bold;
   margin-top: 0px;
   margin-left: 0px;
   margin-bottom: 4px;
   padding-top: 10px;
   padding-left: 10px;
   padding-bottom: 4px;
   width: calc(100% - 10px);
   text-align: left;
}

.large_calendar td.today .calendar_day_selected .calender_day_string {
   border-radius: 0px;
}

.large_calendar td .calendar_day_selected .calendar_today_text {
   position: absolute;
   color: #fff;
}

.calendar_day_container .calendar_items_all {
   margin-top: 125px;
   padding-left: 30px;
   padding-right: 30px;
}

.calendar_day_container .calendar_item_container {
   margin-bottom: 20px;
   font-size: .9em;
}

.calendar_day_container .calendar_item_header {
   width: 100%;
   padding-bottom: 3px;
   border-bottom: 1px solid #eaeaea;
}

.calendar_day_container .calendar_item_content {
   max-width: 250px;
   display: inline-block;
   vertical-align: middle;
   word-break: break-word;
}

.calendar_day_container .calendar_item_view {
   float: right;
   vertical-align: middle;
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 20px;
   padding-right: 20px;
   border-radius: 3px;
   font-weight: bold;
   font-size: 0.9em;
   margin-top: 7px;
}

.calendar_day_container .calendar_item_time {
   display: inline-block;
   vertical-align: middle;
   font-weight: bold;
}

.calendar_day_container .calendar_item_type {
   display: inline-block;
   vertical-align: baseline;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-weight: bold;
   color: #fff;
   font-size: .75em;
   margin-left: 10px;
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 10px;
   /* margin-top: -5px;
   margin-bottom: 2px; */
   padding-top: 2px;
   padding-bottom: 2px;
   background-color: #828282;
}

.calendar_day_container .calendar_item_type.calendar_item_type_Action {
   background-color: var(--font);
}

.calendar_day_container .calendar_item_type.calendar_item_type_Task {
   background-color: #828282;
}

.calendar_day_container .calendar_item_type.calendar_item_type_Milestone {
   background-color: #F2B126;
}

.calendar_day_container .calendar_item_type.calendar_item_type_Meeting {
   background-color: #475f83;
}

.calendar_day_container .calendar_item_type.calendar_item_type_Leave {
   background-color: #F46464;
}

.calendar_day_container .calendar_item_icon {
   display: inline-block;
   vertical-align: top;
   width: 14px;
   height: 14px;
   margin-top: 10px;
   margin-right: 5px;

}

.calendar_day_container .calendar_item_title {
   display: inline-block;
   margin-top: 10px;
   max-width: 225px;
   font-weight: bold;
}

.calendar_day_container .calendar_item_title a {
   margin-right: 5px;
}

.calendar_day_container .calendar_item_descr {
   margin-top: 5px;
}

.calendar_day_empty {
   width: 250px;
   margin: auto;
   text-align: center;
}

.calendar_day_empty div {
   font-size: 2em;
   margin-top: -30px;
}


/* Extra content for specific assets on calendar side popup */
.calendar_item_left_track, .calendar_item_right_track {
   position: absolute;
   height: 10px;
   width: 10px;
   background: #ffffff;
   top: -6.5px;
   border-radius: 20px;
   z-index: 2;
   border: 5px solid #d6d6d6;
}

.calendar_item_right_track {
   right: 0;
}

.calendar_item_track, .calendar_item_track_dates {
   position: relative;
   width: 340px;
   margin-top: 15px;
}

.calendar_item_under_track {
   background: rgba(0, 0, 0, 0.15);
   height: 7px;
   width: 100%;
   border-radius: 7px;
   position: absolute;
   left: 0;
   top: 0;
}

.calendar_item_left_track_date, .calendar_item_right_track_date {
   position: absolute;
   top: 15px;
   font-size: 0.75em;
}

.calendar_item_right_track_date {
   right: 0;
}

.calendar_item_leave_user {
   margin-top: 5px;
}

.calendar_item_track_number {
   background-color: #4EC66A;
   display: inline-block;
    vertical-align: baseline;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: bold;
    color: #fff;
    font-size: .75em;
    margin-left: 125px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 10px;
    padding-top: 2px;
    padding-bottom: 2px;
    margin-top: 15px;
    text-align: center;
    width: 75px;
}

.meeting_loc_dur_div {
   margin-top: 5px;
}

.meeting_duration_div, .meeting_location_div {
   display: inline-block;
   margin-right: 20px;
}

.meeting_duration_div img, .meeting_location_div img {
   margin-right: 7.5px;
   vertical-align: sub;
}

.meeting_required_header_div {
   margin-right: 5px;
   font-weight: bold;
   text-transform: uppercase;
   font-size: .9em;
   display: inline-block;
   vertical-align: sub;
}

.calender_item_creator_div {
   margin-top: 5px;
}

.calender_item_inner_creator_div img {
   width: 24px;
   height: 24px;
}

.calender_item_inner_creator_div .status_state {
   margin-left: 16px;
   border: 1px solid #fff;
   width: 6px;
   height: 6px;
}

.calendar_item_users span {
   display: none;
}

.calendar_item_users {
   margin-top: 5px;
}

.calendar_item_users .status_state {
   margin-left: 16px;
   border: none;
}

.calendar_item_allocated_users .status_state {
   margin-left: 26px;
   top: 10px;
   border: 1px solid #fff;
   width: 6px;
   height: 6px;
}

.task_detailed_div {
   margin-top: 5px;
}

.task_detailed_div div {
   display: inline-block;
   margin-right: 15px;
   text-align: center;
   vertical-align: middle;

}

.task_current_state_div {
   display: inline-block;
    vertical-align: baseline;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: bold;
    color: #fff;
    font-size: .75em;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 10px;
    padding-top: 2px;
    padding-bottom: 2px;
}

.action_creator_div, .action_priority_div {
   display: inline-block;
   vertical-align: middle;
   margin-right: 30px;
   margin-top: 5px;
}

.milestone_dates_div {
   margin-top: 10px;
   width: 350px;
}

.milestone_date_div {
   display: inline-block;
   text-align: center;
   width: 24%;
   vertical-align: middle;
}

.milestone_date_header_div {
   font-weight: bold;
}





/* .small_calendar {
   font-size:0.8em;
   border-collapse:collapse;
   margin-right:10px;
}

.small_calendar img {
    vertical-align: -15%;
    margin-left: 5px;
    margin-right: 5px;
}

.small_calendar th {
   text-align:center;
   padding-left:3px;
   padding-right:3px;
   border:none;
}

.small_calendar td {
   text-align:center;
   padding-left:3px;
   padding-right:3px;
   border:none;
}

.small_calendar a {
   color: var(--font_grey);
   border:none;
}

.small_calendar .other_month a {
   color:#BBBBBB;
   border:none;
}

.small_calendar .selected_date {
   background:#BBBBBB;
}

.small_calendar .today a {
    background-color: #ffbf7d;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 2px;
    padding-bottom: 2px;
}

.layers {
   margin-right:10px;
}

.layers img {
   vertical-align:-25%;
}

.layers a {
   color: var(--font_grey);
}

.layers a:hover {
   text-decoration:none;
}

.layer_purple {
   background:#FFBBFF;
   border:1px solid #FFBBFF;
   padding-left:10px;
   padding-top:5px;
   padding-bottom:5px;
   margin-bottom:10px;
}

.layer_blue {
   background:#DDDDFF;
   border:1px solid #DDDDFF;
   padding-left:10px;
   padding-top:5px;
   padding-bottom:5px;
   margin-bottom:10px;
}

.layer_yellow {
   background:#f7f7a3;
   border:1px solid #f7f7a3;
   padding-left:10px;
   padding-top:5px;
   padding-bottom:5px;
   margin-bottom:10px;
}

.layer_cyan {
   background:#BBFFFF;
   border:1px solid #BBFFFF;
    padding-left:10px;
   padding-top:5px;
   padding-bottom:5px;
   margin-bottom:10px;
}

.layer_red {
   background:#FFBBBB;
   border:1px solid #FFBBBB;
    padding-left:10px;
   padding-top:5px;
   padding-bottom:5px;
   margin-bottom:10px;
}

.layer_green {
   background:#BBFFBB;
   border:1px solid #BBFFBB;
    padding-left:10px;
   padding-top:5px;
   padding-bottom:5px;
   margin-bottom:10px;
}

.layer_amber {
   background:#FFC080;
   border:1px solid #FFC080;
    padding-left:10px;
   padding-top:5px;
   padding-bottom:5px;
   margin-bottom:10px;
} */


/***************/
/* Date picker */
/***************/

.popup #datepicker {
   position: absolute !important;
   left: 200px !important;
}

#datepicker {
    visibility: visible;
    position: absolute;
    left: 850px;
    top: 420px;
    display: block;
    z-index: 10000;
}

#datepicker table {
   background:initial;
   border-collapse:initial;
   border-spacing:0px;
   /* width:initial; */
   -webkit-border-radius:10px;
   -moz-border-radius:10px;
   border-radius:10px;
   -webkit-box-shadow:initial;
   -moz-box-shadow:initial;
   box-shadow:initial;
}

#datepicker tr:hover {
   background:inital;
}

#datepicker tr.even {
   background:initial;
}

#datepicker tr.even:hover {
   background:intial;
}

#datepicker td {
   vertical-align:initial;
   padding-left:10px;
   padding-right:10px;
   padding-top:10px;
   padding-bottom:10px;
   background-color:inherit;
   background: #ffffff; 
   border-radius: 5px;
}

#datepicker>table>tbody>tr>td {
    padding: 0px;
    border-radius: 10px;
}

#datepicker th {
   padding-left:initial;
   padding-right:initial;
   padding-top:initial;
   padding-bottom:initial;
   background:initial;
   color:initial;
/*   background-image:url(/images/normal/table_header.png);
   background-repeat:repeat-x;
   background-position:center;
   background-size:100% 100%;*/
   border-right:initial;
   vertical-align:initial;
   font-weight:initial;
   text-align:initial;
   position:initial;
   z-index:initial;
}

#datepicker th:hover {
   background:var(--main_colour);
   border-right:initial;
}

#datepicker th.sortfield {
   background:var(--main_colour);
   /*background-image:url(/images/normal/table_header_sorted.png);
   background-repeat:repeat-x;
   background-position:center;
   background-size:100% 100%;*/
   border-right:initial;
}

#datepicker th a {
   color:white;
   text-decoration:none;
   font-weight:100;
}

#datepicker img {
   border:none;
   margin-right:3px;
}


/* the div that holds the date picker calendar */

.dpDiv {}


/* the table (within the div) that holds the date picker calendar */

.dpTable {
    font-family: var(--font_family);
    font-size: 15px;
    text-align: center;
    padding: 7px;
    width: 300px;
    height: 300px;
    /* border: 1px solid #3b679e; */
    /* box-shadow: 0px 0px 10px #d6d6d6; */
}

.dpTableHeader {
    height: 70px;
    background: var(--main_colour) !important;
}

.dpTableOuter {
    box-shadow: var(--box_shadow) !important;
    width: 300px !important;
    height: 370px !important;
    border-spacing: 0px !important;
    padding-left: 0px;
}


/* a table row that holds date numbers (either blank or 1-31) */

.dpTR:hover {
}


/* the top table row that holds the month, year, and forward/backward buttons */

.dpTitleTR {
}


/* the second table row, that holds the names of days of the week (Mo, Tu, We, etc.) */

.dpDayTR {
}


/* the bottom table row, that has the "This Month" and "Close" buttons */

.dpTodayButtonTR {}


/* a table cell that holds a date number (either blank or 1-31) */

.dpTD:hover {
}


/* a table cell that holds a highlighted day (usually either today's date or the current date field value) */

.dpDayHighlightTD {
    border: 1px solid var(--main_colour);
    color: white;
}


/* the date number table cell that the mouse pointer is currently over (you can use contrasting colors to make it apparent which cell is being hovered over) */

.dpTDHover {
    background-color: var(--main_colour) !important;
    cursor: pointer;
    color: white;
}

.dpTDHover .dpDayHighlight {
   color: white;
   border: 1px solid var(--main_colour);
}


/* the table cell that holds the name of the month and the year */

.dpTitleTD {
   background: var(--main_colour) !important;
}


/* a table cell that holds one of the forward/backward buttons */

.dpButtonTD {
   background: var(--main_colour) !important;
}


/* the table cell that holds the "This Month" or "Close" button at the bottom */

.dpTodayButtonTD {}


/* a table cell that holds the names of days of the week (Mo, Tu, We, etc.) */

.dpDayTD {
    /* background-color: #6D99C0;
    border: 1px solid #6D99C0; */
    color: #bcbcbc;
}


/* additional style information for the text that indicates the month and year */

.dpTitleText {
    font-size: 15px;
    color: var(--font_grey);
    font-weight: bold;
}


/* additional style information for the cell that holds a highlighted day (usually either today's date or the current date field value) */

.dpDayHighlight {
    color: var(--main_colour);
    font-weight: bold;
}


/* the forward/backward buttons at the top */

.dpButton {
    font-family: var(--font_family);
    font-size: 18px;
    color: var(--font_grey);
    /* background: #eaeaea; */
    font-weight: bold;
    /* padding: 5px 0px 0px 0px; */
    /* height: 20px; */
    border: none;
    cursor: pointer;
    color: white;
}


/* the "This Month" and "Close" buttons at the bottom */

.dpTodayButton {
    font-family: var(--font_family);
    font-size: 15px;
    color: var(--font_grey);
    margin-left: 5px;
    /* border: 1px solid #97B4CE; */
    /* background: #97B4CE; */
    padding-left: 10px;
    padding-right: 10px;
    cursor: pointer;
    color: var(--main_colour);
    display: inline;
    /*  font-weight: bold; */
}


/*today button*/


/* #datepicker>table>tbody>tr:nth-child(2)>td>table>tbody>tr.dpTodayButtonTR>td>div:nth-child(1) {
    background-color: #6D99C0;
    border: 1px solid #6D99C0;
    color: white;
    border-radius: 5px;
    display: inline;
} */


/*close button*/


/* #datepicker>table>tbody>tr:nth-child(2)>td>table>tbody>tr.dpTodayButtonTR>td>div:nth-child(2) {
    border: 1px solid #bbbbbb;
    color: white;
    background-color: #bbbbbb;
    border-radius: 5px;
    display: inline;
} */


/**in popups - buttons next to input fields **/

#createmilestone_original_date>a:nth-child(3)>img {
    margin-left: 10px;
    margin-right: 5px;
}


/**adding padding to calander and help icon in pop-ups next to input fields **/

.popup_calendar_icon {
    margin-left: 10px;
    margin-right: 2px;
    padding: 3px;
    /* margin-bottom: -2px; */
    vertical-align: middle;
    cursor: pointer;
}

.date_field_dropdown {
   min-width: 100px;
   max-width: 175px;
   margin-right: 10px;
}


/** dependency reference icons **/

#createdependency_customfield_reference>input[type="image"]:nth-child(3) {
    margin-left: 10px;
    margin-right: 5px;
}

input#reference+input[type="image"] {
    margin-left: 10px;
    margin-right: 5px;
    margin-bottom: -1px;
}

#dpYearSelect {
    border: none;
    min-width: 50px;
    background: transparent;
    color: white;
    font-family: var(--font_family);
    cursor: pointer;
    font-size: 16px;
    /* outline-color: transparent; */
}

#dpYearSelect option {
    color: black;
}

#dpMonthSelect {
    border: none;
    min-width: 50px;
    background: transparent;
    color: white;
    font-family: var(--font_family);
    cursor: pointer;
    font-size: 16px;
    /* outline-color: transparent; */
}

#dpMonthSelect option {
    color: black;
}

#dpMonthSelect:active,
#dpMonthSelect:hover {
    /* outline-color: transparent; */
}

#dpYearSelect:active,
#dpYearSelect:hover {
    /* outline-color: transparent; */
}

#dpMonthSelect:focus, #dpYearSelect:focus {
   outline: solid black 2px !important;
   border-radius: 5px;
}

/* #createtaskgroup_reference > input[type="image"]:nth-child(3) */

/** Popup file upload styling **/

.popup input[type="file"] {
   width: 100%;
   height: 100%;
   opacity: 0;
   position: absolute;
   top: 0;
   left: 0;
   cursor: pointer;
}

.popup .file_upload_outer {
   width: 500px;
   border: 2px dashed #dddddd;
   border-radius: 5px;
   cursor: pointer;
   position: relative;
   text-align: center;
   padding-top: 30px;
   padding-bottom: 30px;
   margin-top: 5px;
}

.popup .file_upload_outer.file_upload_ondragover {
   border: 2px dashed var(--main_colour);
   background-color:var(--lightest_shade_1);
}


.popup .file_upload_img {
   height: 50px;
   width: auto;
}

.popup .file_upload_text {
   font-size: 1.3em;
   margin-top: 5px;
   overflow: hidden;
   text-overflow: ellipsis;
   padding-left: 5px;
   padding-right: 5px;
}

.popup .file_upload_text_or {
   font-size: .9em;
}

.popup .file_upload_button {
   background-color:var(--main_colour);
   display: inline-block;
   padding-left: 20px;
   padding-right: 20px;
   padding-top: 5px;
   padding-bottom: 5px;
   border-radius: 5px;
   color: #ffffff;
   margin-top: 5px;
}

.popup .file_upload_button.file_upload_with_camera {
   margin-left: -25px;
   margin-right: 35px;
}

.popup input[type="file"]:hover ~ .file_upload_button {
   background-color:var(--lighter_shade_1);
}

.popup .file_take_photo_button {
   position: absolute;
   left: 274px;
   bottom: 46px;
   padding: 5px;
   border-radius: 5px;
}

.popup .file_take_photo_button:hover {
   background-color: #eaeaea;
}

.popup .file_take_photo_button div {
   font-size: .7em;
   margin-top: -4px;
}

.popup .file_upload_text_details {
   margin-top: 5px;
   font-size: .9em;
   color: #8d8d8d;
}

.attachment_inline {
   display: inline-block;
   min-width: 50px;
   min-height: 50px;
   margin-bottom: 5px;
   margin-right: 5px;
   /* max-width: 75%; */
}

.attachment_inline img {
   /* width: 100%; */
}

.popup_camera_canvas_popup_upload {
   display: none;
   height: 50px;
   width: auto;
   margin: auto;
}

.inline_edit_attachment_outer {
   width: 200px;
   border: 2px dashed #dddddd;
   border-radius: 5px;
   cursor: pointer;
   position: relative;
   text-align: center;
   padding-top: 10px;
   padding-bottom: 10px;
   margin-top: 5px;
}

.inline_file_upload {
   width: 100%;
   height: 100%;
   opacity: 0;
   position: absolute;
   top: 0;
   left: 0;
   cursor: pointer;
}

.inline_file_upload:hover ~ .inline_file_upload_button {
   background-color:var(--lighter_shade_1);
}

.inline_edit_attachment_outer .inline_file_upload_button {
   background-color:var(--main_colour);
   display: inline-block;
   padding-left: 20px;
   padding-right: 20px;
   padding-top: 5px;
   padding-bottom: 5px;
   border-radius: 5px;
   color: #ffffff;
   margin-left: -77px;
   margin-right: 10px;
}

.inline_edit_attachment_outer .photo_button_outer {
   display: inline-block;
   font-size: .7em;
   position: absolute;
   width: 75px;
   text-align: left;
   vertical-align: middle;
   top: 11px;
   padding: 2.5px;
   border-radius: 5px;
}

.inline_edit_attachment_outer .photo_button_outer .psoda_icon {
   width: 20px;
   height: 20px;
   margin-right: 3px;
   margin-bottom: 2px;
   vertical-align: middle;
}

.inline_edit_attachment_outer .photo_button_outer:hover {
   background-color: #eaeaea;
}

.displaylist .inline_edit_attachment_outer .photo_button_outer:hover {
   background-color: #dddddd;
}

.inline_edit_attachment_outer.inline_edit_attachment_ondragover {
   border: 2px dashed var(--main_colour);
   background-color:var(--lightest_shade_1);
}

.inline_attachment_details {
   margin-bottom: 10px;
}

.inline_attachment_name {
   display: inline-block;
   vertical-align: middle;
   max-width: 150px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.details_section_element.details_full div.inline_attachment_details, .details_section_element.details_full div.inline_attachment_name, .details_section_element.details_full div.inline_attachment_size, .details_section_element.details_full div.inline_edit_attachment_outer, .details_section_element.details_full div.inline_file_upload_button, .details_section_element.details_full div.photo_button_outer {
   min-width: unset !important;
}

.inline_delete_photo_icon {
   cursor: pointer;
}

.inline_attachment_size {
   display: inline-block;
   font-size: .7em;
   color: #8b8b8b;
   margin-left: 10px;
   margin-right: 10px;
   vertical-align: middle;
}

.inline_attachment_details input {
   vertical-align: middle;
}

.existing_attachment_outer  {
   margin-top: 5px;
}

.existing_attachment_img {
   display: inline-block;
   vertical-align: middle;
   margin-right: 10px;
}

.existing_attachment_img img {
   min-width: 30px;
}

.existing_attachment_name {
   display: inline-block;
   vertical-align: middle;
   margin-right: 10px;
   max-width: 300px;
}

.existing_attachment_size {
   display: inline-block;
   vertical-align: middle;
   font-size: .9em;
   color: #8d8d8d;
   margin-right: 10px;
}

.existing_attachment_delete {
   display: inline-block;
   vertical-align: middle;
}

/* WILLS CSS  */
#fade {
    display: none;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: black;
    z-index: 1001;
    -moz-opacity: 0.8;
    opacity: .80;
    filter: alpha(opacity=80);
}

#light {
    display: none;
    position: absolute;
    width: 70%;
    top: 0%;
    left: 15%;
    z-index: 1002;
    overflow: visible;
}

#boxclose {
    float: right;
    cursor: pointer;
    color: #fff;
    font-size: 31px;
    display: inline-block;
    line-height: 0px;
    padding: 25px 3px;
    /* position: absolute; */
    right: 2px;
    /* top: -2%; */
    z-index: 1002;
    opacity: 0.9;
    text-decoration: none;
}

.boxclose:before {
    content: "×";
}

#fade:hover~#boxclose {
    display: none;
}

.video {
    width: 100%;
    height: auto;
}

#lightboxtitle {
    color: white;
    text-align: center;
    padding-top: 25px;
    font-size: 18px;
}


/* // browser, ipad landscape */


/* 
@media (max-width:1280px) and (max-height:721px) {
    #light {
        width: 75%;
    }
    #video-page {
        padding-left: 50px;
    }
} */



html {
    font-family: var(--font_family);
}

body {
    margin: 0;
}

#video-page {
    padding-top: 40px;
    padding-left: 20px;
    margin-left: auto;
    margin-right: auto;
    width: 85%;
    margin-bottom: 40px;
    overflow: auto;
    position: relative;
   min-height:85vh;
}

#header-DELETE {
    width: 100%;
    height: 74px;
    background-color: blue;
}

#library-header {
    display: inline-block;
}

#header-text {
    margin-top: 0;
    font-size: 1.5em;
    color: var(--font_grey);
    display: inline-block;
    font-weight: 100;
}

#library-footer {
    position: absolute;
    bottom: 22px;
    display: none;
}

#footer-text {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 1.5em;
    color: var(--font_grey);
    display: inline-block;
}

#header-description,
#footer-description {
    font-size: 1em;
    color: var(--font_grey);
    margin-top: 0;
    font-weight: 100;
}

#whats-new-header {
    font-size: 1.5em;
    color: #129b68;
    margin: 0;
}

#whats-new-description {
    font-size: 1em;
    color: #a5a5a5;
    margin: 0;
    margin-top: 10px;
}

#whats-new-container {
    float: right;
    width: 300px;
    padding-bottom: 22px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-bottom: 40px;
    display: inline-block;
    background-color: #efefef;
    border-left: 1px solid #919191;
   min-height:100vh;
}

#whats-new-content {
    margin: 20px;
}

#search-form {
    display: inline-block;
    margin-left: 550px;
}

#search-input {
    height: 30px;
    width: 200px;
    padding-left: 10px;
    border-radius: 5px;
    border: none;
    background-color: #efefef;
    /* background-image: url(/images/icons/darkgrey/search.svg);
    background-position: 175px 3px;
    background-repeat: no-repeat;
    background-size: 12%; */
}

#request-input {
    height: 30px;
    width: 500px;
    padding-left: 10px;
    border-radius: 5px;
    border: none;
    background-color: #efefef;
    min-height: 30px;
    overflow: hidden;
    resize: none;
    line-height: 30px;
}

#request-button {
    height: 30px;
    width: 60px;
    border-radius: 5px;
    border: none;
    background-color: #129b68;
    margin-left: 10px;
    color: white;
    font-family: var(--font_family);
    cursor: pointer;
}

#search-form ::placeholder,
#request-form ::placeholder {
    color: #adadad;
    font-family: var(--font_family);
}

#videos-container {
    width: 1000px;
    padding-bottom: 40px;
    border-left: 1px solid #919191;
    padding-left: 20px;
    min-height: 700px;
}

.vid-containers {
    width: 200px;
    height: 200px;
    margin-top: 20px;
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 10px;
    display: inline-block;
    cursor: pointer;
    overflow: hidden;
   position:relative;
}

.vid-containers:hover, .new-vid-containers:hover {
    transform: scale(1.025);
    transition: .5s ease;
}

.vid-containers.unreleased:hover {
    transform: scale(1);
}

.new-vid-containers {
    position:relative;
    display: inline-block;
    width: 200px;
    height: 200px;
    margin-left: 50px;
    margin-bottom: 29px;
    cursor: pointer;
    /* min-height: 650px; */
}


/* #vid-container-1,
#vid-container-5,
#vid-container-9 {
    margin-left: 40px;
} */

.thumbnails {
    width: 99%;
    display: block;
    height: auto;
   border:1px solid #eaeaea;
}

.video-titles {
    margin: 5px;
    font-size: 1.15em;
    text-align: center;
    color: var(--font_grey);
}

.video-descriptions {
    margin: 0;
    font-size: .75em;
    margin-bottom: 5px;
    margin-left: 5px;
    margin-right: 5px;
    color: #a5a5a5;
}


/* #new-vid-container-3,
#new-vid-container-2 {
    visibility: hidden;
} */

.new-video-descriptions {
    margin: 0;
    font-size: .85em;
    margin-bottom: 5px;
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 10px;
    color: #a5a5a5;
    text-align: left;
}


/* #vid-5-descr,
#vid-6-descr,
#vid-7-descr,
#vid-8-descr,
#vid-9-descr,
#vid-10-descr,
#vid-11-descr,
#vid-12-descr {
    visibility: hidden;
} */

.new_video {
    background-image: url(/images/video_library/new_icon.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    right: 5px;
    top: 5px;
    position: absolute;
    height: 50px;
    width: 50px;
}

.time {
    position: absolute;
    margin-top: 94px;
    margin-left: 150px;
    width: 40px;
    height: 15px;
    text-align: center;
    background-color: rgba(92, 92, 92, 0.75);
    color: white;
    font-size: 13px;
    padding-top: 2px;
    padding-bottom: 2px;
}

.change_video_button {
    cursor: pointer;
    color: #fff;
    font-size: 31px;
    /* display: inline-block; */
    line-height: 0px;
    padding: 11px 3px;
    position: absolute;
    top: 40%;
    z-index: 1002;
    opacity: 0.9;
}

.change_video_button:hover, #box_close:hover {
    color: #A0A0A0;
}

#prev_button {
    left: -5%;
    text-decoration: none;
}

#next_button {
    right: -5%;
    text-decoration: none;
}

.unreleased {
    cursor: default;
}


/* WILLS CSS END*/

/*LOGANS CSS START - Dashboard Layouts*/
.layout_dashboard {
	display: grid;
	padding-right: 7px;
	clear:left;
   padding-top: 35px;
}

.load_dashboard_outer ~ .layout_dashboard {
   padding-top: 15px;
}

.layout_section {
	display: grid;
	grid-template-columns: 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16%;
	display: -ms-grid;
	-ms-grid-columns: 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16% 4.16%;
	align-content: baseline;
	transition-property: opacity, margin-top;
	transition-duration: 0.25s;
}

.layout_dashlet_parent {
	opacity: inherit;
	padding-right: 10px;
	display: grid;
	position: relative;
}

.layout_dashlet {
	position: relative;
	margin-right: 10px;
	margin-bottom: 10px;
	opacity: inherit;
	width: 100%;
	transition-property: padding-bottom, margin-bottom;
	transition-duration: 0.25s;
}

.layout_dashlet_loading .psoda_icon {
	display: none;
}

.layout_dashlet_circle_loader {
	width: 20px;
	height: 20px;
	border-color: #505050 #505050 #505050 transparent;
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

[type=radio] + img {
	cursor: pointer;
	padding: 5px;
	margin: 5px;
}

[type=radio]:checked + img {
	outline: 3px solid #01a46f;
}

.layout_selector {
	margin:0;
	padding:0;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
}

.layout_selection_input {
	position: absolute;
	left: -9999px;
}

.dashlet_layout_label {
	cursor:pointer;
	background-size:contain;
	background-repeat:no-repeat;
	display:inline-block;
	width:100px;height:70px;
	-webkit-transition: all 100ms ease-in;
	-moz-transition: all 100ms ease-in;
	transition: all 100ms ease-in;
	-webkit-filter: brightness(1.8) grayscale(1) opacity(.7);
	-moz-filter: brightness(1.8) grayscale(1) opacity(.7);
	filter: brightness(1.8) grayscale(1) opacity(.7);
}

.dashlet_layout_label_1 {background-image:url(../icons/dashboard_layout_1.png);}
.dashlet_layout_label_2 {background-image:url(../icons/dashboard_layout_2.png);}
.dashlet_layout_label_3 {background-image:url(../icons/dashboard_layout_3.png);}
.dashlet_layout_label_4 {background-image:url(../icons/dashboard_layout_4.png);}
.dashlet_layout_label_5 {background-image:url(../icons/dashboard_layout_5.png);}
.dashlet_layout_label_6 {background-image:url(../icons/dashboard_layout_6.png);}
.dashlet_layout_label_7 {background-image:url(../icons/dashboard_layout_7.png);}
.dashlet_layout_label_8 {background-image:url(../icons/dashboard_layout_8.png);}

.layout_option_block {
	display: inline-block;
}

.dashlet_layout_image {
	width: 280px;
	height: 158px;
}

.add_layout_section_button {
   background-color: var(--main_colour);
   color: #ffffff;
   /* background-image:url("/images/icons/white/new.svg"); */
   padding-left: 10px;
   padding-top: 7px;
   padding-bottom: 7px;
   padding-right: 10px;
   /* background-size: 15px;
   background-repeat: no-repeat;
   background-position: 10px center; */
   text-align: center;
   border-radius: 5px;
}

.add_layout_section_button:hover {
   background-color: var(--lighter_shade_1);
   color: #ffffff;
}

.add_layout_section_button .psoda_icon {
   margin-right: 5px;
}

.dashlet_plus_content {
position: absolute;
margin: auto;
display: flex;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
width: 100%;
height: 80%;
}

.dashlet_plus_img {
width: 4vw;
display: block;
margin: auto;
/* background-image:url("/images/icons/darkgrey/new.svg"); */
/* filter: grayscale(100%); */
cursor: pointer;
background-repeat: no-repeat;
width: 40px;
height: 40px;
background-position-x: center;
background-position-y: center;
transition: filter 0.2s;
}
.dashlet_plus_img:hover {
/* filter: grayscale(0%); */
}

.dashlet_plus_img:hover use {
   fill: var(--icon_green) !important;
   /* background-image: url("/images/icons/green/new.svg"); */
}

.dashlet_add_content {
position: absolute;
margin: auto;
display: flex;
left: 0px;
right: 0px;
width: 100%;
height: 80%;
}

.dashlet_add_menu {
margin: auto;
margin-top: 0px;
height: inherit;
width: inherit;
text-align: center;
}

.dashlet_add_select {
min-width: 150px;
width: 95%;
max-width: 500px;
height: 100%;
margin: auto;
margin-top: 0px;
margin-bottom: 5px;
left: 0px;
right: 0px;
}

.dashlet_add_option {
   background-size: 14px !important;
   padding-left: 20px !important;
}

.dashlet_add_option:disabled {
opacity: 0.5;
}

.dashlet_dialog {
border: none;
left: 0px;
right: 0px;
bottom: 0px;
padding: 0px;
top: 3px;
}

.layout_dashlet .dashlet_header {
/* margin-top: -8px; */
margin-bottom: 0px;
border-bottom: 0px;
width: 100%;
}

.layout_dashlet .dashlet_header h3 {
   padding-left: 15px;
}

.dashlet_data_content {
position: absolute;
width: 100%;
margin-left: 0px;
margin-right: 0px;
height: calc(100% - 36px);
height: -moz-calc(100% - 36px);
height: -webkit-calc(100% - 36px);
height: -o-calc(100% - 36px);
}

.dashlet_data_content::-webkit-scrollbar {
height: 10px;
}

/* .dashlet_data_content .displaylist_container {
   height: calc(100% - 21px);
} */

/* #user_risks .dashlet_data_content .displaylist_container ,
#organisation_risks .dashlet_data_content .displaylist_container ,
#organisation2_risks .dashlet_data_content .displaylist_container ,
#portfolio_risks .dashlet_data_content .displaylist_container ,
#program_risks .dashlet_data_content .displaylist_container ,
#program2_risks .dashlet_data_content .displaylist_container ,
#subproject_risks .dashlet_data_content .displaylist_container ,
#project_risks .dashlet_data_content .displaylist_container {
   height: calc(100% - 55px);
} */

.dashlet_data_content .displaylist_container .displaylist {
height: 100%;
overflow-y: auto;
}

.dashlet_data_content .displaylist_container>div>div {
height: calc(100% - 51px);
}

.dashlet_data_content .displaylist_container {
box-shadow: none;
-webkit-box-shadow: none;
}

.dashlet_data_content .displaylist table {
box-shadow: none;
-webkit-box-shadow: none;
}

.dashlet_hide_button {
cursor: pointer;
}

.section_end_remove {
color: #F46464;
cursor: pointer;
font-size: 12px;
}

.section_end_remove:hover {
color: #F46464;
font-weight: bold;
}

.section_end_arrow {
cursor: pointer;
padding-left: 6px;
padding-right: 6px;
padding-bottom: 6px;
}

#layout_caret_up_icon svg {
   transform:rotate(180deg)
}

.section_end_button {
margin-top: -8px;
padding-bottom: 20px;
opacity: inherit;
margin-top: 0px;
transition-property: padding-bottom, margin-top;
transition-duration: 0.25s;
}

.layout_dashlet .report_section {
width: none !important;
}

.layout_dashlet .displaylist {
margin-top: 0px;
}
.layout_dashlet .displaylist div {
max-height: none !important;
}

.myStatsItem {
width: 33%;
min-width: 220px;
display: inline-block;
}

.layout_dashlet .dialogbuttons {
margin-top: 0px;
margin-bottom: 0px;
}

.layout_dashlet .dialogbuttons input {
   margin-left: 10px;
   margin-right: 10px;
   float: unset; 
}

/*LOGANS CSS END - Dashboard Layouts*/
/*LOGANS CSS START - Photo field*/
#camerabox {
	position: fixed;
	background: white;
	box-shadow: 3px 3px 10px rgb(0 0 0 / 30%);
	z-index: 1001;
	width: 80%;
	height: 80%;
	top: 10%;
	left: 10%;
   text-align: center;
   border-radius: 10px;
}

#camerabox_buttons {
	text-align: center;
	padding-top: 10px;
}

#camerabox_canvas,
#camerabox_video {
	width: auto;
	height: 75%;
	padding-top: 5%;
}

.camerabox_img_detailstab {
	width:100px;
	height:auto;
}

#camerabox_takephoto, #camerabox_uploadphoto {
   border: none;
   margin-right: 10px;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   padding-left: 30px;
   padding-right: 30px;
   text-align: center;
   color: white !important;
   cursor: pointer;
   border-radius: 3px;
   font-family: var(--font_family);
}

#camerabox_takephoto.retake_photo_button {
   background-color: transparent !important;
   color: var(--font) !important;
}

#camerabox .close_button {
   position: absolute;
   right: 10px;
   top: 10px;
}

/*LOGANS CSS END - Photo field*/

/*///////////////////////////////////////////////////////////////////////////////////////////////////////////////
   PSONAR PSONAR PSONAR PSONAR PSONAR PSONAR PSONAR PSONAR PSONAR PSONAR PSONAR PSONAR PSONAR PSONAR PSONAR  
///////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

#results_modules_div {
    border-top: 60px solid #f9f9f9;
    /* padding-top: 60px; */
    float: left;
}

#show_psonar_button:focus {
   outline: none;
}

#psonar {
    position: absolute;
    top: 10;
    z-index: -1;
    background-color: #f9f9f9;
    box-shadow:var(--popup_box_shadow); /*CSS3 shadow*/
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.psonar_button_outer {
   position:absolute;
   /* top:65px; */
   right: 25px;
   width:94px; 
   height: 60px; 
}

.psonar_button_icon {
   background: url(/Psonar/assets/psonar_logo_svg.svg);
   border:none;
   height:36px;
   width: auto;
}

#show_psonar_button {
   background-color:transparent !important;
   cursor:pointer;
   height:30px;
   border:none;
   width: 60px;
   margin-top: -10px;
   position: absolute;
   right: 0px;
   z-index: 1;
}

.copy_button {
    /* background-image: url('/Psonar/assets/psonar_copy.svg'); */
    /* background-image: url('images/icons/theme_normal/derived.svg'); */
    width: 20px;
    height: 20px;
    display: inline-block;
    float: left;
    position: absolute;
    left: -30px;
    top: 0px;
    vertical-align: middle;
    overflow: visible;
	 cursor: pointer;
}

.copy_button use {
	fill: #6EA3CF !important;
}

#results_modules_div {
    width: 270px;
    margin-left: 0px;
    border-top: 60px solid #f9f9f9;
    /* padding-top: 60px; */
    float: right;
    border-top-right-radius: 10px;
}

#results_modules_inner {
    position: absolute;
    top: 60px;
    width: 250px;
    margin-left: 20px;
    float: right;
    overflow-y: scroll;
    background-color: #ECF1F6;
    border-bottom-right-radius: 10px;
}

#selected_result_details_div {
    position: absolute;
    top: 30px;
    width: 370px;
    /* box-shadow: 3px 3px 15px rgba(0,0,0,0.1); */
    float: left;
    left: 0px;
    overflow-y: hidden;
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
    background-color: #ECF1F6;
    border-radius: 5px;
}

#selected_result_details_div h3 {
	font-size: 1em;
}

#selected_result_details_div h3 .psoda_icon {
   padding-left: 5px;
   padding-right: 5px;
}

#selected_result_details_div::-webkit-scrollbar {
  /*display: none;*/
}
                                                                                                        
.results_modules {
    background: white;
    border-left: 18px solid;
    position: absolute; 
    width: 200px;
    height: 100px;
    left: 10px;
    word-wrap: break-word;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 
    cursor: pointer;
    border-radius: 5px;
}

.psonar_module_title {
    overflow: hidden;
    text-align: center; 
    padding-bottom: 0px;
    padding-top: 5px;
    text-overflow: ellipsis;
    display: -webkit-box; 
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical
}

.psonar_module_description {
    overflow: hidden;
    text-align: center; 
    padding-bottom: 0px;
    padding-top: 5px;
    text-overflow: ellipsis;
    display: -webkit-box; 
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.result_scores {
    float: left;
    color: #00a470;
    font-weight: bold;
}

#psonar_comparing_header {
   font-weight: bold;
   padding-top: 20px;
   font-size: 1.1em;
   text-align: center;
}

#copy_all_button {
    /* position: absolute;
    left: 130px;
    top: 80px; */
    text-align: center;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: 150px;
    display: inline-block;
}

#copy_all {
    background-color: #6EA3CF;
    border: none;
    color: white;
    padding: 7px 30px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    cursor: pointer;
    border-radius: 3px;
}

#stop_comparing_button {
   display: inline-block;
   cursor: pointer;
   margin-left: 10px;
}

#stop_comparing_button img, #stop_comparing_button div {
   display: inline-block;
   vertical-align: top;
}

#stop_comparing_button .psoda_icon {
   /* width: 20px;
   height: auto; */
   margin-right: 5px;
}

#title_details {
    width: 320px;
    height: 21px;
    /* border: 1px solid lightgrey; */
    background: #D9E5F0;
    color: #6EA3CF;
    border-radius: 5px;
}

.textarea_box {
    width: 320px;
    display: inline-block;
    /* height: 87px; */
    /* border: 1px solid lightgrey; */
    background: #D9E5F0;
    color: #6EA3CF;
    overflow: visible;
    border-radius: 5px;
}

.select_box {
    float: left;
    width: 320px;
    height: 21px;
    background: #D9E5F0;
    color: #6EA3CF;
    overflow: visible;
    border-radius: 5px;
}

.selected_result_data div {
   padding: 5px;
}

.selected_result_data div .psoda_icon {
	pointer-events: none;
}

.not_enough_img, .start_typing_img {
   /* width: 250px; */
   height: auto;
   width: 75%;
   margin-left: 12.5%;
}

.not_enough_header, .start_typing_header {
   font-size: 1.75em;
   color: #609BCC;
   font-weight: bold;
   text-align:center;
   width: 75%;
   margin: auto;
}

.not_enough_text, .start_typing_text {
   text-align:center;
   color: var(--font_grey);
   width: 75%;
   margin: auto;
}

#start_typing_outer {
   position: absolute;
   z-index: 2;
}

/*///////////////////////////////////////////////////////////////////////////////////////////////////////////////
   ONBOARDING ONBOARDING ONBOARDING ONBOARDING ONBOARDING ONBOARDING ONBOARDING ONBOARDING ONBOARDING ONBOARDING  
///////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

#popupcontent_trialhubpopup .popupdialogue .dialogmessage {
    margin-bottom: 0px;
}

#popupcontent_trialhubpopup .popupdialogue {
   max-height: 85vh;
   height: auto;
}

#popupcontent_trialhubpopup .dialogmessage {
    margin-bottom: 20px;
    font-style: normal;
}

#popup_trialhubpopup .minimise_button {
   display: none;
}

#popup_trialhubpopup .top-right-buttons {
   background-color: #f9f9f9;
}

.module_bottle {
    text-align: center;
}

.module_desc_div {
    width: 225px;
}

.module_content {
    width: 225px;
    height: 225px;
    text-align: left;
    margin-left: 20px;
    margin-right: 20px;
    padding: 10px;
    border: solid 2px transparent;
    cursor: pointer;
    background-color: #FFFFFF;
    float: left;
    position: relative;
}

.registration_modules {
    text-align: center;
    height: 250px;
    /* width: 1156px; */
    width: 867px;
    margin: auto;
    margin-bottom: 0px;
    position: relative;
}

.module_desc_help {
    position: absolute;
    bottom: 15px;
    right: 15px;
    background-image: url(/images/onboarding/descr_questionmark.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 16px;
    height: 16px;
    width: 16px;
}

.module_desc_help:hover {
    background-image: url(/images/onboarding/descr_questionmark_hover.svg);
}

.module_desc_close {
    position: absolute;
    bottom: 15px;
    right: 15px;
    background-image: url(/images/onboarding/descr_x.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 16px;
    height: 16px;
    width: 16px;
}

.module_desc_close:hover {
    background-image: url(/images/onboarding/descr_x_hover.svg);
}

.module_content:hover {
    box-shadow: 0px 0px 15px #eaeaea;
}

.active_module {
    box-shadow: 0px 0px 15px #eaeaea;
    border: solid 2px #00A470;
}

.module_back {
    background-color: #FFFFFF;
    z-index: -1;
    margin-left: -273px;
    position: relative;
}

.checkbox_button {
    width: 249px;
    height: 249px;
    margin-left: -10px;
    margin-top: -10px;
    cursor: pointer;
    position: absolute;
    opacity: 0;
}

#trial_hub_logo {
    display: inline-block;
    height: 50px;
    vertical-align: top;
}


/* trial hub popup */

#hub_circle_container {
    cursor: pointer;
    position: fixed;
    bottom: 25px;
    right: 25px;
    z-index: 22;
    opacity: 0.5;
}

#hub_circle_container:hover {
    opacity: 1;
}

#trial_days_left {
    color: #00A471;
    font-size: 16px;
    margin-top: 0px;
}

#trial_days_left_text {
    margin: 0;
}

#trial_hub_circle_text {
   color: #00A471;
   font-size: 16px;
   text-align: center;
}

#hub_img {
    /* width: 80px;
    height: 80px; */
    /* margin-bottom: 10px; */
    width: 100%;
    height: auto;
}

#trial_hub_text {
    display: inline-block;
    height: 50px;
    font-size: 36px;
    line-height: 50px;
    padding-left: 10px;
}

#trial_hub_title {
    height: 50px;
    width: 100%;
    text-align: center;
    padding-bottom: 10px;
}

#walkthrough_desc {
    font-size: 12px;
}

.module_title_trial_popup {
    font-size: 18px;
    margin: 0;
    margin-left: 5px;
    margin-right: 5px;
}

.module_desc_trial_popup {
    font-size: 12px;
    color: #AAAAAA;
}

.module_bottle_trial_popup {
    text-align: center;
    margin-top: 10px;
}

.module_title_div_trial_popup {
    width: 200px;
    text-align: center;
}

.module_desc_div_trial_popup {
    width: 200px;
}

.module_content_trial_popup {
    width: 200px;
    height: 150px;
    text-align: left;
    background-color: #FFFFFF;
    position: relative;
    box-shadow: 0px 0px 15px #eaeaea;
    border: solid 2px #00A470;
    margin: 0 auto;
}

.module_content_trial_popup_expired {
    width: 200px;
    height: 150px;
    text-align: left;
    background-color: #FFFFFF;
    position: relative;
    box-shadow: 0px 0px 15px #eaeaea;
    border: solid 2px #C63636;
    margin: 0 auto;
}

#trial_popup_right {
    display: inline-block;
    width: calc(33.3% - 80px);
    padding-left: 40px;
    padding-right: 40px;
}

#trial_popup_left {
    display: inline-block;
    width: calc(66.5% - 80px);
    vertical-align: top;
    padding-left: 40px;
    padding-right: 40px;
}

#hub_img_trial_popup {
    width: 80px;
    margin: 0 auto;
}

.trial_popup_text {
    font-size: 18px;
    margin-top: 5px;
}

.trial_popup_text .psoda_icon {
   margin-right: 5px;
}

.trial_expired_text {
    color: #C63636;
    font-size: 14px;
    font-weight: bold;
}

#p_expired {
    display: inline-block;
    width: 55%;
    padding-right: 15%;
    text-align: left;
    margin: 0px;
}

#trial_expired_img {
    display: inline-block;
    width: 20%;
    padding-left: 10%;
    text-align: right;
    vertical-align: top;
}

.trial_popup_text_small {
    font-size: 12px;
}

#contact_link_p {
   margin-top: 10px;
}

#question_contact_link_p {
   margin-top: 5px;
}

#convert_link_p {
    margin-bottom: 0;
}

#walkthough_title {
    margin-bottom: 0;
}

#walkthough_text {
    margin-top: 0;
}

#walkthroughs_container {
    width: 200px;
    margin: 0 auto;
}

.trial_popup_link_span {
    color: var(--font_link);
    font-size: 14px;
}

.trial_popup_link_span:hover {
    cursor: pointer;
    color: var(--font_link_hover);
}

#questions_text {
   margin-bottom: 0px;
    margin-top: 50px;
}

#demo_text {
   margin-bottom: 5px;
   margin-top: 50px;
}

#demo_desc {
   margin-top: 5px;
   margin-bottom: 5px;
   color: #aaa;
   line-height: 1.1;
}

 #demo_button {
   margin-top: 22px;
 }

#demo_button a {
   background: #002f33;
   color: #fff;
   padding-top: 10px;
   padding-bottom: 10px;
   padding-left: 15px;
   padding-right: 15px;
   border-radius: 3px;
}

.module_content_hub {
    width: 200px;
    height: 200px;
}

.checkbox_button_hub {
    width: 220px;
    height: 220px;
}

.module_title_div_hub {
    width: 200px;
    text-align: center;
}

.module_title_hub {
    font-size: 14px;
}

.module_desc_hub {
    font-size: 10px;
    color: #AAAAAA;
}

.registration_modules_row_2_hub {
    width: 801px;
    margin-bottom: 0px;
}

.registration_modules_hub {
    /* width: 856px; */
    width: 801px;
}

.module_back_hub {
    background-color: #FFFFFF;
    z-index: -1;
    /* margin-left: -194px; */
    margin-left: -247px;
    position: relative;
}

#trial_hub_walkthrough_div {
    width: 60%;
    text-align: center;
    margin: auto;
    padding: 5px;
}

#trial_hub_walkthrough_div:hover {
    box-shadow: 0px 0px 15px #eaeaea;
    cursor: pointer;
}

#trial_popup_left_help, #trial_popup_left_videos {
   display: inline-block;
   width: calc(49% - 40px);
   margin: 10px;
   padding: 10px;
   box-shadow: var(--box_shadow);
   /* height: 87px; */
   vertical-align: top;
   line-height: 1.1;
   border-radius: 5px;
}

#trial_popup_left_help:hover, #trial_popup_left_videos:hover {
   background-color: #f0f0f0;
}

#trial_popup_left_help a, #trial_popup_left_videos a {
   color: #aaa;
}

#trial_popup_left_help .trial_popup_text, #trial_popup_left_videos .trial_popup_text {
   color: var(--font_grey);
   padding-bottom: 12px;
}

#trial_popup_left_videos .trial_popup_text img {
   padding-right: 10px;
}

.trial_hub_walkthrough_container {
   margin: auto;
   margin-bottom: 10px;
   /* width: 450px; */
   max-height: 275px;
   overflow: auto;
}

.trial_hub_walkthrough_container::-webkit-scrollbar {
   width: 6px;
   height: 6px;
}

.trial_hub_walkthrough_progress {
   position: relative;
   margin-top: 10px;
}

.trial_hub_walkthrough_progress_track {
   width: 100%;
   height: 10px;
   background-color: #eaeaea;
   border-radius: 3px;
}

.trial_hub_walkthrough_progress_overlay {
   height: 10px;
   background-color: #00a470;
   border-radius: 3px;
   position: absolute;
}

.trial_hub_walkthrough_progress_text {
   color: #00a470;
   padding-top: 5px;
}

#trial_hub_walkthrough_text {
   margin-bottom: 5px;
}

#trial_hub_left_text {
   margin: auto;
    margin-bottom: 10px;
    color: #aaa;
    width: 300px;
    text-align: center;
    line-height: 1.1;
}

.trial_hub_walkthrough {
   text-align: left;
   padding-bottom: 2.5px;
   padding-top: 2.5px;
   padding-left: 5px;
   margin-bottom: 2.5px;
   margin-top: 2.5px;
}

.trial_hub_walkthrough.trial_hub_walkthrough_clickable {
   cursor: pointer;
}

.trial_hub_walkthrough.trial_hub_walkthrough_clickable:hover {
   background-color: #f0f0f0;
}

.trial_hub_walkthrough_name, .trial_hub_walkthrough_name_complete, .trial_hub_walkthrough_name_comingsoon {
   font-size: 1.15em;
   display: inline-block;
   vertical-align: middle;
}

.trial_hub_walkthrough_name_complete {
   color: #00a470;
}

.trial_hub_walkthrough_name_comingsoon {
   color: #b7b7b7;
}

.trial_hub_walkthrough_name .psoda_icon, .trial_hub_walkthrough_name_complete .psoda_icon {
	margin-right: 5px;
}

.trial_hub_walkthrough_name_complete .psoda_icon svg use {
	fill: #00a470 !important; 
}

.trial_hub_walkthrough_sidebar_complete, .trial_hub_walkthrough_sidebar_comingsoon, .trial_hub_walkthrough_sidebar_skipped {
   display: inline-block;
   padding-left: 7.5px;
   padding-right: 7.5px;
   border-radius: 10px;
   color: white;
   font-weight: bold;
   font-size: .8em;
   margin-left: 10px;
   vertical-align: middle;
}

.trial_hub_walkthrough_sidebar_complete {
   background: #00a470;
}

.trial_hub_walkthrough_sidebar_comingsoon {
   background: #b7b7b7;
}

.trial_hub_walkthrough_sidebar_skipped {
   background: #f58836;
}

.trial_hub_walkthrough_complete_once {
   display: inline-block;
   font-size: 9px;
   color: #b7b7b7;
   margin-left: 10px;
}

.trial_hub_walkthrough_loader {
   width: 50px;
   height: 50px;
   background-image: url(/images/night_loader.gif);
   background-size: 100%;
   text-align: center;
   margin: auto;
}

.disable_animations .trial_hub_walkthrough_loader {
   background-image:url(/images/night_loader.png);
}

/* card animations */

@keyframes card_flip_help_open {
    0% {
        transform: scaleX(0);
    }

    100% {
        transform: scaleX(1)
    }
}

@keyframes card_flip_help_close {
    0% {
        transform: scaleX(1);
    }

    100% {
        transform: scaleX(0)
    }
}

@keyframes card_flip_back_open {
    0% {
        transform: scaleX(0)
    }

    100% {
        transform: scaleX(1)
    }
}

@keyframes card_flip_back_close {
    0% {
        transform: scaleX(1)
    }

    100% {
        transform: scaleX(0)
    }
}

.module_front_clicked_close {
    animation-name: card_flip_help_close;
    animation-duration: 0.125s;
    animation-timing-function: ease;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
}

.module_front_clicked_open {
    animation-name: card_flip_help_open;
    animation-duration: 0.125s;
    animation-timing-function: ease;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    animation-delay: 0.125s;
}

.module_back_clicked_close {
    animation-name: card_flip_back_close;
    animation-duration: 0.125s;
    animation-timing-function: ease;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    z-index: -1;
}

.module_back_clicked_open {
    animation-name: card_flip_back_open;
    animation-duration: 0.125s;
    animation-timing-function: ease;
    animation-delay: 0.125s;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    z-index: 1;
}

#modules_hub_form {
    position: relative;
    height: 550px;
}

#hub_save_button_module {
    right: 75px;
}

#hub_back_button_modules {
    left: 75px;
}


/* Setting height and width on all hub buttons */

#trial_welcome input,
#trial_hub_buttons input,
#hub_back_button_contact,
#hub_send_button_contact,
#trial_button_contact,
#hub_back_button_modules,
#hub_save_button_module {
    height: 40px;
    width: 100px;
    font-size: 1.15em;
    background: #00a470;
    text-align: center;
    float: unset;
    margin-right: 0;
}

#hub_back_button_contact {
   left: 125px;
   width: 120px;
}

#hub_back_button_contact:hover {
  opacity: .75;
}

#trial_hub_buttons {
   /* position: absolute; */
    bottom: 10px;
    text-align: center;
    margin: auto;
    left: 0;
    right: 0;
    padding-bottom: 0px;
    border: none;
    padding-top: 10px;
    background: none;
    box-shadow: none;
}

.hub_back_button {
   border: none;
   margin-right: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 15px;
   padding-right: 15px;
   background: none !important;
   text-align: center;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   color: #2d2d2d !important;
   position: absolute;
   bottom: 0;
   cursor: pointer;
   font-size: 1.15em;
}

.hub_back_button span {
	margin-right: 5px;
}

.hub_save_button {
    border: none;
    margin-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 15px;
    padding-right: 15px;
    background: #00a470;
    text-align: center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: white !important;
    position: absolute;
    bottom: 0;
    cursor: pointer;
}

#trialhubpopup_button_cancel {
    cursor: pointer;
}

#trial_popup_right_contact {
    display: inline-block;
    width: 60%;
    text-align: left;
    height: 350px;
    position: relative
}

#trial_popup_left_contact {
    display: inline-block;
    width: 39%;
    vertical-align: top;
    text-align: left;
    border-right: solid #eaeaea 2px;
    height: 350px;
    position: relative
}

#contact_us_title {
    font-size: 30px;
    padding-left: 25px;
}

#contact_us_desc {
    margin-top: 10px;
    font-size: 16px;
    margin-bottom: 30px;
    padding-left: 25px;
}

.contact_form_label {
    display: inline-block;
    margin: 0;
}

.contact_form_label_right {
    width: 95px;
    font-size: 18px;
}

#left_contact_div {
    padding-left: 30px;
}

#left_contact_div div {
    margin-top: 1em;
}

#right_contact_div {
    padding-left: 30px;
}

#right_contact_div>div>div>input {
    height: 15px;
    background-color: #eaeaea;
    border: none;
    padding: 7px;
    border: #eaeaea solid 1px;
    width: 350px;
    /* width: 62%; */
    margin: 5px 0px 5px 0px;
    border-radius: 5px;
}

#right_contact_div>div>div>textarea {
    height: 100px;
    background-color: #eaeaea;
    border: none;
    padding: 7px;
    border: #eaeaea solid 1px;
    width: 350px;
    /* width: 62%; */
    margin: 5px 0px 5px 0px;
    border-radius: 5px;
}

#message_div>p.contact_form_label.contact_form_label_right {
    margin-top: 5px;
}

#contact_message {
    font: 400 13.3333px Arial;
}

.contact_form_error {
    display: none;
    margin: 0px 0px 0px 95px;
    padding: 0px;
    color: #C63636;
}

.contact_text {
    font-size: 18px;
}

#contact_thanks {
    font-size: 30px;
    text-align: center;
}

#contact_thanks_message {
    text-align: center;
    width: 80%;
    margin: auto;
}

#hub_send_button_contact {
    left: 275px;
}


/* welcome popup */

#trial_welcome {
    padding-bottom: 5px;
}

#trial_welcome_text {
    font-size: 40px;
}

#trial_welcome_description {
    width: 69%;
    display: inline-block;
}

#trial_welcome_img_div {
    width: 30%;
    display: inline-block;
    text-align: right;
}

#trial_welcome_description_text {
    width: 80%;
    text-align: left;
    font-size: 21px;
    padding-bottom: 30px;
}

#trial_welcome_logo {
    padding-right: 20px;
}

#trial_welcome_title_div {
    margin-bottom: 34px;
    text-align: center;
}

#trial_button_contact {
    background: #00a470;
    bottom: 90px;
    left: 250px;
}

#trial_button_contact_div {
    width: 100%;
    text-align: center;
}


#popup_trialhubpopup {
   top: 5vh !important;
}

#popup_trialwelcomepopup, #popup_trialhubpopup {
   z-index: 100 !important;
}

#popup_trialwelcomepopup, #popup_trialhubpopup {
   width: 980px !important;
   left: -490px !important;
   margin-left: 50% !important;
   cursor: default;
}

#popup_trialwelcomepopup .popupdialogue, #popup_trialhubpopup .popupdialogue {
   margin-right: 0 !important;
}

#trial_popup_left, #trial_popup_right {
   text-align: center;
}

#popup_trialhubpopup .top_image_outer {
   display: none;
}

.thumbnail {
   cursor: pointer;
}

.preview_lightbox {
    /* display: none; */
    visibility: hidden;
    opacity: 0;
    /** Position and style */
    position: fixed;
    z-index: 999;
    width: 100%;
    height: 100%;
    text-align: center;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.8);
    -webkit-transition: opacity 300ms, visibility 300ms;
    transition: opacity 300ms, visibility 300ms;
}

.preview_lightbox img {
    /** Pad the lightbox image */
    max-width: 90% !important;
    max-height: 80%;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.preview_lightbox:target {
    /** Remove default browser outline */
    outline: none;
    /** Unhide lightbox **/
    /* display: block; */
    visibility: visible;
    opacity: 1;
}

/* Date slider stuff for the GIS map */
#gismap_range_slider input::-webkit-slider-thumb {
    pointer-events: all;
    position: relative;
    z-index: 1;
    outline: 0;
}
#gismap_range_slider input::-moz-range-thumb {
    pointer-events: all;
    position: relative;
    z-index: 1;
    outline: 0;
}

/* FREE TRIAL WALKTHROUGHS */

.walkthrough_popup {
   background: white;
   box-shadow: var(--box_shadow);
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   border-radius: 5px;
   /* height: 300px; */
   width:400px;
   position: absolute;
   /* margin-left: auto;
   margin-right: auto; */
   z-index: 2000;
   padding: 10px;
   text-align: center;
}

.walkthrough_welcome_popup {
   background: white;
   box-shadow: var(--box_shadow);
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   border-radius: 5px;
   /* height: 500px; */
	max-height: 90vh;
	overflow: auto;
   width:800px;
   position: fixed;
   margin-left: auto;
   margin-right: auto;
   top: 5vh;
   left: 0;
   right: 0;
   /* bottom: 0; */
   z-index: 2000;
   padding: 10px;
   text-align: center;
}

.walkthrough_popup.current_step.complete_step {
   position: fixed;
}

.walkthrough_popup {
   visibility: hidden;
}

.walkthrough_popup.current_step {
   visibility: visible;
}

.walkthrough_popup.current_step.walkthrough_fixed {
   position: fixed;
}

.walkthrough_welcome_popup {
   visibility: hidden;
}

.walkthrough_welcome_popup.current_step {
   visibility: visible;
}

.walkthrough_popup_lightbox {
   display: none;
   position: fixed;
   top: 0%;
   left: 0%;
   width: 100%;
   height: 100%;
   /* z-index: 1001; */
   /* z-index: 27; */
   z-index: 33;
   background-color: black;
   opacity: 0.5;
}

.walkthrough_popup.current_step ~ .walkthrough_popup_lightbox, .walkthrough_welcome_popup.current_step ~ .walkthrough_popup_lightbox {
   display: block;
}

.walkthrough_popup.current_step.complete_step ~ .walkthrough_popup_lightbox {
   opacity: 0;
}

.walkthrough_popup_title, .walkthrough_welcome_popup_title {
   font-size: 2.5em;
   /* font-weight: bold; */
   text-align: center;
   padding: 5px;
}

.walkthrough_popup_descr, .walkthrough_welcome_popup_descr {
   text-align: center;
}

.walkthrough_welcome_popup_start_button {
   font-weight: bold;
   text-transform: uppercase;
   letter-spacing: 1.25px;
   text-align: center;
   color: #f58836;
   cursor: pointer;
   padding: 5px;
   padding-left: 20px;
   padding-right: 20px;
   background-size: 30px;
   background-repeat: no-repeat;
   background-position: center;
   background-color: #f588362e;
   display: inline-block;
   margin-top: 10px;
   margin-bottom: 5px;
   border-radius: 5px;
}

.walkthrough_welcome_popup_start_button:hover {
   background-color: #f588364a !important;
}

.walkthrough_complete_popup_next_button {
   font-weight: bold;
   text-transform: uppercase;
   letter-spacing: 1.25px;
   text-align: center;
   color: #f58836;
   cursor: pointer;
   padding: 5px;
   padding-left: 20px;
   padding-right: 20px;
   margin-top: 15px;
   animation: buttonshake 10s infinite;
   background-color: #f588362e;
   display: inline-block;
   margin-bottom: 5px;
   border-radius: 5px;
}

.walkthrough_complete_popup_next_button:hover {
   background-color: #f588364a;
}

.walkthrough_welcome_popup_img {
   width: 66%;
   /* margin-left:17%; */
}

.walkthrough_popup_triangle {
   position: absolute;
   width: 35px;
   height: 30px;
   pointer-events: none;
}

.walkthrough_popup.current_step.complete_step .walkthrough_popup_triangle {
   display: none;
}

.walkthrough_popup_img {
   width: 90%;
   margin-left:5%;
   padding: 10px;
   height: 125px;
}

.walkthrough_popup_steps_indicator_outer {
   text-align: center;
   margin-top: 10px;
}

.walkthrough_popup_steps_indicator_inner {
   background: #eaeaea;
   width: 8px;
   height: 8px;
   border-radius: 10px;
   display: inline-block;
   margin: 5px;
   border: 5px solid #eaeaea;
}

.walkthrough_popup.current_step .walkthrough_popup_steps_indicator_outer {
   display: block;
}

.walkthrough_popup.current_step.complete_step .walkthrough_popup_steps_indicator_outer {
   display: none;
}

.walkthrough_popup_steps_indicator_inner.current_indicator {
   border: 5px solid #f58836;
   background: #fff;
}

.walkthrough_popup_steps_indicator_inner.complete_indicator {
   border: 3px solid #f58836;
   background: #fff;
   background-image: url(/images/onboarding/walkthroughs/orange_tick.svg);
   background-size: 15px;
   background-position: center;
   width: 12px;
   height: 12px;
}

.steps_complete_tick {
   width: 40px;
   height: 40px;
   margin-right: 15px;
   margin-bottom: -8px;
}

.steps_complete_small_tick {
   width: 16px;
   height: 16px;
   margin-right: 7px;
   margin-bottom: -4px;
}

.walkthrough_popup_complete_lessons {
   font-weight: bold;
   text-align: left;
   margin-left: 30%;
   line-height: 2em;
}

.walkthrough_popup_complete_lessons_title {
   text-align: center;
}

.walkthrough_popup.complete_step .walkthrough_popup_title {
   margin-top: 20px;
}

.walkthrough_popup.complete_step .walkthrough_popup_descr {
   margin: 10px;
   margin-bottom: 20px;
   margin-top: 20px;
}

.walkthrough_popup_skip_button {
   font-size: .7em;
   color: #f58836; 
   position: absolute;
   top: 5px;
   right: 10px;
   cursor: pointer;
   z-index: 2;
}

.walkthrough_popup_error_exit_button {
   font-weight: bold;
   text-transform: uppercase;
   letter-spacing: 1.25px;
   text-align: center;
   color: #f58836;
   cursor: pointer;
   padding: 10px;
}

.walkthrough_current_button_element {
   z-index: 30 !important;
   pointer-events: auto !important;
   animation: buttonshake 10s infinite;
   /*fix tabbed dropdown bug*/
}

.walkthrough_current_button_element.secondary_main_element {
   pointer-events: none !important;
}

.walkthrough_current_container_element {
   z-index: 50 !important;
   pointer-events: none !important;
}

#display_list_add_risk_button.walkthrough_current_button_element  {
   position: relative;
   display: inline-block;
}

#tfoot, #tbody {
   position: relative;
}

#createrisk_title #title {
   position: relative;
   display: block;
}

.walkthrough_loading_button_div {
   position: absolute;
   top: 0;
   height: 100%;
   width: 100%;
   background: white;
   background-image: url(/images/walkthrough_loader.gif);
   background-size: 10%;
   background-repeat: no-repeat;
   background-position: center;
   text-align: center;
   margin: auto;
}

.walkthrough_scroll_to_anchor {
   position: absolute;
   height: 1px;
   width: 1px;
   opacity: 0;
   margin-top: -200px;
}

.walkthrough_timer_outer_div {
   height: 4px;
   width: 100%;
}

.walkthrough_timer_div {
   height: 100%;
   width: 0%;
   animation: walkthrough_timer 3s;
   background: #f58836;
   animation-fill-mode: forwards;
   z-index: 1;
}

@keyframes walkthrough_timer {
   0% {
      width: 0%;
   }
   100% {
      width: 100%;
   }
}

@keyframes buttonshake {
	0%{
      transform: translate3d(0px, 0px, 0px);
   }
   
   90% {
      transform: translate3d(0px, 0px, 0px);
   }

   91.67% {
      transform: translate3d(25px, 0px, 0px);
   }

   93.34% {
      transform: translate3d(0px, 0px, 0px);
   }
   95.01% {
      transform: translate3d(12.5px, 0px, 0px);
   }
   96.68% {
      transform: translate3d(0px, 0px, 0px);
   }
   98.35% {
      transform: translate3d(6.25px, 0px, 0px);
   }
	100%{
		transform: translate3d(0px, 0px, 0px);
	}
	
}


/*/////////////////
// Drag and Drop //
/////////////////*/

.table_header_mouse_drag_active {
   position: fixed !important;
   left: 0;
   top: 0;
   opacity: 0.7;
   will-change: transform;
   z-index: 1000 !important;
}

.disabled-header:hover {
   /* background: #666666 !important; */
   opacity: .25;
   border-right: initial !important;
}

.table_header_touch_drag_active {
   position: fixed !important;
   left: 0;
   top: 0;
   opacity: 0.7;
   will-change: transform;
   z-index: 1000 !important;
   pointer-events: none !important;
}

.mouse_drag_active {
   position: fixed !important; /* It will make the element move around the screen even if its parent has overflow: hidden; */
   left: 0; /* It will position the element in the initial left position of the screen. */
   top: 0; /* It will position the element in the initial top position of the screen. */
   will-change: transform; /* Warns the browsers that something will change so the browser can make all needed optimizations to make it happen. */
   z-index: 1; /* It will move the active draggable item one level in the stacking order. */
   background: none !important;
}

.touch_drag_active {
   position: fixed !important; /* It will make the element move around the screen even if its parent has overflow: hidden; */
   left: 0; /* It will position the element in the initial left position of the screen. */
   top: 0; /* It will position the element in the initial top position of the screen. */
   will-change: transform; /* Warns the browsers that something will change so the browser can make all needed optimizations to make it happen. */
   z-index: 1; /* It will move the active draggable item one level in the stacking order. */
   pointer-events: none; /* This is used to make the elementFromPoint() function see what is behind the draggable-item while it is moving. */
   background: none !important;
}

.drop-pending {
   opacity: 0.4;
}

.drop-failed *:not(.retry-image){
   opacity: 0.8;
}

.retry-image {
   transform: translate(-50%,-50%); 
   position: absolute;
   width: 70px;
   height: auto;
   cursor: pointer;
   transition: all .01s ease-in-out;
   top: 50%;
   left: 50%;
}

.retry-image:hover {
   transform: scale(1.03) translate(-50%,-50%);
}

#drag-placeholder {
   border: 2px dashed #bbb;
   -webkit-border-radius: 5px;
   border-radius: 5px;
   border-color: #00A470;   
   background-color: #e5f5f0;   
   border-collapse: separate;
   border-spacing: 0px;
   margin-left: auto;
   margin-right: auto;
   margin-bottom: 10px;
}

#drag-placeholder-tab {
   border: 2px dashed #bbb;
   -webkit-border-radius: 5px;
   border-radius: 5px;
   border-color: #00A470;   
   background-color: #e5f5f0;   
   border-collapse: separate;
   border-spacing: 0px;
}

#tabbed_dropdown_menu_items #drag-placeholder-tab {
   height: 20px !important;
}

#drag-placeholder-tab.drop-notallowed {
   border-color: #FF0000;   
   background-color: #f0e7e7;   
}

#drag-placeholder.drop-notallowed {
   border-color: #FF0000;   
   background-color: #f0e7e7;   
}

.animatable {
   /*transition: transform linear 100ms, opacity linear 100ms;*/
   -webkit-transition: 150ms ease;
   -moz-transition: 150ms ease;
   -o-transition: 150ms ease;
   transition: 150ms ease;
}

.animatable-target {
   -webkit-transition: opacity 200ms;
   -moz-transition: opacity 200ms;
   -o-transition: opacity 200ms;
   transition: opacity 200ms;
}

/*users dropdown*/
.user_dropdown_container{
   overflow: auto;
   list-style: none;
   position: absolute;
   background-color: #ffffff;
   height: 0px;
   box-shadow: var(--box_shadow);
   z-index: 100;
   text-align: left;
   /* transition: .20s; */
   padding: 0px;
   max-height: 0px;
   width:0px;
   min-width: 250px;
   right: 5px;
   top: 20px;
}

.user_dropdown_container_open{
   height: auto;
   padding: 10px 0px 10px 0px;
   max-height: 500px;
   top: 40px;
   /* right:50px; */
} 

.user_dropdown_container>div {
   padding: 5px 10px 5px 10px;
   cursor: pointer;
   display: none;
}


.user_dropdown_container.user_dropdown_container_open>div {
   display: block;
}

.user_dropdown_div.selected{
    /* background-image: url(/images/letters/r.svg); */
    /* background-image: url(/images/icon_tick_dark.svg);
    background-repeat: no-repeat;
    background-size: 15px;
    background-position: 210px center; */
    font-weight:bold;
}

.user_dropdown_div{
   display: inline-block;
   width:220px;
}

.user_dropdown_div:hover{
   background-color: #eaeaea;
}

.user_dropdown_div>div{
   padding-right:5px;
}

.user_dropdown_div>div>.status_state{
   padding: 0;
   margin-left: 20px;
   height: 4.5px;
    width: 4.5px;
}

.user_dropdown_div>div>.photo_thumbnail{
   width: 24px;
   height: 24px;
}

.user_dropdown_container.user_dropdown_container_open>div>div{
   display: inline-block;
   /*text-overflow: ellipsis; */
}

.user_dropdown_name{
   padding-left:5px;
   vertical-align: middle;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   width:157px;
}

.user_dropdown_div_title{
   font-weight: bold;
   font-size: 8pt;
}

/* Actions dropdown */

.actions_dropdown_td {
   vertical-align:top;
   text-align:center;
   position:relative;
}

.actions_menu_container {
   overflow: hidden;
   list-style: none;
   position: absolute;
   background-color: #ffffff;
   height: 0px;
   box-shadow: var(--box_shadow);
   z-index: 100;
   text-align: left;
   /* transition: .20s; */
   padding: 0px;
   max-height: 0px;
   width:0px;
   min-width: 200px;
   right: 20px;
   top: 20px;
   border-radius: 10px;
}

.actions_menu_container .no_actions {
   padding-left: 10px;
}

.actions_menu_container div.actions_column_sub_menu_button {
   /* background-image: url(/images/icons/darkgrey/next.svg);
   background-size: 9px;
   background-position: calc(100% - 20px) center;
   background-repeat: no-repeat; */
   border-top: 1px solid #eaeaea;
   padding-top: 10px;
   padding-bottom: 10px;
   margin-top: 2.5px;
   margin-bottom: 2.5px;
   cursor: default;
   margin-left: -5px;
   width: calc(100% - 40px);
   padding-left: 25px;
   padding-right: 25px;
   color: var(--font_grey);
}

.actions_column_sub_menu_button .psoda_icon {
	pointer-events: none;
}

.actions_menu_container div.actions_column_sub_menu_button:hover {
   /* background-color: unset; */
}

.actions_menu_container .psoda_icon, .actions_column_sub_menu .psoda_icon {
   padding-right: 10px;
}

.actions_menu_container .actions_submenu_caret  {
   padding-right: 0px;
   float: right;
}

.actions_column_sub_menu {
   display: none;
   position: absolute;
   background-color: #ffffff;
   box-shadow: var(--box_shadow);
   z-index: 100;
   text-align: left;
   width: 0px;
   min-width: 200px;
   border-radius: 5px;
}

.actions_column_sub_menu.sub_menu_open {
   display: block;
   height: auto;
   padding: 10px 5px 10px 5px;
   max-height: 500px;
}

.export_menu_button, .import_menu_button {
   user-select: none;
   display: inline-block;
   cursor: pointer;
   position: relative;
   padding: 5px;
   border-radius: 5px;
   font-size: 0.9em;
   height: 20px;
   margin-right: 5px;
   color: var(--font_grey);
}

.export_menu_button:hover, .import_menu_button:hover {
   background-color: #eaeaea;
}

.export_menu_button .psoda_icon, .import_menu_button .psoda_icon {
   pointer-events: none;
}

.import_menu_button .psoda_icon:nth-child(1), .export_menu_button .psoda_icon:nth-child(1) {
   margin-right: 5px;
}

.import_menu_button .menu_arrow, .export_menu_button .menu_arrow {
   margin-left: 5px; 
}

.import_menu_button .menu_arrow svg, .export_menu_button .menu_arrow svg {
   transition: .1s ease;
}

.export_options, .import_options {
   display: none;
   z-index: 30;
   position: fixed;
   width: 200px;
   height: 175px;
   left: 0px;
   bottom: 30px;
   border-radius: 10px;
   background-color: #ffffff;
   box-shadow: var(--box_shadow);
   padding: 5px;
}

.menu_arrow {
   transition: .2s ease;
}

.export_options div, .import_options div {
   display: block;
   font-size: 12px;
   padding: 5px;
   /* padding: 0px 0px 5px 0px; */
   margin-left: 5px;
   margin-right: 5px;
   margin-top: 5px;
   border-radius: 5px;
}

.export_options div:hover, .import_options div:hover{
   background-color: #f0f0f0;
}

.export_options a, .import_options a{
   color: var(--font_grey);
}

.export_text {
   display: inline-block;
   margin-left: 5px;
   /* margin-top: 4px; */
   vertical-align: middle;
   width: calc(100% - 45px);
}

.export_options img, .import_options img {
   z-index: 100;
   width: 20px;
   height: auto;
   vertical-align: middle;
   display: inline-block;
   padding: 0px;
}

.displaylist_popupbutton {
   cursor: pointer;
   border-radius: 5px;
   padding: 5px;
   padding-left: 0px;
   display: inline-block;
   font-size: 0.9em;
   height: 20px;
   margin-right: 7px;
   padding-right: 8px;
}


.displaylist_popupbutton:hover {
   background: #eaeaea;
}

.displaylist_popupbutton a{
   color: var(--font_grey);
}

.displaylist_popupbutton.edit_columns {
   margin-left: 10px;
}

.tablejs_button {
   display: inline-block;
   /* margin-top: 10px;
   margin-bottom: 10px; */
   /* margin-left: 4px; */
	margin-right: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
   vertical-align: middle;
   background-color: #eaeaea;
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 5px;
   color: var(--font_grey);
   cursor: pointer;
	height: 20px;
	position: relative;
}

.tablejs_button.tablejs_button_right_align {
	margin-right: 0px;
	margin-left: 10px;
	float:right;
}

.tablejs_button:hover{
   background-color: #dddddd;
}

.tablejs_button_loading {
   color: #eaeaea;
}

.tablejs_button_loading:hover {
   color: #dddddd;
}

.tablejs_button_loading .circle_loader {
	position: absolute;
   top: 7.5px;
   left: 0;
   right: 0;
   margin-left: auto;
   margin-right: auto;
	border-color: #505050 #505050 #505050 transparent;
}

.tablejs_button_loading .psoda_icon {
	opacity: 0;
}

.tablejs_button .psoda_icon {
	pointer-events: none;
}

.tablejs_button .psoda_icon:first-child {
	margin-right:5px;
}

.tablejs_button .psoda_icon:last-child {
	margin-left:5px;
}

.tablejs_button_icon {
   border: none;
   display: inline-block;
   vertical-align: middle;
}

.tablejs_button_add {
   display: inline-block;
   z-index: 2;
   background-image: url(/images/icons/white/new.svg);
   background-repeat: no-repeat;
   background-position: left;
   background-size: 15px 15px;
   width: 40px;
   font-size: 1em;
   border-radius: 5px;
   cursor: pointer;
   background-color: var(--main_colour);
   color: #FFFFFF;
   background-position-x: 5px;
   padding-left: 27.5px;
   padding-top: 2.5px;
   padding-bottom: 2.5px;
   line-height: 25px;
   margin-left: 3px;
   margin-right: 3px;
   margin-bottom: 10px;
   position: relative;
}

.tablejs_button_add:hover {
   background-color: var(--lighter_shade_1);
   color: #ffffff;
}

.edit_column_text {
   display: inline-block;
   vertical-align: middle;
   margin: 0px;
   margin-left: 7.5px;
}

.tablejs_filters_container {
   margin-top: 10px;
   margin-bottom: 4px;
   font-size: .9em;
}

.actions_dropdown_img {
   /* background-image: url(/images/icons/darkgrey/threedot.svg);
   background-repeat: no-repeat;
   background-size: 20px;
   background-position: center; */
   padding: 5px;
   cursor: pointer;
   width: 20px;
   height: 20px;
   position: relative;
}

/* .actions_dropdown_img:hover {
   background-image: url(/images/icon_actionmenu_dark.svg);
} */
 
.actions_open {
   height: auto;
   padding: 10px 5px 10px 5px;
   max-height: 500px;
   top: 40px;
   right:50px;
}

/* .actions_open.top {
   bottom: 60px;
} */

.actions_open.left {
   height: 30px;
   padding: 10px 0px 10px 0px;
   max-height: 30px;
   top: 0px;
   /* width: max-content; */
   left: auto;
}
.actions_open.right {
   height: 30px;
   padding: 10px 0px 10px 0px;
   max-height: 30px;
   right: 0px;
   top: 0px;
   /* width: max-content; */
   ;
}



.actions_menu_container div , .actions_column_sub_menu div {
   padding: 7px 20px 7px 20px;
   cursor: pointer;
   display: none;
}

.actions_menu_container div.actions_menu_blocked {
   cursor: default;
   color: #F46464;
}

.actions_menu_container.actions_open div, .actions_column_sub_menu.sub_menu_open div {
   display: block;
}

.actions_menu_container.actions_open.left div, .actions_column_sub_menu.sub_menu_open.left div  {
   display: inline-block;
}

.actions_menu_container.actions_open.right div, .actions_column_sub_menu.sub_menu_open.right div {
   display: inline-block;
}

.actions_menu_container div:hover, .actions_column_sub_menu div:hover {
   background-color: #f0f0f0;
   border-radius: 5px;
}

.actions_menu_container img, .actions_column_sub_menu img {
   margin-right: 10px;
   vertical-align: top;
}

.actions_menu_container a, .actions_column_sub_menu a {
   color: var(--font_grey);
   display: block;
}

@media print {
   #navigator, #usermenu, #mainmenu,#footermenu, #logo {
      display:none;
   }

   #shiftedcontent, #content {
      margin-left:0px !important;
   }

   #contentarea {
      background:none;
   }

   #viewdetails {
      border:none;
   }

   #viewdetails > h1 {
      display:none;
   }

   .viewdetailsbuttons {
      display:none;
   }

   #viewdetailscontent {
      background:none;
   }

   .tabbed_control_menu {
      display:none;
   }

   /* .tabbed_control_content-left {
      background:none;
   } */

   .tabbed_control_content-right {
      background:none;
   }

   .tabbed_control_content {
      padding-top:15px;
      padding-left:10px;
      padding-right:10px;
      padding-bottom:10px;
      height:200px;
   }

   html>body .tabbed_control_content {
      height:auto;
      min-height:175px;
   }

   .tabbed_control_top {
      height:15px;
      background:none;
   }

   .tabbed_control_top-left {
      background:none;
   }

   .tabbed_control_top-right {
      height:15px;
      background:none;
   }

   .tabbed_control_bottom {
      background:none;
   }

   .tabbed_control_bottom-left {
      /* height:15px; */
      background:none;
   }

   .tabbed_control_bottom-right {
      /* height:15px; */
      background:none;
    }
    
 

   #siteutils {
      display:none;
   }

   .toolbar_holder {
      display:none;
   }

   /* .dashboard {
      background:white;
   } */

   .dashlet_header {

      width:100%;
      height:2.5em;
      /* text-align:right; */
      margin-bottom:10px;
      margin-left:10px;
      cursor:move;
      color: var(--font_grey);

        /* border-bottom: 1px solid #eaeaea; */
   }

   .dashlet_header a {
      display:none;
    }


   .customise_dashboard {
      display:none;
   }

   #footerseperator {
      display:none;
   }

   #footercontact {
      display:none;
   }

	.subtab_view_outer {
		display: none;
	}

	.load_dashboard_outer, .saved_tables_outer, .save_dashboard_button {
		display: none;
	}

	.dashlet_options_right {
		display: none;
	}

	.dashlet_dragger {
		display: none;
	}

	.collapse_table_container {
		display: none;
	}

	.displaylistcontrols {
		display: none;
	}

	.table_height_resize_handle {
		display: none !important;
	}

	.displaylist form > div {
		max-height: 100% !important;
	}

	.top_info_with_image.sticky {
		width: 100% !important;
		left: 0px !important;
		background: #f9f9f9 !important;
    	position: relative !important;
	 	margin-top: -5px !important;
		padding: 0px !important;
		box-shadow: none !important;
	}

	#top_info .top_title {
		padding-left: 0px !important;
		background: #f9f9f9 !important;
  }

  #top_title_inner #user_profile_pic_outer .photo_thumbnail {
		width: 80px !important;
		height: 80px !important;
	}

}

/********************* TIMELINE DASHLET CSS START *********************/
#timeline_dashlet_scrollable {
    position: relative;
    overflow: auto;
    background-color: #f7f7f7;
}

#timeline_dashlet_scrollable::-webkit-scrollbar {
    height: 12px;
}

#timeline_dashlet_scrollable::-webkit-scrollbar-thumb {
    /* background-color: #828282; */
    background-color: #cecece;
}

#timeline_dashlet_scrollable::-webkit-scrollbar-track {
   background-color: #eaeaea;
}

/* #timeline_dashlet_scrollable::-webkit-scrollbar-button:single-button {
    background-color: #828282;
    display: block;

    width:16px;
    height:20px;

    background-repeat: no-repeat;
}

#timeline_dashlet_scrollable::-webkit-scrollbar-button:single-button:horizontal:decrement {
    background-image: url(/images/icon_previous_light.svg);
}
#timeline_dashlet_scrollable::-webkit-scrollbar-button:single-button:horizontal:increment {
    background-image: url(/images/icon_next_light.svg);
} */


.timeline_dashlet_load {
    position: absolute;
    z-index: 1;
    display: block;
    width: 50px;
    height: 50px;
    top: 35%;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(/images/ajax-loader-night.gif);
}

#timeline_dashlet_loadleft {
    left: 5px;
}
#timeline_dashlet_loadright {
    right: 5px;
}


#timeline_dashlet_simpletimeline {
    position:relative;
    width: 100%;
    height: 30px;
}

#timeline_dashlet_simpletimeline_background {
    height: 100%;
    background-color: #ffffff;
}

#timeline_dashlet_simpletimeline_bar {
    position: absolute;
    top: 11px;
    height: 6px;
    background-color: #00a470;
    border-radius: 6px;
}

#timeline_dashlet_simpletimeline .diamond {
    position: absolute;
    display: inline-block;
    top: 2px;
    width: 12px;
    height: 12px;
    background-color: green;

    transform: rotate(45deg);
    transform-origin: 0 100%;

    margin-left: -4px;
}


#timeline_dashlet_timechange {
    background-color: #ffffff;
    height: 25px;
}

.timesheet {
    border-top: 1px solid rgba(250,250,250,0.5);
/*    background-color: #f7f7f7; */
    position: relative;
    height:292px;

    transition: height 0.1s;
}

#timeline_dashlet_scale {
    height: 100%;
    width: 100%;
    position: absolute;
}
#timeline_dashlet_scale div {
    display: block;
    float: left;
    width: 8.2%;
    text-align: center;
    color: var(--font_grey);
    line-height: 24px;
    font-weight: lighter;
    border-left: 2px solid rgba(234,234,234);
    height: 100%;

    position: absolute;

    font-weight: bold;
}
.timesheet .data {
    margin: 28px 0 0 0;
    padding: 0;
    text-align: left;
    list-style-type: none;
    color: rgba(250,250,250,0.8);
    font-size: 13px;
/*    overflow: hidden; */
}

.timeline_dashlet_item {
    height:10px;
    position: absolute;
    margin-top: 5px;
}

.timeline_dashlet_item span {
    height: 10px;
    display: block;
    border-radius: 4px;
    opacity: 0.999;
}
.timeline_dashlet_item_task span {
    background-color: #828282;
}
.timeline_dashlet_item_milestone span {
    background-color: #f7b640;
}


/* IMAGE DIVS */
.timeline_dashlet_item span div {
    display: block;
    position: relative;
    top: -5px;
    margin: auto;
    padding: 3px;
    width: 14px;
    height: 14px;
    border-radius: 100%;
    border: 3px solid #f5f5f5;
    border-top: none;
    border-bottom: none;
}
.timeline_dashlet_item_task span div {
    background: grey;
}
.timeline_dashlet_item_milestone span div {
    border-radius: 0%;

    transform: rotate(45deg);
/*    transform-origin: 0 100%; */

    background-color: #f7b640;

    border: none;

    top: -2px;
    width: 8px;
    height: 8px;
}

/* IMAGES */
.timeline_dashlet_item span div section {
    width: 14px;
    height: 14px;
}
.timeline_dashlet_item_task span div section {
    background-image: url(/images/icon_task_light.svg);
}
.timeline_dashlet_item_milestone span div section {
    background-image: none;
}

.timesheet .data div .date {
    color: #b5b5b5;
    font-size: 14px;
}
.timesheet .data div .label {
    font-weight: lighter;
    font-size: 14px;
    padding-left: 5px;
    line-height: 21px;
    color: #979796;
    white-space: nowrap;
}

#timeline_dashlet_currentdateline {
    position: absolute;
    width: 3px;
    height: 100%;
    background-color: #00a470;
    z-index: 1;
}

#timeline_dashlet_currentdateline div {
    position: absolute;
    top: -10px;
    left: -18px;
    font-size: 12px;
    background-color: #00a470;
    padding: 3px;
    color: #fff;
}

#timeline_dashlet_data li {
    padding-bottom: 20px;
}

/* TIMELINE DASHLET INFO PANEL START */
#timeline_dashlet_info {
    position: absolute;
    width: 260px;
    height: 115px;
    background-color: rgb(255, 255, 255);
    box-shadow: black 0px 0px 10px -4px;
    z-index: 1;
}

#timeline_dashlet_info_colourpanel {
    width: 38px;
    height: 100%;
}
.timeline_dashlet_info_task #timeline_dashlet_info_colourpanel {
    background-color: #828282;
}
.timeline_dashlet_info_milestone #timeline_dashlet_info_colourpanel {
    background-color: #f7b640;
}

#timeline_dashlet_info_icon {
    position: absolute;
    top: 10px;
    left: 22.5px;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    border: 3px solid white;
}
#timeline_dashlet_info_icon div {
    width: 20px;
    height: 20px;
    margin: 4px;
}
.timeline_dashlet_info_task #timeline_dashlet_info_icon {
    background-color: #828282;
}
.timeline_dashlet_info_milestone #timeline_dashlet_info_icon {
    background-color: #f7b640;
}
.timeline_dashlet_info_task #timeline_dashlet_info_icon div {
    background-image: url(/images/icon_task_light.svg);
}
.timeline_dashlet_info_milestone #timeline_dashlet_info_icon div {
    background-image: url(/images/icon_milestone_light.svg);
}

#timeline_dashlet_info_close {
    position: absolute;
    top: -8px;
    right: -8px;
}
#timeline_dashlet_info_close img {
    background-color: white;
    border-radius: 10px;
}

#timeline_dashlet_info_reference {
    position: absolute;
    top: 15px;
    left: 60px;
    font-size: 9px;
    font-weight: bold;
    width: 120px;

    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

#timeline_dashlet_info_effort {
    position: absolute;
    top: 10px;
    right: 8px;
    padding-left: 8px;
    padding-right: 8px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: bold;
    text-align: center;
}

#timeline_dashlet_info_title {
    position: absolute;
    top: 25px;
    left: 60px;
    font-size: 12px;
    font-weight: bold;
    width: 190px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

#timeline_dashlet_info_bar {
    position: absolute;
    top: 55px;
    left: 55px;
    width: 185px;
    height: 7px;
}

#timeline_dashlet_info_progress {
    position: absolute;
    top: 55px;
    left: 55px;
    height: 7px;
}

#timeline_dashlet_info_percentage {
    position: absolute;
    top: 65px;
    left: 135px;
    width: 30px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: bold;
    text-align: center;
}

#timeline_dashlet_info_startball,
#timeline_dashlet_info_endball {
    position: absolute;
    top: 50px;
    width: 9px;
    height: 9px;
    border: 4px solid #828282;
    border-radius: 100%;
    background-color: white;
}

#timeline_dashlet_info_startball {
    left: 47px;
}
#timeline_dashlet_info_endball {
    left: 233px;
}


#timeline_dashlet_info_startdate,
#timeline_dashlet_info_enddate {
    position: absolute;
    top: 67px;
    font-size: 10px;
    font-weight: bold;
}

#timeline_dashlet_info_startdate {
    left: 47px;
}
#timeline_dashlet_info_enddate {
    left: 200px;
}

#timeline_dashlet_info_viewbutton {
    position: absolute;
    bottom: 5px;
    right: 5px;
    font-size: 12px;
    font-weight: bold;
}
/* TIMELINE DASHLET INFO PANEL END */

#timeline_dashlet_showhide {
    position: relative;
    width: 20px;
    height: 20px;
    margin: auto;
    background-image: url(/images/icons/darkgrey/vnext.svg);
    transform: rotate(180deg);
    top: -3px;
    cursor: pointer;
}

#timeline_dashlet_zoom {
    position: absolute;
    top: 290px;
    right: 10px;
    width: 20px;
    height: 21px;
    background-color: red;
}

#timeline_dashlet_key {
    padding-top: 10px;
    text-align: center;
}

#timeline_dashlet_key div {
    width: max-content;
    display: inline-block;
    padding-right: 10px;
    padding-left: 10px;
    cursor: pointer;
}

#timeline_dashlet_key div div {
    display:block;
    position: relative;
    padding: 5px;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    border: 3px solid #f5f5f5;
    float: left;
    margin-right: 5px;
}

#timeline_dashlet_key div b {
    float: right;
    padding-top: 10px;
}

#timeline_dashlet_key_task div {
    background: grey;
}

#timeline_dashlet_key_milestone div {
    background: orange;
}

.timeline_dashlet_key_disabled b {
    text-decoration: line-through;
}

.timeline_dashlet_key_disabled {
   opacity: .5;
}
/********************** TIMELINE DASHLET CSS END **********************/

.deleted_object {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
	background-size: 15%;
	opacity: 0.5;
	pointer-events: none;
	/* background-image: url(/images/icon_delete_transparent.svg);
	background-repeat: no-repeat; */
}

/********************************* SIDEBAR *********************************/

#logo {
   width: 50px;
    height: 100vh;
    position: fixed;
    box-shadow: 0px 10px 10px #29303e;
    z-index: 16;
    padding-left: 0px !important;
    top: 0px;
}

#logo .psodalogo {
   background-image: url(/images/psoda_logo_icon_white.svg);
   height: 40px;
   width: 50px;
   background-size: auto 30px;
   background-position: center;
   padding-left: 0px !important;
}

.versionstring {
   display: none;
}

#siteutils > .graphicsonly {
   opacity: 0;
   visibility: hidden;
}

.brand_logo {
   margin-left: 5px;
}

.brand_logo img {
   width: 40px;
   height: auto;
   margin-top: 10px;
}

/* #siteutils {
   background: none;
   height: 155px;
   right: 0px;
   padding-right: 0px;
} */

#navigator {
   /* margin-left: 50px; */
   top: 0 !important;
   padding-top: 10px;
}

#navigator .navigator_logo {
   background-image: url(/images/psoda_logo_orange_white.svg);
   background-repeat: no-repeat;
   background-position: left;
   background-size: auto 35px;
   margin-top: 0px;
   padding-top: 0px;
   padding-bottom: 0px;
   /* float: left; */
   margin-bottom: 0px;
   display: inline-block;
   width: calc(100% - 100px);
   height: 40px;
   vertical-align: middle;
}

#navigator #navigatorcontent .tree .delete_favourite_img {
   width: 15px;
   height: auto;
   margin-right: 0px;
	display: none;
}

#navigator.navigator_expanded #navigatorcontent .tree .delete_favourite_img {
	display: inline-block;
	opacity: 0;
}

#navigator #navigatorcontent .tree .delete_favourite_img svg {
	padding: 0px;
	border-radius: 0px;
	margin-top: 8px;
	pointer-events: none;
}

#navigator.navigator_expanded #navigatorcontent .tree .navigator_link:hover + .delete_favourite_img,
#navigator.navigator_expanded #navigatorcontent .tree .delete_favourite_img:hover, 
#navigator.navigator_expanded #navigatorcontent .tree .delete_favourite_img:focus {
	opacity: 1;
}

#navigator .navigator_logo.corrections {
   background-image: url(/images/brandlogos/corrections_logo_light.png);
   background-size: auto 40px;
}

#navigator .navigator_logo.electricity_authority {
   background-image: url(/images/brandlogos/ea_logo_light.svg);
   background-size: auto 40px;
}

#navigator .navigator_logo.linz {
   background-image: url(/images/brandlogos/linz_logo.png);
   background-size: auto 40px;
}

#navigator .navigator_logo.gns {
   background-image: url(/images/brandlogos/gns_logo_light.png);
   background-size: auto 40px;
}

#navigator .navigator_logo.massey_university {
   background-image: url(/images/brandlogos/massey_logo_light.png);
   background-size: auto 40px;
}

#navigator .navigator_logo.hcc {
   background-image: url(/images/brandlogos/hcc_logo_light.svg);
   background-size: auto 40px;
}

#navigator .navigator_logo.waikato_regional_council {
   background-image: url(/images/brandlogos/wrc_new_white.png);
   background-size: auto 40px;
}

#navigator .navigator_logo.moe {
   background-image: url(/images/brandlogos/moe_logo_light.png);
   background-size: auto 40px;
}

#navigator .navigator_logo.contactenergy {
   background-image: url(/images/brandlogos/contactenergy.svg);
   background-size: auto 40px;
}

#navigator .navigator_logo.powerco {
   background-image: url(/images/brandlogos/PowerCo_Logo.svg);
   background-size: auto 35px;
}


#backbutton .navigatorhelp,  #backbutton .navigatorback {
   display: none;
} 

/* #backbutton {
   padding-top: 0px;
   padding-bottom: 0px;
   height: 40px;
}

#backbutton img {
   margin-top: 15px;
} */

#navigator_hidden {
   z-index: 21;
   left: -4px;
}

/* #navigatorcontent {
   margin-top: 40px;
   padding-top: 10px;
} */

/* #content {
   margin-left: 50px;
} */

/* .flag_uk, .flag_us, .flag_za, .flag_cn, .flag_ru, .flag_ja {
   padding-left: 48px;
   margin-bottom: 10px;
   margin-top: 17.5px;
}


#themeDropdown > li {
   margin-bottom: 10px;
   background-image: url(/images/header/theme_white.svg);
} */

.navigator_expanded #menuDropdown > li {
   margin-top: 0px;
   padding-top: 6.5px;
   padding-bottom: 6.5px;
   padding-left: 5px;
   padding-right: 0px;
   width: calc(100% - 50px);
}

#menuDropdown > li {
   position: relative;
   cursor: pointer;
   text-decoration: none;
   padding-right: 5px;
   padding-left: 5px;
   margin-bottom: 0px;
   margin-top: 5px;
   padding-top: 10px;
   padding-bottom: 10px;
}

#menuDropdown > li:hover {
   background-color: var(--navigator_hover);
   border-radius: 5px;
}

#menuDropdown .status_state {
   margin-top: 0px;
   top: 8.5px;
   right: 8.5px;
}

#menuDropdown_li > .photo_letters {
   vertical-align: top;
}

.navigator_expanded #menuDropdown > li > .status_state {
   top: 5px;
}

#menuDropdown > li > .status_state {
   top: 8px;
   left: -17px;
   width: 5px;
   height: 5px;
}

.navigator_bottom_name_outer {
   display: none;
   color: var(--navigator_font);
   padding-left: 10px;
   margin-top: -2px;
   width: calc(100% - 40px);
}

.navigator_expanded .navigator_bottom_name_outer {
   display: inline-block;
}

.navigator_bottom_name {
   font-weight: bold;
   font-size: 1.1em;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.navigator_bottom_username {
   font-size: .8em;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.navigator_bottom_name_caret {
   /* background-image: url(/images/icons/white/vnext.svg);
   background-repeat: no-repeat;
   background-position: center;
   width: 8px;
   height: 8px; */
   padding-left: 10px;
   vertical-align: top;
   /* display: inline-block; */
}

.navigator_bottom_name_caret svg {
   transition: .2s ease;
   transform: rotate(0deg);
}

.menuOpen .navigator_bottom_name_caret svg {
   transform: rotate(180deg);
}

.navigator_bottom_name_caret.psoda_icon use, .notification_menu_bell #notification_icon use {
	fill: var(--navigator_font) !important;
}

/* .flag_uk {
   background-image: url(/images/nz_white.svg);
}

.flag_us {
   background-image: url(/images/header/us_white.svg);
}

.flag_za {
   background-image: url(/images/header/za_white.svg);
}

.flag_cn {
   background-image: url(/images/header/cn_white.svg);
}

.flag_ja {
   background-image: url(/images/header/ja_white.svg);
}

.flag_ru {
   background-image: url(/images/header/ru_white.svg);
} */

/* #themeDropdown li ul, #langDropdown li ul {
   left: 79px;
   top: auto;
 } */

 .navigator_expanded  #menuDropdown li ul {
   bottom: 45px;
   left: 5px;
   top: auto;
 }

/* FOR WHEN NAV IS SHUT */
 #menuDropdown li ul {
   bottom: 0px;
   left: 48px;
   top: auto;
 }

 /* #themeDropdown li ul {
   bottom: 130px;
 }

 #langDropdown li ul {
   bottom: 175px;
 } */

 .navigator_expanded #notificationDropdown li ul {
   bottom: 45px;
   left: 0px;
   top: auto;
 }

 /* FOR WHEN NAV IS SHUT */
#notificationDropdown li ul {
   bottom: 0px;
   left: 48px;
   top: auto;
 }

/* #menuDropdown, #notificationDropdown {
position: static;
} */

#lang_animation_div {
   top: 49px;
   left: 50px;
   background-color: #656565;
}

/* .backArrow {
   padding-left: 16px;
   padding-right: 0px;
   padding-bottom: 16px;
   background-repeat:no-repeat;
   background-position:center 5px;
   background-size:16px 16px;
   margin-right: -5px;
} */

#theme_animation_div {
   top: 90px;
   left: 50px;
   background-color: #656565;
}

#notification_animation_div {
   top: 56px;
   left: 40px;
   background-color: #656565;
}

#menu_animation_div {
   display: none;
   top: 102px;
   left: 36px;
   background-color: #656565;
}

#siteutils a.loginbutton {
color: white;
position: absolute;
   right: 8px;
   bottom: 40px;
}

.status_state {
border-radius: 100%;
border: 2px solid white;
margin-left: 42.5px;
height: 7.5px;
    width: 7.5px;
}

#menuDropdown .status_state {
   border: 2px solid var(--darker_shade_1);
}

.status_state.superuser {
   background: #0000FF;
}

.status_state.impers {
   background: #EA2424;
}

.status_state.active {
   background: #4DD965;
}

.status_state.offline {
   background: #AAAAAA;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: none) {
   /* IE10+ CSS */
   .displaylistcontrols .floatleft {
      width:60%;
   }
}

@supports (-ms-accelerator:true) {
   /* Edge 12+ CSS */
   .displaylistcontrols .floatleft {
      width:60%;
   }
}


/* Details tab */

.details_outer_standard_fields, .details_outer_custom_fields {
   column-count: 2;
   column-gap: 20px;
   row-gap: 20px;  
   position: relative;
}

.details_section_outer {
   width: calc(49% - 50px);
   /* -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow); */
   border: 1px solid #dadada;
   border-radius: 5px;
   background: #ffffff;
   display: inline-block;
   margin: 10px;
   padding: 15px;
   vertical-align: top;
   /* -webkit-column-break-inside: avoid;
   page-break-inside: avoid;
   break-inside: avoid;
   position: relative; */
}

.details_section_outer_full_width {
   width: calc(98% - 50px);
}

.details_section_header {
   margin-bottom: 15px;
}

.details_section_header .psoda_icon {
   width: 30px;
   height: 30px;
   margin-right: 10px;
   display: inline-block;
   vertical-align: middle;
}

.details_section_header div {
   font-size: 1.25em;
   font-weight: bold;
   display: inline-block;
   vertical-align: middle;
}

.details_section_inner {

}

.details_section_row {

}

.details_section_row .details_section_element {
   min-width: calc(75% - 30px);
   max-width: calc(99% - 30px);
}

.details_section_row.details_row_of_2 .details_section_element{
   min-width: calc(20% - 30px);
   max-width: calc(49% - 30px);
}

.details_section_row.details_row_of_3 .details_section_element{
   min-width: calc(20% - 30px);
   max-width: calc(33% - 30px);
}

.details_section_row.details_row_of_4 .details_section_element{
   min-width: calc(15% - 30px);
   max-width: calc(24% - 30px);
}

.details_section_row.details_full_width_element .details_section_element {
   width: calc(100% - 40px);
}

.details_section_element.details_third {
   width: calc(33% - 30px);
}

.details_section_element.details_half {
   width: calc(49% - 30px);
}

.details_section_element.details_full {
   width: calc(99% - 30px);
}

.details_section_element.details_full div {
   min-width: calc(75% - 30px) !important;
} 

.details_section_element.details_full div.wysiwyg_buttons, .details_section_element.details_full div.wysiwyg_button_div {
   min-width: auto !important;
}

.details_section_element {
   margin-bottom: 7.5px;
   margin-top: 7.5px;
   display: inline-block;
   margin-left: 15px;
   margin-right: 15px;
   vertical-align: top;
}

.details_section_label {
   color: #919191;
   font-size: .9em;
   letter-spacing: .25px;
   font-weight: bold;
   margin-bottom: 2px;
}

.details_section_description {
   font-size: .75em;
   color: #a5a5a5;
   font-style: italic;
   margin-top: 2px;
}

.details_section_content {
   /* word-break: break-word; */
}

.details_section_content > div, .details_section_label + div {
   min-height: 10px;
   word-break: break-word;
}

.details_section_content.details_rounded {
   padding-top: 2px;
   padding-bottom: 2px;
   padding-left: 10px;
   padding-right: 10px;
   color: white;
   border-radius:3px;
   text-align: center;
   font-weight: bold;
   background: #4ec66a;
   min-width: 100px;
   max-width: 125px;
}

.details_section_content.details_rounded.details_green {
   background: #4ec66a;
}

.details_section_content.details_rounded.details_amber {
   background: #FF8B2B;
}

.details_section_content.details_rounded.details_red {
   background: #FF3B3B;
}

.details_section_content.details_rounded.details_grey {
   background: #eaeaea;
   color: var(--font_grey);
}

.details_section_content .status_state {
   margin-left: 18px;
   margin-top: 2px;
}

.details_section_content .photo_thumbnail {
   margin-top: 2px;
   margin-bottom: 2px;
}

.details_section_row.details_geometry .details_section_element .details_section_content {
   font-size: .75em;
}

.details_section_underline {
   background: #eaeaea;
   width: 100%;
   height: 1.5px;
   margin-top: 7.5px;
   margin-bottom: 7.5px;
}

.details_vcard img {
   width: 20px;
   height: auto;
}

#super_user_pref_check_title {
   font-weight: bold;
}

#super_user_pref_check_input {
   margin-top: 5px;
   width: 400px;
   background-color: #f9f9f9;
   border: solid 1.5px #d7d7d7;
   border-radius: 5px;
}

#super_user_pref_check_search {
   display: inline-block;
   margin-left: 10px;
   background: #eaeaea;
   /* background: var(--main_colour); */
   padding: 7px;
   padding-left: 20px;
   padding-right: 20px;
   border-radius: 5px;
   cursor: pointer;
}

#super_user_pref_check_helper {
   margin-top: 10px;
   border: 1px solid #dadada;
    border-radius: 5px;
    padding: 5px;
}

#super_user_pref_check_helper_title {
   font-weight: bold;
   margin-bottom: 5px;
}


/*******************TOP BOXES *********************/

.top_left_breadcrumb,
.top_title,
.top_right_people {
   vertical-align: middle;
}

#top_hide_show_button {
   font-size: 10px;
   display: inline-block;
   vertical-align: initial;
   margin-left: 15px;
   position: relative;
   color: var(--font_grey);
   padding-top: 5px;
   padding-bottom: 5px;
}

#top_hide_show_button:hover {
   cursor: pointer;
}

#top_hide_show_button div {
   display: inline-block;
   vertical-align: bottom;
}

#top_hide_show_button.hide {
 display: none;
}

.top_left_breadcrumb {
   /* display: inline-block; */
   /* width: 33%; */
   float: left;
   /* margin-top: 15px;
   margin-left: -5px; */
   width: calc(100% - 140px);
   position: relative;
}

.breadcrumbs_no_workflow {
   width: calc(100% - 30px);
}

.top_left_breadcrumb div {
   display: inline-block;
   /* padding-left: 5px;
   padding-right: 5px; */
   font-weight: bold;
}

.top_left_breadcrumb .photo_letters {
   padding-left: 0px;
   padding-right: 0px;
   margin-left: 5px;
   margin-right: 5px;
}

.top_left_breadcrumb div .breadcrumb_left_right_a {
   padding-left: 8px;
   padding-right: 8px;
   padding-top: 3px;
   padding-bottom: 3px;
}

.breadcrumb_left_right_icons {
   vertical-align: unset;
   height: 8px;
   display: inline-block;
}

/* .top_left_breadcrumb div a:hover {
   background: #eaeaea;
   border-radius: 5px;
} */

.top_left_breadcrumb div .breadcrumb_text {
   color: var(--font_grey);
}

.top_left_breadcrumb div a img {
   width: 8px;
}

.breadcrumbs {
   font-size: 1em;
}

.breadcrumb_icon, .top_left_breadcrumb .photo_thumbnail {
   vertical-align: middle;
   /* opacity: .7; */
   margin-left: 5px;
   margin-right: 5px;
}

.breadcrumb_icon svg {
   vertical-align: middle;
}

/* .breadcrumb_separators {
   margin-left: 7.5px;
   margin-right: 2.5px;
} */

.breadcrumb_separators {
   width: 14px;
   height: 14px;
   /* background-image: url(/images/icons/darkgrey/breadcrumbseparator.svg);
   background-size: 10px;
   background-repeat: no-repeat;
   background-position: center; */
   vertical-align: middle;
   padding-left: 5px;
   padding-right: 5px;
}

.top_left_breadcrumb .status_state {
   display: none;
}

.breadcrumb_icon_org {
   border-radius: 100%;
   box-shadow: 0px 0px 5px #00000030;
   background-color: #ffffff;
}

.breadcrumb_menu_button {
   width: 24px;
   height: 24px;
   /* background-color: #eaeaea;
   border-radius: 5px; */
   display: inline-block;
   padding: 0px !important;
   vertical-align: middle;
   /* margin-left: 5px; */
   margin-right: 3px;
   cursor: pointer;
   position: relative;
   /* background-image: url(/images/icons/darkgrey/vnext.svg);
   background-position: center;
   background-repeat: no-repeat;
   background-size: 8px; */
   text-align: center;
}

.breadcrumb_menu_button .psoda_icon {
   margin-top: 3px;
   padding-left: 5px;
   padding-right: 5px;
   background-color: #eaeaea;
   border-radius: 5px;
}

.breadcrumb_menu_button .psoda_icon svg {
   transform: rotate(0deg);
   transition: .2s ease;
}

.breadcrumb_menu_button.breadcrumb_menu_open .psoda_icon svg {
   transform: rotate(180deg);
}

.breadcrumb_menu_button:hover img {
   background-color: #dddddd;
}

.breadcrumb_menu {
   position: absolute;
   left: 5px;
   top: 25px;
   background: #ffffff;
   border-radius: 10px;
   -webkit-box-shadow: 0px 0px 10px rgb(0 0 0 / 30%);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: 0px 0px 10px rgb(0 0 0 / 30%);
   z-index: 22;
   padding: 15px !important;
   min-width: 400px;
   display: none !important;
}

.breadcrumb_menu_button.breadcrumb_menu_open + .breadcrumb_menu {
   display: block !important;
}

.view_hierarchy_type, .breadcrumb_menu .view_hierarchy_type {
   display: block;
   color: #919191;
   font-size: .9em;
   letter-spacing: .25px;
   font-weight: bold;
   /* margin-bottom: 2px; */
   padding: 0;
}

.view_hierarchy_type img {
   margin-right: 5px;
   margin-bottom: -2px;
}

.view_hierarchy_type span, .view_hierarchy_name.textedit {
   margin-left: -2px;
   background-position: right 5px;
   padding-right: 15px !important;
   padding-top: 0px !important;
}

.view_hierarchy_type .psoda_icon {
   margin-left: 0px;
   padding-right: 5px !important;
}

.view_hierarchy_name, .breadcrumb_menu .view_hierarchy_name {
   display: inline-block;
   padding: 0;
   margin-bottom: 7.5px;
   vertical-align: top;
}

.view_hierarchy_current, .breadcrumb_menu .view_hierarchy_current {
   margin-bottom: 0px;
   width: auto !important;
   padding-top: 2px;
}

.view_hierarchy_name a, .breadcrumb_menu .view_hierarchy_name a {
   padding: 0;
}

.breadcrumb_menu .view_hierarchy_manager {
   padding-left: 10px;
}

.breadcrumb_menu .view_hierarchy_manager .photo_thumbnail {
   width: 20px;
   height: 20px;
   margin-top: -5px;
   opacity: 1;
}

.breadcrumb_menu .view_hierarchy_manager .status_state {
   width: 7.5px;
   height: 7.5px;
   margin-left: 17px;
   margin-top: -5px;
}

.breadcrumb_menu #top_asset_status.top_asset_status_archived, .breadcrumb_menu #top_asset_status.top_asset_status_deleted, .breadcrumb_menu #top_asset_status.top_asset_status_tempdeleted, .breadcrumb_menu #top_asset_status.top_asset_status_template, .breadcrumb_menu #top_asset_status.top_asset_status_suspended {
   margin-left: 5px;
   vertical-align: top;
}

.view_hierarchy_icon_org {
   position: absolute;
   top: 15px;
   right: 15px;
   border-radius: 100%;
}

.breadcrumb_menu_header {
   font-weight: bold;
   font-size: 1.1em;
   margin-bottom: 10px;
   padding: 0 !important;
}

.top_title {
   display: inline-block;
   /* width: 33%; */
   text-align: left;
   position: relative;
   /* width: 60%; */
   max-width: 800px;
   background: #f9f9f9;
}

#report_top_info .top_title {
   max-width: 900px;
}

#report_top_info #top_project_title_div {
   max-width: 680px;
}

.top_right_people {
   display: inline-block;
   /* width: 33%; */
   text-align: right;
   /* float: right; */
   margin-top: -4px;
   min-height: 38px;
}

.org_level .top_right_people {
   margin-top: -7px;
}

.top_right_people .photo_thumbnail {
   width: 35px;
   height: 35px;
   border: 2px solid #f9f9f9 !important;
}

.top_right_people .top_right_person {
   margin-right: -5px;
   display: inline-block;
   position: relative;
   cursor: pointer;
   transition: .1s ease;
}

.top_right_people .top_right_person:hover {
   transform: scale(1.1);
   z-index: 2;
}

.top_right_people .top_right_person.top_right_person_primary_contact {
   margin-right: 0;
}

#primary_contact_container > div > img.status_state{
   margin-left: 25px;
   z-index: 1;
   height: 11px;
   width: 10px;
}

#top_right_outer > div.top_right_people > div > div.top_right_person > img.status_state{
   margin-left: 25px;
   z-index: 1;
   height: 11px;
   width: 10px;
}

#top_right_outer > div.top_right_people > div > div.top_right_person >a.user_avatar >img.status_state{
   margin-left: 25px;
   z-index: 1;
   height: 11px;
   width: 10px;
}

.top_right_person .photo_letters {
   vertical-align: middle;
   border: 2px solid #f9f9f9;
}

.top_right_people>div {
   transition: .25s ease;
}

.top_right_people>div>div {
   transition: .25s ease;
}

.top_right_people>div:hover>div {
   /* margin-right: 0;
   margin-left: -5px; */
   z-index: 5;
}

/* .top_right_people .top_right_person>img:hover, .top_right_people .top_right_person .photo_letters:hover {
   transform: scale(1.1);
} */

.top_right_people #user_photo_top_header:hover {
   transform: scale(1);
}

.top_follow_bell {
   display: inline-block;
   padding-right: 20px;
}

#bell_dropdown {
   list-style: none;
   width: 100px;
   position: absolute;
   background-color: #ffffff;
   display: none;
   left: 0px;
   top: 10px;
   min-width: 160px;
   margin-top: -10px;
   box-shadow: var(--box_shadow);
   padding: 12px 16px;
   z-index: 3;
   text-align: left;
   border-radius: 10px;
}

#bell_dropdown li {
   padding: 5px 0px 5px 0px;
   cursor: pointer;
}

#bell_dropdown li:hover {
   font-weight: bold;
}


/* #bell_dropdown li:nth-child(1):hover {
   background-color: #00a470;
   color: white;
}

#bell_dropdown li:nth-child(2):hover {
   background-color: #ea6928;
   color: white;
} */

#bell_dropdown li:nth-child(2) {
   color: #ea6928;
}

.user_options_dropdown {
   list-style: none;
   width: 100px;
   position: absolute;
   background-color: #ffffff;
   display: none;
   right: 10px;
   /* top: 10px; */
   min-width: 160px;
   margin-top: 5px;
   box-shadow: var(--box_shadow);
   padding: 12px 16px;
   z-index: 2;
   text-align: left;
   color: var(--font_grey);
   border-radius: 5px;
}

.user_options_dropdown li {
   padding: 5px 0px 5px 0px;
   cursor: pointer;
}

.user_options_dropdown li:hover {
   font-weight: bold;
}
.user_options_dropdown li a {
   color: var(--font_grey);

}

.user_options_dropdown li:nth-child(3) {
   display: none;
}


/* .user_options_dropdown li:nth-child(2) {
   color: #ea6928;
} */

/* .top_left_breadcrumb>a {
   padding-left: 5px;
   padding-right: 5px;
} */



#details_caret {
   /* transition: .2s ease; */
   padding-right: 3px;
   padding-left: 3px;
   /* transform: rotate(-90deg); */
}

#details_caret svg {
   transition: .2s ease;
   transform: rotate(-90deg);
}

#details_text {
   padding-left: 5px;
}

#bell_outline_img,
#yellow_bell_img {
   vertical-align: middle;
}

#bell_outline_img:hover {
   cursor: pointer;
}

#yellow_bell_img:hover {
   cursor: pointer;
}

#user_photo_top_header {
   position: relative;
   width: auto;
   height: auto;
   text-align: right;
   padding-top: 0;
   border: none;
   display: inline-block !important;
}

.dropzone_progress_top_header {
   height: auto;
}

.top_title .status_state {
   height: 16px;
   width: 16px !important;
   border: none !important;
   margin-left: 60px;
   margin-top: 5px;
   /* transition: height 0.05s linear; */
   /* transition: all 0.05s ease; */
}

.top_title .photo_thumbnail {
   height: 80px;
   width: 80px !important;
   border: none !important;
   /* transition: height 0.05s linear; */
   /* transition: all 0.05s ease; */
}


/* .top_title .photo_thumbnail {
   height: 60px;
   width: 60px !important;
   border: none !important;
} */

#drag_drop_upload_user_photo {
   height: 80px;
   width: 80px !important;
   border: none !important;
   /* transition: height 0.05s linear; */
   /* transition: all 0.05s ease; */
}

#user_profile_pic_outer {
   display: inline-block;
   padding: 0px 10px 0px 0px;

   /* transition: height 1s;
     
   transition: width 1s; */
}

.no_access_user_photo {
   padding: 0px 10px 5px 0px;
}

#user_profile_pic_outer.smaller .photo_thumbnail {
  width: 35px !important;
  height: 35px;
}

#user_profile_pic_outer.smaller .photo_letters {
   font-size: 17.5px !important;
   width: 35px !important;
   padding-top: 5.8333333333333px !important;
   padding-bottom: 5.8333333333333px !important;
}

#user_profile_pic_outer.smaller .status_state{
   height: 7.5px;
   width: 7.5px !important;
   margin-left: 25px;
   margin-top: 2.5px;
}

#user_profile_pic_outer.smaller #profile_picture_camera_overlay_div{
   width: 35px;
    height: 35px;
}

#department_container {
   /* display:inline-block; */
   display: none;
}

#email_container {
   display:inline-block;
}

#email_container .psoda_icon svg {
   vertical-align: middle;
}

.top_right_user {
   text-align: left;
   padding-left: 10px;
}

.no_department {
   color: #dddddd;
}

.first_asset_header {
   margin-top: 20px;
   display: none;
}

.asset_header {
   margin-top: 20px;
}

.first_asset_header img, .asset_header img {
   max-width: 200px;
}

#primary_contact_text {
   font-weight: bold;
   text-align: left;
}

#user_photo_top_header.filedrop_hover {
   background: white;
   color: white;
   border: 2px dashed #00a470;
   animation: file_drop_rotation 8s linear infinite;
   padding: 3px;
   font-size: 1em;
   -webkit-border-radius: 100%;
   -moz-border-radius: 100%;
   border-radius: 100%;
}

@keyframes file_drop_rotation {
   0% {
       transform: rotate(0deg);
   }
   100% {
       transform: rotate(360deg);
   }
}

#user_photo_top_header.filedrop_hover .photo_thumbnail {
   animation: photo_file_drop_rotation 8s linear infinite;
   opacity: .5;
}

#user_photo_top_header.filedrop_hover .status_state {
   opacity: 0;
   transition: .25s ease;
   animation: photo_file_drop_rotation 8s linear infinite;
}

#user_photo_top_header.filedrop_hover #drag_drop_upload_user_photo {
   animation: photo_file_drop_rotation 8s linear infinite;
   opacity: .5;
}

@keyframes photo_file_drop_rotation {
   0% {
       transform: rotate(0deg);
   }
   100% {
       transform: rotate(-360deg);
   }
}

#user_photo_top_header.filedrop {
   border: 2px dashed transparent;
   padding: 3px;
   -webkit-border-radius: 100%;
   -moz-border-radius: 100%;
   border-radius: 100%;
   vertical-align: middle;
}

#user_profile_pic_outer .progress_indicator svg {
   width: 80px;
   height: 80px;
}

#user_photo_top_header .progress_indicator .green_animate {
   stroke: #7BC675;
   stroke-width: 9;
   fill: none;
   /*   2 * 3.14 * 37(radius)   */
   stroke-dasharray: 232.36;
   stroke-dashoffset: 232.36;
   transition: stroke-dashoffset 1s ease;
}

#user_photo_top_header.filedrop span {
   font-size: 0em;
}

#profile_picture_camera_overlay_div {
   width: 80px;
   height: 80px;
   bottom: 0;
   top: 0;
   left: 0;
   right: 0;
   padding: 3px;
   position: absolute;
   transform: scale(0);
   transition: 0.25s ease;
   transform-origin: 71px 71px;
   cursor: pointer;
}

#profile_picture_camera_overlay_div_inner {
   /* width: 100% !important;
   height: 100%;
   border: none !important; */
   width: 20px !important;
   height: 20px !important;
   background-color: #0000006b;
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 5px;
   padding-bottom: 5px;
   border-radius: 10px;
   margin-top: 50px;
   margin-left: 50px;
   border: none !important;
}

#profile_picture_camera_overlay_div_inner .psoda_icon svg {
   margin-top: -10px;
   margin-left: -2px;
}

#user_photo_top_header:hover #profile_picture_camera_overlay_div {
   transform: scale(1);
}

/* .temp_hide_details_img {
   height: 25px;
   width: 86px;
   position: absolute;
   top: 20px;
   left: 0px;
   background-image: url(/images/temp_hide_details.svg);
   background-repeat: no-repeat;
   animation: temp_img_pointing 10s linear;
   animation-fill-mode: forwards;
} */

@keyframes temp_img_pointing {
   0% {
       left: 42px;
       opacity: 1;
   }
   10% {
       left: 37px;
       opacity: 1;
   }
   20% {
       left: 42px;
       opacity: 1;
   }
   30% {
       left: 37px;
       opacity: 1;
   }
   40% {
       left: 42px;
       opacity: 1;
   }
   50% {
       left: 37px;
       opacity: 1;
   }
   60% {
       left: 42px;
       opacity: 1;
   }
   70% {
       left: 37px;
       opacity: 1;
   }
   80% {
       left: 42px;
       opacity: 1;
   }
   90% {
       left: 37px;
       opacity: .5;
   }
   100% {
       left: 42px;
       opacity: 0;
   }
}

#profile_image_uploader {
   height: 0.01px;
   width: 0.01px;
   opacity:0;
}

#bell_dropdown.open{
   display:block;
}

.user_options_dropdown.open{
   display:block;
}



/* TOOLBAR TOP HEADER MERGE START: */

.toolbar.modern_toolbar {
   display: none;
}

#breadcrumbs{
   /* height:50px; */
   /* padding-top: 5px; */
   margin-top: 10px;
   margin-bottom: 10px;
   display: flex;
   align-items: center;
}

#right_breadcrumb_buttons{
   float:right;
   /* margin-top: 7.5px; */
}

#help_button_div{
   /* background-image: url(/images/squareicons/icon_help_grey.svg); */
   /* background-image: url(/images/icons/darkgrey/help.svg); */
   background-color: #eaeaea;
   /* background-repeat: no-repeat;
   background-position: center;
   background-size: 12px 12px; */
   border-radius: 5px;
   margin-right:5px;
   /* width: 25px;
   height: 25px; */
   display: inline-block;
   vertical-align: middle;
   padding-top: 4px;
   padding-bottom: 4px;
   padding-left: 5px;
   padding-right: 5px;
}

#help_button_div .psoda_icon {
}

#help_button_div:hover {
   opacity: .8;
}

#help_button_div a{
   text-decoration: none;
   color:white;
}

.workflow_button_outer {
   display: inline-block;
   /* position:relative; */
}

#workflow_button_div {
   background-color:#eaeaea;
   color: var(--font_grey);
   cursor: pointer;
   width: 90px;
   /* height: 30px; */
   display: inline-block;
   vertical-align: middle;
   text-align: left;
   padding-left: 5px;
   padding-right: 5px;
   padding-top: 5px;
   padding-bottom: 5px;
   font-size: 12px;
   /* background-image: url(/images/icons/darkgrey/workflow.svg);
   background-repeat: no-repeat;
   background-size: 16px;
   background-position: 5px center; */
   border-radius: 5px;
   position: relative;
   margin-right: 6px;
}

#workflow_button_div img {
   display: inline-block;
   margin-left: 5px;
   transform: rotate(0deg);
   transition: .2s ease;
}

#workflow_button_div.open img {
   transform: rotate(180deg);
}

#workflow_button_div .workflow_button_div_icon {
   margin-right: 5px;
}

#workflow_button_div .workflow_button_div_caret {
   margin-left: 5px;
}

#workflow_button_div svg {
   vertical-align: middle;
}

#workflow_button_div .workflow_button_div_caret svg {
   transform: rotate(0deg);
   transition: .2s ease;
   margin-bottom: 2px;
}

#workflow_button_div.open .workflow_button_div_caret svg {
   transform: rotate(180deg);
}

#workflow_button_div:hover {
   background-color: #dddddd;
}

#workflow_button_menu {
   position: absolute;
   background-color: #ffffff;
   box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 20%);
   z-index: 32;
   text-align: left;
   padding-top: 10px;
   padding-bottom: 10px;
   padding-left: 20px;
   padding-right: 20px;
   min-width: 250px;
   max-width: 400px;
   right: 47px;
   top: 45px;
   border-radius: 10px;
   display: none;
}

#workflow_button_div.open + #workflow_button_menu {
   display: block;
}

#workflow_button_menu .psoda_dropdown_header {
   margin-bottom: 5px;
}

.workflow_menu_workflow {
   font-size: 1.1em;
   font-weight: bold;
}

.workflow_menu_state {
   background: #e5e5e5;
   text-align: center;
   font-size: 0.75em;
   /* height: 20px; */
   position: relative;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-weight: bold;
   color: #969696;
   border-top-right-radius: 20px;
   border-bottom-right-radius: 20px;
   border-top-left-radius: 5px;
   border-bottom-left-radius: 5px;
   box-shadow: 0px 0px 10px #00000047;
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   white-space: nowrap;
   width: 150px;
}

.workflow_menu_current_state, .workflow_menu_sub_state {
   background: var(--main_colour);
   color: #ffffff;
}

.workflow_menu_sub_state {
   margin-left: 15px;
   margin-top: 5px;
}

.workflow_menu_current_state_sub {
   box-shadow: none;
   background: unset;
   color: var(--main_colour);
   border: 1px solid var(--main_colour);
}

.workflow_menu_requested_transition {
   background: #ffffff;
   color: var(--main_colour);
}

.workflow_menu_request .psoda_icon {
   margin-right: 5px;
}


.workflow_menu_title {
   /* color: #686868; */
   /* text-transform: uppercase; */
   /* font-size: .85em; */
   margin-bottom: 5px;
   /* font-weight: bold; */
   color: #919191;
   margin-top:10px;
   font-size: .9em;
   font-weight: bold;
   letter-spacing: .25px;
}

.workflow_menu_sub_state_left, .workflow_menu_current_state_left, .workflow_menu_current_state_right {
   display: inline-block;
}

.workflow_menu_sub_state_left ~ .workflow_menu_current_state_right {
   vertical-align: bottom;
   margin-bottom: -2px;
}

.workflow_menu_current_state_left ~ .workflow_menu_current_state_right {
   vertical-align: middle;
}

.workflow_menu_current_state_right {
   margin-left: 20px;
}

.workflow_menu_prev_state span {
   font-size: .75em;
}

.workflow_menu_prev_state span:nth-child(1) {
   color: #919191;
   text-transform: uppercase;
   font-weight: bold;
}

.workflow_menu_authorisation .status_state, .workflow_menu_requested_by .status_state {
   margin-left: 17px;
}

.workflow_menu_requested_transition, .workflow_menu_requested_by {
   display: inline-block;
}

.workflow_menu_requested_by {
   margin-left: 20px;
}

.workflow_menu_note {
   margin-top: -5px;
   line-break: anywhere;
}
.workflow_menu_reason {
   margin-top: -5px;
   line-break: anywhere;
}

.workflow_menu_note_container, .workflow_menu_reason_container {
   padding:0.5em;
   margin-top:10px;
   border-radius: 5px;
}

.workflow_menu_note_container {
	background-color:rgba(0, 164, 112,0.1);
}


.workflow_menu_reason_container {
   background-color: rgba(234,166,13,0.1);
}

.workflow_menu_note_container .workflow_menu_title, .workflow_menu_reason_container .workflow_menu_title {
   margin-top:0px;
}

.workflow_menu_note_container .workflow_menu_title {
	color:rgba(0, 164, 112);
}


.workflow_menu_reason_container .workflow_menu_title {
	color: rgba(234,166,13,1);
}

.workflow_menu_requested_transition_outer {
   margin-top: 10px;
   background: #4e71b114;
   padding: 10px;
}

.workflow_menu_requested_transition_outer .workflow_menu_title {
   color: var(--main_colour);
   margin-top: 0px;
   font-weight: bold;
}

.workflow_menu_requested_transition_inner {
   margin-top: 7.5px;
}

.workflow_menu_authorise {
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 10px;
   padding-right: 10px;
   border: 1px solid var(--main_colour);
   color: var(--main_colour);
   display: inline-block;
   margin-right: 10px;
   border-radius: 5px;
}

.workflow_menu_authorise:hover {
   background-color: var(--lightest_shade_2);
}

.workflow_menu_approved_outer, .workflow_menu_archived_outer {
   display: inline-block;
}

.workflow_menu_approved_outer ~ .workflow_menu_archived_outer {
   margin-left: 50px;
}

.workflow_menu_underline {
   border-top: 1px solid #bfbfbf;
}

.workflow_menu_no_workflow {
   color: #919191;
   padding-bottom: 7.5px;
}

#workflow_menu_apply_workflow {
   background-color: var(--main_colour);
   color: #ffffff;
   padding-top: 5px;
   padding-bottom: 5px;
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 5px;
   margin-bottom: 12.5px;
   display: inline-block;
   cursor: pointer;
}

#workflow_menu_apply_workflow.workflow_menu_apply_workflow_hidden {
   display: none;
}

#workflow_menu_apply_workflow_menu {
   position: relative;
}

#workflow_menu_apply_workflow_menu.workflow_menu_apply_workflow_hidden {
   display: none;
}

#apply_workflow {
   display: inline-block;
   background: none;
   border: none;
   border-bottom: 1.5px solid #bababa;
   padding-left: 0;
   height: auto !important;
   width: 180px;
   min-width: 180px;
   max-width: 180px;
   padding: 5px;
   margin-bottom: 12.5px;
}

#workflow_menu_apply_workflow_menu label {
   display: block;
   font-size: .9em;
   position: relative;
}

#workflow_menu_apply_workflow_cancel {
   display: inline-block;
   font-size: .9em;
   cursor: pointer;
   margin-left: 20px;
}

#workflow_menu_apply_workflow_menu .circle_loader {
   position: absolute;
   left: 0;
   right: 0;
   bottom: 0;
   top: 0;
   margin: auto;
   border-color: var(--font) #505050 #505050 transparent;
}

#workflow_button_new {
   position: absolute;
   background: red;
   padding-left: 5px;
   padding-right: 5px;
   right: 47px;
   top: 7.5px;
   font-size: .65em;
   color: #ffffff;
   font-weight: bold;
   border-radius: 5px;
}


.workflow_button_notification {
	position:relative;
	border-radius: 50%;
	width:8px;
	height:8px;
	top:-31px;
	left:85px;
	border: 1px solid white;
}

#workflow_button_reason {
	background:rgba(234,166,13,1);
}

#workflow_button_note {
	background:rgba(0, 164, 112);
}



.workflow ~ #viewdetailscontent #workflow_button_new {
   top: 50px;
}


/* #admin_button_div {
   background-color:#eaeaea;
   cursor: pointer;
   width: 60px;
   height: 30px;
   display: inline-block;
   vertical-align: middle;
   text-align: left;
   padding-left: 10px;
   padding-top: 7px;
   padding-bottom: 7px;
   font-size: 12px;
   background-image: url(/images/icons/darkgrey/vnext.svg);
   background-repeat: no-repeat;
   background-size: 10px 10px;
   background-position: 50px center;
   border-radius: 5px;
   position: relative;
}

#admin_button_div:hover {
   background-color: #dddddd;
} */

#admin_actions_dropdown {
   top: 35px;
   right: 0px;
}

#top_info{
   /* background: #ffffff;
   width:calc(100% - 280px); */
   background: #f9f9f9;
   position: relative;
}

#top_info.sticky {
   position: fixed;
   top: 0;
   width: 100%;
   z-index:31;
   padding: 10px;
   box-shadow: 0px 5px 10px #8a8a8a52;
   background: #ffffff;
   /* padding-bottom: 6px; */
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
 }
 
 #top_info.sticky .top_title {
   padding-left: 7px;
   background: #ffffff;
 }

#top_info.top_info_with_image {
   margin-top: -5px;
}
#top_info.top_info_with_image.sticky {
   margin-top: 0;
   padding:5px;
}

#top_info.top_info_with_image.sticky #top_right_outer{
   margin-top: 5px;
    margin-right: 5px;
}


#top_search{
   /* float:right; */
   margin-right:20px;
   display: inline-block;
   vertical-align: middle;
   position: relative;
   /* padding-top: 5px; */
}

#quick_keywords_search_icon {
   position: absolute;
   left: 15px;
   top: -5px;
   z-index: 1;
   transition: all .1s;
}

#input_container.search_focused #quick_keywords_search_icon {
   left: -140px;
}

#quick_keywords_header {
   background-color: #F9f9f9;
   /* background-image: url(/images/icons/darkgrey/search.svg);
   background-repeat: no-repeat;
   background-position: left;
   background-size: 15px 15px;
   background-position-x: 10px; */
   outline: none;
   border-radius: 5px;
   font-size: 100%;
	-webkit-transition: all .1s;
	-moz-transition: all .1s;
   transition: all .1s;
   width: 125px;
   border: solid 1.5px #d7d7d7;
   padding: 9px 10px 9px 32px;
   height:10px;
   position: absolute;
   top: -13.5px;
   right: 0;
}

#quick_keywords_header::-ms-clear{
   display: none;
}

#input_container {
   position: relative;
   width: 175px;
}

#input_container.search_focused #quick_keywords_header {
   width: 250px;
	background-color: #f7f7f7;
   border:solid var(--main_colour) 1.5px;
   padding-right: 42px;
   /* position: absolute;
   top: -14.5px;
   right: 0; */
}

#quick_keywords_header:focus::placeholder {
   color: transparent;
 }

 #focused_search_button {
    display: inline-block;
    background-color: #f7f7f7;
    color:#FFFFFF;
    position: absolute;
    left: 0px;
    /* right: 20px;
    top:-6.5px; */
    height:18px;
    width:0px;
    line-height: 18px;
    border-radius: 2px;
    -webkit-transition: all .1s;
    -moz-transition: all .1s;
    transition: all .1s;
    text-align: center;
    font-size: 10px;
    cursor: pointer;
    padding: 0px;
    border: 0px;
    letter-spacing: .5px;
    /* background-image: url(/images/icons/darkgrey/risk_nochange.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 14px; */
 }


 #input_container.search_focused #focused_search_button {
   width:24px;
   /* padding-left: 10px;
   padding-right: 10px; */
}

.focused_search_button_div {
   width:0px;
   position: absolute;
   right: 27px;
   top:-6.5px;
   height:18px;
   transition: all .1s;
}

#input_container.search_focused  .focused_search_button_div {
   width:24px;
}

.focused_search_button_div .psoda_icon {
   position: absolute;
   left: 0;
   left: 4.5px;
   top: 1.5px;
   pointer-events: none;
}

#input_container .focused_search_button_div .psoda_icon svg {
   width: 0px;
   transition: all .1s;
}

#input_container.search_focused  .focused_search_button_div .psoda_icon svg {
   width: 14px;
   transition: all .1s;
}

 #focused_search_clear {
   display: inline-block;
   /* background-image: url(/images/icons/darkgrey/closepopup.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 50%; */
   position:absolute;
   height:20px;
   width:0px;
   right:0px;
   top:-8px;
   -webkit-transition: all .1s;
	-moz-transition: all .1s;
   transition: all .1s;
   cursor: pointer;
   /* display:none; */
}

#input_container.search_focused #focused_search_clear {
   /* height:27px; */
   width: 24px;
}

#focused_search_clear .psoda_icon svg {
   width:0px;
   transition: all .1s;
   /* margin-bottom: 2.5px; */
}

#input_container.search_focused #focused_search_clear .psoda_icon svg {
   width:10px;
   padding-left: 6px;
   padding-right: 6px;
}

#focused_types_button {
   display: inline-block;
   background-color: #eaeaea;
   position: absolute;
   right: 55px;
   top:-9px;
   height:18px;
   width:0px;
   line-height: 18px;
   border-radius: 5px;
   -webkit-transition: all .1s;
   -moz-transition: all .1s;
   transition: all .1s;
   font-size: 10px;
   cursor: pointer;
   padding: 0px;
   border: 0px;
   overflow: hidden;
   /* background-image: url(/images/icons/darkgrey/vnext.svg);
   background-size: 8px;
   background-position: calc(100% - 5px) center;
   background-repeat: no-repeat; */
   -webkit-user-select: none;
   -moz-user-select: none;
   user-select: none;
}

#focused_types_button:hover {
   background-color: #d4d4d4;
}

#input_container.search_focused #focused_types_button {
   width: auto;
   max-width: 60px;
   padding-left: 5px;
   padding-top: 2px;
   padding-bottom: 2px;
   padding-right: 5px;
   text-overflow: ellipsis;
   white-space: nowrap;
}

#focused_types_button .psoda_icon {
   margin-left: 5px;
}

.focused_types_dropdown_outer {
   display: none;
   right: 0px;
   top: 25px;
}

.focused_types_dropdown_outer .multiselect-wrapper {
   width: 400px;
}

.focused_types_dropdown_outer .multiselect-wrapper .view_notselected {
   height: 250px;
   width: 399.5px;
}

#search_types_dropdown_submit_search {
   margin-left: 10px;
   background-color: var(--lightest_shade_1);
   color: var(--main_colour);
}

.focused_types_dropdown_outer.open {
   display: block;
}


#search_and_replace_button {
   display: inline-block;
   vertical-align: middle;
   /* background-image: url(/images/icons/darkgrey/searchandreplace.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px 18px; */
   width: 30px;
   height: 30px;
   border-radius: 5px;
   cursor: pointer;
   background-color: #eaeaea;
   margin-top: 1px;
   /* vertical-align: top; */
   margin-left: -12px;
   margin-right: 10px;
}

#search_and_replace_button:hover {
   background-color: #dddddd;
}

#search_and_replace_button svg {
   padding: 6px;
}

#top_title_type{
   text-align: left;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-weight: bold;
   color: var(--font_grey);
   opacity: .75;
   font-size: .75em;
}

.top_title_type_icon {
   display: inline-block;
   vertical-align: middle;
   padding-right: 5px;
   height: 16px;
}

.top_title_type_string {
   display: inline-block;
   vertical-align: middle;
}

#top_title_type.hide{
display:none !important;
}

#breadcrumbs.padded{
 padding-bottom:49px;
}

.top_info_with_image #top_title_type {
   /* width: 90px;
   text-align: center; */
}

.top_info_with_image #top_project_title_div, .top_info_with_image #top_edit_div, .top_info_with_image #top_options_div, .top_info_with_image #top_follow_bell_div, .top_info_with_image #top_add_button_outer, .top_info_with_image #top_hide_show_button_div, .top_info_with_image #top_asset_status {
   margin-top: -25px;
}

.top_info_with_image.sticky #top_project_title_div, .top_info_with_image.sticky #top_edit_div, .top_info_with_image.sticky #top_options_div, .top_info_with_image.sticky #top_follow_bell_div, .top_info_with_image.sticky #top_add_button_outer, .top_info_with_image.sticky #top_hide_show_button_div, .top_info_with_image.sticky #top_asset_status {
   margin-top: 0px;
}
 
.top_info_with_image #top_title_type {
   display: block;
   margin-left: 100px;
   margin-top: -37px;
   margin-bottom: 20px;
}

#top_title_inner{
   display: inline-block;
   text-align: left;
   width: 100%;
}

#top_title_inner>div{
   display: inline-block;
   vertical-align: middle;
}

#top_project_title_div{
   padding-right: 8px;
   text-align: left;
   /* max-width: 50%; */
   max-width: 380px;
}

#top_project_title_div.top_project_title_div_with_archived {
   max-width: 325px;
}

#top_project_title_div p{
   font-size: 1.75em;
   display: inline-block;
   vertical-align: middle;
   margin: 0;
   font-weight: bold;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
   width: 100%;
   height: 32.1px;
   /* max-width: 75%; */
   /* padding-bottom: 10px; */
}

#top_project_title_div p.textedit{
   font-size: 1.75em;
   display: inline-block;
   vertical-align: middle;
   margin: 0;
   font-weight: bold;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
   width: 100%;
   height: 32.1px;
   /* max-width: 75%; */
   /* padding-bottom: 10px; */
   cursor: pointer;
   background-image: none;
   background-repeat: no-repeat;
   background-position: top right;
   background-size: 7px 7px;
   padding-right: 0px;
   margin-left: 0px;
}

#top_project_title_div .textedit_active input {
   font-size: 1em;
   font-weight: bold;
   color: var(--font_grey);
   /* width: 107px !important; */
   padding: 0;
   cursor:text;
   background:#eaeaea;
   border:none;
   /* outline: none; */
}

#top_project_title_div .textedit_wait input {
   width: 100%;
   font-size: 1em;
   font-weight: bold;
   color: var(--font_grey);
   background:#eaeaea;
   border:none;
   padding: 0;
}

#top_project_title_div .under_text_field_counter {
   display: none;
}

#top_project_title_div .textedit_wait.inlineedit_error {
   width: auto !important;
   height: auto !important;
}

#top_project_title_div #input_error {
   /* margin-top: -35px; */
   pointer-events: none;
   /* display: inline-block; */
   font-size: 12px;
   padding-left: 0px;
}

#top_project_title_div #input_error ~ em {
   font-size: .5em;
   pointer-events: none;
}

#top_edit_div {
   /* background-image: url(/images/icons/darkgrey/edit.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 17px 17px; */
   /* padding-right: 10px; */
   width: 30px;
   height: 30px;
   border-radius: 5px;
   cursor: pointer;
   /* margin-left: 20px; */
}

#top_edit_div .psoda_icon svg,
.report_top_buttons svg {
   padding: 6.5px;
}

#top_edit_div.edit_locked .psoda_icon svg {
	padding: 3px;
}

#top_edit_div.edit_locked {
   /* background-image: url(/images/icons/red/blockedit.svg); */
   background-color: #ffdddd;
   /* background-size: 24px 24px; */
	cursor: default;
}

#top_edit_div.edit_locked:hover {
   background-color: #ffdddd;
}

#edit_asset_link_header{
   /* width: 30px;
   height: 30px; */
}



#top_options_div {
   /* background-image: url(/images/icons/darkgrey/threedot.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px 18px; */
   /* padding-right: 10px; */
   width: 30px;
   height: 30px;
   border-radius: 5px;
   cursor: pointer;
   position: relative;
}

#top_options_div > .psoda_icon svg {
   padding: 6px;
}

#header_actions_dropdown .psoda_icon svg {
   padding-right: 10px;
}

#top_options_div_report {
   /* background-image: url(/images/icons/white/sort-down.svg);
   background-repeat: no-repeat;
   background-position: 5px center;
   background-size: 16px 16px; */
   /* padding-right: 10px; */
   width: 87.5px !important;
   /* height: 30px;
   border-radius: 5px;
   cursor: pointer;
   position: relative;
   background-color: var(--main_colour);
   color: #FFFFFF; */
}

#top_options_div_report:hover {
   background-color: var(--lighter_shade_1);
}

#top_options_report_down_icon {
   margin-right: 5px;
} 

/* #top_options_div_report p{
   text-align: center;
   color: #FFFFFF;
   margin: 6px;
   padding-left: 20px;
}

#top_options_div_report p span{
   margin-left: 5px;
} */

#top_options_div_report .header_actions_dropdown{
   top: 35px;
   left: 0px;
   min-width: 210px;
}


#top_options_div .header_actions_dropdown {
   top: 35px;
   left: 0px;
   min-width: 225px;
}

#top_follow_bell_div{
   /* background-image: url(/images/icons/darkgrey/notification.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px 18px; */
   /* padding-right: 10px; */
   width: 30px;
   height: 30px;
   border-radius: 5px;
   position: relative;
   display: inline-block;
   cursor: pointer;
}

#top_follow_bell_div.active_follows{
   /* background-image: url(/images/icons/darkgrey/notification_on.svg); */
   background-color: #FAEAC8;
}

#top_follow_bell_div.active_follows:hover {
   background-color: #f1ddb0;
}

#top_edit_div:hover, #top_options_div:hover, #top_follow_bell_div:hover {
   background-color: #dddddd;
}

#top_follow_bell_icon svg {
   padding: 6px;
}

#top_follow_bell_div.active_follows #top_follow_bell_icon svg use {
   fill: #F2B126 !important;
}

.top_small_button{
   background-color: #eaeaea;
   margin-left:3px;
   margin-right:3px;
}

#top_rag_status{
   margin-right:20px;
}

#top_rag_status + #top_asset_status {
   margin-left: -10px;
}

#top_asset_status {
   margin-right: 20px;
   margin-left: 0px;
   border-radius: 10px;
   height: 16px;
  line-height: 16px;
   padding-left:10px !important;
   padding-right:10px;
   padding-top: 3px;
   padding-bottom: 2px;
   text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1.5px;
  font-size: .7em;
}

#top_asset_status.top_asset_status_archived {
   background: #eaeaea;
   color: #828282;
}

#top_asset_status.top_asset_status_archived.top_asset_status_locked {
   background: #F9EBEB;
   color: #f46464;
}

#top_asset_status.top_asset_status_template {
   background: #f0e3fc;
   color: #a442ff;
}

#top_asset_status.top_asset_status_deleted,
#top_asset_status.top_asset_status_suspended {
   background: #F9EBEB;
   color: #f46464;
   margin-left: 0px;
}

#top_asset_status.top_asset_status_tempdeleted {
   background: #F9EFE6;
   color: #f58836;
   margin-left: 0px;
}

#top_asset_status.top_asset_status_trial_org {
   background: #00a470;
   color: #ffffff;
   margin-left: 0px;
}

#top_add_button_outer {
   position: relative;
}

#top_add_button, #top_options_div_report {
   /* background-image: url(/images/icons/white/new.svg);
   background-repeat: no-repeat;
   background-position: left;
   background-size: 15px 15px; */
   width: 70px;
   font-size: 1em;
   border-radius: 5px;
   cursor: pointer;
   background-color: var(--main_colour);
   color:#FFFFFF;
   background-position-x: 5px;
   padding-left: 5px;
   padding-top: 2.5px;
   padding-bottom: 2.5px;
   line-height: 25px;
   margin-left: 3px;
   margin-right: 3px;
   position: relative;
}

#top_add_button:hover {
   background-color: var(--lighter_shade_1);
}

#top_add_button #add_plus {
   margin-right: 5px;
}

#top_add_button #add_plus svg, #top_options_report_down_icon svg {
   margin-bottom: -1.5px;
}

#add_caret {
   margin-left: 10px;
}

#add_caret svg {
   transform: rotate(0deg);
   transition: .2s ease;
}

#top_add_button.top_add_button_open #add_caret svg {
   transform: rotate(180deg);
}
/* new_light */

.header_actions_dropdown{
   overflow: hidden;
    list-style: none;
    position: absolute;
    background-color: #ffffff;
    height: 0px;
    box-shadow: var(--box_shadow);
    z-index: 32;
    text-align: left;
    /* transition: .20s; */
    padding: 0px;
    max-height: 0px;
    /* width: 0px; */
    min-width: 200px;
    right: 20px;
    top: 20px;
    border-radius: 10px;
    color: var(--font_grey);
}

.header_actions_dropdown.open{
   height: auto;
   padding: 10px 0px 10px 0px;
   max-height: 550px;

}

.header_actions_dropdown div{
   margin-left:5px;
   margin-right:5px;
   padding: 5px 15px 5px 15px;
   cursor: pointer;
}

.header_actions_dropdown img{
   margin-right: 10px;
   vertical-align: top;
}

.header_actions_dropdown a{
   color: var(--font_grey);

}

#header_dropdown_delete_div, .actions_menu_delete div {
   color: var(--icon_red);
}

.actions_menu_delete {
   border-top: 1px solid #eaeaea;
   padding-top: 5px;
}

.actions_menu_amber div {
   color: #FF8B2B;
}

.actions_menu_green div {
   color: #4EC66A;
}

.header_dropdown_item_top_line{
   border-top: solid 1px #eaeaea;
   padding-top: 10px !important;
   margin-top: 10px;
}

.header_actions_dropdown div:hover {
   background-color: #f0f0f0;
   border-radius: 5px;
   /* font-weight: bold; */
}

#top_right_outer{
   display: inline-block;
   float: right;
   /* max-width: 30%; */
}

.top_info_with_image #top_right_outer {
   margin-top: 15px;
}

#top_right_user_info{
   display: inline-block;
   margin-top: 2px;
    vertical-align: top;
}
.top_right_user_info{
   display: inline-block;
   padding-right: 10px;
   vertical-align: middle;
}

#top_rag_status div{
     color: #FFFFFF;
    border-radius: 10px;
    height: 16px;
   line-height: 16px;
    border-left: none !important;
    /* padding-left: 10px;
    padding-right: 20px;
    width: 50px; */
    padding-left:8px !important;
    padding-right:8px;
    text-transform: uppercase;
   font-weight: bold;
   letter-spacing: 1.5px;
   font-size: .7em;
}

#top_rag_status div.dropdown {
    /* background-image: url(/images/icons/white/vnext.svg); */
    /* background-size: 8px 8px; */
    /* background-position: center right; */
    /* background-position: right 7px center;
    background-repeat: no-repeat; */
    padding-right:18px !important;
    cursor: pointer;
    min-width: 0px;
    width: auto !important;
}

/* #top_rag_status>.displaylist_lightgrey.dropdown{
   background-image: url(/images/icons/darkgrey/vnext.svg) !important;
} */

#top_rag_status>.displaylist_lightgrey{
   color: #888888 !important;
   background-color: #eaeaea;
}
#top_rag_status>.displaylist_purple{
   background-color: #8A2BE2;
}

#top_rag_status>.displaylist_blue{
   background-color: #0c78e5 ;
}
#top_rag_status>.displaylist_grey{
   background-color: #BBBBBB;
}
#top_rag_status>.displaylist_green{
   background-color: #4ec66a ;
   /* width: 38px !important; */
}
#top_rag_status>.displaylist_amber{
   background-color: #ff8b2b;
}
#top_rag_status>.displaylist_red{
   background-color: #ff3b3b ;
}

#top_rag_status>.displaylist_lightgrey select{
   color: #888888 !important;
   background-color: #eaeaea;
}
#top_rag_status>.displaylist_blue select{
   background-color: #0c78e5 ;
}
#top_rag_status>.displaylist_grey select{
   background-color: #BBBBBB;
}
#top_rag_status>.displaylist_green select{
   background-color: #4ec66a ;
   /* width: 63px !important; */
}
#top_rag_status>.displaylist_amber select{
   background-color: #ff8b2b;
}
#top_rag_status>.displaylist_red select{
   background-color: #ff3b3b ;
}
#top_rag_status>.displaylist_purple select{
   background-color: #8A2BE2 ;
   /* width: 63px !important; */
}



#top_rag_status select{
   border-radius: 10px;
   color: #FFFFFF;
   height: 18px;
   /* padding-left: 10px; */
   /* padding-right: 20px; */
   min-width: 0px !important;
   /* width: auto !important; */
   /* font-size: 10pt; */
   padding: 0px;
   /* width: 100%; */
   border:none !important;
   /* width: calc(100% + 7px) !important; */
   padding-left:2px !important;
   text-transform: uppercase;
   font-weight: bold;
   letter-spacing: 1.5px;
   font-size: 9px;
   /* margin-left: -7px; */
   cursor: pointer;
}

#top_rag_status select option{
   background-color: #ffffff;
   color: var(--font_grey);
   /* text-transform: uppercase; */
   text-transform: none;
   font-size: 1.5em;
}

#top_rag_status select:disabled {
   cursor: default;
}

/* ADD MENU start */

/* .toolbar_add_button {
   background-image: url(/images/white/new.svg);
   background-repeat: no-repeat;
   background-size: 20px;
   background-position: 20px center;
   background-color: #00a470;
   width: 45px;
   padding: 10px;
   margin: 0;
   padding-left: 45px;
   border-radius: 5px;
   text-align: center;
   color: #ffffff;
   cursor: pointer;
   padding-top: 10px;
   padding-bottom: 10px;
   margin-top: 20px;
   margin-right: 20px;
   font-size: 9pt;
   border: none;
   float: right;
   transition: .1s ease;
}

   .toolbar_add_button.add_button_shrink {
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   margin-top: 10px;
} */

/* .toolbar_add_button:hover {
   background-color:#0ab47e; */
   /* border: 1px solid #7d7d7d;
  -webkit-border-radius:2px;
  -moz-border-radius:2px;
  border-radius:2px; */
/* }  */

/* .toolbar_add_down_arrow {
   width: 10px;
   height: 10px;
   margin-left: 3px;
   margin-bottom: -1px;
   background-image: url(/images/icons/white/vnext.svg);
   background-repeat: no-repeat;
   background-size: 10px;
   display: inline-block;
} */

#add_menu_dropdown {
   display: none;
   max-width: calc(100vw - 120px);
   width: intrinsic;           /* Safari/WebKit uses a non-standard name */
  width: -moz-max-content;    /* Firefox/Gecko */
  width: -webkit-max-content; /* Chrome */
  width: max-content;
   /* min-width: 50vw; */
   background: white;
   position: absolute;
   -moz-box-shadow: var(--box_shadow);
   -webkit-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
   z-index: 32;
   top: 35px;
   left:35px;
   /* left:0px !important; */
   padding: 10px;
   /* margin-left: calc((-100vw - 100px)/2); */
   overflow:auto;
   max-height: 70vh;
   border-radius: 10px;
}

#add_menu_dropdown.open {
   display:block;
}

/* #save_report_button{
   padding-left: 10px;
   padding-right: 10px;
} */

.add_menu_icon {
   margin-left: -41px;
   background: var(--lightest_shade_1);
   padding: 6px;
   vertical-align: text-top;
   margin-bottom: -27px;
   display: inline-block;
   margin-right: 4px;
   margin-top: 5px;
   border-radius: 5px; 
}

.add_menu_icon svg {
   margin-bottom: -4px;
}


#save_report_button{
   /* background-image: url(/images/icons/darkgrey/save.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px 18px; */
   width: 30px;
   height: 30px;
   border-radius: 5px;
   /* margin-left: 20px; */
}

#rerun_report_button{
   /* background-image: url(/images/icons/darkgrey/refresh.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px 18px; */
   width: 30px;
   height: 30px;
   border-radius: 5px;
   margin-left: 20px;
}

#rerun_report_button:hover, #save_report_button:hover {
   background-color: #dddddd;
}

#rerun_link_header{
   width: 30px;
   height: 30px;
}

#rerun_report_button.highlight_rerun_report_button {
   width: 27px;
   height: 27px;
   border: 1.5px solid var(--main_colour);
   background-color: var(--lightest_shade_1);
   /* background-image: url(/images/icons/theme_night/refresh.svg); */
}

#rerun_report_button.highlight_rerun_report_button .psoda_icon svg {
   padding: 5px;
}

#rerun_report_button.highlight_rerun_report_button .psoda_icon use {
   fill: var(--main_colour) !important;
}

#rerun_message_div {
   position: absolute;
   background: white;
   box-shadow: var(--box_shadow);
   padding: 10px;
   border-radius: 5px;
}

#rerun_message_div_triangle {
   position: absolute;
   height: 18px;
   pointer-events: none;
   top: -10px;
   left: 4px;
}

#report_top_info.sticky #rerun_message_div {
   top: 50px !important;
}

#save_link_header{
   width: 30px;
   height: 30px;
}

#report_top_info{
   /* padding-top: 20px; */
    padding-bottom: 20px;
    margin-bottom: 10px;
    margin-left: -20px;
    padding-left: 20px;
    margin-right: -10px;
    /* box-shadow: 0px 7px 7px -7px rgba(0, 0, 0, 0.3); */
    background: #f9f9f9;
}

#report_top_info .top_title {
   background: #f9f9f9;
}

#report_top_info.sticky {
   position: fixed;
   top: 0;
   width: 100%;
   z-index:16;
   padding: 10px;
   box-shadow: 0px 5px 10px #8a8a8a52;
   background: #ffffff;
 }
 
 #report_top_info.sticky .top_title {
   padding-left: 7px;   
   background: #ffffff;
}

#report_content {
  background: #ffffff;
  -webkit-box-shadow: var(--box_shadow);
  -moz-box-shadow: var(--box_shadow);
  box-shadow: var(--box_shadow);
  padding: 10px;
  border-radius: 5px;
  margin-top: 17px;
  /* width: max-content; */
  height: calc(100vh - 150px);
  overflow: auto;
}

.customise_report_tab {
	/* text-align:right; */
   margin-top: 5px;
   margin-bottom: 10px;
}

.customise_report_tab a {
   padding-top: 5px;
   padding-bottom: 5px;
   vertical-align: middle;
   background-color: #eaeaea;
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 5px;
   color: var(--font_grey);
   cursor: pointer;
}

.customise_report_tab .psoda_icon {
   margin-right: 5px;
   vertical-align: middle;
}

.customise_report_tab a:hover {
   background-color: #dddddd;
}

/* .deleted_object {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
	background-size: 15%;
	opacity: 0.5;
	pointer-events: none;
	background-image: url(/images/icon_delete_transparent.svg);
	background-repeat: no-repeat;
} */

.upgrade_trial_button input {
   border: none;
   background: unset;
   color: var(--font_grey);
   font-family: var(--font_family);
   cursor: pointer;
   padding: 0;
}

.upgrade_trial_button input:hover {
   font-weight: bold;
}

/********************************* SIDEBAR *********************************/

.add_menu_dropdown_title { 
   text-align: center;
   font-weight: bold;
}

#add_menu_dropdown .toolbar_menu_section {
   /* float: right; */
   float: left;
   width: 200px;
}

#add_menu_dropdown .toolbar_menu_section.large_section {
   width: 400px;
}

#add_menu_dropdown .toolbar_menu_section h3 {
   top: auto;
   bottom: -25px;
   background-color: unset;
   color: var(--font_grey);
   opacity: .75;
   text-transform: uppercase;
   letter-spacing: 1.5px;
   font-size: 0.7em;
   text-align: center;
}

#add_menu_dropdown .toolbar_button, #add_menu_dropdown .toolbar_tiny_button {
   width: 200px;
   height: 50px;
   margin-top: 5px;
   margin-bottom: 5px;
   float: left;
}

#add_menu_dropdown .toolbar_button:hover, #add_menu_dropdown .toolbar_tiny_button:hover {
   background: #f7f7f7;
   border-radius: 5px;
}

#add_menu_dropdown .toolbar_button a, #add_menu_dropdown .toolbar_tiny_button a {
   margin-left: 0px;
   margin-top: 0px;
   padding-top: 2px;
   margin-bottom: 0px;
   padding-bottom: 2px;
   margin-right: 0px;
   padding-right: 2px;
   float: left;
   display: block;
   background-repeat: no-repeat;
   /* background-position: 5px;
   background-size: 35px 35px; */
   background-position: 10px, 3px;
   background-size: 25px 25px, 38px 38px;
   padding-left: 45px;
   font-size: 9pt;
   font-weight: bold;
   width: 150px;
   height: calc(100% - 4px);
   text-align: left;
}

#add_menu_dropdown .toolbar_button .button_description, #add_menu_dropdown .toolbar_tiny_button .button_description {
   font-weight: 100;
   font-size: 8pt;
   color: #919191;
}

#add_menu_dropdown .toolbarbutton, #add_menu_dropdown .widetoolbarbutton, #add_menu_dropdown .toolbarbutton_nolabel, #add_menu_dropdown .widetoolbarbutton_nolabel {
   display: block;
   padding: 0px;
   width: 24px;
   height: 24px;
   background-repeat: no-repeat;
   background-position: center center, center center;
   background-size: 24px 24px, 40px 40px;
   text-align: center;
   font-size: 20px;
   color: var(--font)!important;
}

#add_menu_dropdown .toolbar_tiny_button .selfimage img {
   width: 35px;
   height: auto;
}

#add_menu_dropdown .toolbar_tiny_button .selfimage span {
   vertical-align: top;
}


.search_highlight {
   background-color: yellow;
 }
/***** TOP BoX END *******/



/******************/
/* SCHEDULE GANTT */
/******************/

#gantt_chart text{
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}

#plot_gantt_chart {
	width: 100%; 
   height: 100%;
   position: relative;
   min-width: 24.5%;
   max-width: 100%; 
}

#gantt_chart {
   width: 100%; 
   height: 100%;
   position: relative;
   min-width: 24.5%;
	max-width: 89%; 
   float: right;
}

#gantt_chart:before {
   content: "";
   background-color: transparent;
   position: absolute;
   width: 5px;
   height: 100%;
   left: -2.5px;
   z-index: 1;
   cursor: col-resize;
}

.toggle_gantt_container {
   margin-top:25px;
   height: 50px;
}

.toggle_gantt_button {
   cursor:pointer;
   height:24px;
   border:none;
   width: 40px;
   margin-top: -13px;
   position: absolute;
   right: 0;
   z-index: 1;
   display: inline-block;
}

.toggle_gantt_slider {
   position: absolute;
   cursor: pointer;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: #ccc;
   border-radius: 34px;
}

.toggle_gantt_button > .toggle_gantt_slider:before {
   border-radius: 500px;
   box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
   height: 24px;
   width: 24px;
   bottom: 4px;
   top: 0px;
}

.toggle_gantt_button.disabled > .toggle_gantt_slider {
   background-color: #ccc;
}

.toggle_gantt_button.enabled > .toggle_gantt_slider {
   background-color: var(--main_colour);
}

.toggle_gantt_button.disabled > .toggle_gantt_slider:before {
   position: absolute;
   content: "";
   left: -1px;
   background-color: white;
}

.toggle_gantt_button.enabled > .toggle_gantt_slider:before {
   position: absolute;
   content: "";
   right: -1px;
   background-color: white;
}

.toggle_gantt_button:focus {
   /* outline: none; */
}

#toggle_gantt_text {
   border:none;
   margin-top: -8px;
   position: absolute;
   right: 50px;
   z-index: 1;
   font-size: 0.85em;
}

.gantt_footer {
   margin-top: 10px;
}

.zoom_button {
   width: 24px; 
   height: 24px;
   background-color: #eaeaea;
   color: var(--font_grey);
   float: right;
   margin-left: 15px;
   margin-right: 15px;
   border-radius: 1px;
   cursor: pointer;
   text-align: center;
   vertical-align: middle;
   line-height: 24px;
   font-size: 15px;
   color: #828282;
   user-select: none;
   border-radius: 5px;
}

.zoom_to_fit_button {
   height: 24px;
   background-color: #eaeaea;
   float: right;
   border-radius: 1px;
   cursor: pointer;
   text-align: center;
   line-height: 25px;
   font-size: 11px;
   color: var(--font_grey);
   user-select: none;
   padding-left: 7px;
   padding-right: 7px;
   border-radius: 5px;
}

.link {
   stroke:#DAE0D5;
   stroke-width:1.5;
   fill:none;
}

.link.selected {
   stroke-width:3.5;
   fill:none;
}

.link:hover {
   stroke-width:3.5;
   fill:none;
}

#zoom_slidecontainer {
   width: 100px;
   float: right;
}

#zoom_slideinput {
   -webkit-appearance: none;  
   appearance: none;
   width: 100%; 
   height: 2px; 
   background: #d3d3d3; 
   outline: none; 
   border-radius: 1px;
}

#zoom_slideinput:hover {
   opacity: 1; 
}

#zoom_slideinput::-webkit-slider-thumb {
   -webkit-appearance: none;
   appearance: none;
   width: 6px;
   height: 24px;
   border: 0;
   background: #828282;
   cursor: pointer;
   border-radius: 3px;
}

#zoom_slideinput::-moz-range-thumb {
   width: 6px;
   height: 25px;
   border: 0;
   background: #828282;
   cursor: pointer;
   border-radius: 3px;
}

/*****************/
/* SVG SIGNATURE */
/*****************/

.svg_signature {
   width: 500px;
   height: 100px;
}

.svg_signature.disabled {
   pointer-events: none;
   opacity: 0.4;
}

.svg_signature_background {
   x: 0;
   y: 0;
   width: 100%;
   height: 100%;
   fill: #f8f9fb;
   stroke: #c2c8d2;
   stroke-width: 2;
}

.signature_signed_by_div {
   margin-top: -15px;
   font-size: 12px;
   font-style: italic;
}

.signature_signed_by_div.disabled {
   opacity: 0.8;
   margin-top: 0px;
}

.signature_clear_button {
   background:none;
   border:none;
   margin:0;
   padding:0;
   cursor: pointer;
   display: block;
   position: relative;
   left: 470px;
   z-index: 1;
   color: var(--main_colour);
}

.signature_clear_button:hover {
   color: var(--lighter_shade_1);
}

.signature_clear_button.disabled {
   pointer-events: none;
   opacity: 0.4;
}

/***********************/
/* Table height resize */
/***********************/

.table_height_resize_handle {
    display: flex;
    width: 25%;
    height: 15px;
    margin: auto;
    user-select: none;
    /* background-image:url("/images/icon_table_height.svg");
    background-repeat:no-repeat;
    background-position: center;
    background-size:12px; */
    margin-bottom: 5px;
    cursor: row-resize;
    border-radius: 5px;
}

.table_height_resize_handle .psoda_icon svg {
   transform: rotate(45deg);
}

.table_height_resize_handle .psoda_icon {
   margin: auto;
   margin-top: -3px;
   pointer-events: none;
}

.layout_dashboard .table_height_resize_handle {
   display: none;
}

.table_height_resize_handle:hover  {
    background-color: #f0f0f0; 
}

#table_height_resize_ui_element_outer {
   position: absolute;
   background: white;
   box-shadow: var(--box_shadow);
   padding: 10px;
   border-radius: 5px;
   bottom: 30px;
   left: 0;
   right: 0;
   margin-left: auto;
   margin-right: auto;
   text-align: center;
   display: table;
}

#table_height_resize_ui_element {
   font-size: .9em;
   font-weight: bold;
}

#table_height_resize_ui_element_triangle {
   width: 20px;
   position: absolute;
   transform: rotate(180deg);
   bottom: -9px;
   left: 0;
   right: 0;
   margin-left: auto;
   margin-right: auto;
}

.table_height_resize_ui_element_success {
   color: #00a470;
}


/** Skeleton animations **/
.skeleton_animation {
   background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0));
   background-size: 200%;
   background-position: 200%;
   background-repeat: no-repeat;
   animation: skeleton_animation 1.25s infinite ease;
   background-color: #E7E7E7;
}

.skeleton_header {
   margin-top: 3px;
}

.skeleton_collapse {
   height: 30px;
   width: 30px;
   display: inline-block;
   margin-right: 2px;
   border-radius: 5px;
   margin-top: -3px;
}

.skeleton_title {
   height: 12px;
   width: 400px;
   display: inline-block;
   border-radius: 12px;
   margin-left: calc(50% - 200px - 120px);
   margin-bottom: 5px;
}

.skeleton_view {
   height: 30px;
   width: 100px;
   display: inline-block;
   /* margin-right: 10px; */
   border-radius: 5px;
   float: right;
   margin-top: -3px;
}

.skeleton_table {
   width: 100%;
   height: calc(60vh - 56px);
   margin-top: 5px;
   border-radius: 5px;
}

.skeleton_table table {
   width: 100%;
}

.skeleton_table table th {
   border-bottom: 1px solid #dadada;
}

.skeleton_table table th:nth-child(1) div, .skeleton_table table tr td:nth-child(1) div {
   width: 20px;
   height: 20px;
}

.skeleton_table table th .skeleton_filter {
   width: 12px !important;
   height: 12px !important;
   float: right;
   margin-left: 3px;
   margin-right: 3px;
}

.skeleton_table table th .skeleton_filter_outer {
   width: 36px !important;
   height: 12px !important;
   background: none;
   float: right;
   margin: 0;
}

.skeleton_table table th:nth-child(2) div, .skeleton_table table tr td:nth-child(2) div {
   width: 200px;
}

.skeleton_table table th:nth-child(3) div, .skeleton_table table tr td:nth-child(3) div {
   width: 400px;
}

.skeleton_table table th:nth-child(4) div, .skeleton_table table tr td:nth-child(4) div {
   width: 300px;
}

.skeleton_table table th:nth-child(5) div, .skeleton_table table tr td:nth-child(5) div {
   width: 100px;
}

.skeleton_table table th:nth-child(6) div, .skeleton_table table tr td:nth-child(6) div {
   width: 20px;
}

.skeleton_table table div, .skeleton_gantt table div, .skeleton_calendar table div, .skeleton_reporttemplate_table table div {
   height: 12px;
   margin: 10px;
   background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0));
   background-size: 200%;
   background-position: 200%;
   background-repeat: no-repeat;
   animation: skeleton_animation 1.25s infinite ease;
   background-color: #E7E7E7;
   border-radius: 20px;
   float: left;
}

.skeleton_table_footer {
   border-top: 1px solid #dadada;
}

.skeleton_table_footer_top_row, .skeleton_table_footer_bottom_row {
   width: 100%;
   height: 30px;
   padding-top: 10px;
}

.skeleton_table_footer_add {
   float: left;
   width: 75px;
   height: 30px;
   border-radius: 5px;
   margin-right: 10px;
}

.skeleton_table_footer_next_to_add {
   float: left;
   height: 25px;
   width: 30px;
   border-radius: 5px;
   margin-right: 10px;
   margin-top: 2.5px;
}

.skeleton_table_footer_show_rows {
   float: right;
   height: 12px;
   width: 150px;
   border-radius: 6px;
   margin-top: 9px;
}

.skeleton_table_footer_bottom_element {
   display: inline-block;
   height: 26px;
   border-radius: 5px;
   margin-right: 10px;
   margin-top: 5px;
}

.skeleton_table_footer_bottom_element:nth-child(1) {
   width: 125px;
} 

.skeleton_table_footer_bottom_element:nth-child(2) {
   width: 200px;
} 

.skeleton_table_footer_bottom_element:nth-child(3) {
   width: 175px;
} 

.skeleton_kanban .skeleton_header, .skeleton_dashboard .skeleton_header {
   height: 30px;
}

.skeleton_settings {
   width: 30px;
   height: 30px;
   border-radius: 15px;
   float: right;
}

.skeleton_kanban_columns {
   margin-top: 40px;
}

.skeleton_kanban_column_header {
   width: 150px;
   height: 12px;
   border-radius: 6px;
   margin-bottom: 20px;
}

.skeleton_kanban_column {
   width: calc(20% - 20px);
   display: inline-block;
   vertical-align: top;
   margin: 10px;
}

.skeleton_kanban_column_inner {
   width: 100%;
   border-radius: 5px;
   margin-top: 5px;
   margin-bottom: 5px;
}

.skeleton_dashlet_outer {
   width: 100%;
}

.skeleton_dashlet_outer:nth-child(2) {
   margin-top: 30px;
}

.skeleton_dashlet {
   height: 300px;
   display: inline-block;
   border-radius: 5px;
   margin: 10px;
}

.skeleton_dashlet_outer:nth-child(3) .skeleton_dashlet {
   height: 200px;
}

.skeleton_details {
   position: relative;
   width: 100%;
   height: 1030px;
   margin-top: -10px;
}

.skeleton_details_outer_1, .skeleton_details_outer_2, .skeleton_details_outer_3, .skeleton_details_outer_4 {
   border-radius: 5px;
   position: absolute;
   margin: 10px;
   width: calc(49% - 50px);
   display: inline-block;
   border: 1px solid #dadada;
   padding: 15px;
}

.skeleton_details_outer_1 {
   top: 10px;
   left: 10px;
   /* height: 510px; */
   height: 480px;
}

.skeleton_details_outer_2 {
   top: 10px;
   right: 10px;
   /* height: 320px; */
   height: 290px;
}

.skeleton_details_outer_3 {
   right: 10px;
   top: 353px;
   /* height: 230px; */
   height: 200px;
}

.skeleton_details_outer_4 {
   left: 10px;
   top: 538px;
   /* height: 466px; */
   height: 436px;
}

.skeleton_details_outer_header_icon {
   height: 30px;
   width: 30px;
   border-radius: 15px;
   display: inline-block;
}

.skeleton_details_outer_header_text {
   height: 20px;
   border-radius: 10px;
   display: inline-block;
   vertical-align: top;
   margin-top: 5px;
   margin-left: 10px;
}

.skeleton_details_outer_1 .skeleton_details_outer_header_text {
   width: 100px;
}

.skeleton_details_outer_2 .skeleton_details_outer_header_text {
   width: 160px;
}

.skeleton_details_outer_3 .skeleton_details_outer_header_text {
   width: 120px;
}

.skeleton_details_outer_4 .skeleton_details_outer_header_text {
   width: 80px;
}

.skeleton_details_inner {
   width: 100%;
   height: calc(100% - 60px);
   margin-top: 15px;
   border-radius: 5px;
}

.skeleton_gantt_table table {
   width: calc(40% - 10px);
   display: inline-block;
   margin-right: 10px;
}

.skeleton_gantt_table table div {
   height: 12px;
}

.skeleton_gantt_chart {
   display: inline-block;
   vertical-align: top;
   margin-top: 37px;
   width: calc(60% - 10px);
   margin-left: 10px;
   overflow: hidden;
}

.skeleton_gantt_chart_inner {
   height: 26px;
   margin-top: 4px;
   margin-bottom: 4px;
   border-radius: 5px;
}

.skeleton_gantt_chart_inner:nth-child(2) {
   margin-left: 100px;
}

.skeleton_gantt_chart_inner:nth-child(3) {
   margin-left: 180px;
}

.skeleton_gantt_chart_inner:nth-child(4) {
   margin-left: 260px;
}

.skeleton_gantt_chart_inner:nth-child(5) {
   margin-left: 325px;
}

.skeleton_gantt_chart_inner:nth-child(6) {
   margin-left: 450px;
}

.skeleton_gantt_chart_inner:nth-child(7) {
   margin-left: 500px;
}

.skeleton_gantt_chart_inner:nth-child(8) {
   margin-left: 600px;
}

.skeleton_gantt_chart_inner:nth-child(9) {
   margin-left: 750px;
}

.skeleton_gantt_chart_inner:nth-child(10) {
   margin-left: 875px;
}

.skeleton_calendar_header {
   width: 100%;
   height: 30px;
   margin-bottom: 50px;
}

.skeleton_calendar_header_1, .skeleton_calendar_header_4  {
   float: left;
   width: 20px;
   height: 20px;
   border-radius: 10px;
   margin-right: 20px;
   margin-top: 5px;
}

.skeleton_calendar_header_2 {
   float: left;
   height: 20px;
   width: 70px;
   border-radius: 5px;
   margin-right: 5px;
   margin-top: 5px;
}

.skeleton_calendar_header_3 {
   float: left;
   height: 20px;
   width: 75px;
   border-radius: 5px;
   margin-top: 5px;
}

.skeleton_calendar_header_4 {
   margin-left: 20px;
}

.skeleton_calendar_header_5 {
   float: left;
   height: 26px;
   width: 75px;
   border-radius: 5px;
   margin-top: 2px;
}

.skeleton_calendar_header_6, .skeleton_calendar_header_7, .skeleton_calendar_header_8, .skeleton_calendar_header_9, .skeleton_calendar_header_10  {
   float: right;
   height: 23px;
   width: 125px;
   border-radius: 5px;
   margin-left: 20px;
   margin-top: 3.5px;
}

.skeleton_calendar_table_header_inner {
   width:14.285%;
   display: inline-block; 
}

.skeleton_calendar_table_header_inner div {
   height: 12px;
   width: 100px;
   text-align: center;
   border-radius: 6px;
   margin: auto;
}

.skeleton_calendar_table table {
   width: 100%;
}

.skeleton_calendar_table table div {
   height: 150px;
   margin-left: 5px;
   margin-right: 5px;
   margin-bottom: 5px;
   width: 100%;
   border-radius: 5px;
}

.skeleton_reporttemplate_table {
   width: 900px;
   margin-top: 20px;
   border-radius: 5px;
}

.skeleton_reporttemplate_table table {
   border-collapse: collapse;
   width: 900px;
}

.skeleton_reporttemplate_table table th {
   border: 1px solid #dadada;
   background-color: #f9f9f9;
}

.skeleton_reporttemplate_table table th:nth-child(1) div, .skeleton_reporttemplate_table table tr td:nth-child(1) div {
   width: 20px;
   height: 20px;
}

.skeleton_reporttemplate_table table th:nth-child(2) div, .skeleton_reporttemplate_table table tr td:nth-child(2) div {
   width: 200px;
}

.skeleton_reporttemplate_table table th:nth-child(3) div, .skeleton_reporttemplate_table table tr td:nth-child(3) div {
   width: 400px;
}

.skeleton_reporttemplate_table table th:nth-child(4) div, .skeleton_reporttemplate_table table tr td:nth-child(4) div {
   width: 300px;
}

.skeleton_reporttemplate_table table th:nth-child(5) div, .skeleton_reporttemplate_table table tr td:nth-child(5) div {
   width: 100px;
}

.skeleton_reporttemplate_table table th:nth-child(6) div, .skeleton_reporttemplate_table table tr td:nth-child(6) div {
   width: 20px;
}

.skeleton_reporttemplate_table table td {
   border: 1px solid #dadada;
}

.skeleton_scenarios_saved_outer {
   margin-bottom: 5px;
   margin-top: -5px;
   margin-left: 10px;
}

.skeleton_scenarios_saved_dd {
   height: 20px;
   width: 90px;
   display: inline-block;
   margin-right: 20px;
   vertical-align: middle;
   border-radius: 10px;
}

.skeleton_scenarios_save_button {
   height: 30px;
   width: 160px;
   display: inline-block;
   vertical-align: middle;
   border-radius: 5px;
}

.skeleton_scenarios_resources_outer, .skeleton_scenarios_bars_outer {
   height: 400px;
   margin-bottom: 20px;
}

.skeleton_scenarios_resources_outer, .skeleton_scenarios_names_outer {
   display: inline-block;
   width: 400px;
   margin-left: 20px;
}

.skeleton_scenarios_resources_header {
   height: 25px;
   width: 115px;
   margin-bottom: 10px;
   border-radius: 15px;
}

.skeleton_scenarios_resources_selectall, .skeleton_scenarios_resources_item {
   height: 16px;
   width: 70px;
   margin-bottom: 5px;
   border-radius: 8px;
}

.skeleton_scenarios_resources_selectall {
   margin-bottom: 7.5px;
}

.skeleton_scenarios_bars_outer, .skeleton_scenarios_draggers_outer {
   display: inline-block;
   width: calc(100% - 400px - 20px);
   vertical-align: top;
}

.skeleton_scenarios_bars {
   display: inline-block;
   width: calc((100% - 20px - 60px) / 11);
   height: 100px;
   margin-right: 5px;
   border-radius: 5px;
}

.skeleton_scenarios_names_header {
   height: 20px;
   width: 200px;
   margin-bottom: 5px;
   border-radius: 10px;
}

.skeleton_scenarios_names {
   height: 16px;
   width: 150px;
   margin-bottom: 5px;
   border-radius: 10px;
}

.skeleton_scenarios_draggers {
   height: 20px;
   width: 300px;
   margin-bottom: 5px;
   border-radius: 10px;
}


/*skeleton tab*/
#skeleton_tab_outer {
   margin-top: 0px;
   padding-left: 17px;
   padding-right: 10px;
}

#viewdetailscontent #skeleton_tab_outer {
   margin-top: 7px;
   padding: 0px;
}

.skeleton_tab_top_outer {
   overflow: hidden;
}

.skeleton_tab_top {
   width: 160px;
   height: 43px;
   display: inline-block;
   vertical-align: middle;
   text-align: center;
}

.skeleton_tab_top_inner_1, .skeleton_tab_top_inner_2 {
   height: 12px;
   border-radius: 6px;
   display: inline-block;
   vertical-align: middle;
   margin-top: 20px;
}

.skeleton_tab_top_inner_1 {
   width: 120px;
}

.skeleton_tab_top_inner_2 {
   width: 75px;
}

.skeleton_tab_top_selected {
   display: inline-block;
   height: 31px;
   width: 180px;
   background: #ffffff;
   border-top: 2.5px solid #cfcfcf;
	box-shadow: 0px 5px 10px #00000029;
   border-top-left-radius: 7.5px;
   border-top-right-radius: 7.5px;
   z-index: 1;
   /* padding: 5px;
   padding-top: 9px; */
	padding-top: 9px;
   vertical-align: middle;
   position: relative;
	margin-bottom: -6px;
}

.skeleton_tab_top_selected_icon {
   display: inline-block;
   width: 22px;
   height: 22px;
   border-radius: 22px;
   vertical-align: middle;
   margin-right: 10px;
   margin-left: 12px;
}

.skeleton_tab_top_selected_text {
   width: 75px;
   height: 12px;
   border-radius: 6px;
   display: inline-block;
   vertical-align: middle;
}

.skeleton_tab_top_selected_star, .skeleton_tab_top_selected_refresh {
   float: right;
   width: 16px;
   height: 16px;
   border-radius: 16px;
   vertical-align: middle;
   margin-top: 3px;
   margin-right: 5px;
}

.skeleton_tab_top_selected:before,
.skeleton_tab_top_selected:after {
    content: "";
    position: absolute;
    height: 10px;
    width: 20px;
    bottom: 0px;
}

.skeleton_tab_top_selected:after {
    right: -20px;
    border-radius: 0 0 0 10px;
    -moz-border-radius: 0 0 0 10px;
    -webkit-border-radius: 0 0 0 10px;
    -webkit-box-shadow: -10px 0 0 0 #fff;
    box-shadow: -5px 0 0 0 #fff;
}

.skeleton_tab_top_selected:before {
    left: -20px;
    border-radius: 0 0 10px 0;
    -moz-border-radius: 0 0 10px 0;
    -webkit-border-radius: 0 0 10px 0;
    -webkit-box-shadow: 10px 0 0 0 #fff;
    box-shadow: 5px 0 0 0 #fff;
}


.skeleton_tab_top_all_tabs {
   float: right;
   width: 90px;
   height: 20px;
   border-radius: 10px;    
   margin-right: 10px;
   margin-top: 16px;
}

.skeleton_tab_bottom_outer {
   background-color: #ffffff;
   margin-right: 17px;
   width: calc(100% - 37px);
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
   border-radius: 10px;
   /* height: calc(100vh - 270px); */
   padding-left: 10px;
   padding-right: 20px;
   padding-top: 15px;
}

/*skeleton view page*/
#skeleton_top_box_outer {
   padding: 10px;
   padding-left: 17px;
}

#skeleton_top_box_outer.skeleton_top_box_outer_with_photo {
   padding-bottom: 0px;
}

.skeleton_top_box_workflow_outer {
   margin-bottom: 10px;
   margin-top: 2px;
	margin-left: -5px;
}

.skeleton_top_box_workflow {
   height: 25px;
   border-top-right-radius: 25px;
   border-bottom-right-radius: 25px;
	border-top-left-radius: 5px;
   border-bottom-left-radius: 5px;
   display: inline-block;
   /* margin-left: 2px; */
   /* margin-right: 2px; */
}

.skeleton_top_box_breadcrumb_outer {
   margin-top: 3px;
   margin-bottom: 17px;
}

.skeleton_top_box_workflow_outer + .skeleton_top_box_breadcrumb_outer {
   margin-top: 13px;
}

.skeleton_top_box_breadcrumb {
   height: 12px;
   border-radius: 12px;
   display: inline-block;
}

.skeleton_top_box_breadcrumb_spacer {
   height: 12px;
   width: 12px;
   border-radius: 12px;
   display: inline-block;
   margin-left: 5px;
   margin-right: 5px;
}

.skeleton_top_box_breadcrumb_menu {
   height: 18px;
   width: 18px;
   margin-right: 5px;
   margin-left: 2px;
   display: inline-block;
   border-radius: 5px;
	vertical-align: top;
}

.skeleton_top_box_workflow_menu {
	float: right;
	height: 28px;
   width: 100px;
   margin-right: 5px;
   border-radius: 5px;
	margin-top: -5px;
}

.skeleton_top_box_help {
	float: right;
	height: 28px;
   width: 24px;
   border-radius: 5px;
	margin-top: -5px;
	margin-right: 10px;
}

.skeleton_top_box_title_left_outer {
   display: inline-block;
   margin-bottom: 5px;
   vertical-align: middle;
}

.skeleton_top_box_outer_with_photo .skeleton_top_box_title_left_outer {
   margin-bottom: 13px;
}

.skeleton_top_box_title_right_outer {
   float: right;
   vertical-align: middle;
}

.skeleton_top_box_outer_with_photo .skeleton_top_box_title_right_outer {
   margin-top: 30px;
}

.skeleton_top_box_title {
   height: 22px;
   border-radius: 22px;
   display: inline-block;
   margin-right: 8px;
   vertical-align: middle;
}

.skeleton_top_box_photo {
   height: 80px;
   width: 80px;
   border-radius: 40px;
   display: inline-block;
   margin-right: 13px;
	margin-left: 5px;
	margin-bottom: -25px;
   vertical-align: middle;
}

.skeleton_top_box_rag {
   height: 16px;
   border-radius: 16px;
   display: inline-block;
   margin-right: 20px;
   vertical-align: middle;
}

.skeleton_top_box_button {
   height: 30px;
   width: 30px;
   border-radius: 5px;
   display: inline-block;
   margin-left: 3px;
   margin-right: 3px;
   vertical-align: middle;
}

.skeleton_top_box_add {
   height: 30px;
   width: 80px;
   border-radius: 5px;
   display: inline-block;
   margin-left: 3px;
    margin-right: 3px;
    vertical-align: middle;
}

.skeleton_top_box_details {
   height: 12px;
   width: 60px;
   border-radius: 12px;
   display: inline-block;
   margin-left: 15px;
   vertical-align: middle;
}

.skeleton_top_box_search {
   height: 30px;
   width: 170px;
   border-radius: 5px;
   display: inline-block;
   margin-right: 20px;
   vertical-align: middle;
}

.skeleton_top_box_user {
   height: 30px;
   width: 30px;
   border-radius: 30px;
   display: inline-block;
   vertical-align: middle;
}

.skeleton_top_box_asset {
   height: 12px;
   width: 100px;
   border-radius: 12px;
}

#skeleton_top_box_outer.skeleton_top_box_outer_with_photo .skeleton_top_box_asset {
	margin-left: 98px;
	margin-top: -20px;
	margin-bottom: 30px;
}

/* Navigator skeleton animations */
.navigator_skeleton_loader_outer .skeleton_animation {
   background-image: var(--navigator_skeleton_loader_gradient);
   background-color: var(--navigator_skeleton_loader_background);
}

.navigator_skeleton_loader_outer {
   padding: 10px;
}

.navigator_skeleton_loader_inner {
   margin-bottom: 20px;
   margin-top: 20px;
}

.navigator_skeleton_loader_inner:first-child {
   margin-top: 0px;
}

.navigator_skeleton_loader_inner_icon {
   width: 20px;
   height: 20px;
   border-radius: 50%;
   margin-left: 5px;
   margin-right: 10px;
   display: inline-block;
   vertical-align: middle;
}

.navigator_expanded .navigator_skeleton_loader_inner_icon {
   margin-left: 0px;
}

.navigator_expanded .navigator_skeleton_loader_inner_text_outer {
   height: 12px;
   width: calc(100% - 46px);
   display: inline-block;
   vertical-align: middle;
}

.navigator_expanded .navigator_skeleton_loader_inner_text {
   height: 12px;
   width: 100px;
   border-radius: 6px;
}

.navigator_expanded .navigator_skeleton_loader_inner_expand {
   width: 16px;
   height: 16px;
   border-radius: 50%;
   display: inline-block;
   vertical-align: middle;
}

@keyframes skeleton_animation {
   40% {
       background-position:
           200%;
   }
   100% {
       background-position:
           -100%;
   }
}

/* Favourites list class borders */
.favourites_list_class_red {
   border-left: 6px solid #E01E1E;
}

.favourites_list_class_pink {
   border-left: 6px solid #e01ece;
}

.favourites_list_class_green {
   border-left: 6px solid #1ee02c;
}

.favourites_list_class_blue {
   border-left: 6px solid #1e7fe0;
}

.favourites_list_class_yellow {
   border-left: 6px solid #ddb91f;
}

.favourites_list_class_orange {
   border-left: 6px solid #f58836;
}

.favourites_list_class_purple {
   border-left: 6px solid #851fdd;
}

.favourites_list_class_darkblue {
   border-left: 6px solid #1c1ce8;
}

.favourites_list_class_lightgrey {
   border-left: 6px solid #c4c4c4;
}

.favourites_list_class_aquablue {
   border-left: 6px solid #21c6db;
}

.favourites_list_class_darkgrey {
   border-left: 6px solid #1c1c1c;
}

/* New Psoda dropdowns */

.psoda_dropdown_outer {
   position: absolute;
   background-color: #ffffff;
   -webkit-box-shadow: 3px 3px 10px rgb(0 0 0 / 30%);
   -moz-box-shadow: var(--popup_box_shadow);
   box-shadow: 3px 3px 10px rgb(0 0 0 / 30%);
   z-index: 25;
   padding: 15px;
   border-radius: 10px;
}

.psoda_dropdown_header {
   font-weight: bold;
   font-size: 1.1em;
   margin-bottom: 10px;
   display: inline-block;
}

.psoda_dropdown_submit {
   background-color: var(--main_colour);
   color: #ffffff;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   padding-left: 30px;
   padding-right: 30px;
   float: left;
   border-radius: 5px;
   cursor: pointer;
   vertical-align: middle;
   margin-top: 10px;
   border: none;
   font-family: var(--font_family);
}

.psoda_dropdown_cancel {
   float: right;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   padding-left: 30px;
   padding-right: 30px;
   cursor: pointer;
   vertical-align: middle;
   margin-top: 10px;
   border: none;
   background-color: unset;
   font-family: var(--font_family);
}

.psoda_dropdown_outer input[type="text"], .psoda_dropdown_outer input[type="number"], .psoda_dropdown_outer .wysiwyg, .psoda_dropdown_outer select, .psoda_dropdown_outer .listfield, .psoda_dropdown_outer textarea, .psoda_dropdown_outer input[type="password"] {
   background: none;
   border: none;
   border-bottom: 1.5px solid #bababa;
   padding-left: 0;
   height: auto !important;
}

.psoda_dropdown_outer input[type="text"]:focus, .psoda_dropdown_outer input[type="number"]:focus, .psoda_dropdown_outer .wysiwyg:focus, .psoda_dropdown_outer select:focus, .psoda_dropdown_outer .listfield:focus, .psoda_dropdown_outer textarea:focus, .psoda_dropdown_outer input[type="password"]:focus  {
   border: none;
   border-bottom: 1.5px solid  var(--main_colour);
   outline: none;
}

/*add to favs dropdown */
.add_to_favourites_dropdown {
   width: 500px;
   top: 0px;
   right: 0px;
   z-index: 35;
}

.add_to_favourites_dropdown .add_to_favs_remove {
   background-color: #ffe9e9;
   color: #E02020;
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   padding-left: 30px;
   padding-right: 30px;
   float: right;
   border-radius: 5px;
   cursor: pointer;
   vertical-align: middle;
   margin-top: 10px;
}

.add_to_favourites_dropdown #title, .add_to_favourites_dropdown #favourite_colour, .add_to_favourites_dropdown #url {
   display: block;
   margin-bottom: 10px;
}

.add_to_favourites_dropdown #title.circle_loader, .add_to_favourites_dropdown #url.circle_loader {
   height: 14px !important;
   border: 1px solid;
   border-color: var(--font) #505050 #505050 transparent;
   padding: 0;
   margin-top: 5px;
   margin-bottom: 15px;
}

.add_to_favourites_dropdown .update_favs_disabled {
   pointer-events: none;
   background: #eaeaea;
   color: #aaaaaa;
}

.psoda_dropdown_submit.psoda_button_disabled, .add_to_favs_remove.psoda_button_disabled {
   pointer-events: none;
   background: #eaeaea;
   color: #eaeaea;
   position: relative;
}

.psoda_dropdown_submit .circle_loader, .add_to_favs_remove .circle_loader {
   position: absolute;
   top: 10px;
   left: 0;
   right: 0;
   margin-left: auto;
   margin-right: auto;
   border-color: #505050 #505050 #505050 transparent;
}

.add_to_favourites_dropdown .input_focus label {
   font-weight: bold;
   color: var(--main_colour);
}

.add_to_favourites_x {
   height: 24px;
   width: 24px;
   /* background-image: url(/images/icons/darkgrey/closepopup.svg);
   background-size: 10px;
   background-repeat: no-repeat;
   background-position: center; */
   float: right;
   cursor: pointer;
   border-radius: 5px;
}

.add_to_favourites_x svg {
	padding: 7px;
}

.add_to_favourites_x:hover {
   background-color: #eaeaea;
}

#graph_legend {
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}

/* CLIENTSIDE TABLES */
.clientside_displaylist {
   height: 75vh;
   overflow: auto;
   margin-top: 10px;
}

.clientside_displaylist table {
   position: relative;
   border-collapse: separate !important;
}

.clientside_displaylist thead {
   position: sticky;
   inset-block-start: 0;
   z-index: 10;
}

.clientside_displaylist th {
   background-color: #ffffff;
}

.clientside_displaylist #tfoot  {
   position: sticky;
   inset-block-end: 0;
   z-index: 10;
}

.clientside_displaylist td.displaylistcontrols {
   padding-left: 5px;
   padding-right: 5px;
}

.clientside_displaylist table {
   table-layout: auto;
}

.clientside_displaylist .displaylist_top_filters_container {
   margin-bottom: 10px;
}

.displaylist_filter, .displaylist_sort {
   border-radius: 5px;
   display: inline-block;
   cursor: pointer;
}

.displaylist_filter img, .displaylist_sort img {
   padding-top: 3px;
   padding-bottom: 1px;
   padding-left: 1px;
   padding-right: 1px;
}

.displaylist_filter:hover, .displaylist_sort:hover {
   background-color: #eaeaea;
}

.clientside_displaylist .displaylist_header_text {
   vertical-align: middle;
}

.displaylist.chartjs_table_displaylist tr, 
.displaylist.chartjs_table_displaylist tr:hover {
   background: #FFFFFF !important;
}

.displaylist.chartjs_table_displaylist th {
   border-bottom: 1px solid #dddddd;
}

.displaylist.chartjs_table_displaylist td {
   border-bottom: 1px solid #dddddd;
}

#popup_filter_list {
   width: 500px;
}

#popup_filter_list .multiselect-wrapper {
   width: 500px;
}

#popup_filter_list .multiselect-wrapper .view_notselected, #popup_filter_list .multiselect-wrapper .view_selected {
   width: 500px;
}

#popup_filter_list .multiselect-wrapper .view_notselected {
   height: 175px;
}

.program_members_v2_freeze_left_columns {
   display: none;
}

.multi_member_select_total {
   color: white;
   background-color: var(--lighter_shade_1);
	border: 1px solid transparent;
}

.multi_member_select_total.multi_member_select_total_zero {
   color: var(--font_grey);
   background-color: #eaeaea;
	border: 1px solid transparent;
}

#javascript_reload_popup_outer {
   position: absolute;
   top: 30px;
   left: 0;
   right: 0;
   margin-left: auto;
   margin-right: auto;
   background-color: #ffffff;
   border-radius: 5px;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: var(--box_shadow);
   box-shadow: var(--box_shadow);
   z-index: 1000;
   width: 300px;
   width: max-content;
   padding: 12px;
   padding-left: 22px;
   padding-right: 22px;
}

.javascript_reload_popup_icon {
   display: inline-block;
   vertical-align: top;
   width: 40px;
   margin-right: 10px;
   margin-top: 5px;
}

.javascript_reload_popup_content {
   display: inline-block;
   vertical-align: top;
   width: calc(100% - 50px);
}

.javascript_reload_popup_title {
   font-size: 1.1em;
   font-weight: bold;
   padding-bottom: 4px;
}

.javascript_reload_popup_button {
   font-weight: bold;
   color: var(--font_link);
   cursor: pointer;
   display: inline-block;
}

.javascript_reload_popup_button:hover {
   color: var(--font_link_hover);
}


/* New selected details area */
#viewdetails .top_selected_details_outer h2 {
   font-size: 1em;
   margin: 0;
   margin-bottom: 10px;
}

.top_selected_details_outer {
   margin-top: 10px;
}

.top_selected_details {
   width: calc(100% - 360px);
   display: inline-block;
   vertical-align: top;
   padding-right: 40px;
   border-right: 1px solid #d3d3d3;
}

.top_selected_details_people {
   width: 275px;
   display: inline-block;
   vertical-align: top;
   padding-left: 40px;
}

.top_selected_details_columns {
   padding-left: 10px;
}

.top_selected_details_element_outer {
   padding-right: 10px;
   border-radius: 5px;
   display: inline-block;
   margin-right: 10px;
   margin-bottom: 10px;
   vertical-align: top;
   width: calc(25% - 20px);
}

.top_selected_details_element_outer.top_selected_details_element_url {
   width: calc(50% - 20px);
}

.top_selected_details_element_outer.top_selected_details_element_longstring {
   width: calc(100% - 20px);
}

.top_selected_details_element_title, .top_selected_details_user_title {
   color: #919191;
   font-size: .9em;
   font-weight: bold;
   letter-spacing: .25px;
   padding-bottom: 2.5px;
}

.top_selected_details_element_title .textedit, .top_selected_details_user_title .textedit {
   background-position: right 3px;
   padding-right: 15px;
}

.top_selected_details_element_id .top_selected_details_element_content > div {
   background: #eaeaea;
   color: var(--font_grey);
   padding-top: 2px;
   padding-bottom: 2px;
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 3px;
   text-align: center;
   font-weight: bold;
   min-width: 100px;
   max-width: 125px;
}

.top_selected_details_element_url .top_selected_details_element_content > div {
   overflow-wrap: break-word;
   height: auto !important;
}


.top_selected_details_element_content > div {
   padding-top: 2px;
   padding-bottom: 2px;
   width: max-content;
   min-width: 30px;
   max-width: 100%;
}

.top_selected_details_element_content .textedit, .top_selected_details_element_content .dropdown, .top_selected_details_element_content .inlinecheckbox, .top_selected_details_element_content .dateedit  {
   padding-top: 0px;
   padding-bottom: 0px;
   background-position: right 5px;
   padding-right: 15px;
}

.top_selected_details_element_longstring .top_selected_details_element_content > div {
   height: auto !important;
   /* min-height: 20px;
   max-height: 100px; 
   overflow: auto; */
   width: unset;
   min-width: unset;
}

.top_selected_details_element_longstring .top_selected_details_element_content {
   min-height: 20px;
   max-height: 100px; 
   overflow: auto;
}

.top_selected_details_element_longstring .top_selected_details_element_content.top_selected_details_element_content_edit_active {
   max-height: unset;
   overflow: unset;
}

/* .top_selected_details_element_longstring .top_selected_details_element_content .wysiwyg_buttons {
   position: relative;
   z-index: 30;
   top: 0;
   margin-top: 0;
} */


.top_selected_details_element_longstring .top_selected_details_element_content > div.wysiwygedit_active, .top_selected_details_element_longstring .top_selected_details_element_content > div.textareaedit_active {
   max-height: unset;
}

.top_selected_details_element_string .top_selected_details_element_content > div, .top_selected_details_element_url .top_selected_details_element_content > div, .top_selected_details_element_dropdown .top_selected_details_element_content > div {
   min-height: 20px;
   min-width: 100px;
	word-break: break-word;
}

.top_selected_details_element_photo img {
   max-width: 150px;
}

.top_selected_details_element_photo .top_selected_details_element_content > div img,
.top_selected_details_element_photo .top_selected_details_element_content > div input {
   vertical-align: middle;
}

.top_selected_details_element_colour .top_selected_details_element_inner_left > div {
   width: 30px;
   height: 30px;
   border-radius: 30px;
}

.top_selected_details_element_colour .top_selected_details_element_title {
   padding-top: 2.5px;
   padding-bottom: 0px;
}

.top_selected_details_element_asset .status_state {
   margin-left: 18px;
}

.top_selected_details_element_asset .top_selected_details_element_content > div img, .top_selected_details_element_asset .top_selected_details_element_content > div a {
   vertical-align: middle;
}

.top_selected_details_element_attachment .photoedit input {
   width: 100% !important;
   margin-top: -5px;
   text-align: center;
}

.top_selected_details_element_inner_left { 
   display: inline-block;
   padding-right: 5px;
   vertical-align: middle;
}

.top_selected_details_element_progress .top_selected_details_element_content_inner {
   background: #4ec66a;
   border-radius: 3px;
   font-weight: bold;
   height: 20px;
   padding-top: 2px;
   padding-bottom: 2px;
   text-align: center;
   margin-top: -2px;
   min-width: unset;
}

.top_selected_details_element_progress .top_selected_details_element_content_inner > div {
   display: inline-block;
   background: none;
   position: absolute;
}

.top_selected_details_section {
   margin-bottom: 10px;
   margin-right: 10px;
   padding: 10px 10px 0px 10px;
   background: var(--lightest_shade_1);
   border-radius: 5px;
   display: inline-block;
   width: calc(100% - 30px);
}

.top_selected_details_section h3 {
   padding-left: 3px;
   font-size: 1em;
   font-weight: 100;
   margin: 0;
   padding-bottom: 5px;
   font-weight: bold;
}

.top_selected_details_section .top_selected_details_element_outer  {
   padding-left: 3px;
}

.top_selected_details_element_inner .right_align {
   text-align: left !important;
}


.top_selected_details_user_outer {
   background: #ffffff;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
   box-shadow: var(--box_shadow);
   padding-top: 7.5px;
   padding-bottom: 7.5px;
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 5px;
   display: inline-block;
   margin-right: 10px;
   margin-bottom: 10px;
   margin-top: 23px;
   width: 100px;
   vertical-align: top;
}

.top_selected_details_user_img {
   margin-top: -30px;
   text-align: center;
}

.top_selected_details_user_img_role {
   background: #ffffff;
   width: 45px;
   height: 45px;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
   box-shadow: var(--box_shadow);
   border-radius: 45px;
   margin-left: auto;
   margin-right: auto;
}

.top_selected_details_user_img_role .psoda_icon svg {
   width: 24px;
   height: 24px;
   margin-top: 10.5px;
}

.top_selected_details_user_img img {
   vertical-align: middle;
}

.top_selected_details_user_name {
   font-weight: bold;
   text-align: center;
   margin-top: 5px;
   margin-bottom: 5px;
   word-wrap: break-word;
}

.top_selected_details_user_multi .top_selected_details_user_name {
   font-size: .85em;
   margin-top: 15px;
}

.top_selected_details_user_multi .top_selected_details_user_multi_img {
   display: inline-block;
   margin-right: -10px;
}

.top_selected_details_user_multi .top_selected_details_user_multi_img_role {
   background: #ffffff;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
   box-shadow: var(--box_shadow);
   border-radius: 45px;
   width: 30px;
   height: 30px;
   vertical-align: top;
}

.top_selected_details_user_multi .top_selected_details_user_img {
   margin-left: -10px;
   margin-top: -23px;
}

.top_selected_details_user_multi_img img {
   width: 30px;
   height: 30px;
   border: 2px solid #f7f7f7 !important;
}

.top_selected_details_user_multi_img .photo_letters {
   vertical-align: middle;
   border: 2px solid #f7f7f7;
}

.top_selected_details_user_multi .top_selected_details_user_multi_img_role .psoda_icon svg {
   width: 20px;
   height: 20px;
   margin-top: 5px;
}

.top_selected_details_user_outer.top_selected_details_user_multi .status_state {
   margin-left: 20px;
   display: none;
}

.top_selected_details_user_multi_img:nth-child(1) {
   border: 1px black;
}


.top_selected_details_user_title {
   text-align: center;
}

.top_selected_details_user_outer .status_state {
   margin-left: 60px;
   border: 2px solid #f9f9f9;
}

.top_selected_details_user_titles_2 {
   padding-bottom: 4px;
}

.top_selected_details_user_titles_2 .top_selected_details_user_name {
   margin: 0;
}

.top_selected_details_user_titles_2 .top_selected_details_user_title {
   padding: 0;
}

.top_selected_details_user_titles_3 {
   padding-bottom: 5px;
}

.top_selected_details_user_titles_3 .top_selected_details_user_name {
   margin: 0;
   margin-top: -1px;
}

.top_selected_details_user_titles_3 .top_selected_details_user_title {
   padding: 0;
   font-size: .8em;
}

.top_selected_details_user_name span {
   color: var(--font_link);
   font-weight: bold;
   cursor: pointer;
}

.top_selected_details_user_name span:hover {
   color: var(--font_link_hover);
}

.top_selected_details_user_multi_dropdown {
   display: none;
   position: absolute;
   background: #ffffff;
   -webkit-box-shadow: var(--box_shadow);
   -moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
   box-shadow: var(--box_shadow);
   padding-top: 10px;
   padding-bottom: 10px;
   padding-left: 20px;
   padding-right: 20px;
   border-radius: 5px;
   max-height: 400px;
   min-width: 120px;
   overflow: auto;
   z-index: 50;
}

.top_selected_details_user_multi_dropdown .top_selected_details_user_multi_dropdown_item {
   padding-top: 5px;
   padding-bottom: 5px;
}

.top_selected_details_user_multi_dropdown_item .status_state {
   margin-left: 17.5px;
}

.top_selected_details_user_multi_dropdown.open {
   display: block;
}

.top_selected_details_user_multi_dropdown_close {
   height: 20px;
   width: 20px;
   /* background-image: url(/images/popup_x_grey.svg);
   background-size: 16px;
   background-repeat: no-repeat;
   background-position: center; */
   float: right;
   cursor: pointer;
   border-radius: 5px;
   margin-top: 1px;
}

.top_selected_details_user_multi_dropdown_close .psoda_icon {
	padding-left: 4px;
	pointer-events: none;
}

.top_selected_details_user_multi_dropdown_close:hover {
   background-color: #eaeaea;
}

.unlink_jira {
   display: inline-block;
   background-color: #ffe9e9;
   color: #E02020;
   padding: 3px;
   font-size: .75em;
   padding-left: 5px;
   padding-right: 5px;
   border-radius: 5px;
   margin-left: 5px;
   cursor: pointer;
}

.unlink_jira:hover {
   background-color: #ffdbdb;
}

/* scenarios new UI CSS */
.scenarios_chart #opex_box_text, .scenarios_chart #opex_box, .scenarios_chart #capex_box_text, .scenarios_chart #capex_box {
   cursor: pointer;
   user-select: none;
}

.scenarios_chart .scenarios_buttons:hover rect {
   fill: #dddddd;
}

.scenarios_chart input[type="text"]:disabled {
   background: #ffffff !important;
   color: var(--font) !important;
}

/* .scenarios_chart input {
   padding: 0 !important;
} */

.scenarios_chart .scenario_name_column_header {
   padding-left: 30px !important;
}

/* .scenarios_chart .checkboxcontainer {
   left: 5px !important;
} */

.scenarios_chart #resizeBar {
   fill: white;
   stroke: white;
   filter: drop-shadow( 3px 0px 2px rgba(0, 0, 0, .3));
}

/* PSODA TIME LOGO/BUTTON */

#psodatime_logo_div {
   display: flex; 
   flex-direction: column; 
   align-items: center;
   text-align: center;
   margin-bottom: 10px;
}

#psodatime_logo_div p {
   color: #525252;
   margin-top: 7px;
}

#psodatime_logo_div a {
   /* background-image: url(/images/icons/white/import.svg);
   background-repeat: no-repeat;
   background-position: 10px 7px;
   background-size: 15px 15px; */
   width: 70px;
   font-size: 1em;
   line-height: 25px;
   border-radius: 5px;
   border: none;
   cursor: pointer;
   background-color: #454674;
   color: #FFFFFF;
   padding-left: 5px;
   padding-right: 5px;
   padding-top: 3.5px;
   padding-bottom: 2.5px;
   margin-top: -2px;
}

#psodatime_logo_div .psoda_icon {
	margin-right: 5px;
}

#import_successes_message p, #import_updated_message p, #failures_message p {
   margin-top: 5px;
   margin-bottom: 5px;
}

.ratings_default_dropdown select{
   display: none;
}

.ratingSliderInput {
   -webkit-appearance: none;
   appearance: none; 
   width: calc(100% - 50px);
   cursor: pointer;
   outline: none;
   border-radius: 15px;
   height: 6px;
   background: #ccc;
 }
 
 .ratingSliderInput::-webkit-slider-thumb {
   -webkit-appearance: none;
   appearance: none; 
   height: 20px;
   width: 20px;
   background-color: var(--main_colour);
   border-radius: 50%;
   border: none;
   transition: .2s ease-in-out;
 }
 
 .ratingSliderInput::-moz-range-thumb {
   height: 20px;
   width: 20px;
   background-color: var(--main_colour);
   border-radius: 50%;
   border: none;
   transition: .2s ease-in-out;
 }
 
 .ratingSliderInput::-webkit-slider-thumb:hover {
   box-shadow: 0 0 0 10px rgba(57,70,87, .1)
 }
 
 
 .ratingSliderInput::-moz-range-thumb:hover {
   box-shadow: 0 0 0 10px rgba(255,85,0, .1)
 }

 .ratingSliderOutput {
   height: 20px;
   width: 20px;
   border-radius: 20px;
   background: var(--main_colour);
   bottom: -2px;
   left: 10px;
   position: absolute;
   pointer-events: none;
   color:white;
   text-align:center;
   margin-left:20%;
}

.ratings_default_dropdown div{
   display:inline-block;
}
.ratings_default_dropdown>td>.popup_label_parent{
   width:20% !important;
   font-weight:bold;
}
.ratings_default_dropdown>td>:nth-child(5){
   width:80%;
}



.ratings_default_dropdown select{
   display: none;
}

.sliderInput {
   -webkit-appearance: none;
   appearance: none; 
   width: calc(100% - 50px);
   cursor: pointer;
   outline: none;
   border-radius: 15px;
   height: 6px;
   background: #ccc;
 }
 
 .sliderInput::-webkit-slider-thumb {
   -webkit-appearance: none;
   appearance: none; 
   height: 20px;
   width: 20px;
   background-color: var(--main_colour);
   border-radius: 50%;
   border: none;
   transition: .2s ease-in-out;
   z-index: 10;
 }
 
 .sliderInput::-moz-range-thumb {
   height: 20px;
   width: 20px;
   background-color: var(--main_colour);
   border-radius: 50%;
   border: none;
   transition: .2s ease-in-out;
 }
 
 .sliderInput::-webkit-slider-thumb:hover {
   box-shadow: 0 0 0 10px rgba(57,70,87, .1)
 }
 
 
 .sliderInput::-moz-range-thumb:hover {
   box-shadow: 0 0 0 10px rgba(255,85,0, .1)
 }

 .sliderValueOutput{
   height: 20px;
   width: 20px;
   border-radius: 20px;
   background: var(--main_colour);
   bottom: -2px;
   left: 10px;
   position: absolute;
   pointer-events: none;
   color:white;
   text-align:center;
   /* margin-left:20%; */
}



.ratings_slider div{
   display:inline-block;
}
.ratings_slider>td>.popup_label_parent{
   /* width:20% !important; */
   max-width:300px;
}
.ratings_slider>td>:nth-child(5){
   width:80%;

}


 .sliderInputContainer{
   width:300px;
   padding-left:20px;
   display:inline-block;
}

.sliderInput{
   background: linear-gradient(to right, rgb(57, 70, 87) 0%, rgb(204, 204, 204) 0%);
}

.sliderValueOutput{
   left: 15px;
}
.sliderLeftValue{
   /* color: rgb(204, 204, 204); */
   color: rgb(104, 104, 104);
   
   padding-right: 5px;
	vertical-align: middle;
}
.sliderRightValue{
   /* color: rgb(204, 204, 204);  */
   color: rgb(104, 104, 104);

   padding-left: 5px;
	vertical-align: middle;
} 


.commenter_container_comment_column{
   position:relative;
   padding-top: 5px;
}

.commenter_container_comment_column .status_state{
   margin-left: 17px;
   height: 5.5px;
   width: 5.5px;
   border: 1px solid white;
}

.inner_collapse_table .commenter_container_comment_column:first-of-type {
   padding-top: 0px;
}

.commenter_img_container_comment_column{
   display:inline-block;
   vertical-align:top;
}

.commenter_name_container_comment_column p{
   margin: 0;
   margin-top: 2px;
   line-height: 1;
}

.commenter_name_container_comment_column{
   display: inline-block;
   margin-left: 2px;
   width: calc(100% - 30px);
   margin-top: -2px;
}

.commenter_name_comment_column{
   font-weight:bold;
}

.commenter_date_comment_column{
   font-size:.8em;
}

.comment_container_comment_column{
   padding-left:30px;
}

.comment_container_comment_column_all{
   padding-left: 15px;
   border-left: 2px #d8d8d8 solid;
   border-radius: 2px;
   margin-left: 15px;
}

.inner_collapse_table .comment_container_comment_column_all:last-of-type {
   padding-left:17px;
   border-left: 2px solid transparent;;
 }

 .inner_collapse_table .comment_container_comment_column_all.wysiwygedit_wait:last-of-type {
   border-left: 1px solid #FF5555;
 }


.forms_copy_link_button {
   color: #fff;
   /* background-image: url(/images/icons/white/copy.svg);
   background-repeat: no-repeat; */
   padding: 7.5px 10px 7.5px 10px;
   /* background-size: 18px;
   background-position: 5px center; */
   border-radius: 5px;
   cursor: pointer;
}

.forms_copy_link_button .psoda_icon {
   margin-right: 5px;
}

.forms_copy_link_button.copy_button_copied {
   color: var(--main_colour);
   border: 1px solid var(--main_colour);
   /* background-image: url(/images/icons/theme_night/tick.svg);
   background-size: 16px;
   background-position: 7.5px center; */
}

/* new dropdown builder styling */

.read_only_drop_down_builder_row {
	opacity: 0.3;
}

.drop_down_builder_table {
   border-spacing: 10px 8px;
}

/* .drop_down_builder_table tr td:first-child {
   width: 10px;
 } */
.drop_down_builder_table tr td:nth-child(2) {
   width: 250px;
 }
.drop_down_builder_table tr td:nth-child(3) {
   width: 250px;
}

.drop_down_builder_table.multidateselect tr td:nth-child(2) {
   width: 0px;
 }
.drop_down_builder_table.multidateselect tr td:nth-child(3) {
   width: 0px;
}

.drop_down_builder_table th {
   text-align: left;
}

.drop_down_builder_value_header {
   max-width: 20px;
}

.drop_down_builder_label_input,
.drop_down_builder_value_input {
   background: none;
   border: none;
   border-bottom: 1.5px solid #bababa;
   padding-left: 0;
   height: auto !important;
   width: inherit;
   font-family: var(--font_family);
}

.drop_down_builder_label_input:focus,
.drop_down_builder_value_input:focus {
   border-bottom: 1.5px solid var(--main_colour);
   outline: none;
}

.drop_down_builder_drag_header,
.drop_down_builder_delete_header {
   visibility: hidden;
}

.drop_down_builder_button {
   display: flex;
   flex-direction: row-reverse;
   background-color: var(--main_colour);
   background-size: 12px;
   font-family: var(--font_family);
   vertical-align: middle;
   text-align: center;
   color: white !important;
   cursor: pointer;
   border: none;
   border-radius: 5px;
   margin-left: 53px;
   padding: 5px 7px;
   align-items: center;
}
.drop_down_builder_button.multidateselect {
   margin-top: 10px;
   margin-left: 0;
}

.drop_down_builder_button_icon {
   /* background-image: url(/images/icons/white/new.svg);
   background-repeat: no-repeat;
   background-position: center center; */
   /* width: 13px; */
   /* height: 13px; */
   margin-right: 5px;
   /* padding: 7px; */
}

.drop_down_builder_button:hover {
   background-color: var(--lighter_shade_1);
}

.drop_down_builder_remove_icon {
   /* display: flex; */
   /* background-image: url(/images/icons/red/delete.svg);
   background-repeat: no-repeat;
   background-position: center center; */
   /* padding: 8px; */
   cursor: pointer;
   margin: -5px 5px;
}

.clear_all_div > .drop_down_builder_remove_icon .psoda_icon svg {
   vertical-align: middle;
}

.drop_down_builder_drag_icon {
   display: block;
   /* background-image: url(/images/icons/theme_night/drag.svg);
   background-repeat: no-repeat;
   background-position: center center; */
   /* width: 28px; */
   padding-left: 7px;
   padding-right: 7px;
   height: 14px;
   cursor: move;
}

.drop_down_builder_copy {
   /* display: inline-table; */
   position: relative;
   /* background-image: url(/images/icons/theme_night/copy.svg);
   background-repeat: no-repeat;
   background-position: center center; */
   /* padding: 7px; */
   cursor: pointer;
   margin: 0px 5px;
   /* left: 180px; */
   /* top: 4px; */
   float: right;
   padding-left: 5px;
   padding-right: 5px;
   padding-top: 3px;
   padding-bottom: 3px;
}

/* .drop_down_builder_value_header .drop_down_builder_copy{
   left: 160px
} */

.option_dragging {
   opacity: 0.5;
   cursor: move;
}

.builder_button_div {
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.clear_all_div {
   display: flex;
   flex-direction: row-reverse;
   margin-right: 32px;
}

.clear_all_div.multidateselect {
   margin-right: 5px;
   margin-top: 15px;
}

.clear_all_div > .drop_down_builder_remove_icon {
   /* padding: 8px; */
}

.clear_all_button {
   display: flex;
   color: #F46464;
   cursor: pointer;
   font-size: 11px;
}

.drop_down_copied_feedback_div {
   display: block;
   position: absolute;
   background-color: #fff;
   border-left: 5px solid #00a470;
   box-shadow: 0px 0px 10px rgb(0 0 0 / 30%);
   border-radius: 5px;
   padding: 10px;
   z-index: 100000;
   transition: .25s;
   /* top: 485px;
   left: 385px; */
}

.checklist_item_table{
   /* border-collapse:collapse; */
   text-align: left;
   border-spacing: 10px 5px;

}
.checklist_item_table_title{
   /* border:1px solid #dadada; */
   text-align: left;
   vertical-align:top;
}
.checklist_item_table_cells{
   /* border:1px solid #dadada; */
   /* text-align: right; */
   position:relative;
   vertical-align: top;

}

.checklist_item_table_cells .dropdown {
   padding: 5px;
   padding-right: 25px;
   cursor: text;
   min-width: 50px;
   background-image: url(/images/icons/darkgrey/vnext.svg);
   background-repeat: no-repeat;
   background-position: calc(100% - 5px) 10px;
   background-size: 10px;
   /* padding-right: 10px; */
   border: 1px solid #dadada;
   border-radius: 5px;
   width: calc(100% - 35px);
   /* position: absolute;
   top: 0px; */
   /* right: 20px; */
   word-break: break-word;

}

.checklist_item_table_cells .dropdown_active>select  {
   padding: 5px;
   /* padding-right: 25px; */
   cursor: text;
   min-width: 50px;
   border: 1px solid #dadada;
   border-radius: 5px;
   width: calc(100% - 35px);
   /* position: absolute;
   top: 0px; */
   right: 20px;
   /* text-align: right; */
}


.checklist_item_table_cells.answer{
   width:15%;
}


.checklist_item_table_cells .inlinecheckbox {
   /* padding-right: 14px; */
   text-align:right;
}

.checklist_item_table_cells>div{
   min-height:15px;
   word-break: break-word;
}


.checklist_item_table_comment{
   min-height:15px;
   width:40%;
   text-align: left;
}

.checklist_item_table_comment .wysiwygedit{
   border:1px solid #dadada;
   border-radius: 5px;
   background-position: calc(100% - 15px) 5px;
   background-size: 15px;
   padding:5px;
}

.checklist_item_table_comment>div{
   min-height:15px;

}

.checklist_comment_default>div::before{
   color: #dadada;
   content:"Comment";
}

.checklist_item_table_title>p {
   font-size: .75em;
   color: #a5a5a5;
   font-style: italic;
   margin-top: 2px;
}

.checklist_instructions_div {
	margin-left: 10px;
	margin-top: 10px;
	padding: 10px 10px 10px 10px;
	background: var(--lightest_shade_1);
	border-radius: 5px;
	width: max-content;
}

.checklist_instructions_div>p:first-child{
   font-weight: bold;
	margin: 0;
	margin-bottom: 5px;
	color: var(--main_colour);
}

.checklist_instructions_div>p:last-child{
	margin: 0;
}

.invalid_checklist_item_section{
   border: 1px solid transparent;
   background: #f5f5f5;
}

.checklist_item_section_locked{
   font-size: .75em;
    color: #a5a5a5;
    margin-top: 2px;
   float:right;

}

.details_section_header.locked > div{
  width:100%;
}

.details_section_header.locked > div > .psoda_icon {
   width: 15px;
   height: 15px;
   margin-right: 5px;
   display: inline-block;
   vertical-align: middle;
   float:right;
}

.toggle_all_checklist_states_container {
   margin-top: 8px;
   height: 10px;
	float: right;
}

.toggle_all_checklist_states_button {
   cursor:pointer;
   height: 20px;
   border: none;
   width: 35px;
   /* margin-top: -10px; */
   /* position: absolute;
   left: 155px;
   z-index: 1; */
	position: relative;
	margin-bottom: -5px;
   display: inline-block;
}

.toggle_all_checklist_states_slider {
   position: absolute;
   cursor: pointer;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: #ccc;
   border-radius: 34px;
}

.toggle_all_checklist_states_button > .toggle_all_checklist_states_slider:before {
   border-radius: 500px;
   box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
   height: 20px;
   width: 20px;
   bottom: 4px;
   top: 0px;
}

.toggle_all_checklist_states_button.disabled > .toggle_all_checklist_states_slider {
   background-color: #ccc;
}

.toggle_all_checklist_states_button.enabled > .toggle_all_checklist_states_slider {
   background-color: var(--main_colour);
}

.toggle_all_checklist_states_button.disabled > .toggle_all_checklist_states_slider:before {
   position: absolute;
   content: "";
   left: -1px;
   background-color: white;
}

.toggle_all_checklist_states_button.enabled > .toggle_all_checklist_states_slider:before {
   position: absolute;
   content: "";
   right: -1px;
   background-color: white;
}

.toggle_all_checklist_states_button:focus {
   outline: none;
}

#toggle_all_checklist_states_text {
   border:none;
   /* margin-top: -8px; */
   /* position: absolute;
   left: 45px;
   z-index: 1; */
   font-size: 0.85em;
	display: inline-block;
	margin-right: 5px;
}

.checklist_tab .details_section_outer_full_width {
	width: calc(100% - 50px);
}

.checklist_item_empty_text {
	margin-left: 15px;
	margin-top: 10px;
}

/* .invalid_checklist_item_title {
   font-size: 1.25em;
   font-weight: bold;
   vertical-align: middle;
   text-align: left; 
   margin-left: 45%;
} 


.invalid_checklist_item_state_title{
   font-size: 1.25em;
   font-weight: bold;
   vertical-align: middle;
   padding-left: 10px;
   margin-left: 5px;
} */

.invalid_checklist_item_fieldset{
   border: none;
   border-top: solid 1px #bdbdbd;
	padding: 0;
}

.invalid_checklist_item_fieldset:hover{
   border: none;
   border-top: solid 1px #bdbdbd;
}

.invalid_checklist_item_fieldset:hover>legend{
   border: 1px solid transparent;
   background:none;
   color: var(--font_grey);

}
.invalid_checklist_item_fieldset>legend{
   font-weight: bold;
   color: var(--font_grey);
   text-align: left;
   margin-left: 45%;
   font-size:1.25em;
}

.invalid_checklist_item_fieldset.disabled{
   display:none;
}

.invalid_checklist_item_fieldset.enabled{
   display:block;
}

.checklist_item_state_title {
	margin-left: 15px;
}

.checklist_item_state_title p:first-child {
	color: #919191;
	font-size: .9em;
	letter-spacing: .25px;
	font-weight: bold;
	margin-bottom: 2px;
	margin-top: 0;
}

.checklist_item_state_title p:last-child {
   font-size: 1.25em;
   font-weight: bold;
   vertical-align: middle;
	margin: 0;
}

.invalid_checklist_item_fieldset input[type="checkbox"]:disabled + .fancyCheckbox{
   border: 1px solid #868686 !important;
}

.checklistitem_checklist_div{
   /* padding-right: 14px; */
   text-align:right;

}

.checklistitem_dropdown_div{
   padding: 5px;
   padding-right: 25px;
   cursor: text;
   min-width: 50px;
   background-image: url(/images/icons/darkgrey/vnext.svg);
   background-repeat: no-repeat;
   background-position: calc(100% - 5px) 10px;
   background-size: 10px;
   /* padding-right: 10px; */
   border: 1px solid #dadada;
   border-radius: 5px;
   width: calc(100% - 35px);
   /* position: absolute;
   top: 0px; */
   /* right: 20px; */
   word-break: break-word;
}

/* input[type="checkbox"]:disabled + .fancyCheckbox */


/* CHART JS SLIDER */
.chartSliderContainer {
   display: flex;
   flex-direction: column;
   position: relative;
   min-height: 50px;
   width: calc(100% - 125px);
   margin-top: 15px;
   margin-left: auto;
   margin-right: auto;
}

.budgetChartSliderContainer {
   width: calc(100% - 20px - 75px);
   margin-left: 75px;
}

#sliderInputContainer {
   position: relative;
}

.chartSliderInput {
   -webkit-appearance: none; 
   appearance: none;
   height: 5px;
   width: 100%;
   position: absolute;
   background-color: var(--main_colour);
   pointer-events: none;
}

.chartSliderInput::-webkit-slider-thumb {
   -webkit-appearance: none;
   pointer-events: all;
   width: 15px;
   height: 15px;
   background-color: var(--main_colour);
   border-radius: 50%;
   box-shadow: 0 0 0 1px var(--main_colour);
   cursor: pointer;
 }
 
 .chartSliderInput::-moz-range-thumb {
   -webkit-appearance: none;
   pointer-events: all;
   width: 15px;
   height: 15px;
   background-color: var(--main_colour);
   border-radius: 50%;
   box-shadow: 0 0 0 1px var(--main_colour);
   cursor: pointer;  
 }
 
 .chartSliderInput::-webkit-slider-thumb:hover {
   background: var(--main_colour);
 }
 
 .chartSliderInput::-webkit-slider-thumb:active {
   box-shadow: inset 0 0 3px var(--main_colour), 0 0 9px var(--main_colour);
   -webkit-box-shadow: inset 0 0 3px var(--main_colour), 0 0 9px var(--main_colour);
 }

 .leftSlider{
   height: 0;
   z-index: 1;
   margin-top: 5px;
 }

 .chartSliderValues {
   display: flex;
   justify-content: space-between;
   width: 100%;
 }

 .chartSliderMinMax {
   display: flex;
   justify-content: space-between;
   margin-top: 20px;
 }

 .leftChartSliderValue, 
 .rightChartSliderValue {
   width: 70px;
   font-weight: bold;
   color: var(--main_colour);
   position: relative;
   left: 7.5px;
 }

 .rightChartSliderValue {
   left: unset;
   right: 7.5px;
 }

 .leftChartSliderMin,
 .rightChartSliderMax {
   color: #808080;
   vertical-align: top;
   position: relative;
 }

 .leftSliderValue, 
 .rightSliderValue {
   position: absolute;
   z-index: 100;
   background-color: #FFFFFF;
   padding: 0 10px 0 1px;
   top: 20px;
   left: -7.5px;
}

 .rightSliderValue {
   left: unset;
   right: -7.5px;
   padding: 0 1px 0 10px;
 }

 .chart_overlay {
	height: 90%;
	width: 90%;
	position: relative;
	z-index:10;
 }
 .chart_overlay_message {
	font-family: var(--font_family);
	text-align: center;
	padding-top: 15em;
 }

 .add_rule_button {
   background-color: var(--main_colour);
   color: #ffffff;
   padding-top: 5px;
   padding-left: 10px;
   padding-right: 10px;
   padding-bottom: 5px;
   display: inline-block;
   margin-top: 10px;
   border-radius: 5px;
   /* background-image: url(/images/icons/white/new.svg);
   background-repeat: no-repeat;
   background-size: 16px;
   background-position: 7.5px center; */
   cursor: pointer;
 }

 .add_rule_button:hover {
   background-color: var(--lighter_shade_1);
 }

 .add_rule_button .psoda_icon {
   margin-right: 5px;
 }

 #customfield_rules_start table {
   width: calc(100% - 20px);
 }

 .customfield_rules_container {
   display: none;
   width: 100%;
 }

 .customfield_rules_container.customfield_rules_container_open {
   display: block;
 }

 .customfield_rules_container select {
   /* display: inline-block; */
   margin-top: 5px;
   margin-bottom: 5px;
 }

 .customfield_rules_container input {
   /* display: inline-block; */
   margin-left: 30px;
   margin-top: 5px;
   margin-bottom: 5px;
 }

 .customfield_rules_container .rule_text {
   /* display: inline-block; */
   /* margin-left: 30px; */
   margin-right: 30px;
   padding-left: 10px;
   padding-right: 10px;
   padding-top: 3px;
   padding-bottom: 3px;
   color: var(--main_colour);
   border: 1px solid var(--main_colour);
   border-radius: 20px;
   text-transform: uppercase;
   font-size: 10px;
   font-weight: bold;
   margin-top: 5px;
   margin-bottom: 5px;
   width: max-content;
 }

 .rule_hide {
   width: 150px;
   min-width: 150px;
   max-width: 150px;
 }

 .rule_operator {
   width: 100px;
   min-width: 100px;
   max-width: 100px;
 }

.rules_container_remove {
   /* background-image: url(/images/icons/red/delete.svg); */
   float: right;
   height: 24px;
   width: 24px;
   cursor: pointer;
}

.rules_container_remove span, .rules_container_remove svg, .rules_container_remove use {
	pointer-events: none;
}

.customfield_rules_container .fieldset_label {
   float: left;
   width: calc(100% - 20px);
}

.map_grey_rect {
   fill: #eaeaea;
}

.map_grey_rect:hover {
   fill: #dddddd;
}

.map_grey_text {
   fill: var(--font_grey);
}

.map_add_rect {
   fill: var(--main_colour);
}

.map_white_text {
   fill: #ffffff;
}



.santa_hat_on_user {
   position: absolute;
   top: -7px;
   left: -5px;
}

.navigator_expanded .santa_hat_on_user {
   top: -10px;
   left: -5px;
}

div.history_array ul:first-of-type{
   list-style-type: none;
   padding-left: 10px;
}

.shortcuts_outer {
	margin-top: 10px;
	margin-bottom: 10px;
}

.shortcuts_outer_toggle:disabled ~ .shortcuts_section {
	opacity: .5;
}

.shortcuts_section {
	min-width: 150px;
	display: inline-block;
	margin-right: 20px;
	vertical-align: top;
	margin-bottom: 20px;
	text-align: right;
}

.shortcuts_section_header {
	font-weight: bold;
	color: var(--main);
	margin-bottom: 5px;
	text-align: left;
}

.shortcuts_name {
	display: inline-block;
	color: var(--font_grey);
	font-size: .9em;
}

.shortcut_value {
	display: inline-block;
	width:15px;
	text-align: center;
	margin-left: 5px;
	background-color: #eaeaea;
	border-radius: 5px;
	color: var(--font);
	border: 1px solid transparent;
	padding: 3px;
	font-weight: bold;
}

.shortcuts_element.back_shortcut .shortcut_value {
	width: 70px;
}

.shortcuts_element.close_popup_shortcut .shortcut_value {
	width: 50px;
}

.shortcuts_element.remapped_shortcut_value .shortcuts_name {
	font-weight: bold;
	color: var(--main_colour);
}

.shortcuts_element.remapped_shortcut_value .shortcut_value {
	background-color: var(--lightest_shade_2);
	border: 1px solid var(--main_colour);
	color: var(--main_colour);
}

.shortcuts_element.duplicate_shortcut_value .shortcuts_name {
	font-weight: bold !important;
	color: rgb(255, 59, 59) !important;
}

.shortcuts_element.duplicate_shortcut_value .shortcut_value {
	background-color: rgb(253 232 232) !important;
	border: 1px solid rgb(255, 59, 59) !important;
	color: rgb(255, 59, 59) !important;
}

.shortcuts_reset {
	display: inline-block;
	opacity: 0;
	pointer-events: none;
	margin-right: 5px;
	vertical-align: middle;
	cursor: pointer;
}

.shortcuts_element.remapped_shortcut_value .shortcuts_reset {
	opacity: 1;
	pointer-events: auto;
}


@media (max-width:1000px) {
   #top_add_button_outer {
      display: none;
   }
}

/**** FRONT END TAB AND TABLES ****/
.subtab_view_outer + .front_end_tab {
	margin-top: -60px;
}

.tab_controls {
	margin-bottom: 10px;
}

.tab_controls .filters_dropdown_inner {
	height: 300px;
	overflow: auto;
}

.tab_controls .filters_dropdown {
	display: none;
	width: 500px;
}

.tab_controls .filter_button_open + .filters_dropdown {
	display: block;
}

.tab_controls .group_by_dropdown {
	display: none;
	width: 300px;
}

.tab_controls .group_by_dropdown_inner {
	height: 300px;
	overflow: auto;
}

.tab_controls .group_by_button_open + .group_by_dropdown {
	display: block;
}

.filters_dropdown_save, #filterlist_button_submit {
	position: relative;
}

.filter_dropdown_outer, 
.filter_phrase_outer, 
.filter_number_outer, 
.filter_date_outer, 
.filter_active.filter_active_closed .filter_dropdown_outer, 
.filter_active.filter_active_closed .filter_phrase_outer, 
.filter_active.filter_active_closed .filter_number_outer, 
.filter_active.filter_active_closed .filter_date_outer {
	display: none;
	margin-bottom: 20px;
}

.filter_active .filter_dropdown_outer, 
.filter_active .filter_phrase_outer, 
.filter_active .filter_number_outer, 
.filter_active .filter_date_outer {
	display: block;
}

.filters_button_active, .tab_toggle_active {
	background-color: var(--lightest_shade_1);
	color: var(--main_colour);
	font-weight: bold;
}

.tablejs_button_loading.tab_toggle_active, .tablejs_button_loading.filters_button_active {
	color: var(--lightest_shade_1);
}

.tablejs_button_loading.tab_toggle_active .circle_loader, .tablejs_button_loading.filters_button_active .circle_loader {
	border-color: var(--main_colour) var(--main_colour) var(--main_colour) transparent;
}

.filters_button_active:hover, .tab_toggle_active:hover {
	background-color: var(--lightest_shade_2);
}

.tablejs_button_loading.tab_toggle_active:hover, .tablejs_button_loading.filters_button_active:hover {
	color: var(--lightest_shade_2);
}

.filters_dropdown_active_filters {
	background-color: #eaeaea;
	color: var(--font_grey);
	padding-left: 7.5px;
	padding-right: 7.5px;
	padding-top: 3px;
	padding-bottom: 3px;
	display: inline-block;
	margin-left: 20px;
	border-radius: 5px;
	font-size: .8em;
	font-weight: bold;
}

.filters_dropdown_active_filters_active {
	background-color: var(--main_colour);
	color: #ffffff;
}

.filters_dropdown_clear_all, .group_by_dropdown_clear {
	color: var(--icon_red);
	display: inline-block;
	margin-left: 5px;
	font-size: .8em;
	font-weight: bold;
	cursor: pointer;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 3px;
	padding-bottom: 3px;
	border-radius: 5px;
}

.group_by_dropdown_clear {
	margin-left: 10px;
}

#filters_dropdown_search {
	width: 100%;
	border: 1px solid #e6e6e6;
	padding: 5px;
	font-family: var(--font_family);
	border-radius: 5px;
	margin-bottom: 10px;
}

.filter_outer {
	margin-bottom: 2px;
}


.filter_title_outer {
	cursor: pointer;
	display: inline-block;
	width: calc(100% - 10px);
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 5px;
}

.filter_outer_disabled {
	pointer-events: none;
	opacity: .5;
}

.filter_active .filter_title_outer {
	width: auto;
}

.filter_title_outer:hover, 
.tablejs_dropdown_toggle:hover {
	background-color: #f7f7f7;
}

.filter_active .filter_title_outer:hover {
	background-color: unset;
}

.filter_active .filter_title_outer, .filter_active_closed .filter_title_outer {
	font-weight: bold;
	color: var(--main_colour);
	/* cursor: default; */
}

.filter_title_help_tooltip .psoda_icon, .filter_title_help_tooltip .psoda_icon svg, .filter_title_help_tooltip .psoda_icon use {
	pointer-events: none;
}

.filter_title_help_tooltip {
	margin-right: 10px;
	border-radius: 100px;
	pointer-events: auto;
	cursor: help;
	float: right;
}

.tab_toggle_tick {
	display: none;
}

.tab_toggle_active .tab_toggle_tick {
	display: inline-block;
}

.filter_title_arrow_icon {
	display: none;
}

.filter_title_add_icon, .filter_title_arrow_icon {
	pointer-events: none;
	margin-right: 5px;
}

.filter_active .filter_title_arrow_icon {
	display: inline-block;
}

.filter_active.filter_active_closed .filter_title_arrow_icon {
	transform: rotate(-90deg);
}

.filter_active .filter_title_add_icon {
	display: none;
}

.filter_remove {
	display: none;
	margin-right: 10px;
	color: var(--icon_red);
	font-size: .8em;
	font-weight: bold;
	cursor: pointer;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 5px;
}

.filter_remove .psoda_icon {
	margin-right: 5px;
}

.filter_active .filter_remove {
	display: block;
	float: right;
}

.filter_remove:hover, .filters_dropdown_clear_all:hover, .group_by_dropdown_clear:hover {
	background-color: #f7f7f7;
}

.operators_outer {
	margin-top: 10px;
	margin-bottom: 10px;
}

.operators_outer .operator_option {
	width: 50px;
	height: 56px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 3px;
	padding-right: 3px;
	display: inline-block;
	background-color: #eaeaea;
	margin-right: 5px;
	border-radius: 5px;
	vertical-align: middle;
	cursor: pointer;
}

.operators_outer .operator_option:hover {
	background-color: #dddddd;
}

.operators_outer .operator_option_selected {
	background-color: var(--main_colour);
}

.operators_outer .operator_option_selected:hover {
	background-color: var(--main_colour);
}

.operators_outer .operator_option_text {
	text-align: center;
	font-size: .8em;
	color: var(--font_grey);
	pointer-events: none;
}

.operators_outer .operator_option_selected .operator_option_text {
	color: #ffffff;
}

.operators_outer .operator_option .psoda_icon {
	margin-left: 12px;
	pointer-events: none;
}

.operators_outer .operator_option_5 .psoda_icon, .operators_outer .operator_option_6 .psoda_icon {
	margin-left: 17.5px;
}

.operators_outer .operator_option_5 .psoda_icon svg, .operators_outer .operator_option_6 .psoda_icon svg {
	height: 24px;
}

.operators_outer .operator_option_selected .psoda_icon use {
	fill: #ffffff !important;
}

.filter_field_input {
	width: 100%;
}

.filter_dropdown_outer .multiselect-wrapper {
	width: 450px;
}

.filter_dropdown_outer .multiselect-wrapper .view_notselected, .filter_dropdown_outer .multiselect-wrapper .view_selected {
	width: 449.5px;
}

.filters_container {
	font-size: .9em;
	margin-top: 10px;
	margin-bottom: 10px;
}

.tablejs_dropdown_toggle {
	cursor: pointer;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 5px;
}

.tablejs_dropdown_active_toggle {
	font-weight: bold;
	color: var(--main_colour);
}

.tablejs_dropdown_active_toggle .psoda_icon {
	float: right;
	margin-right: 10px;
}

/* New table js */

.tablejs_table_container {
	position: relative;
	overflow: auto;
	margin-top: 10px;
}

.tablejs_table {
	width: 100%;
	color: var(--font_grey);
	table-layout: fixed;
	border-collapse: separate;
	border-spacing: 0px;
}

.front_end_tab .tablejs_filters_container {
	display: none;
}

.table_top_controls {
	width: 100%;
   display: inline-block;
}

.collapse_tablejs_container {
	background-color: #eaeaea;
	height: 30px;
	border-radius: 5px;
	width: 90px;
	display: inline-block;
}

.collapse_tablejs_button {
   height: 30px;
   width: 30px;
   display: inline-block;
   cursor: pointer;
   border-radius: 5px;
}

.collapse_tablejs_button:hover {
	background-color: #dddddd;
}

.collapse_tablejs_button_active:hover {
	background-color: var(--main_colour);
}

.collapse_tablejs_button_active {
	background-color: var(--main_colour);
}

.collapse_tablejs_button .psoda_icon {
	pointer-events: none;
}

.collapse_tablejs_button .psoda_icon svg {
	padding: 5px;
}

.collapse_tablejs_button_active .psoda_icon use {
	fill: #ffffff !important;
}

.tablejs_table.collapse_1_enabled .collapse_table {
   max-height: 95px !important;
   overflow: hidden;
}

.tablejs_table.collapse_2_enabled .collapse_table {
	max-height: 20px !important;
	overflow: hidden;
}

.tablejs_table.collapse_1_enabled .expand_row .collapse_table, .tablejs_table.collapse_2_enabled .expand_row .collapse_table {
	overflow: visible !important;
	transition: .1s ease;
	max-height: unset !important;

}

.tablejs_table .expand_row {
	background-color: var(--lightest_shade_1) !important;
}

.tablejs_table.collapse_2_enabled .actions_dropdown_img {
   margin-top: -5px;
}

.freeze_left_columns {
	margin-bottom: 10px;
}

.freeze_columns_select {
	max-width: unset;
	min-width: unset;
}

#freeze_left_columns_select {
	margin-right: 10px;
}

#popup_columnlist .memberselect-wrapper .view_notselected {
	height: 249px;
}

#popup_columnlist .memberselect-wrapper .view_selected {
	height: 216px;
}

#popup_columnlist .freeze_columns {
	margin-bottom: 10px;
}

.tablejs_table thead tr {
	position: sticky;
	top: 0;
	z-index: 5;
	color: var(--font);
}

.tablejs_table thead th {
	text-align: left;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 10px;
	padding-bottom: 10px;
	cursor: pointer;
	background-color: #ffffff;
	box-shadow: inset 0 -1px 0 #dddddd;
	position: relative;
}

.tablejs_table .displaylist_header_text_no_sort_filter {
	margin-top: -2px;
}

.tablejs_table .tablejs_sort {
	border-radius: 5px;
	display: inline-block;
	cursor: pointer;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 6px;
	padding-right: 6px;
	margin-top: -5px;
	position: relative;
}

.tablejs_table .tablejs_sort:hover {
	background-color: #eaeaea;
}

.tablejs_table .tablejs_sort.active_sort {
	background-color: var(--main_colour);
}

.tablejs_table .tablejs_sort.active_sort:hover {
	background-color: var(--lighter_shade_1);
}

.tablejs_table .tablejs_sort.tablejs_sort_loading .psoda_icon svg use {
	fill: #ffffff !important;
}

.tablejs_table .tablejs_sort.tablejs_sort_loading:hover .psoda_icon svg use {
	fill: #eaeaea !important;
}

.tablejs_table .tablejs_sort.active_sort.tablejs_sort_loading .psoda_icon svg use {
	fill: var(--main_colour) !important;
}

.tablejs_table .tablejs_sort.active_sort.tablejs_sort_loading:hover .psoda_icon svg use {
	fill: var(--lighter_shade_1) !important;
}

.tablejs_table .tablejs_sort .circle_loader {
	position: absolute;
	top: 4px;
	left: 1px;
   right: 0;
   margin-left: auto;
   margin-right: auto;
   border-color: #505050 #505050 #505050 transparent;
}

.tablejs_table .tablejs_sort.active_sort .circle_loader {
   border-color: #FFFFFF #FFFFFF #FFFFFF transparent;
}

.tablejs_table thead th:hover .tablejs_resize_col {
	opacity: 1;
}

.tablejs_resize_col {
	cursor: col-resize;
	position: absolute;
	right: 0;
	top: 0;
	width: 3px;
	height: 100%;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	background-color: #dddddd;
	opacity: 0;
}

.tablejs_resize_col.tablejs_resize_col_active {
	background-color: var(--main_colour);
}

#tablejs_drag_bar_overlay {
	position: absolute;
	top: 0;
	height: 100%;
	width: 3px;
	background-color: var(--main_colour);
}

.tablejs_table_container .tfoot {
	position: sticky;
	bottom: 0;
	left: 0;
	background-color: #ffffff;
	box-shadow: inset 0 1px 0 #dddddd;
	min-height: 32px;
	padding-top: 10px;
	padding-bottom: 10px;
	z-index: 5;
}

.tablejs_table_container .footer_left_div {
	display: inline-block;
}

.tablejs_addbutton {
   display: inline-block;
   z-index: 2;
	height: 20px;
   border-radius: 5px;
   cursor: pointer;
   background-color: var(--main_colour);
   color: #FFFFFF;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	margin-right: 10px;
   position: relative;
}

.tablejs_addbutton:hover {
   background-color: var(--lighter_shade_1);
   color: #ffffff;
}

.tablejs_addbutton .psoda_icon {
   margin-right: 5px;
}

.tablejs_table_container .tfoot .max_rows {
	padding-top: 7px;
	padding-bottom: 7px;
	font-size: 0.9em;
}

.tablejs_table tbody tr {
	background: linear-gradient(to bottom, #f7f7f7, #ffffff);
}

.tablejs_table tbody tr:hover {
	background: linear-gradient(to bottom, #f1f1f1, #e7e7e7);
}

.tablejs_table .archived_row {
	filter: grayscale(100%);
   opacity: .6;
   background: linear-gradient(to bottom, #f1f1f1, #e7e7e7);
}

.tablejs_table .archived_row.selected_row {
	background: #cdcdcd;
}

.tablejs_table tbody tr.selected_row, .tablejs_table tbody tr.selected_row .tablejs_sticky_column{
	background: var(--lightest_shade_1);
}

.tablejs_table td {
	vertical-align: top;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: inherit;
	overflow: hidden;
	position: relative;
}

.tablejs_table .tablejs_sticky_column {
	position: sticky;
	background-color: #ffffff;
	z-index: 2;
}



.tablejs_table .tablejs_sticky_left_column {
	left: 0;
}

.tablejs_table .tablejs_sticky_right_column {
	right: 0;
}

.tablejs_table td.tablejs_sticky_left_column.tablejs_last_sticky_column {
	box-shadow: inset -1px 0 0 #dddddd;
}

.tablejs_table th.tablejs_sticky_left_column.tablejs_last_sticky_column {
	box-shadow: inset -1px -1px 0 #dddddd;
}

.tablejs_table td.tablejs_sticky_right_column.tablejs_last_sticky_column {
	box-shadow: inset 1px 0 0 #dddddd;
}

.tablejs_table th.tablejs_sticky_right_column.tablejs_last_sticky_column {
	box-shadow: inset 1px -1px 0 #dddddd;
}

.tablejs_table tbody tr.tablejs_group_by_tr {
	background-color: #ffffff;
	box-shadow: inset 0 -1px 0 #dddddd;
	font-weight: bold;
	color: var(--font);
}

.tablejs_group_by_tr td {
	position: sticky;
	left: 0;
	box-shadow: inset 0 -1px 0 #dddddd;
}

.tablejs_table .collapse_overflow {
	width: 0;
	height: 0;
	/* background-color: blue; */
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-right: 5px solid var(--lightest_shade_2);
	transform: rotate(-135deg);
	position: absolute;
	right: 0;
	bottom: -2.5px;
	pointer-events: none;
	/* display: none; */
	opacity: 0;
}

.tablejs_table .collapse_overflow.overflow_visible {
	/* display: block; */
	opacity: 1;
}

.tablejs_table.collapse_1_enabled .tablejs_loading_td div {
	height: 95px;
}

.tablejs_table.collapse_2_enabled .tablejs_loading_td div {
	height: 20px;
}

.tablejs_table .tablejs_loading_td div .skeleton_animation {
	height: 20px;
	border-radius: 5px;
}

.link_icon {
	margin-right: 5px;
}

.tablejs_no_items_td {
	padding: 20px;
}

.tablejs_no_items {
	width: 400px;
}

.tablejs_no_items_header {
	padding-top: 200px;
	background-image: url(/images/displaylist_no_items.svg);
	background-repeat: no-repeat;
	background-size: auto 180px;
	background-position: center 10px;
	font-size: 2em;
	text-align: center;
	color: var(--font);
}

.tablejs_no_items_text {
	color: var(--font_grey);
	text-align: center;
}

.tablejs_table thead th.tablejs_selectall {
	width: 20px;
	padding-left: 10px;
	padding-right: 10px;
}

.tablejs_actiononselected_imgs_divs {
	display: inline-block;
	padding-left: 2px;
	padding-right: 2px;
	margin-left: 5px;
	margin-right: 5px;
	cursor: pointer;
}

.tablejs_bulk_action_imgs {
	pointer-events: none;
}

.tablejs_table .status_state {
	margin-left: 18px;
}


/* .tablejs_table .textedit,
.tablejs_table .textareaedit,
.tablejs_table .wysiwygedit,
.tablejs_table .dateedit,
.tablejs_table .dropdown {
	border: none;
} */


/* Front end popup classes */

.popup_display_list {
	margin-top: 25px;
	text-align: left;
}

.popup_display_list table {
	/* background: white; */
	border-collapse: separate;
	border-spacing: 0px;
	width: 99.7%;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	table-layout: fixed;
}

.popup_display_list tr {
	background: linear-gradient(to bottom, #f1f1f1, #e7e7e7);
}

.popup_display_list th, .popup_display_list td {
	vertical-align: top;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: inherit;
	overflow: hidden;
}

.popup_message {
	text-align: center;
}

.popup_button_container {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	background-color: #ffffff;
	border-top: none;
	box-shadow: 0px -4px 3px rgb(50 50 50 / 10%);
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	min-height: 33.4px;
	padding-top: 20px;
    /* text-align: center; */
    padding-bottom: 20px;
    border-top: 1px solid #eaeaea;
    /* position: relative; */
}

.popup_submit_delete_button {
	background-color: #e02020;
	padding: 8px 30px;
	text-align: center;
	color: white !important;
	cursor: pointer;
	border-radius: 3px;
	margin-right: 20px;
}

.popup_cancel_button {
	cursor: pointer;
	margin-left: 20px;
}

.popup_close_button {
	display: inline-block;
	height: 20px;
	border-radius: 5px;
	cursor: pointer;
	background-color: var(--main_colour);
	color: #FFFFFF;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
	/* margin-bottom: 10px; */
	position: relative;
}

.popup_error_message {
	padding: 3px;
	border-radius: 5px;
	padding-left: 5px;
	padding-right: 5px;
	background: #ffdddd;
	font-weight: bold;
}

.tabdialogbuttons {
	display: flex;
	align-items: center;
	padding-bottom: 20px;
}

.tabdialogbuttons input {
	text-align: center;
	color: white !important;
	cursor: pointer;
	border-radius: 3px;
	margin: 8px 8px 0px 0px
}

.tabdialogbuttons .tab_phase_button_cancel {
	background-color: transparent !important;
   color: var(--font) !important;
	border: 1px solid transparent;
	margin-left: 8px;
}

.popup .tab_phase_button_submit {
	padding-top: 4.5px;
	padding-bottom: 4.5px;
	padding-left: 20px;
	padding-right: 20px;
	border: 1px solid transparent;
}


/* DUAL RANGE SLIDERS */
.dualslidercontainer {
   display: flex;
   flex-direction: column;
   position: relative;
   /* min-height: 50px; */
   /* width: calc(100% - 125px); */
	width: 500px;
   margin-top: 15px;
   margin-left: auto;
   margin-right: auto;
}


#sliderInputContainer {
   position: relative;
}

.dualsliderinput {
   -webkit-appearance: none; 
   appearance: none;
   height: 5px;
   width: 100%;
   position: absolute;
   background-color: var(--main_colour);
   pointer-events: none;
}

.dualsliderinput::-webkit-slider-thumb {
   -webkit-appearance: none;
   pointer-events: all;
   width: 20px;
   height: 20px;
   background-color: var(--main_colour);
   border-radius: 50%;
   box-shadow: 0 0 0 1px var(--main_colour);
   cursor: pointer;
}
 
.dualsliderinput::-moz-range-thumb {
   -webkit-appearance: none;
   pointer-events: all;
   width: 20px;
   height: 20px;
   background-color: var(--main_colour);
   border-radius: 50%;
   box-shadow: 0 0 0 1px var(--main_colour);
   cursor: pointer;  
}
 
.dualsliderinput::-webkit-slider-thumb:hover {
   background: var(--main_colour);
}
 
.dualsliderinput::-webkit-slider-thumb:active {
   box-shadow: inset 0 0 3px var(--main_colour), 0 0 9px var(--main_colour);
   -webkit-box-shadow: inset 0 0 3px var(--main_colour), 0 0 9px var(--main_colour);
}

.leftSlider{
	height: 0;
	z-index: 1;
	margin-top: 5px;
}

.dualslidervalues {
	display: flex;
	justify-content: space-between;
	width: 100%;
}

.dualsliderminmax {
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
}

.leftdualslidervalue, 
.rightdualslidervalue {
	width: 10px;
	font-weight: bold;
	color: #FFFFFF;
	position: relative;
}

.leftdualslidermin,
.rightdualslidermax {
	color: #808080;
	vertical-align: top;
	position: relative;
}

.leftdualslidervalue, 
.rightdualslidervalue {
   position: absolute;
   z-index: 100;
   /* background-color: #FFFFFF; */
   /* padding: 0 10px 0 1px; */
	top: -2.5px;
	left: -1.5px;
	pointer-events: none;
}

.rightdualslidervalue {
   left: unset;
   right: 2.5px;
}
.leftdualslidervalue {
   left: 4.5px;
}

.tabdialogbuttons input {
	background: var(--main_colour);
   font-family: var(--font_family);
	border: 1px solid transparent;
}

.dualslider_label_container{
	margin: 8px;
	width: 100px;
}

.dualslider_outer_container {
	display: flex;
}

.toggle_button_container {
   margin: 8px 0px;
   height: 10px;
	/* float: right; */
}

.toggle_button {
   cursor:pointer;
   height: 20px;
   border: none;
   width: 35px;
   /* margin-top: -10px; */
   /* position: absolute;
   left: 155px;
   z-index: 1; */
	position: relative;
	margin-bottom: -5px;
   display: inline-block;
}

.toggle_slider {
   position: absolute;
   cursor: pointer;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: #ccc;
   border-radius: 34px;
}

.toggle_button > .toggle_slider:before {
   border-radius: 500px;
   box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
   height: 20px;
   width: 20px;
   bottom: 4px;
   top: 0px;
}

.toggle_button.disabled > .toggle_slider {
   background-color: #ccc;
}

.toggle_button.enabled > .toggle_slider {
   background-color: var(--main_colour);
}

.toggle_button.disabled > .toggle_slider:before {
   position: absolute;
   content: "";
   left: -1px;
   background-color: white;
}

.toggle_button.enabled > .toggle_slider:before {
   position: absolute;
   content: "";
   right: -1px;
   background-color: white;
}

.toggle_button:focus {
   outline: none;
}

#toggle_button_text {
   border:none;
   /* margin-top: -8px; */
   /* position: absolute;
   left: 45px;
   z-index: 1; */
   font-size: 0.85em;
	display: inline-block;
	margin-right: 5px;
}

/* .popup_waiting_image {
	background-image: url(/images/night_loader.gif);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 120px 120px;
	height: 125px;
	width: 125px;
} */

.loader_label {
	color: var(--main_colour);
	font-weight: bold;
}

.loader_div_container {
	display: flex;
	flex-direction: row;
	justify-content: center;
	width: 500px;
	margin: 40px;
}

.loader_div {
	display: flex;
	flex-direction: column;
	align-items: center;
}

/*WYSIWYG table styling*/

.wysiwygedit table, .wysiwygedit tr, .wysiwygedit th, .wysiwygedit td,
.wysiwyg table, .wysiwyg tr, .wysiwy th, .wysiwyg td,
.inner_collapse_table table, .inner_collapse_table tr, .inner_collapse_table th, .inner_collapse_table td{
	border-collapse: collapse;
}


.wysiwyg td,
.wysiwygedit td {
	padding: 4px;
	min-width: 50px;
}

.wysiwyg .circle_loader,
.wysiwygedit .circle_loader {
	width: 40px;
	height: 40px;
	border-color: var(--icon_grey) var(--icon_grey) var(--icon_grey) transparent;
	position: relative;
}