/* HTML Elements / Defaults
----------------------------------------------------------*/

a:hover {
  position: relative;
  cursor:pointer;
  color: #046C71;
}

a.dragClickable {
    background-color: inherit;
}

a:hover.dragClickable {
  position: relative;
  cursor:pointer;
  color:inherit;
}

/* Progess Bar
----------------------------------------------------------*/

/*firefox*/
progress.progressBar::-moz-progress-bar { background: #046C71; }

/*chrome*/
progress.progressBar::-webkit-progress-bar {

  background-color: grey;
} 

progress.progressBar::-webkit-progress-value {  
	background-color: #046C71;
}  

/*IE*/
progress.progressBar { 
    -webkit-appearance: none;
     color: #046C71;
}

/* Headers
----------------------------------------------------------*/

.header {
    position: relative;
    margin: 0px;
    width: 100%;
    height: 64px;
	background: -webkit-linear-gradient(left, #FFFFFF, #F89F15);
    background: -moz-linear-gradient(bottom left, #FFFFFF, #F89F15);
    background: -o-linear-gradient(right, #FFFFFF, #F89F15);
    background: linear-gradient(to right, #FFFFFF, #F89F15);
    
	background-position:0px 50%;
	background-repeat: no-repeat;
	overflow:hidden;
}

.headerLogo {
	background-image: url(../../img/hdr/mod/sbmLogo.png);
	margin-left: 40px;
	background-position-y: 50%;
	background-position: left center;
	background-repeat: no-repeat;
	width: 100%;
	height: 54px; /* Define as image height (background-image) to work on firefox */
}

.header_sml {
	width: 100%;
	height: 56px;
	background: url(../../img/hdr/mod/sbmLogo.png) no-repeat center bottom;
	background-repeat: no-repeat;
    position:relative;
    top:10px;
}

/* Tabs
----------------------------------------------------------*/

.tabSelected {
    color: #046C71;
    font-weight:bold;
}


/* Buttons  
----------------------------------------------------------*/

.button_HL {
	color: #046C71;
	background-color: #706F6F;
	cursor:default;
	font-size:11px;
	font-weight:bold;
	border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.button_P {
	color: #046C71;
	background-color: #949494;
	cursor:default;
	font-size:11px;
	font-weight:bold;
	-moz-border-radius-topleft: 8px;
	border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

/* Drag and Drop
----------------------------------------------------------*/

.dragOver{
	height: 25px;
	background-color: #046C71;
}

table tr.dragOver td {	
	background-color: #046C71;
    color: #FFFFFF;
}

/* Upload Zones
----------------------------------------------------------*/

.uploadZone {
	outline: 2px dashed #92B0B3;
}

.uploadZoneActive {
	outline: 2px dashed #046C71 !important;
}

/* Modern Skin Gradients
----------------------------------------------------------*/

.clientGradient {
	background: -webkit-linear-gradient(left, #046C71  , #10908F); /* For Safari 5.1 to 6.0 */
	background: -moz-linear-gradient(bottom left, #046C71 , #10908F);
	background: -o-linear-gradient(right, #046C71 , #10908F); /* For Opera 11.1 to 12.0 */
    background: linear-gradient(to right, #046C71  , #10908F); /* Standard syntax (must be last) */
}

.backgroundWatermark {
	height:100vh;
	width:100%;
	overflow: hidden;
	background-size: cover;
	background-position: center;
	background-image: url("../../img/background/dots.svg");
}

/* Search Criteria Tag Selected */

.tag {
	background-color: #046C71;
	display: inline-table;
	height: 20px;
	margin: 5px 15px 5px 15px;
	padding: 4px 4px 4px 7px;
	position: relative;
	color: #FFF;
}

	/* Inner Triangle */
	.tag:after {
		border-top: 14px solid transparent;
		border-bottom: 14px solid transparent;
		border-left: 14px solid #046C71;
		border-right: 0;
		content: "";
		position: absolute;
		right: -14px;
		top: 0;
	}

/* Search Criteria Tag List */

.tagOutline {
	box-shadow: inset 2px 2px #046C71, inset 0px -2px #046C71;
	display: inline-table;
	height: 20px;
	margin: 5px 15px 5px 15px;
	padding: 4px 4px 4px 7px;
	position: relative;
}

	.tagOutline:after {
		box-shadow: -2px 0px #FBFAF9;
		border-color: transparent #FBFAF9;
		border-style: solid;
		border-width: 12px 0px 12px 13px;
		content: "";
		display: block;
		left: 100%;
		top: 2px;
		margin: 0px 0px 0px 0px;
		padding: 0;
		position: absolute;
		width: 0;
		z-index: 1;
	}

	.tagOutline:before {
		border-color: transparent #046C71;
		border-style: solid;
		border-width: 14px 0px 14px 16px;
		content: "";
		display: block;
		left: 100%;
		top: 0px;
		margin: 0;
		padding: 0;
		position: absolute;
		width: 0;
		z-index: 0;
	}

    
/* PROJECT CUSTOM ACTION MENU */

/* Action Menu Container */
.projectCustomActionMenuContainer {
    display:none;
    width:200px;
    height:0px;
    position:absolute;
    overflow:hidden;
}

/* Action Menu Body*/
.projectCustomActionMenu {
    background-color: #FBFAF9;
    border: 3px solid #046C71;
    border-radius: 10px 10px 10px 10px;
    color: #000000;    
    padding: 10px;
    position: relative;
    text-align: center;
    width: 140px;
    max-width: 140px;
    z-index: 2100;  
    top:20px;
}

/* Inner Triangle */
.projectCustomActionMenu:after{
    content: "";
    border-color: #FBFAF9 transparent;
    border-style: solid;
    border-width: 0px 20px 20px 20px;
    content: "";
    display: block;
    left: 57.5%;
    position: absolute;
    top: 20px;
    width: 0px;
    z-index: 2;
    margin-left: -29px;
    margin-top: -36px;
    border-bottom-width:18px;
}

/* Outer Triangle */
.projectCustomActionMenu:before {
    content: "";
    border-color: #046C71 transparent;
    border-style: solid;
    border-width: 0px 23.5px 31.5px 23.5px;
    content: "";
    display: block;
    left: 56%;
    position: absolute;
    top: -1px;
    width: 0px;
    height:5px;
    z-index: 1;
    margin-left: -29px;
    margin-top: -26.5px;
    border-bottom-width: 22.5px;
}