BODY.modal-open { overflow: hidden; }
BODY.modal-open.page-overflow .page-container { overflow-y: visible !important; }

body.reports
{
	font: 16px Open Sans;
	width: 210mm;	
	overflow: hidden; 
}

SELECT { -moz-appearance: none; }

/********************************************/
/******REMOVE SCROLL IN INPUT NUMBER*********/
/********************************************/
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number]
{ 
	-moz-appearance: textfield; 
	/* set all input number alignment */
	text-align: right;
}

.page-footer 
{
	background-color: #b1c5e1;
    padding-top: 6px;
    border-top: 1px solid #2a4b7a !important;
    color: #2a4b7a;
}

.scroll-to-top { bottom: 42px; }

.page-sidebar-menu-closed .NeoMenuHeading
{
	height: 2px !important; 
	padding: 0 !important; 
	margin: 5px !important; 
	background-color: #5b9bd1 !important;
	opacity: 0.3;
}

.datepicker-inline { width: 100%; }

.page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-menu { width: auto; max-width: 350px; }
.page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-menu > li.title { padding: 13px; font-weight: bold; background-color: #efefef; }
.page-content-wrapper .page-content { padding: 20px; background-color: white; margin-bottom: 53px; position: relative; }
.page-content-wrapper .page-content.rare
{
	height: 100vh;
	background-color: white; 
    margin: 0px !important;
    position: relative;
}

.note-editor.note-frame { border: 1px solid lightgray; }
.panel .panel-body { font-size: 14px; }

.page-container.rare { margin: 0 !important; padding: 0 !important; height: 100vh; overflow: hidden; }
.page-container.rare .hide-rare { display: none; }
.page-container.rare .portlet-title
{ 
	position: fixed; 
	left: 20px; top: 0px; 
	width: -moz-calc( 100% - 40px ); width: -webkit-calc( 100% - 40px ); width: calc( 100% - 40px ); 
}
.page-container.rare .portlet-body 
{ 
	position: fixed; 
	left: 20px; top: 50px; 
	width: 90%; width: -moz-calc( 100% - 40px ); width: -webkit-calc( 100% - 40px ); width: calc( 100% - 40px ); 
	height: 90%; height: -moz-calc( 100vh - 120px ); height: -webkit-calc( 100vh - 120px ); height: calc( 100vh - 120px ); 
	overflow: auto;
}

.page-container.rare .portlet-body::-webkit-scrollbar 
{ 
	height: 0px;  /* remove horizontal scrollbar space */
}

.page-container.rare .portlet-body.vsm { top: 75px; } 

.actions.btn-set { border-top: 1px solid #eee; padding-top: 20px; display: block; }
.actions.btn-set.top-margin { margin-top: 10px; }
.page-container.rare .portlet-body .actions.btn-set
{
	position: fixed;
    bottom: 20px;
    left: 20px;
    padding-top: 20px;
    z-index: 8;
    width: 90%; width: -moz-calc( 100% - 40px ); width: -webkit-calc( 100% - 40px ); width: calc( 100% - 40px ); 
}

.page-container.rare .portlet-body .Block_00_34 { position: absolute; top: 0; left: 0; width: 100%; height: 34%; }
.page-container.rare .portlet-body .Block_34_66 { position: absolute; top: 34%; left: 0; width: 100%; height: 66%; } 
.page-container.rare .portlet-body .Block_PX_00_350 { position: absolute; top: 0; left: 0; width: 100%; height: 350px; } 
.page-container.rare .portlet-body .Block_PX_350_REST { position: absolute; top: 350px; left: 0; width: 100%; height: 50%; height: -moz-calc( 100% - 350px ); height: -webkit-calc( 100% - 350px ); height: calc( 100% - 350px ); } 

.NeoMaximize:hover { opacity: 1; color: #5b9bd1; text-decoration: none; }
.NeoMaximize:before { font-family: 'Simple-Line-Icons'; content: "\e057"; font-size: 16px; text-decoration: none; }
.NeoMinimize:before { font-family: 'Simple-Line-Icons'; content: "\e058"; font-size: 16px; text-decoration: none; }
.NeoMinimize, .NeoMaximize { color: #959595; cursor: pointer; position: absolute; opacity: 0.4; text-decoration: none; }
.NeoMinimize { top: 10px;  right: 20px; }
.NeoMaximize { top: 20px;  right: 20px; }

::-webkit-scrollbar 
{
    width: 0px;  /* remove vertical scrollbar space */
    background: transparent;  /* optional: just make scrollbar invisible */
}

* { -ms-overflow-style: none; scrollbar-width: unset; }

.disabled { color: lightgray; }

.reports .header { font: 25px Open Sans; }
input.noclear::-ms-clear { display: none; }
h4.narrow, h5.narrow, h6.narrow { margin-top: 0px; margin-bottom: -5px; }

.reports .overlapping
{
	width: 10px; height: 10px;
	border: 3px solid lightgray;
	border-radius: 10px;
	background-color: gray;
	margin: 2px;
	align: left;
	float: right;
}

.neo_wordwrap 
{ 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}

div.boxMultiline
{
	font-size: 11px;
	font-weight: bold;
}

div.neo_page_blocks_iframe_wrapper
{
	width: 100%; 
	overflow: hidden;
}

iframe.neo_page_blocks_iframe
{
	width: 100%; 
}

div.neo_page_blocks_actions
{
	position: absolute; 
	top: 182px; left: 0px; 
	padding: 5px; 
	background-color: white; 
	border-top: 1px solid lightgray; 
	border-right: 1px solid lightgray;
}

td.timeframe_green_border_top
{
	background-color: #1fc8b0; 
	border-top: 1px dashed black; 
	border-left: 1px solid gray; 
	border-right: 1px solid gray; 
	cursor: pointer;
}

td.timeframe_green
{
	background-color: #1fc8b0; 
	border-left: 1px solid gray; 
	border-right: 1px solid gray; 
	cursor: pointer;
}

td.timeframe_green_bottom
{
	background-color: #1fc8b0; 
	border-bottom: 1px solid gray; 
	border-left: 1px solid gray; 
	border-right: 1px solid gray;
}

td.timeframe_green_bottom_dashed
{
	background-color: #1fc8b0; 
	border-bottom: 1px dashed black; 
	border-left: 1px solid gray; 
	border-right: 1px solid gray;
}

td.timeframe_green_bottom_end
{
	background-color: #1fc8b0; 
	border-bottom: 1px solid gray; 
	border-left: 1px solid gray; 
	border-right: 1px solid gray;
}

td.timeframe_gray
{
	background-color: lightgray; 
	border-bottom: 1px dashed black; 
	border-left: 1px solid gray; 
	border-right: 1px solid gray;
}

td.timeframe_gray_top
{
	background-color: lightgray; 
	border-top: 1px dashed black; 
	border-left: 1px solid gray; 
	border-right: 1px solid gray;
}

input.newsletterSeries
{
	width: 50px; height: 25px;
	text-align: center; 
	border: 1px solid lightgray; 
	font-size: 14px; 
	padding-bottom: 4px; 
	padding-top: 1px;
	margin: 4px 4px 0px 0px;
}

select.newsletterSeries
{
	width: 30px; height: 25px;
	text-align: center; 
	border: 1px solid lightgray; 
	font-size: 14px; 
	padding: 2px; 
	margin: 4px 4px 0px 0px;
}

div.newsletterSeries
{
	float:left;
	border: 1px solid lightgray; 
	width: 130px; 
	background: #f0f0f0; 
	padding: 3px 10px;
	margin: 2px 4px 2px 0px;
}

div.trafficeLight
{
	width: 40px;
	height: 40px;
	-webkit-border-radius: 30px !important;
  	-moz-border-radius: 30px !important;
  	border-radius: 30px !important;
  	border: 2px solid #dddddd;
	background-color: #eeeeee;
	margin: 2px;
}

.ellipsed
{
	overflow: hidden;
    wrap: no-wrap;
    word-wrap: no-wrap;
    white-space: nowrap;
    text-overflow: ellipsis;
}

a.menu_ellipsed
{
	overflow: hidden;
    wrap: no-wrap;
    word-wrap: no-wrap;
    white-space: nowrap;
    text-overflow: ellipsis;
}

a.table_header
{
	white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    margin: 0; padding: 0;
    color: #5a5a5a; 
    overflow: hidden;
    text-decoration: none;
    width: -moz-calc( 100% - 20px );
   	width: -webkit-calc( 100% - 20px );
   	width: calc( 100% - 20px );
}

.table_header_sort
{
	color: lightgray;
    position: absolute;
    top: 1px;
    right: 10px;
}

.table_header_icon
{
	color: lightgray;
    position: absolute;
    top: 0;
    left: 0px;
}

.table_header_spinner
{
	color: lightgray;
    position: absolute;
    top: 0;
    right: 10px;
}

.table_cell_content
{
	padding-left: 3px; 
	white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    width: -moz-calc( 100% - 22px );
   	width: -webkit-calc( 100% - 22px );
   	width: calc( 100% - 22px );
}
div.trafficeLightRedOn
{
	border: 2px solid #B40404;
	background-color: #FF0000;
}

div.trafficeLightYellowOn
{
	border: 2px solid #AEB404;
	background-color: #D7DF01;
}

div.trafficeLightGreenOn
{
	border: 2px solid #04B404;
	background-color: #01DF01;
}

div.newsletterHistoryProcessbar
{
	width: 100%;
	-webkit-border-radius: 6px !important;
  	-moz-border-radius: 6px !important;
  	border-radius: 6px !important;
  	border: 1px solid #c0c0c0;
	background-color: #eeeeee;
	padding: 2px;
}

div.newsletterHistoryProcessbarProcess
{
	height: 10px;
	-webkit-border-radius: 6px !important;
  	-moz-border-radius: 6px !important;
  	border-radius: 6px !important;
  	background-color: lightgreen;
	overflow: hidden;
}

img.NeoDynamicImageLoadingMiddle
{
	border: 1px solid lightgray;
	-webkit-border-radius: 10px !important;
  	-moz-border-radius: 10px !important;
  	border-radius: 10px !important;
	background-color: #ffffff;
	padding: 35px;
}

img.NeoDynamicImageLoading16
{
	border: 1px solid lightgray;
	-webkit-border-radius: 10px !important;
  	-moz-border-radius: 10px !important;
  	border-radius: 10px !important;
	background-color: #ffffff;
	padding: 0px;
}

img.NeoDynamicImageLoading32
{
	border: 1px solid lightgray;
	-webkit-border-radius: 10px !important;
  	-moz-border-radius: 10px !important;
  	border-radius: 10px !important;
	background-color: #ffffff;
	padding: 8px;
}

img.NeoDynamicImageLoading66
{
	border: 1px solid lightgray;
	-webkit-border-radius: 10px !important;
  	-moz-border-radius: 10px !important;
  	border-radius: 10px !important;
	background-color: #ffffff;
	padding: 24px;
}

img.NeoDynamicImageLoading96
{
	border: 1px solid lightgray;
	-webkit-border-radius: 10px !important;
  	-moz-border-radius: 10px !important;
  	border-radius: 10px !important;
	background-color: #ffffff;
	padding: 35px;
}

img.NeoDynamicImageLoading128
{
	border: 1px solid lightgray;
	-webkit-border-radius: 10px !important;
  	-moz-border-radius: 10px !important;
  	border-radius: 10px !important;
	background-color: #ffffff;
	padding: 51px;
}

.dont-break-out 
{

  	/* These are technically the same, but use both */
  	overflow-wrap: break-word;
  	word-wrap: break-word;
	-ms-word-break: break-all;
 	/* This is the dangerous one in WebKit, as it breaks things wherever */
  	word-break: break-all;
  	/* Instead use this non-standard one: */
  	word-break: break-word;
	/* Adds a hyphen where the word breaks, if supported (No Blink) */
  	-ms-hyphens: auto;
  	-moz-hyphens: auto;
  	-webkit-hyphens: auto;
  	hyphens: auto;
}

div.releasesBlocks
{
	width: 70px; 
	float: left; 
	text-align: center; 
	padding: 5px 0px;
	margin: 10px 5px 0px 5px; 
	background-color: #ffffff;	
}

div.releasesBlocks_selected
{
	width: 70px; 
	float: left; 
	text-align: center; 
	padding: 5px 0px;
	margin: 10px 5px 0px 5px; 
	background-color: #FFD700;	
}

div.column, div.column_disabled, div.column_moved, div.column_helper_visible, div.column_helper_invisible, div.column_last_selected
{
	outline: none; 
	position:absolute;
	border: 1px solid lightgray;
	left: 10px;  z-index: 0;
	border-radius: 15px !important; 
	width: 300px; height: 25px; 
	font-family: Verdana,Helvetica,VERDANA,sans-serif;
	color: #000000; font-weight: bold;
	font-size: 10px; padding: 6px 10px;
	text-align: left;
	background-color: #f0f0f0;
}

div.column_container div
{
	position: absolute; 
	left: 15px; top: 5px; width: 50%;
	-webkit-user-select: none; /* Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none; /* Standard */	
}

div.column_container input
{
	position: absolute; 
	border-radius: 5px; 
	right: 70px; top: 1px; width: 30%;
	margin: 0px; padding: 0px; height: 21px;
}

div.column_container select
{
	position: absolute; 
	width: 50px;
    right: 10px; top: 3px;
}

div.column_moved
{
	z-index: 9999;
	border: 1px solid darkgray;
	background-color: #c0c0c0
}

div.column_helper_visible
{
	font-family: Verdana,Helvetica,VERDANA,sans-serif;
	color: #e6e6e6; font-weight: bold;
	border: 1px solid #e6e6e6;	
	background-color: #ffffff;
	display: block;
}

div.column_helper_invisible
{
	display: none;
}

div.column_last_selected
{
	border: 1px solid #97b59d;	
	background-color: #acd7b4
}

div.buttons
{
	height: 30px; font-size: 11px; 
	font-family: VERDANA; 
}

DIV.neo-uploader.dropover
{
	background-color: #e9f0ea;
}

DIV.neo-uploader-progress-border
{
	border: 1px dotted lightgray;
	border-top: 0;
    background: #f4f4f4;
    color: gray;
    padding: 10px;
    position: relative;
}

DIV.neo-uploader-progress-text
{
	position: absolute;
    left: 0px; top: 0px; width: 100%;
    padding: 7px;
    height: 30px;
	font-family: Verdana,Helvetica,VERDANA,sans-serif;
	font-size: 11px;
}

IMG.neo-uploader-img
{
	margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 40%;
}

DIV.neo-uploader-progress
{
	background-color: #f6c058;
	position: absolute;
    left: 0px; top: 0px; width: 0px;
    height: 20px;
    display: none;
    text-align: right;
}

DIV.preview
{
	width: 100%; 
	border: 1px solid lightgray;
	border-left: 0;
	padding: 20px;
}

DIV.preview IFRAME
{
	width: 100%; 
	height: 100%;
	min-height: 800px;
	border: 0;
	overflow: hidden;
}

table.radios INPUT
{
	margin: 0 !important;	
}

table.radios LABEL
{
	margin-right: 10px;
    margin-left: 5px;
    font-weight: bold;
}

.institution img 
{
	width: 100%;
}

.matrix_column
{
	position: absolute; 
	border-right: 1px solid gray;
	border-bottom: 1px solid gray;
}

.matrix_column.top
{
	border-top: 1px solid gray;
}

.matrix_column.left
{
	border-left: 1px solid gray;
}

.align-middle
{
	position: absolute;
	top: -moz-calc( 50% - 9px );
   	top: -webkit-calc( 50% - 9px );
   	top: calc( 50% - 9px );
   	width: 100%; left: 0;
   	text-align: center;
}

/* org chart style */
DIV.orgchart { position: relative; }
DIV.orgchart DIV.pointer IMG { width: 50px;}
DIV.orgchart DIV.pointer 
{ 
	position: absolute;
    display: none;
    left: 0;
    top: 0;
    width: 200px;
    height: 130px;
    z-index: 99999;
    right: 0;
    margin: auto;
    border: 1px solid #cacea8;
    background: #f5facc;
    border-radius: 10px !important;
    bottom: 0;
    padding: 20px;
    text-align: center;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: #50542a 3px 3px 3px;
    -moz-box-shadow: #50542a 3px 3px 3px;
    box-shadow: 3px 3px 3px #50542a;
}

.org
{
  	width: 100%;
  	overflow: hidden; 
  	cursor: grab; 
  	cursor: -o-grab; 
  	cursor: -moz-grab; 
  	cursor: -webkit-grab; 
}
 
.org-chart-node
{
	font-size: 1em; 
	border: 1px solid lightgray;
    cursor: default; border: 2px solid #b5d9ea;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: rgba( 0, 0, 0, 0.5 ) 3px 3px 3px;
    -moz-box-shadow: rgba( 0, 0, 0, 0.5 ) 3px 3px 3px;
    box-shadow: 3px 3px 3px rgba( 0, 0, 0, 0.5 );
    background-color: #edf7ff;
    background: -webkit-gradient(linear, left top, left bottom, from(#edf7ff), to(#cde7ee));
}

.org-chart-node.true
{
	background-color: #fff3ed;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff3ed), to(#eed4cd));
}

.org-chart-node.google-visualization-orgchart-nodesel
{
	border: 2px solid #e3ca4b;
    background-color: #fff7ae;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff7ae), to(#eee79e));
}

.org-chart-node-content
{
	padding: 0px;
	overflow: hidden; wrap: no-wrap; word-wrap: no-wrap;
    white-space: nowrap; text-overflow: ellipsis;
    text-align: center; vertical-align: middle; 
}

.org-chart-node-content.institution
{
	width: 150px;
}

.org-chart-node-content.institution.true
{
	width: 150px;
}

.org-chart-node-content.person
{
	min-width: 80px;
}

.DataEditingBox
{
	position: absolute; 
	left: 20px; right: 20px; 
	max-width: 600px; 
	margin: auto;
}

.NeoLayerButton
{
	position: absolute; 
	right: 4px; top: 10px; 
	width: 40px; text-align: center; 
	border: 1px solid lightgray; 
	border-radius: 5px !important; 
	padding: 10px;
	overflow: hidden;
/* 	-webkit-box-shadow: #50542a 4px 4px 4px; */
/*     -moz-box-shadow: #50542a 4px 4px 4px; */
/*     box-shadow: 4px 4px 4px #50542a; */
    background-color: white;
    z-index: 1;
}

.NeoLayerButton .batch
{
    position: absolute;
    left: -9px;
    top: -5px;
    border-radius: 10px !important;
    background-color: red;
    border: 1px solid #ffd6d6;
    min-width: 18px;
    font-size: 9px;
    padding: 2px 5px 2px 5px;
    color: white;
    display: none;
}

.NeoLayerButton.max
{
	padding: 0px;
}

.NeoLayerButtonLink
{
	padding: 10px;
	display: inline-block;
}

.NeoLayerButton.green, .NeoLayerButton.max.green
{
	background-color: #35aa47;
	color: white;
	border: 1px solid #20772d; 
/* 	-webkit-box-shadow: #10561a 4px 4px 4px; */
/*     -moz-box-shadow: #10561a 4px 4px 4px; */
/*     box-shadow: 4px 4px 4px #10561a; */
}

.NeoLayerButton.blue, .NeoLayerButton.max.blue
{
	background-color: #18abff;
	color: white;
	border: 1px solid #0e8fd8; 
/* 	-webkit-box-shadow: #064d75 4px 4px 4px; */
/*     -moz-box-shadow: #064d75 4px 4px 4px; */
/*     box-shadow: 4px 4px 4px #064d75; */
}

.NeoLayerButton.gray, .NeoLayerButton.max.gray
{
	background-color: lightgray;
	color: black;
	border: 1px solid gray; 
/* 	-webkit-box-shadow: gray 4px 4px 4px; */
/*     -moz-box-shadow: gray 4px 4px 4px; */
/*     box-shadow: 4px 4px 4px gray; */
}

.NeoContentDialog
{
	position: absolute; display: none;
	top: 0px; right: 0px; left: 0px; bottom: 0px; 
	max-width: 450px; height: 850px; max-height: 80%; 
	margin: auto;
	background-color: white;
	border: 1px solid lightgray; 
	border-radius: 5px !important; 
	padding: 20px;
	overflow: hidden;
	-webkit-box-shadow: #50542a 6px 6px 6px;
    -moz-box-shadow: #50542a 6px 6px 6px;
    box-shadow: 6px 6px 6px #50542a;
    z-index: 6;
}

.QmDynamicDialogField
{
	display: none;
}

.NeoTreeInlineDialog
{
	position: absolute;
    left: 647px;
    top: 104px;
    width: 250px;
    z-index: 9;
    border: 1px solid lightgray;
    background-color: white;
    -webkit-border-radius: 5px;
    -webkit-box-shadow: #50542a 3px 3px 3px;
    -moz-box-shadow: #50542a 3px 3px 3px;
    box-shadow: 3px 3px 3px #50542a;
    border-radius: 10px !important;
    padding: 10px;
    display: none;
}

.NeoTreeManagementStatus
{
	padding-left: 5px;
	padding-right: 5px;
	margin-top: 1px;
}

.NeoTableTreeButtons
{
	position: absolute;
    top: 35px;
    left: 0;
    width: 10px;
    border: 1px solid gray;
    border-bottom-right-radius: 5px !important;
    border-top-right-radius: 5px !important;
    padding: 6px 3px;
    overflow: hidden;
    background-color: white;
    opacity: 0.3;
    z-index: 1;
    text-align: center;
}

.NeoTableTreeButtons:hover
{
	width: 31px;
    -webkit-box-shadow: #50542a 4px 4px 4px;
    -moz-box-shadow: #50542a 4px 4px 4px;
    box-shadow: 4px 4px 4px #50542a;
    background-color: white;
    border: 1px solid lightgray;
    opacity: 1;
}

.NeoTableTreeButtons I.fa
{
	color: gray; 
	cursor: pointer;
	margin: 0px 5px;
}

.NeoTableTreeButtons I.fa:hover
{
	color: #18abff; 
}

.NeoTreeManagementStatus.Red { background-color: #ff4b4b; border: 1px solid #e23131; }
.NeoTreeManagementStatus.Yellow { background-color: #eef100; bordeR: 1px solid #c3c503;}
.NeoTreeManagementStatus.Green { background-color: #2CB42C; border: 1px solid #168e16; }
.NeoTreeManagementStatus.Gray { background-color: #d3d5d8; border: 1px solid #B9BABD; }

.NeoProjectFormColumns, .NeoProjectFormDetails, .NeoProjectFormNote
{
	width: 90%; 
	width: -moz-calc( 100% - 50px );
	width: -webkit-calc( 100% - 50px );
	width: calc( 100% - 50px );
}

.NeoProjectFormHeader
{
	background-color: #f4f4f4; 
	margin-bottom: 1px; 
	border-left: 5px solid #a3a3a3;
	padding-top: 7px;
    padding-bottom: 7px;
}

.NeoProjectFormFunctionHeader
{
	background-color: #dcffd8; 
	margin-bottom: 1px; 
	border-left: 5px solid #285623;
}

.NeoProjectFormRow
{
	margin-left: 0;
	margin-right: 0;
}

.NeoProjectFormRow DIV
{
	padding-left: 0;
	padding-right: 0;
}

.NeoProjectFormButton
{
	width: 100%;
	height: 20px;
	font-size: 12px;
	padding: 0;
    text-align: left;
	color: #e3e3e3 !important;
	border: none !important;
    background-color: white !important;
}

.NeoProjectFormButton:hover
{
	color: white !important;
	background-color: #4b8df8 !important;
	border: none !important;
	padding: 0 5px;
}

A.NeoProjectFormField
{
	font-size: 12px !important;
	min-height: 20px !important;
	padding: 2px 0px !important;
	margin: 0 !important;
	border: none !important;
	cursor: pointer;
	color: #333;
	text-decoration: none;
	display: block;
}

DIV.NeoProjectFormRowColors
{
	width: 70%; 
	margin: auto; 
	height: 16px; 
	border-radius: 5px !important; 
	border: 1px solid #ececec; 
}

DIV.NeoDropDownList
{
	position: absolute; 
	left: 0px; width: 100%; 
	max-height: 150px; 
	border: 1px solid gray;
	background: #eef4fd;
	z-index: 1;
	overflow: auto;
}

DIV.NeoDropDownList DIV
{
	cursor: pointer;
	padding: 2px;
}

DIV.NeoDropDownList DIV:hover
{
	background: #87d4ff;
}

A.NeoProjectFormField.center
{
	text-align: center;
}

A.NeoProjectFormField.left
{
	text-align: center;
}

A.NeoProjectFormField.red
{
	color: red;
}

A.NeoProjectFormField.blue
{
	color: blue;
}

A.NeoProjectFormField IMG.classification
{
	padding: 0px 5px !important;
}	

A.NeoProjectFormField:hover
{
	background-color: lightgray;
}

HR.default { margin: 8px 0; }

SELECT.form-control { max-height: 34px; }

.form-control.freebie { border: 0 !important; border-bottom: var( --border ) !important; background-color: transparent !important; }
.form-control.no-border-right { border-right: none; }
.form-control.no-border-left { border-left: none; }
.form-control.splitted-150, .splitted-150 { width: 150px; }
.form-control.splitted-150-rest, .splitted-150-rest 
{ 
	width: 95%; 
	width: -moz-calc( 100% - 150px );
	width: -webkit-calc( 100% - 150px );
  	width: calc( 100% - 150px );
}
.form-control.splitted-200, .splitted-200 { width: 200px; }
.form-control.splitted-200-rest, .splitted-200-rest 
{ 
	width: 95%; 
	width: -moz-calc( 100% - 200px );
	width: -webkit-calc( 100% - 200px );
  	width: calc( 100% - 200px );
}
.form-control.splitted-100, .splitted-100 { width: 100px; }
.form-control.splitted-100-rest, .splitted-100-rest 
{ 
	width: 95%; 
	width: -moz-calc( 100% - 100px );
	width: -webkit-calc( 100% - 100px );
  	width: calc( 100% - 100px );
}
.form-control.splitted-75, .splitted-75 { width: 75px; }
.form-control.splitted-75-rest, .splitted-75-rest
{ 
	width: 95%; 
	width: -moz-calc( 100% - 75px );
	width: -webkit-calc( 100% - 75px );
  	width: calc( 100% - 75px );
}
.form-control.splitted-50, .splitted-50 { width: 50px; }
.form-control.splitted-50-rest, .splitted-50-rest
{ 
	width: 95%; 
	width: -moz-calc( 100% - 50px );
	width: -webkit-calc( 100% - 50px );
  	width: calc( 100% - 50px );
}
.form-control.splitted-35, .splitted-35 { width: 35px; }
.form-control.splitted-35-rest, .splitted-35-rest
{ 
	width: 95%; 
	width: -moz-calc( 100% - 35px );
	width: -webkit-calc( 100% - 35px );
  	width: calc( 100% - 35px );
}

/* special quattro split */
.form-control.quattro-splitted-75 { width: 75px; }
.form-control.quattro-splitted-75-rest 
{ 
	width: 95%; 
	width: -moz-calc( 50% - 75px );
	width: -webkit-calc( 50% - 75px );
  	width: calc( 50% - 75px );
}

/* special tripple split */
.form-control.tripple-splitted-30p { width: 30%; }
.form-control.tripple-splitted-30p-rest { width: 40%; }
.form-control.splitted-60p, .splitted-60p { width: 60%; }
.form-control.splitted-60p-rest, .splitted-60p-rest { width: 40%; }
.form-control.splitted-75p, .splitted-75p { width: 75%; }
.form-control.splitted-75p-rest, .splitted-75p-rest { width: 25%; }

INPUT.ajax { font-style: italic; color: lightgray; }
TEXTAREA.ajax { font-style: italic; color: lightgray; }
SELECT.ajax { font-style: italic; color: lightgray; }

INPUT.form-control.small
{
	font-size: 12px !important;
	height: 20px !important;
	padding: 0 5px !important;
	margin: 0 !important;
	border: none !important;
}

INPUT.form-control.small.centered
{
	text-align: center;
}

INPUT.form-control.small.right
{
	text-align: right;
}

INPUT.form-control.small.colored
{
	background-color: lightgray !important;
}

INPUT.form-control.small.transparent
{
	background: none !important;
}

INPUT.form-control.small.method
{
	background-color: #ececec !important;
}

TEXTAREA { resize: vertical; }
TEXTAREA.form-control.small
{
	font-size: 12px !important;
	min-height: 20px !important;
	padding: 0 5px !important;
	margin: 0 !important;
	border: none !important;
	resize: none;
    overflow: hidden;
}

DIV.form-control.wysiwyg 
{ 
	overflow: hidden; 
	width: 100%; min-height: 200px; 
	border: var( --border ) !important; 
	padding: 20px;
}

/* some overwriting from metronic */
@media ( max-width: 480px ) 
{ 
	.login .content { width: 90%; } 
	.DataEditingBox { top: 43px;  }
}
@media ( min-width: 992px ) 
{ 
	.page-sidebar { width: 215px; } 
	.DataEditingBox { top: 13px;  }
}
@media ( max-width: 991px ) 
{ 
	.page-sidebar 
	{ 
		width: 94%; 
		width: -moz-calc( 100% - 40px );
   		width: -webkit-calc( 100% - 40px );
   		width: calc( 100% - 40px );
	} 
	
	.DataEditingBox { top: 13px;  }
}
@media ( max-width: 767px ) 
{ 
	.page-sidebar 
	{ 
		width: 98%; 
		width: -moz-calc( 100% - 20px );
   		width: -webkit-calc( 100% - 20px );
   		width: calc( 100% - 20px );
	} 
	.DataEditingBox { top: 13px;  }
}

/* Media query for the Project Risk Form */
@media (max-width: 1200px) 
{
	.fullWidthHeader
	{
		display:none;
	}
	.smHeader
	{
		display:block;
	}
	
	.DataEditingBox { top: 13px;  }
}
@media (min-width: 1200px) 
{
	.smHeader
	{
		display:none;
	}
	
	.DataEditingBox { top: 13px;  }
}

@media (min-width:1768px)
{
	.table-header
	{
		font-size:13px;
	}
}
@media (max-width:1768px)
{
	.table-header
	{
		font-size:10px;
	}
}
.hiddenTableAddBtn
{
	display:none;
}
.showTableAddBtn:hover .hiddenTableAddBtn
{
	display:block;
}

DIV.placeHolder  font
{
	color: lightgray;
}

DIV.placeHolder:hover  font
{
	color:#333;
}

.showTableScroll::-webkit-scrollbar {
    background: #e2e2e2;
    width: 12px;
}
.showTableScroll::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 16px rgb(224, 224, 224);
    border-radius: 1px;
}
.showTableScroll::-webkit-scrollbar-thumb {
    border-radius: 1px;
    -webkit-box-shadow: inset 0 17px rgb(156, 154, 154);
}

@media print {
	body {
		-webkit-print-color-adjust: exact !important;
	}
	.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6,
		.col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
		float: left;
	}
	.col-md-12 {
		width: 100%;
	}
	.col-md-11 {
		width: 91.66666667%;
	}
	.col-md-10 {
		width: 83.33333333%;
	}
	.col-md-9 {
		width: 75%;
	}
	.col-md-8 {
		width: 66.66666667%;
	}
	.col-md-7 {
		width: 58.33333333%;
	}
	.col-md-6 {
		width: 50%;
	}
	.col-md-5 {
		width: 41.66666667%;
	}
	.col-md-4 {
		width: 33.33333333%;
	}
	.col-md-3 {
		width: 25%;
	}
	.col-md-2 {
		width: 16.66666667%;
	}
	.col-md-1 {
		width: 8.33333333%;
	}
}

.neo_status_report_header
{
	background-color: #B14021 !important; 
	color: white; 
	padding: 1px;
}
.neo_status_report_content
{
	color: black; 
	padding: 6px; 
	background-color: #efefef !important;
}

.neo_import_modal_body
{
	bottom: 60px;
    top: 60px;
    overflow-y: auto !important;
    position: absolute;
    width: 100%;
}

.neo_import_modal_header
{
	height: 60px;
}

.neo_import_modal_footer
{
	bottom: 0px;
    height: 60px;
    position: absolute;
    width: 100%;
}

.neo_toggle_password
{
	color: #565656;
	margin-right: 10px;
    float: right;
    margin-left: -25px;
    margin-top: -25px;
    position: relative;
    cursor: pointer;
}

option.RiskDialogFailures[value^=red_]
{
	color: red;
}

option.RiskDialogFailures[value^=blue_]
{
	color: blue;
}

option.ConntrollingDialogFailures[data-color=red]
{
	color: red;
}

option.ConntrollingDialogFailures[data-color=blue]
{
	color: blue;
}

input::-ms-clear, input::-ms-reveal {
    display: none;
}

.NeoFormHideScrollbar
{
	overflow: auto;
	-ms-overflow-style: none; 
	scrollbar-width: none;
}

.task_priority.top
{
	border-top: 1px solid black;
	display: flex;
}

.task_priority_header
{
	background-color: #e0dddd;
	border-right: 1px solid black;
	border-bottom: 1px solid black;
	border-left: 1px solid black; 
    text-align: left;
    width: 145px;  
    padding: 7px;
    overflow: hidden; 
    wrap: no-wrap; 
    word-wrap: no-wrap; 
    white-space: nowrap; 
    text-overflow: ellipsis;
}

.task_priority_details
{
	border-right: 1px solid black;
	border-bottom: 1px solid black;
    text-align: center;
    width: 10%;    
    padding: 7px;
}

.task_priority_checked
{
	background: #7d7d7d;
	color: white !important; 
}

.NeoSideMenuToggle
{
	display: inline-block;    
	cursor: pointer;
	font-size: 28px; 
	color: gray;
}

@media (max-width: 991px)
{
	.NeoSideMenuToggle{ display: none }
}

@media (min-width: 992px) 
{
	.page-sidebar-closed .page-content-wrapper .page-content  { margin-left: 74px !important; }
	.page-sidebar-closed .page-content-wrapper .page-content.rare  { margin-left: 0px !important; }
}

.MarkSelection{ float: left; width: 100px; text-align: center; margin: 10px 0; padding: 10px 5px; overflow-wrap: break-word; height: 120px; }
.MarkSelection.selected { background-color: #a1d8f7; }
.page-header.navbar { background: #ffffff; }
.page-header.navbar .page-logo .logo-default { margin: 10px 0px; height: 55px; }
.portlet.light { padding: 0px; }
.page-header.navbar .top-menu .navbar-nav > li.dropdown.open .dropdown-toggle { background-color: #eee; }
.control-label { overflow: hidden; wrap: no-wrap; word-wrap: no-wrap; white-space: nowrap; text-overflow: ellipsis; margin-bottom: -2px; margin-top: 5px;}
.control-label.hidden { display: none; }
.form-group.thin { margin-bottom: 2px; }
Font.resp { font-size: 1em; }
.neo-dialog-600{ width: 600px !important; margin-left: -300px !important; }
.jstree-default .jstree-ellipsis .jstree-anchor { width: 90%; width: -webkit-calc( 100% - 24px ); width: -moz-calc( 100% - 24px ); width: calc( 100% - 24px ); }
.jstree-default .jstree-clicked { background-color: #b1e1fd; }
.jstree-default > .jstree-striped { display: block; }
.vakata-context li > a { line-height: 1.6em; }
.vakata-context, .vakata-context ul { box-shadow: 5px 5px rgba(22, 22, 22, 0.3); padding: 10px; border: 1px solid #a29e9e; }
table.google-visualization-orgchart-table { border-collapse: separate; }
.modal-backdrop, .modal-backdrop.fade.in { opacity: 0.2; }
.jstree-grid-separator-regular { border-color: transparent !important; border-style: none !important; }
.jstree-grid-separator { border-width: 0 !important;}
.jstree-grid-header-regular { background-color: transparent !important; }
.jstree-grid-header-cell { padding: 5px; font-weight: bold; }
.jstree-grid-cell { padding-left: 5px !important; }
.jstree-grid-wrapper { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAkCAMAAAB/qqA+AAAABlBMVEUAAAAAAAClZ7nPAAAAAnRSTlMNAMM9s3UAAAAXSURBVHjajcEBAQAAAIKg/H/aCQZ70AUBjAATb6YPDgAAAABJRU5ErkJggg==) left top repeat; background-size: 100% 48px; background-position: 0 -3px; }
#treea_chart g text { font-family: "Open Sans", sans-serif !important; font-size: 13px !important; }
.control-label.medium { font-size: 12px !important; }
.portlet-sortable-placeholder { padding: 10px; margin-bottom: 10px; border: 1px dashed #86c3d2; background-color: #dff9ff; }
.portlet-sortable.navigation { background-color: #ffffff; color: #a94442; border: 1px solid lightgray; }
.portlet-sortable.navigation.danger { color: #ff8000; border-color: #800040; background-color: #ff0000; }
.page-sidebar .page-sidebar-menu > li > a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li > a  { padding: 2px 15px; }
.page-sidebar-closed .page-sidebar .page-sidebar-menu.page-sidebar-menu-closed > li > a  { min-height: 26px; }

.page-sidebar .page-sidebar-menu > li.heading > a.menu 
{ 
	border-left: none !important; 
	background-color: transparent;
	padding-left: 0px !important;
	margin-top: -2px !important;
	margin-left: 0px !important;
}

/* deletables */
A.deletable { cursor: pointer; }
A.deletable.exists, A.deletable.deleted:hover { color: #2c2c2c; text-decoration: none; }
A.deletable.exists:hover, A.deletable.deleted { color: red; text-decoration: line-through;  }

/* adjusting bootstrap spacings between blocks */
.row.narrow { margin-right: -5px; margin-left: -5px; }
.row.narrow DIV[class^='col-'] { padding-right: 5px; padding-left: 5px; }
.row.narrower { margin-right: -2px; margin-left: -2px; }
.row.narrower.invitations { margin-bottom: 5px; }
.row.narrower DIV[class^='col-'] { padding-right: 2px; padding-left: 2px; }
.row.equal { display: flex; flex-wrap: wrap; }
.row.equal .form-group { height: calc( 100% - 40px); }
.row.equal .form-group .input-group { height: 100%; }

/* remove mandatory when block disabled */
.disabled .form-group.mandatory .control-label:after { opacity: 0; }

.NeoTreeButtons
{
	position: absolute;
    top: -24px;
    right: 13px;
    border: 1px solid gray;
    border-top-right-radius: 5px !important;
    border-top-left-radius: 5px !important;
    padding: 0px 3px;
    overflow: hidden;
    background-color: white;
    opacity: 0.3;
    z-index: 9994;
    text-align: center;
    height: 23px;
    border-bottom: 0;
    -webkit-box-shadow: #50542a 3px -2px 5px;
    -moz-box-shadow: #50542a 3px -2px 5px;
    box-shadow: 3px -2px 5px #50542a;
}

.NeoTreeButtons:hover { opacity: 1; }
.NeoTreeButtons I.fa
{
	color: gray; 
	cursor: pointer;
	margin: 5px 5px;
}

.NeoTreeButtons I.fa:hover
{
	color: #18abff; 
}

.jstree-node { position: relative; }
.jstree-node .jstree-permissions { position: absolute; right: 2px; top: -2px; }
.jstree-node .jstree-permissions IMG { margin: 0 2px; }
.jstree-node .jstree-roles { position: absolute; right: 2px; top:0; }

.actions.btn-set .btn { margin-right: 4px; }
.actions.btn-set .fr { float: right; }
.actions.btn-set SELECT.form-control { max-width: 300px; display: unset; padding: 2px 10px 5px 10px; }

/* overwritten theme disabled button colors */
SPAN.btn,
.btn.disabled, 
.btn.disabled:hover, 
.btn.disabled:focus, 
.btn.disabled:active, 
.btn.disabled.active, 
.btn[disabled], 
.btn[disabled]:hover, 
.btn[disabled]:focus, 
.btn[disabled]:active, 
.btn[disabled].active, 
fieldset[disabled] .btn, 
fieldset[disabled] .btn:hover, 
fieldset[disabled] .btn:focus, 
fieldset[disabled] .btn:active, 
fieldset[disabled] .btn.active
{ background-color: #dadada !important; color: #868686 !important; }

.btn.rounded 
{
	border-radius: 3px !important; 
	padding: 2px 8px;
}

.modal .DropDownFilter 
{
	width: 100%; 
	border: 1px solid lightgray; 
	border-bottom: 0; 
	height: 65px; 
	padding: 15px; 
	position: relative;
}

.modal .DropDownFilter IMG.SearchSpinner
{
	position: absolute;
    right: 35px;
    top: 24px;
    width: 16px;
    height: 16px;
    display: none;
    z-index: 2; 
}

.modal .DialogContent
{
	overflow: auto; 
	padding: 10px;
	border: 1px solid lightgray; 
}

.modal .MarkAll 
{
	width: 100%;
    border: 1px solid lightgray;
    border-bottom: 0;
    height: 40px;
    padding: 10px;
    position: relative;
    font-weight: bold;
}

.modal .Deselect 
{
	width: 100%;
    border: 1px solid lightgray;
    border-bottom: 0;
    height: 40px;
    position: relative;
    font-weight: bold;
    padding-left: 16px;
    padding-top: 6px;
}

.modal .MarkAll IMG.SearchSpinner
{
	position: absolute;
    right: 14px;
    top: 12px;
    width: 16px;
    height: 16px;
   	display: none;
    z-index: 2;
}

.modal .SearchFilter 
{
	width: 100%; 
	border: 1px solid lightgray; 
	border-top: 0; 
	min-height: 65px; 
	padding: 15px; 
	position: relative;
}

.modal .SearchFilter IMG.SearchSpinner
{
	position: absolute; 
    right: 24px;
    top: 24px;
    width: 16px;
    height: 16px;
    display: none;
    z-index: 2; 
}

.modal .AmountSpinner
{
    position: absolute;
    right: 12px;
    top: 18px;
    z-index: 99;
    display: none;
}

.modal .odd { border-bottom: 1px solid lightgray; background-color: #f7f7f7; padding: 11px 1px; line-height: 13px; }
.modal .even { border-bottom: 1px solid lightgray; padding: 11px 1px; line-height: 13px; }
.modal .highlight { border-bottom: 1px solid lightgray; background-color: #ffd9b3; padding: 11px 1px; line-height: 13px; }

.modal-body.scrollable > SPAN,
.modal-body.scrollable > DIV { overflow-y: auto; overflow-x: hidden; }
.modal-body.vh60 > SPAN,
.modal-body.vh60 > DIV{ display: block; height: 60vh; }
.modal-body.vh50 > SPAN,
.modal-body.vh50 > DIV{ display: block; height: 50vh; }
.modal-body.vh45 > SPAN,
.modal-body.vh45 > DIV{ display: block; height: 45vh; }

.modal-submenu .portlet { margin-bottom: -27px; }
.modal-submenu .portlet .portlet-title { border: 0; }

SELECT OPTION:disabled { color: lightgray; }
SELECT OPTION[disabled="disabled"] { color: lightgray; }

.riskCell
{
	width: 70px;
	height: 70px;
	text-align: center;
	font-size: 15px;
	border: 2px solid white;
	font-weight: bold;
}

.riskCell.verylow { background: rgb(84, 130, 53); color: white; }
.riskCell.low { background: rgb(112, 173, 71); color: white; }
.riskCell.medium { background: rgb(255, 192, 0); color: gray; }
.riskCell.high { background: rgb(237, 125, 49); color: white; }
.riskCell.veryhigh { background: rgb(227, 0, 27); color: white; }

.riskYAxis
{
	width: 70px;
	height: 70px;
	position: absolute; 
	top: -10px; 
	right: 10px;
	text-align: right;
}

.riskXAxis
{
	width: 70px;
	height: 30px;
	text-align: center;
	border: 2px solid white;
}

.riskYLegend
{
	transform: rotate( 270deg );
	text-transform: uppercase;
	font-weight: bold;	 
}

.riskXLegend
{
	text-align: center;
	text-transform: uppercase;
	font-weight: bold;	
}

.caption.submenu 
{ 
	padding: 16px 20px 1px 0px !important; 
    font-weight: 300 !important;
}
.caption.submenu::first-letter { text-transform: uppercase !important; }

.caption.breadcrumb 
{ 
	padding: 4px 20px 1px 7px !important;
    color: #5C9ACF !important;
    font-weight: 400 !important;
    font-size: 12px !important;
}

.portlet-title.tabbable-line.second 
{ 
	top: 41px !important; 
	height: 26px !important; 
	overflow: hidden;
    min-height: 26px;
}

/* milestone chart */
.mst-container
{
	position: relative;
	height: 300px;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
	margin-bottom: 30px;
}

.mst-timeline
{
	position: absolute;
	bottom: 0px;
    width: 100%;
	z-index: 2;
}

.mst-timeline .mst-block
{
	float: left;
	height: 45px;
	vertical-align: top;
	text-align: center;
	padding: 5px 0; 
	background-image: linear-gradient(#1BB7E1, #61D1F0, #1BB7E1);
	color: #BEEDFA;
	font-size: 12px;
	font-weight: bold;
	border-right: 1px solid #61D1F0;
}
.mst-timeline .mst-block.first { margin-left: -30px; width: 30px; border-top-left-radius: 30px !important; border-bottom-left-radius: 30px !important; }
.mst-timeline .mst-block.last { margin-right: -30px; width: 30px; border-top-right-radius: 30px !important; border-bottom-right-radius: 30px !important; }

.mst-diamond
{
	position: absolute;
	bottom: 35px;
	transform-origin: bottom left;
	transform: rotate(-45deg);
	background-color: red;
	width: 15px; height: 15px;
	z-index: 3;
}

.mst-line
{
	position: absolute;
	bottom: 45px; width: 1px; 
	display: inline-block;
	border-left: 1px dotted red;
	z-index: 1;
}

.mst-text
{
	position: absolute;
	bottom: 45px; width: 150px;
	font-size: 12px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-align: center;
	margin-left: -75px;
	z-index: 2;
}

.mst-date
{
	position: absolute;
	bottom: 45px; width: 70px;
	font-size: 11px;
	text-align: center;
	margin-left: -35px;
	margin-top: 15px;
	z-index: 3;
}

.mst-content
{
	background-color: white;
}

.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] { margin-left: -9px; }
DIV.radio, DIV.checker { margin-bottom: 4px; margin-right: 4px; }
TABLE.radio TD { padding-left: 20px; }
.radio label { padding-left: 0; }
.page-sidebar .page-sidebar-menu > li.active > a > .selected, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu > li.active > a > .selected
{
	right: -3px;
    top: 0px;
}
.page-sidebar .page-sidebar-menu .group-collapse .menu-items > li.active > a { display: block; }

SPAN.note.block { display: block; }
SPAN.form-group.block { display: block; }
.form-group .bordered { border: 1px dotted lightgray; } 

.modal-header .btn { margin-right: 3px; }
.portlet > .portlet-title > .nav-tabs > li.active > a, .portlet > .portlet-title > .nav-tabs > li:hover > a { background: none; }
.heading.NeoMenuHeading H3 { border-bottom: 1px solid #e8e8e8; padding-bottom: 4px !important; }

.btn.task { width: 100%; }

/* progress bar */
.neo-progress { border: 1px solid lightgray; margin-bottom: 20px; padding: 3px; }
.neo-progress .percent { display: block; text-align: center; background-color: #2e90e4; color: #c8d5e0; height: 28px; padding: 5px 0px; }

.group-header-collapse { cursor: pointer; margin-block-end: 0 !important; }
.group-header-collapse:before 
{
	font-family: "Glyphicons Halflings";
	float: left;
	font-size: 20px;
	content: "\e080";
	margin-top: 0px;
	margin-right: 5px;
	transition: all 0.5s;
}

.group-header-collapse.active:before 
{
	-webkit-transform: rotate( 90deg );
	-moz-transform: rotate(90deg);
	transform: rotate(90deg);
}

.group-header-collapse SPAN.hint { font-size: 12px; opacity: 0.6; margin-top: 10px; }
.group-header-collapse.active SPAN.hint { display: none; }
.group-collapse .row
{
	margin: 12px -15px 0px 0px;
    border-left: 20px solid;
    border-color: #f5f5f5;
}

.group-collapse > DIV.form-group 
{
	margin: 12px -0px 0px 0px;
	padding-left: 15px;
    border-left: 20px solid #f5f5f5;
}

.NeoMenuHeading .collapser:before 
{
    font-family: "Glyphicons Halflings";
    float: right;
    font-size: 9px;
    content: "\e080";
    margin-top: 2px;
    margin-right: 2px;
}

.NeoMenuHeading.closed { margin-bottom: -21px !important; }
.NeoMenuHeading .collapser.loading:before { content: "\e165"; }
.NeoMenuHeading .collapser.opened:before { -webkit-transform: rotate( 90deg ); -moz-transform: rotate( 90deg ); transform: rotate( 90deg ); }
.NeoMenuHeading .collapser.closed:before { -webkit-transform: rotate( 0deg ); -moz-transform: rotate( 0deg ); transform: rotate( 0deg ); }
.NeoMenuHeading .collapser A { text-decoration: none; }
.NeoMenuHeadingEntry { transition: all 0.5s; }
.NeoMenuHeadingEntry.opened { display: block !important; }
.NeoMenuHeadingEntry.closed { display: none !important; }

.skill-filter-area
{
	display: block;
	width: 100%;
	min-height:105px;
	max-height: 150px;
	padding: 0.375rem 0.75rem;
	font-size: 1rem;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid lightgray;
	border-radius: 0.25rem;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	margin-bottom: 15px;
	overflow: scroll;
}

.skill-filter-component
{
	float: left;
	width: 150px;
	min-height: 65px;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: 0.25rem;
	margin: 12px;
	box-shadow: 6px 7px 7px;
}

.skill-filter-component-close
{
	float: right;
	height: 20px;
	width: 20px;
	background-color: red;
	border-radius: 50% !important;
	margin-right: -9px;
	margin-top: -9px;
	text-align: center;
	text-decoration: none !important;
	font-weight: bold;
	font-size: 13px;
	color: white !important;
}

.skill-filter-component-detail
{
	height: 50%;
	width: 100%;
	text-align: center;
}

.skill-filter-component-ratings
{
	font-size:17px; 
	margin-top: 10px; 
	margin-left: 11px;
}

.stars { color: lightgray !important;  }
.stars:hover { color: yellow !important;  }
.stars-checked { color: yellow !important; }

.institution-persons
{
	padding: 10px 20px; 
	background-color: #F8F8F8;
}

.import-profile
{
	width: 100%;
	min-height: 115px;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: 0.25rem;
	margin-top: 5px;
}

.import-profile .profile-name
{
	display: inline;
	margin: 10px;
}

.import-profile .profile-details
{
	margin-left: 40px;
}

/* Session CSS Class */
.session-header { background-color: #f9f9f9; }
.session-row { background-color: #f9f9f9; }

/* Tender Quotation Overview CSS Class */
TABLE.quotation-overview 
{ 
	width: 100%; 
	table-layout: fixed; 
	border-collapse: separate;
}

H3.quotation-overview { margin-bottom: 0 !important; }  
H3.form-section .sub { font-size: -moz-calc( 100% - 10px ); font-size: -webkit-calc( 100% - 10px ); font-size: calc( 100% - 10px ); }

TABLE.quotation-overview TH  { border-bottom: 1px dashed lightgray; padding-top: 20px; padding-bottom: 4px;}
TABLE.quotation-overview TH.menu  { padding-top: 4px; }
TABLE.quotation-overview TD { padding: 4px; }
TABLE.quotation-overview TD.bordered { border-left: 1px dotted lightgray; }
TABLE.quotation-overview TH.bordered { border-left: 1px dotted lightgray; }
TABLE.quotation-overview TR.bordered { border-left: 1px dotted lightgray; }
TABLE.quotation-overview TD.summary { border-top: 1px solid lightgray; }
TABLE.quotation-overview TD.gross { background-color: #e9eaf2; }
TABLE.quotation-overview TD.odd { background-color: #f5f5f5; }
TABLE.quotation-overview TD.even { background-color: #f7f6ed; }
TABLE.quotation-overview TD.highlight { background-color: #ffd9b3; }
TABLE.quotation-overview TD.net { font-size: 18px !important; font-weight: bold; }
TABLE.quotation-overview TD.gross { font-size: 22px !important; font-weight: bold; background-color: #bcbfd8; }
TABLE.quotation-overview TD.totals { font-weight: bold; }
TABLE.quotation-overview TD.right { padding-right: 10px; text-align: right; }
.quotation-overview-header
{ 
	width: 100%;
    padding-right: 6px;
    padding-left: 6px;
    display: block;
}
.quotation-overview-scrollable { overflow-x: auto; scrollbar-width: auto; }
.quotation-overview-scrollable::-webkit-scrollbar { width: 0px; background: #f1f1f1; }
.quotation-overview-scrollable::-webkit-scrollbar-track { background: #e8e8e8; }
.quotation-overview-scrollable::-webkit-scrollbar-thumb { background: #d4d4d4; }
.quotation-overview-scrollable::-webkit-scrollbar-thumb:hover { background: #c5c5c5; }

/* help css */
.portlet > .portlet-title > .nav-tabs > LI.help > SPAN { color: #d8cabe; font-weight: 600; font-size: 1.1em; padding: 8px 10px; padding-bottom: 3px; margin: 5px 0 0 1px; display: block;}
.portlet > .portlet-title > .nav-tabs > LI.help > A { color: #ff8000; font-weight: 600; font-size: 1.1em; padding-bottom: 3px; }
.portlet > .portlet-title > .nav-tabs > LI.help > A > I { color: #ff8000; }
.portlet > .portlet-title > .nav-tabs > LI.help:hover { border-bottom-color: #ff8000; }
.modal .modal-header .help { float: right; }
.modal .modal-header .help A, .modal .modal-header .help I { color: #ff8000; cursor: pointer; }
.modal .modal-header .help SPAN { color: #b79e88; cursor: default; }


/* TASK SUBTASK */
ul.subtask-section
{
	list-style-type: none;
	padding: 0;
	margin: 0;
}
ul.subtask-section li 
{
	padding: 5px 0 5px 0;
	border-bottom: 1px solid lightgray;
}

.releases A.versions
{
	width: 80px; 
	float: left; 
	text-align: center; 
	padding: 15px 0px 15px 0px;
	font-size: 11px;
	cursor: pointer;
	text-decoration: none;
	position: relative;
}

.releases A.versions IMG { width: 50px; margin-bottom: 5px; }
.releases A.versions IMG.star
{
	position: absolute;
    width: 24px; top: 2px; right: 3px;
    margin-bottom: 0px; 
}

.datepicker table tr td.disabled, .datepicker table tr td.disabled:hover { opacity: 0.2; }
.modal.in .modal-dialog { margin: 0; width: 100%; }
.modal.in .modal-dialog .checkbox input[type=checkbox], 
.modal.in .modal-dialog .checkbox-inline input[type=checkbox], 
.modal.in .modal-dialog .radio input[type=radio], .radio-inline input[type=radio] { left: 10px; }
.modal.in .modal-dialog .checkbox > label, 
.modal.in .modal-dialog .form-horizontal .checkbox > label { margin-left: 25px; }

.placeholders { overflow: auto; margin-top: 10px; background-attachment: local !important; }
.placeholders .neofield { padding: 3px; cursor: pointer; }

.form-control.form_date:after { content: "aa" }
.form-control.radio_line_direction TD { padding-top: 2px; padding-right: 15px; }
.form-control.checkbox_line_direction TD { padding-top: 2px; padding-right: 15px; }

/***************************************************/
/***************************************************/
/***************** ADDITIONALS *********************/
/***************************************************/
/***************************************************/
.additionals-container { height: 200px; padding-right: 5px; }
.additionals-container .ui-resizable-e { width: 15px; }
.additionals-container .placeholder { height: 1px; width: 1px; float: left; opacity: 0.4; margin: 5px; }
.additionals-wrapper { float: left; overflow: hidden; height: 37px; position: relative; }
.additionals-block
{ 
	position: absolute; 
	text-align: center;
	font-size: 12px; 
	top: 0; left: 0; 
	width: 100%; height: 100%; 
	padding: 5px 10px; 
	overflow: hidden; 
	cursor: pointer; 
	position: relative; 
	border-left: 5px solid transparent;  
	border-top: 5px solid transparent;  
}

/***************************************************/
/***************************************************/
/***************** OVERRIDE LAYOUT *****************/
/***************************************************/
/***************************************************/
/* Good For iPad */
@media (max-width: 991px) 
{
  .page-header.navbar { position: fixed; }
  .page-content-wrapper .page-content { top: 75px; }
  .page-content-wrapper { transform: translate(0, 0); }
  .page-sidebar { top: 47px; } 
  .page-logo { width: 70px !important; }
  .top-menu { z-index: -1; }
}

/* Good for devices like iPhone 6/7/8 */
@media (max-width: 767px) 
{
	.page-header.navbar .top-menu { position: absolute; }
	.page-header.navbar .page-logo { padding: 0 10px 0 10px; }
	.page-header.navbar .top-menu .navbar-nav > li.dropdown-user { padding: 0px; }
	.page-header.navbar .top-menu .navbar-nav > li.dropdown-user .dropdown-toggle { padding: 25px 2px 2px 2px; }
	.page-content-wrapper .page-content { overflow: initial; /* This is needed to make child div's sticky property work */ }
	.page-header.navbar .top-menu .navbar-nav .dropdown > ul.dropdown-menu 
	{ 
		/* align dropdown menu in center */
		position:fixed;
		top: 75px;
		left: 0;
	 	margin: auto;
	}
	.page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-menu:before { display: none !important; }
	.page-header.navbar .top-menu .navbar-nav > li.dropdown .dropdown-menu:after { display: none !important; }
	.page-sidebar { top: 60px; }
	.page-logo { width: 70px !important; }
	.top-menu { z-index: -1; }
}

/***************************************************/
/***************************************************/
/***************** CONTEXT MENU ********************/
/***************************************************/
/***************************************************/
.contextmenu .dropdown-menu li > a, 
.contextAddMenu .dropdown-menu li > a, 
.contextSavemenu .dropdown-menu li > a, 
.contextDeleteMenu .dropdown-menu li > a
{ 
	margin: 0 !important; 
	padding: 5px 30px 5px 10px; 
}
.contextmenu .dropdown-menu, 
.contextAddMenu .dropdown-menu, 
.contextSavemenu .dropdown-menu, 
.contextDeleteMenu .dropdown-menu 
{
	font-family: "Open Sans", sans-serif; 
	box-shadow: 5px 5px rgb(48 42 62 / 50%); 
	font-size: 13px; font-weight: 300;
}
.contextmenu A::hover, 
.contextAddMenu A::hover, 
.contextSavemenu A::hover, 
.contextDeleteMenu A::hover
{   
	outline: none !important;
    background-image: none !important;
    filter: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    text-shadow: none;
} 

.dropdown-submenu { position: relative; }
.dropdown-submenu > .dropdown-menu 
{
	top: 0; left: 100%;
	margin-top: -6px; margin-left: -1px;
	-webkit-border-radius: 0 6px 6px 6px;
	-moz-border-radius: 0 6px 6px;
	border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover > .dropdown-menu { display: block; }
.dropdown-submenu > a:after { content: "\f138"; margin-top: -2px; }

.project-plan-arrangement 
{ 
	height: 50vh; 
	width: 100%; 
	background-color: white; 
	padding: 5px; 
	border: 1px solid lightgray;
	overflow-y: auto; 
	overflow-x: hidden;
}

.plan-arrangement-placeholder
{
	display: block;
	height: 30px;
}

.project-plan-arrangement .working-package-block
{
	display: block;
	height: 30px; 
	width: 100%; 
	background-color: grey; 
	padding: 5px; 
}

.project-plan-arrangement .working-package-block .working-package { font-weight: 800; }

/******** PROJECT CALCULATIONS ***************/
.project-calculations-scrollable, .tender-calculations-scrollable { overflow-x: auto; scrollbar-width: auto; }
.project-calculations-scrollable::-webkit-scrollbar, .tender-calculations-scrollable::-webkit-scrollbar { width: 0px; background: #f1f1f1; }
.project-calculations-scrollable::-webkit-scrollbar-track, .tender-calculations-scrollable::-webkit-scrollbar-track { background: #e8e8e8; }
.project-calculations-scrollable::-webkit-scrollbar-thumb, .tender-calculations-scrollable::-webkit-scrollbar-thumb { background: #d4d4d4; }
.project-calculations-scrollable::-webkit-scrollbar-thumb:hover, .tender-calculations-scrollable::-webkit-scrollbar-thumb:hover { background: #c5c5c5; }
.project-calculations-header, .tender-calculations-header
{ 
    padding-right: 6px;
    padding-left: 6px;
    display: block;
}
.project-calculations-header.right, .tender-calculations-header.right{ padding-right: 6px; text-align: right; }
TABLE.project-calculations, TABLE.tender-calculations
{  
	width: 100%; 
	table-layout: fixed;
	border-collapse: collapse;
	margin-top: -1px;
}

TABLE.project-calculations TD, TABLE.tender-calculations TD { text-overflow: ellipsis; }
TABLE.project-calculations TH, TABLE.tender-calculations TH { padding-top: 20px; padding-bottom: 4px; overflow: hidden; text-overflow: ellipsis; }
TABLE.project-calculations TH.bordered, TABLE.tender-calculations TH.bordered { border-left: 1px dotted lightgray; }
TABLE.project-calculations TR.bordered, TABLE.tender-calculations TR.bordered { border-left: 1px dotted lightgray; }
TABLE.project-calculations TR.bordered-bottom, TABLE.tender-calculations TR.bordered-bottom { border-bottom: 1px dotted lightgray; }
TABLE.project-calculations TD, TABLE.tender-calculations TD { padding: 4px; }
TABLE.project-calculations TD.bordered, TABLE.tender-calculations TD.bordered { border-left: 1px dotted lightgray; }
TABLE.project-calculations TD.bordered-top,  TABLE.tender-calculations TD.bordered-top { border-top: 1px dotted lightgray; }
TABLE.project-calculations TD.right, TABLE.tender-calculations TD.right { padding-right: 10px; text-align: right; }
TABLE.tender-calculations TD.editable { padding-right: 4px; }
TABLE.project-calculations TD.summary, TABLE.tender-calculations TD.summary { font-size: 18px !important; font-weight: bold; }
TABLE.project-calculations TD.summary-total, TABLE.tender-calculations TD.summary-total { font-size: 22px !important; font-weight: bold; }
H3.project-calculations, H3.tender-calculations { margin-top: 15px !important; margin-bottom: 0 !important; }  
A.project-calculations, A.tender-calculations { text-decoration: none; float: right; margin-right: 3px; }
SELECT.project-calculations, SELECT.tender-calculations { width: 100%; border: 0; background-color: transparent !important; border-bottom: 1px dashed lightgray; }
INPUT.project-calculations, INPUT.tender-calculations { width: 100%; text-align: right; border: 0; background-color: transparent !important; border-bottom: 1px dashed lightgray; }
HR.project-calculations, HR.tender-calculations { margin: 1px 0 1px 0; border-top: 1px dotted lightgray; }

.filter-button { margin-right: 4px; margin-bottom: 4px; }
DIV.row DIV.border-right { border-right: 1px dotted #efefef; }

/********* JOURNAL *********/
TABLE.journal-signature TD, TABLE.journal-packages TD { border-bottom: 1px dotted lightgray !important; }

.project-configuration-fields 
{ 
	display: block; 
	border: 1px dotted lightgray;
	background-color: black; 
	padding-left: 2px; 
	padding-bottom: 2px;
}

/***************************/
/******** VSM CSS **********/
/***************************/
.vsm { opacity: 0; }
.vsm > DIV { display: inline-block; position: absolute; overflow: auto; }
.vsm > DIV#VsmTree { left: 0; top: 0; width: 30%; height: 60vh; }
.vsm > DIV#VsmContent { left: 35%; top: 0; width: 65%; height: 60vh; overflow: hidden; }
.vsm > DIV#VsmContent > DIV#VsmContentDetails { height: 100%; overflow: auto; }
.vsm > DIV#VsmContent > DIV#VsmContentDetails .actions.btn-set 
{
	position: absolute !important;
    bottom: 0px !important; left: 0px !important;
    padding: 10px; width: 100%; margin: 0px;
    background-color: var( --background-lighter ) !important;
    border-bottom-color: var( --background-light ) !important;
    border-top-color: var( --lines ) !important;
    z-index: 2;
}
.vsm > DIV#VsmResources { left: 0; bottom: 0; width: 30%; height: 40vh; }
.vsm > DIV#VsmNavigation { left: 30%; bottom: 0; width: 40%; height: 40vh; }
.vsm > DIV#VsmLogging { left: 70%; bottom: 0; width: 30%; height: 40vh; }
.vsm > DIV.dragger { position: absolute; background-color: lightgray; opacity: 0.2; z-index: 2; }
.vsm > DIV.dragger.ui-draggable-dragging { background-color: red; opacity: 1;  }
.vsm > DIV.dragger.vertical { width: 10px; cursor: e-resize; }
.vsm > DIV.dragger.horizontal { width: 100%; height: 10px; cursor: n-resize; }
.page-container .portlet-body.vsm { height: 800px; position: relative; }
.page-container.rare .portlet-body.vsm { height: calc( 100vh - 75px ); position: fixed; }

.vsm-resources { display: none; }
.vsm-navigation-focus-container
{
	height: 30px; 
	width: 100%; 
	padding: 3px 0 0 10px; 
	cursor: pointer;
	border-bottom: var(--border);
}
.vsm-navigation-focus
{
	color: white; 
	font-size: 17px; 
	font-weight: 400; 
	cursor: pointer;
}
.vsm-spinner 
{	
	display: none;
	position: absolute;
	right: 0;
	margin: 5px;
	z-index: 1;
	width: 50px;
	height: 50px;
	border: 10px solid #000000;
	border-radius: 50% !important;
	border-top: 10px solid #FFFFFF;
	-webkit-animation: spin 0.5s linear infinite;
	animation: spin 0.5s linear infinite;
}
.vsm-spinner.active { display: block; }
@-webkit-keyframes spin 
{
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin 
{ 
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/***************************/
/******** KANBAN CSS *******/
/***************************/
.kanban-header
{
	display: flex;
	flex-direction: row;
	align-items: stretch; 
	width: 100%; 
	gap: 10px; 
	z-index: 1;
	padding-bottom: 10px;
}
.kanban-header > DIV 
{  
	flex: 1;
	text-align: center;
	font-weight: 700;
	background-color: #efefef;
	padding: 10px;
	font-size: 14px;
	font-weight: normal;
	height: 80px;
}
.kanban-status-slider { width: 80%; margin: 8px auto 5px auto; }
.kanban-status-slider .ui-slider-handle { outline: none !important; }
.kanban-status-slider.ui-slider-horizontal .ui-slider-handle { top: -4px; }
.kanban-status-filter .kanban_filter_days { font-size: 16px; font-weight: bold; }
.kanban-status-slider-tooltip 
{ 
	position: absolute;
    top: 20px;
}
.kanban-status-filter
{
	font-size: 10px;
	font-weight: 700;
}
.kanban-status-slider > DIV { background: none; }
.kanban-container
{
	display: flex;
	flex-direction: row;
	align-items: stretch; 
	width: 100%; 
	gap: 10px;
}
.kanban-container > DIV
{
	flex: 1;
	font-weight: 700;
	background-color: #efefef;
	padding: 10px;
	font-size: 14px;
	font-weight: normal;
	overflow-y: scroll;
}
.kanban-items-container.active { border: 1px dashed black; background-color: #c8e9f7; }
.kanban-items
{
	position: relative;
	height: 120px; 
	width: 100%; 
	padding: 10px;
	margin-bottom: 5px;
	background-color: white;
}

.kanban-items .text { font-size: 12px; }
.kanban-items .responsibility-bubble
{
	position: absolute;
	bottom: 5px; right: 5px;
	height: 25px; width: 25px; 
	background-color: #efefef; 
	border-radius: 50% !important;
	text-align: center;
	line-height: 25px;
	font-size: 10px;
	font-weight: 900;
}
.kanban-items .workflow-status
{
	position: absolute;
	top: 5px; right: 5px;
	height: 25px; width: 25px;
    text-align: center; padding-top: 2px;
	background-color: #efefef; 
	border-radius: 50% !important;
}
.kanban-items .workflow-status.done { background-color: #ccf1d8;  }
.kanban-items .workflow-status.in-progress { background-color: #fcf8e3;  }
.kanban-items .next-step
{
	position: absolute;
	top: 5px; right: 5px;
	height: 25px; width: 25px;
    text-align: center; padding-top: 2px;
	background-color: #ff0000; 
	border-radius: 50% !important;
}
.kanban-items .resources
{
	position: absolute;
	top: 5px; right: 5px;
	height: 25px; width: 25px;
    text-align: center; padding-top: 2px;
	background-color: #ff0000; 
	border-radius: 50% !important;
}
.kanban-items .resources.done { background-color: #ccf1d8; }
.kanban-items .disabled
{
	position: absolute;
	top: 5px; right: 5px;
	height: 25px; width: 25px;
	text-align: center; 
	padding-top: 2px;
	background-color: #fcf8e3; 
	border-radius: 50% !important;
}

.kanban-items > SPAN { display: block; }
.kanban-item-spinner
{
	display: none;
    position: absolute;
    left: 5px;
    bottom: 5px;
}
.kanban-item-spinner.active { display: block; }

.vsm > DIV#VsmResources .link { display: inline-block; position: relative; text-decoration: none; padding: 10px; }
.vsm > DIV#VsmResources .link .badge { border-radius: 20px !important; position: absolute; top: 0; right: 15px; min-width: 20px; min-height: 20px; }
.vsm > DIV#VsmResources .SearchSpinner { display: none; position: absolute; top: 100px; left: 35px;}

/********* INPUT SUBLINES ********/
.InputMessageInfo { color: #3badcf; font-size: 12px; }
.InputMessageWarning { color: #ff8000; font-size: 12px; }
.InputMessageDanger { color: #ff0000; font-size: 12px; }
.InputMessageDanger.invalid { display : none; }

/***************************/
/**** MEDIA GENERATOR ******/
/***************************/
.media_generator .template { position: relative; height: 180px; margin-bottom: 10px; }
.media_generator .template .hint { padding-top: 50px; }
.media_generator .template .side.left { left: 5px; width: calc( 50% - 6px ); top: 0; bottom: 0; }
.media_generator .template .side.right { right: 5px; width: calc( 50% - 6px ); top: 0; bottom: 0; }
.media_generator .template .side
{
	position: absolute; 
	background: #eeeeee; 
	border: 1px solid lightgray; 
	text-align: center;
	font-size: 11px;
	height: 120px;
}

.media_generator .template .title
{
	position: absolute; 
	height: 58px; bottom: 0; left: 5px; 
	width: calc( 100% - 10px );
	text-align: center; 
	text-overflow: ellipsis; 
	overflow: hidden; 
	white-space: nowrap; 
	background: #eeeeee; 
	padding: 5px; 
	border: 1px solid lightgray; 
	font-size: 11px;
}

.media_generator .template .fancybox IMG
{
	position: absolute; 
	left: 0; right: 0; top: 0; bottom: 0;
	margin: auto; max-width: 100%; max-height: 100%;
}

.page-content.rare DIV.neo-dashboard-section 
{ 
	position: sticky; 
	top: 0;
	background-color: white;
	z-index: 1; 
}

/***************************************************/
/***************** WIDGETS *************************/
/***************************************************/
.widgets { height: 60vh; overflow: auto; }
.widgets .canvas .placeholder { float: left; opacity: 0.6; }
.widgets .canvas .widget { float: left; overflow: hidden; position: relative; }
.widgets .widget INPUT.order { display: none; position: absolute; top: 10px; right: 140px; width: 20px; height: 20px; border: var( --border ) !important; text-align: center; }
.widgets .widget INPUT.width { display: none; position: absolute; top: 10px; right: 162px; width: 20px; height: 20px; border: var( --border ) !important; text-align: center; }
.widgets .widget INPUT.active { display: none; position: absolute; top: 10px; right: 182px; width: 20px; height: 20px; border: var( --border ) !important; text-align: center; }
.widgets .canvas .widget INPUT.btn { position: absolute; top: 10px; right: 10px; height: 20px; font-size: 10px; cursor: pointer; padding: 2px 5px; }
.widgets .canvas .widget a.btn { position: absolute; top: 10px; right: 10px; height: 20px; font-size: 10px; cursor: pointer; padding: 2px 5px; }
.widgets .canvas .widget INPUT.btn.blue { display: none; }
.widgets .repository .widget { float: left; overflow: hidden; opacity: 0.5; position: relative; }
.widgets .repository .widget INPUT.btn { position: absolute; top: 10px; right: 10px; height: 20px; font-size: 10px; cursor: pointer; padding: 2px 5px; }
.widgets .repository .widget INPUT.btn.red { display: none; }
.widgets .repository { clear: both; }
.widgets .canvas .widget DIV.content { margin: 5px; padding: 12px 14px; height: 60px; border: var( --border ) !important; background-color: var( --background-lighter ) !important; }
.widgets .repository .widget DIV.content { margin: 5px; padding: 12px 14px; height: 60px; border: var( --border ) !important; }
.widgets .canvas .widget DIV.content { cursor: move; }
.widgets .canvas .placeholder DIV.content { margin: 5px; padding: 20px; height: 60px; background-color: var( --background ) !important; }
.widgets .canvas .ui-resizable-e { width: 15px; }

.layout-report-issue 
{
	position: fixed; 
	display: block; 
	height: 32px; 
	width: 32px; 
	right: 12px; 
	bottom: 47px; 
	border: 2px solid grey;
	border-radius: 50% !important; 
	text-align: center; 
	line-height: 30px; 
	opacity: 0.7;
	z-index: 999999999;
	cursor: pointer;
}
.layout-report-issue:hover { opacity: 100%; }

/***************************************************/
/***************** PRICING *************************/
/***************************************************/
.PriceBlock { position: relative; }
.PriceBlock IMG.PriceSpinner
{
	position: absolute;
    left: 10px;
    top: 10px;
    width: 16px;
    height: 16px;
    display: none;
    z-index: 3; 
}

/**********************************/
/************ SLIDER **************/
/**********************************/
.text.range .ui-slider-horizontal { height: 16px; }
.text.range .ui-slider .ui-slider-handle { color: #333333; }
.text.range .ui-slider .ui-widget-header { background: #f5c335; }
.text.range .ui-slider .ui-slider-handle { width: 40px; height: 15px; outline: none; font-size: 10px; text-align: center; margin-left: -20px; overflow: visible; z-index: 4; border-radius: 2px !important; }
.text.range .ui-slider SPAN.ui-slider-handle:nth-of-type(1) { top: -8px; } 
.text.range .ui-slider SPAN.ui-slider-handle:nth-of-type(2) { top: 8px; } 
.text.range .ui-slider DIV.hours { position: absolute; width: 1px; background-color: #ff0000; height: 3px; z-index: 4; margin-left: -1px; } 
.text.range .ui-slider DIV.hours.top { top: -3px; }
.text.range .ui-slider DIV.hours.bottom { top: 15px; }
.text.range .ui-slider DIV.hours.middle { top: 6px; }
.text.range .ui-slider DIV.hours.zero { top: 0px; height: 15px; } 
.text.range .ui-slider DIV.minutes
{
    position: absolute;
    width: 1px;
    height: 100%;
    
    bottom: 0;
}
.text.range .ui-slider DIV.minutes.blocked { z-index: 3; background-color: #f0701a; }
.text.range .ui-slider DIV.minutes.scheduled { z-index: 2; background-color: #07e020; }

/* some styles for displaying range in jsf forms */
.text.range.details .ui-slider-horizontal  { height: 34px; }
.text.range.details .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: 1; }
.text.range.details .ui-slider SPAN.ui-slider-handle:nth-of-type(1) { top: -1px; } 
.text.range.details .ui-slider SPAN.ui-slider-handle:nth-of-type(2) { top: 18px; } 
.text.range.details .ui-slider DIV.hours { height: 11px; } 
.text.range.details .ui-slider DIV.hours.top { top: -1px; }
.text.range.details .ui-slider DIV.hours.bottom { top: 15px; }
.text.range.details .ui-slider DIV.hours.middle { top: 10px; }
.text.range.details .ui-slider DIV.hours.zero { top: 0px; height: 33px; } 

/* disabled slider */
.text.range.disabled .ui-slider .ui-slider-handle { color: #a9a9a9; }
.text.range.disabled .ui-slider .ui-widget-header { background: #b7b7b7; }
.text.range.disabled .ui-slider DIV.hours { height: 11px; background-color: #a7a7a7; } 

/**********************************/
/********* SALES SUMMARY **********/
/**********************************/
DIV.sales { padding: 7px; }
DIV.sales.odd { background-color: #ffffff; }
DIV.sales.even { background-color: #f2f6f9; }
DIV.sales.highlight { background-color: #ffd9b3; }
DIV.sales.sum { font-weight: bold; }
DIV.sales.current { font-weight: bold; font-size: 20px; }
DIV.sales.current.positive { background-color: #f4ffdd; color: #008000; }
DIV.sales.current.negative { background-color: #ffdde8; color: #620020;  }
DIV.sales.current.balanced { background-color: #c0c0c0; color: #000000; }

/**********************************/
/********* BENEFITS TABLE *********/
/**********************************/
TABLE.benefits { width:100%; table-layout: fixed; }
TABLE.benefits TR { height: 30px; }
TABLE.benefits TD { padding: 5px; }
TABLE.benefits TR.odd { background-color: #f5f5f5; }
TABLE.benefits TR.even { background-color: #f7f6ed; }
TABLE.benefits TR.highlight { background-color: #ffd9b3; }

/**********************************/
/********* CUSTOMER RADIO *********/
/**********************************/
TABLE.customer-radio TD { display: grid; grid-template-columns: 30px auto; }

/*************************************/
/************* SHOP ******************/
/*************************************/
DIV.shop-container 
{
	position: relative;
	height: 60vh;
	border: 1px solid lightgray; 
	overflow: auto;
}
DIV.shop-container A.shop-item
{
	display: block;
	height: 300px; 
	width: 100%; 
	border: 1px solid lightgray; 
	margin-bottom: 10px; 
	padding: 10px;
}
DIV.shop-container A.shop-item > DIV.image-container
{
	height: 80%; 
	width: 100%; 
	border: 1px solid lightgray;
}
DIV.shop-container A.shop-item > DIV.image-container > IMG
{
	width: 100%; 
	height: 100%; 
	object-fit: contain;
}
DIV.shop-container A.shop-item > DIV.image-container > IMG.placeholder { object-fit: none; }
DIV.shop-container A.shop-item > DIV.item-details
{
	margin-top: 10px;
	width: 100%; 
}
DIV.shop-container A.shop-item > DIV.item-details > SPAN.item-name
{
	font-weight: 600;
    display: block;
}

/**********************************/
/********* Category Media *********/
/**********************************/
.media-thumbnail-container { background-color: white; min-height: 80vh; }
.media-thumbnail-container.overflow { min-height: 50vh !important; overflow: auto; height: 50vh; }
.media-thumbnail-container::-webkit-scrollbar { display: none; }
.media-thumbnail-container .redirect { color:gray; position: absolute; top: 11px; }
.media-thumbnail-container .redirect i { color:gray; font-size: 17px; }
.media-thumbnail DIV DIV SPAN, .media-thumbnail .download  { top: -23px !important; right: 12px !important;}
.media-thumbnail-container DIV.row DIV { margin-bottom: 5px; }
.media-thumbnail { background-color: #eee; padding-bottom: 20px;}
.media-thumbnail DIV DIV  { background-color: #eee !important; border: none !important; padding: 10px !important; }
.media-thumbnail .title { position: absolute; bottom: 10px; padding: 0px 10px; font-size:11px; height: 20px; text-overflow: ellipsis; overflow: hidden; width: 95%;}
.media-thumbnail .media_uploader DIV SPAN { margin-right: 3px; }
.media-thumbnail .checker { margin-top: 10px !important; margin-left: 10px !important; }
.media-thumbnail-footer { display: block; border-bottom: 20px solid white !important; border-bottom-color: white !important;  border-top: 1px solid lightgray; border-top-color: lightgray;  height: 69px; padding: 10px; background-color: #eee; position: sticky; bottom: 33px; z-index: 3; }
.page-content.rare .media-thumbnail-footer { position: sticky; bottom: 0px; width: 100%; z-index: 2; height: 50px; border-top: 1px solid lightgray; border-top-color: lightgray; border-bottom: 1px solid lightgray; border-bottom-color: lightgray; }
.media-thumbnail-footer .btn { margin-right: 4px; }
.neo-media-thumbnail .media-thumbnail-container .note-info { font-size: 13px !important; }
.neo-media-thumbnail { white-space: nowrap; font-size: 0; -ms-overflow-style: auto; position: relative; white-space-collapsing: discard; }
.neo-media-thumbnail.dropover { position: relative; }
.neo-media-thumbnail.dropover DIV.dropper { position: absolute; font-size: 13px; left: 0px; top: 0px; width: 100%; height: 100%; opacity: 0.8; color: black; z-index: 5; border: 1px dotted #c0c0c0; background-color: #eee; pointer-events: none; }
.media-thumbnail-footer .columns { float: right; text-decoration: none; color: lightgray; padding-top: 7px; font-size: 14px; }
DIV.media-thumbnail-footer DIV.neo-uploader-progress-border { border: 1px dotted lightgray; position: absolute; width: 100%; left:0px; bottom: 49px; z-index: 10; background: #f4f4f4; color: gray; padding: 10px; }
DIV.media-thumbnail-footer DIV.neo-uploader-progress { height: 20px }

.neo-thumbnail-navigation .left { position: absolute; left: 10px; top: 10px; }
.neo-thumbnail-navigation .center SPAN.number { padding: 5px; }
.neo-thumbnail-navigation .center SPAN.number B { font-weight: bold; font-size: 20px; }
.neo-thumbnail-navigation .center DIV.max { position: absolute; right: 10px; top: -16px; font-size: 11px; color: gray; }
.neo-thumbnail-navigation .right { position: absolute; right: 10px; top: 10px; }
.neo-thumbnail-navigation 
{  
    position: absolute;
    right: 50px; bottom: 131px; width: 350px;
    text-align: center;
    background-color: white;
    border: 1px solid lightgray;
    border-radius: 10px !important;
    box-shadow: 5px 5px rgb(48 42 62 / 31%);
    margin: auto;
    display: inline;
    padding: 3px 40px;
}

/***************************************/
/********** MEMBERSHIP STATUS **********/
/***************************************/
DIV.membership-status 
{ 
	height: 50vh; 
	width: 100%; 
	padding: 10px 0px; 
}
DIV.membership-status DIV.membership-status-details 
{ 
	height: 7vh; 
	width: 100%; 
	border: 1px solid lightgrey; 
	border-bottom: 0 !important; 
	padding: 10px;
}
DIV.membership-status DIV.membership-status-benefits
{
	height: 25vh;
	width: 100%; 
	border: 1px solid lightgrey; 
	border-bottom: 0 !important; 
	padding: 10px; 
	overflow: auto;
}
DIV.membership-status DIV.membership-status-benefits-text
{
	height: 15vh;
	width: 100%; 
	border: 1px solid lightgrey; 
	border-top: 0 !important; 
	padding: 10px;
}

.ConnectionMessage .loader { position: relative; }
.ConnectionMessage .loader IMG.SearchSpinner
{
	position: absolute;
	right: 25px;
	width: 18px;
	height: 18px;
	z-index: 2; 
}

/******* SCROLLABLE MODAL BODY *********/
DIV.modal DIV.modal-body DIV.scrollable 
{ 
	height: 45vh; /* default */
	overflow-y: auto; 
	overflow-x: hidden; 
} 

/********* VSM RESOURCES *********/
DIV.resource-header
{
	position: sticky; 
	top: 0px;
	display: flex; 
	flex-direction: row; 
	align-items: stretch; 
	width: 100%; 
	gap: 5px; 
	z-index: 1;
	padding-bottom: 5px;
	height: 10%;
}
DIV.resource-header > DIV.header
{
	text-align: center;
	background-color: #efefef;
	padding: 15px;
	font-size: 13px;
	font-weight: 700;
}
DIV.resource-container 
{
	display: flex; 
	flex-direction: row; 
	align-items: stretch; 
	height: 90%;
	width: 100%; 
	gap: 5px; 
	font-size: 13px;
	font-weight: 700;
}
DIV.resource-container > DIV.resource-category
{
	position: relative;
	background-color: #efefef;
	height: 100%;
	padding: 10px;
	overflow: auto;
}
DIV.resource-container > DIV.resource-category > A.btn
{
	height: 40px;
	width: 100%;
	padding: 10px;
}
DIV.resource-container > DIV.resource-category > DIV.dropdown.resource-category-button
{
	display: flex; 
	flex-direction: row; 
	align-items: stretch;  
	height: 40px;
	width: 100%; 
	margin-bottom: 5px;
}
DIV.resource-container > DIV.resource-category > DIV.dropdown.resource-category-button A { text-align: left; }
DIV.resource-container UL.dropdown-menu.resource-category-actions
{
	top: 80%;
	right: 0;
	left: unset;
}
DIV.resource-container UL.dropdown-menu.resource-category-actions > LI { border-bottom: 1px solid lightgray; }
DIV.resource-container UL.dropdown-menu.resource-category-actions > UL > LI.btn { text-align: left; }
DIV.resource-container UL.dropdown-menu.resource-category-actions:before { right: 7px; left: unset; }
DIV.resource-container UL.dropdown-menu.resource-category-actions:after { right: 8px; left: unset; }

/********* CMS CONTENT *********/
TABLE.variations, 
TABLE.matrix
{
	width: 100%;
	table-layout: fixed;
}
TABLE.variations TD, 
TABLE.overview TD, 
TABLE.matrix TD
{
	border: 0; 
	padding-right: 2px;
	padding-bottom: 2px;
}

TABLE.variations TD .btn, 
TABLE.overview TD .btn, 
TABLE.matrix TD .btn
{
	width: 100%;
	min-height: 40px;
	margin: 0;
	overflow: hidden;
    wrap: no-wrap;
    word-wrap: no-wrap;
    white-space: nowrap;
    text-overflow: ellipsis;
}

TABLE.overview TH,
TABLE.overview TD
{
	vertical-align: middle;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 2px;
	padding-right: 5px;
} 

TABLE.overview TH.centered,
TABLE.overview TD.centered
{
	text-align: center;
	vertical-align: middle;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 2px;
	padding-right: 5px;
} 

TABLE.overview TR.even { background: var( --table-rows-even ); }
TABLE.overview TR.odd  { background: var( --table-rows-odd ); }

TABLE.matrix TD .btn
{
	font-weight: bold; 
	width: 100%;
	height: 100%;
	cursor: default;
}

TABLE.matrix TD A.btn
{
	cursor: pointer;
}

TABLE.matrix TD A.btn.title,
TABLE.matrix TD SPAN.btn
{
	cursor: default;
}

TABLE.matrix TD A.title
{
	position: relative; 
	background-image: linear-gradient( to bottom left, var( --button-disabled ) 49%, white 50%, var( --button-cancel ) 51% ) !important;
}

TABLE.matrix TD A.title SPAN
{
	font-size: 11px; 
	font-weight: bold; 
	position: absolute;
}

TABLE.matrix TD A.title SPAN.row
{
	bottom:5px; 
	left: 30px;
}

TABLE.matrix TD A.title SPAN.column
{
	top:5px; 
	right: 30px; 
}

/********* MASONRY *********/
.masonry { column-count: 2; column-gap: 10px; font-size: 11px; }
.masonry IMG { width: 100%; display: block; }
.masonry DIV.checker { position: absolute; left: 6px; top: 10px; }
.masonry FIGURE > IMG { grid-row: 1 / -1; grid-column: 1; }
.masonry FIGURE A { color: black; text-decoration: none; }
.masonry FIGURE 
{
	margin: 0;
	display: grid;
	grid-template-rows: 1fr auto;
	margin-bottom: 10px;
	break-inside: avoid;
	overflow: hidden;
	position: relative;
	background: var( --background-lighter ) !important; 
}

.masonry FIGCAPTION 
{
	grid-row: 2;
	grid-column: 1;
	background-color: rgba( 255,255,255,.7 );
	padding: .2em .5em;
	justify-self: start;
}

@media ( min-width:  480px ) { .masonry { column-count: 3; } }
@media ( min-width:  767px ) { .masonry { column-count: 4; } }
@media ( min-width:  991px ) { .masonry { column-count: 5; } }
@media ( min-width: 1200px ) { .masonry { column-count: 6; } }
@media ( min-width: 1768px ) { .masonry { column-count: 8; } }

.ui-sortable-placeholder { background-color: red; visibility: visible; }

/************ INSTANCES OVERVIEW *************/
DIV.instance 
{
	width: 100%;
	overflow: auto;
}

DIV.instance ::-webkit-scrollbar 
{
    background: #e2e2e2;
    width: 12px;
}

A.resource.btn.default SPAN { color: #333333 !important; }
A.resource.btn.default { background-color: #ffffff !important; }
A.resource.btn SPAN.text { display: inline-block; max-width: 90%; }
A.resource.btn SPAN.icon { float: right; line-height: 20px; font-size: 18px !important; }

/********* INLINE DATE *********/
.inline-date-container
{
	display: flex;
}

.inline-date-calendar
{
	width: 200px;
	margin-right: 25px;
}

.inline-calendar-listener
{
	flex: auto;
}

/****** Lingual styles *******/
IMG.lingual { height: 24px; width: 24px; opacity: 0.25; filter: grayscale( 100% ); }
IMG.lingual:hover { opacity: 1; filter: none; }
