body.ff2 .fg00 { color: #C7543F !important; }
body.ff2 .fg01 { color: #4D4D4D !important; }
body.ff2 .fg02 { color: var(--secondaryColor);}
body.ff2 .fg03 { color: #4D4D4D !important; }
body.ff2 .fg04 { color: #BBBBBB !important; }
body.ff2 .fg05 { color: #DADADA !important; }
body.ff2 .fg06 { color: #EEEEEE !important; }
body.ff2 .fg07 { color: #F0F0F0 !important; }
body.ff2 .fg08 { color: #FFFFFF !important; }
body.ff2 .fg09 { color: #FCBA45 !important; }
body.ff2 .fg10 { color: #C7543F !important; }

body.ff2 .bg00 { background-color: #C7543F !important; }
body.ff2 .bg01 { background-color: #4D4D4D !important; }
body.ff2 .bg02 { background-color: var(--secondaryColor);}
body.ff2 .bg03 { background-color: #4D4D4D !important; }
body.ff2 .bg04 { background-color: #BBBBBB !important; }
body.ff2 .bg05 { background-color: #DADADA !important; }
body.ff2 .bg06 { background-color: #EEEEEE !important; }
body.ff2 .bg07 { background-color: #F0F0F0 !important; }
body.ff2 .bg08 { background-color: #FFFFFF !important; }
body.ff2 .bg09 { background-color: #FCBA45 !important; }
body.ff2 .bg10 { background-color: #C7543F !important; }

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #BBB;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #BBB;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #BBB;
}

.material-icons {
	font-family: 'Material Icons' !important;
	cursor: pointer;
	color: #999;
	width: 1em;
	height: 1em;
}
mark {
	background-color: #FCBA45;
}

body.ff2 {
    background: #DADADA;
}

body.progress,
body.progress * {
	cursor: progress !important;
}

body, form, div, table, h1, h2, img {
    margin: 0;
    padding: 0;
}

input {
	color: #4D4D4D;
    font: normal 13px Roboto;
    background: #EEEEEE;
    padding: 7px 5px;
}

textarea {
	color: #4D4D4D;
    padding: 10px;
    resize: both;
    overflow: visible;
    width: 300px;
}

a {
    word-wrap: break-word;
}

table {
    border-collapse: collapse;
    empty-cells: show;
}

#headerLinks a.material-icons.active {
	color: #C7543F;
}

.chartDivHeader {
    background: #EEE;
    color: #4D4D4D;
    height: 40px;
    text-align: center;
    padding-top: 12px;
    font-size: 24px;
    white-space: nowrap;
}
i.material-icons {
	font-size: 1.5em;
	user-select: none;
}
	i.material-icons:hover {
		color: #808080;
	}

i.expandInactive,
i.iconActive {
	color: #389995;
}
i.iconActive:hover {
	color: #389995;
}

i.expandActive {
    color: var(--secondaryColor) !important;
}

.ffButton {
	font-size: 11px;
	height: 31px;
	margin-right: 10px;
	text-transform: none;
	transition: color 200ms;
	width: initial;
    min-width: 85px;
    padding: 0 10px;
    border-radius: 0px;
}
.ffButton:hover {
	background-color: var(--primaryColor);
	color: var(--secondaryColor);
}
.ffButton.bold:hover {
    color: var(--alternateFontColor);
}
.ffButton:focus:before {
	border: none;
}

.ffButton.bold {
	background-color: var(--secondaryColor);
}
.ffButton span {
	text-transform: uppercase;
}

.ffOverlay {
	display: none;
    height: 100%;
    padding: 5px;
    width: 100%;
    margin: 0px;
    z-index: 999;
    position: fixed;
    left: 0;
    top: 0;
    height: calc(100% - 10px);
    width: calc(100% - 10px);
}


/* Less padding for small screen widths */

@media only screen and (max-width: 400px) {
	body {
		padding-bottom: 10px !important;
	}
	#pagePadding {
		padding: 10px !important;
	}
	.ffTopContainer,
	.ffChartContainer {
		margin-bottom: 10px !important;
	}
}

/* Drop down styles for 2.0 */

#ui-datepicker-div {display: none;}

/* Date picker */

.ui-datepicker .ui-datepicker-title {
	color: #FFF;
}

::-ms-clear {
	display: none;
}

.ffModalButtonContainer .ffButton {
	width:auto;
}
.deleteCommon{
	margin:10px;
	padding: 20px 10px;
	white-space: normal;
}
.deleteCommon input{
	margin-right: 10px;
}
.deleteCommon span{
	float: right;
	width: 86%;
}

/* Files */

.jobFilesTr .btnLink i{ padding-right:0px; font-size: 21px; position: relative; top: 6px; color:#EEEEEE;}

#msgUploadForm{width: 35px;display: inline-block;}
#msgFiles{margin-top:10px;padding: 0;}
.smsFileLink .material-icons{position:relative;top: 5px;left: 5px;}
.jobFileList{list-style:none;padding:0px; margin-left: 120px;max-height:100px;overflow-y:auto;}
.jobFileList li{width: calc(100% - 10px); max-width:350px;background: #EEEEEE;margin-top: 5px;padding: 6px;}
.jobFileList li i{font-size: 20px;float: right;}
.jobFileList li span{max-width:320px;overflow: hidden;display: inline-block;}
.loader {width: 40px;height: 40px;-webkit-animation: .5s linear 0s normal none infinite spin;animation: .5s linear 0s normal none infinite spin;}

@-webkit-keyframes spin {from {transform:rotate(0deg);}to {transform:rotate(360deg);}}
@keyframes spin {from {transform:rotate(0deg);}to {transform:rotate(360deg);}}

table.ffTable tbody tr:hover td.timesheetHours { background-color: #DADADA; }
table.ffTable td.timesheetHours { cursor: n-resize; }
#tsLinks i { font-size: 2em; margin-top: -3px; }
table.ffTable thead td#timerHeader > div i { margin-left: 0 }

/* Input drop down */

.ffInputDropDownContainer {
	background-color: #FFF;
    border: 1px solid #CCC;
    opacity: 1;
    overflow-y: auto;
	position: absolute;
	left: -1px;
	margin-top: 3px;
	top: 31px;
	transition: opacity 300ms, margin 300ms;
	z-index: 4;
}
.ffInputDropDownContainer.initial {
	margin-top: 0;
	opacity: 0;
	transition: opacity 0ms, margin 0ms;
	z-index: -1;
}
.ffInputDropDownContainer span {
	color: #666;
	cursor: pointer;
	font-size: 13px;
	display: block;
	padding: 5px;
}
.ffInputDropDownContainer span.hover,.ffInputDropDownContainer span:hover {
		background-color: #E8E8E8;
	}


/* Datepicker */
.ui-datepicker .ui-datepicker-buttonpane { text-align: center; border: none; margin: 0; }
.ui-state-default.ui-priority-secondary:not(.ui-datepicker-current) { opacity: 0.3; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: none; opacity: 1; outline: none; margin-top: 0}
button.ui-datepicker-current { float: none; }
button.ui-datepicker-close { display: none; }



.modal_availability_link {
	color: var(--alternateFontColor);
    cursor: pointer;
    font-size: 12px;
    position: absolute;
    right: 60px;
    top: 17px;
}
.modal_availability_link:hover {
	text-decoration: underline;
}

/*********************************************************************************************************
 *                                                                                                       *
 *                                             2.0 Styles                                                *
 *                                                                                                       *
 *********************************************************************************************************/

body.ff2,
body.ff2 table,
body.ff2 div,
body.ff2 select {
    font: normal 13px Roboto;
    color: #4D4D4D;
}

body.ff2 .rhc_div a {
	color: var(--alternateFontColor);
	text-decoration: underline;
}

body.ff2 input {
	box-shadow: none;
    border: none;
}

body.ff2 textarea {
    border: none;
    background: #EEEEEE;
    font: normal 13px Roboto;
}

body.ff2 #header #headerLinks {
    font: bold 12px Roboto;
}

body.ff2 .deleteCommon input {
	color: #FFFFFF;
	background-color: #3C4650;
	padding: 5px 10px;
}

body.ff2 .deleteCommom {
	height: 60px
}

body.ff2 .jobFilesTr a.btnLink,
body.ff2 label.btnLink {
   	position: absolute;
    right: 0;
    top: 0;
    padding: 5px 7px 3px 7px;
}
	body.ff2 label.btnLink:hover {
		color: var(--secondaryColor);
	}

body.ff2 .ffFieldContainer.narrow .jobFileList,
body.ff2 .ffFieldContainer.mobile .jobFileList {
	margin-left: 0px;
}
body.ff2 .ffModalLayer .jobFileList {
	margin:0 0 10px 110px;
	overflow-y: auto;
	max-height: 75px;
}

@media print {
	.ffFilterMainWrapper, .ffChartContainer, #headerLinks a, .settingsIcon { display: none; }
}

.crmDetailsInput{vertical-align: top;width:56px;height: 24px;background:#DADADA;text-align:center;padding:0px;}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}


/*********************************************************************************************************
 *                                                                                                       *
 *                                             ffAlert Styling                                           *
 *                                                                                                       *
 *********************************************************************************************************/

#alertModal {
	padding-bottom: 15px;
}

#alertModal > div {
	padding: 15px 35px 15px 55px;
	position: relative;
}

#alertModal i.material-icons {
	position: absolute;
	top: 0;
}
	#alertModal i.material-icons.closeIcon {
		right: 10px;
		top: 10px
	}
	#alertModal i.material-icons.alertIcon {
		color: #4D4D4D;
		left: 15px;
	    top: 10px;
	    font-size: 28px;
	}

#alertModal h1 {
	margin: 0;
    border: none;
    font-size: 16px;
}

#alertModal p {
	margin: 0;
	padding: 0 20px 10px 20px;
	white-space: normal;
}

/*********************************************************************************************************
 *                                                                                                       *
 *                                          Context Menu Styling                                         *
 *                                                                                                       *
 *********************************************************************************************************/

.contextMenu {
	background-color: #FFF;
	border: 1px solid #808080;
	padding: 5px 10px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 999;
}