@charset "utf-8";
html{
    min-height:100%;/* make sure it is at least as tall as the viewport */
    position:relative;
}
body{
    height:100%; /* force the BODY element to match the height of the HTML element */
}
._md-subheader-inner{
	padding-bottom: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
#tableBody {
    display: block;
}

.availableMarker {
    background-color: #fff;
    position: relative;
}

.availableMarker::before,
.availableMarker::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    border-color: transparent;
    border-style: solid;
}

.availableMarker::before {
    border-width: .3em;
    border-left-color: #ccc;
    border-top-color: #ccc;
}

.availableMarker::after {
    border-width: .25em;
    border-left-color: #0c0;
    border-top-color: #0c0;
}

.internalTooltipWrapper {
 position: absolute;
 z-index: 20;
 visibility: hidden;
}
.internalTooltip:hover .internalTooltipWrapper {
 visibility: visible;
 opacity: 0.7;
 /*top: 30px;*/
 /*left: 50%;*/
 /*margin-left: -76px;*/
 /* z-index: 999; defined above with value of 5 */
}

.tooltiptext {
  z-index: 20;
 display: block;
 position: relative;
 bottom: 50%;
 left: 10%;
 padding: 10px;
 min-width: 450px;
 /*margin-left: -76px;*/
 color: #FFFFFF;
 background: #000000;
 line-height: 20px;
 text-align: center;
 border-radius: 8px;
 box-shadow: 4px 3px 10px #800000;
}

.tooltiptextLast {
  z-index: 20;
 display: block;
 position: relative;
 bottom: 50%;
 right: 75%;
 padding: 10px;
 min-width: 450px;
 /*margin-left: -76px;*/
 color: #FFFFFF;
 background: #000000;
 line-height: 20px;
 text-align: center;
 border-radius: 8px;
 box-shadow: 4px 3px 10px #800000;
}

@keyframes fadeIn {
  from { opacity: 0; }
}

.flashing_no_show{
	color: #FB858B;
	animation: fadeIn 2s infinite alternate;
}
.workerDropdown{
	border-color: black;
}
.gridViewCells{
	vertical-align: top;
	text-align: center;
	border-bottom: solid 1px grey;
	border-right: solid 1px grey;
	color:#616161;
}
.gridViewCells:not(.startRows){
	/*display: flex;
    flex-direction: ;
    flex-wrap: wrap;*/
    /*justify-content: flex-start;*/
    min-height: 65px;
    /*max-height: 67px;*/
}
div.startRows{
	padding-top: 5px;
	min-height: 30px;
}
div.gridViewCells{
	text-align: center;

}

.datetime-picker-dropdown > li.time-picker-menu {
	width: 250px;
}
/*   menu    */
.menu-wrap {
    width:100%;
    box-shadow:0px 1px 3px rgba(0,0,0,0.2);
	height: 29px;
    background:#bddce9;
}

.menu {
    width: 100%;
	padding:0px 20px;
}

.menu li {
    margin:0px;
    list-style:none;
    line-height:50%;
	font-weight: lighter !important;
	font-family: 'jaf-bernino-sans';
}

.menu a {
    transition:all linear 0.15s;
    color:black;
}

.menu li:hover > a, .menu .current-item > a {
    text-decoration:none;
    color:black;
}

.menu .arrow {
    font-size:11px;
    line-height:0%;
}

/*----- Top Level -----*/
.menu > ul > li {
    float:left;
    display:inline-block;
    position:relative;
    font-size:18px;
}

.menu > ul > li > a {
    padding:10px 40px;
    display:inline-block;
}

.menu > ul > li:hover > a, .menu > ul > .current-item > a {
    background:#2897ce;
}

/*----- Bottom Level -----*/
.menu li:hover .sub-menu {
    z-index:500;
    opacity:1;
}

.sub-menu {
    width:140%;
    padding:0;
    position:absolute;
    top:100%;
    left:0px;
    z-index: -1;
    opacity:0;
    transition:opacity linear 0.15s;
    box-shadow:0px 2px 3px rgba(0,0,0,0.2);
    background:#bddce9;
}

.sub-menu li {
    display:block;
    font-size:18px;
	line-height:50%;
	font-weight: lighter !important;
	font-family: 'jaf-bernino-sans';
}

.sub-menu li a {
    padding:10px 30px;
    display:block;
}

.sub-menu li a:hover, .sub-menu .current-item a {
    background:#2897ce;
}
.md-virtual-repeat-offsetter {
  height: 1000px;
}

.time-off-cell {
	padding: 10px;
	border-right: 1px grey solid;
	font-size: 80%;
	font-weight: 100;
}

.time-off-rowHeader {
	line-height: 175%;
	width: 130px;
	display: inline-block;
	font-weight: 100 !important;
}

.requests-rowHeader {
	line-height: 175%;
	width: 330px;
	display: inline-block;
	font-weight: 100 !important;
}


/* CSS Document */
body{ background-image:url('../images/linen_bg.jpg'); background-color: #bcbcbc; margin:0px; padding:0px; line-height:18px;  font-family: 'jaf-bernino-sans'; color: #616161; font-size:18px; font-weight: lighter;}
h1{ font-size:32px; margin:0px; padding:0px;font-family: 'jaf-bernino-sans'; letter-spacing:-1px; word-spacing:0px;padding-top:35px; font-weight: lighter;}
h2{ font-size:30px; margin:0px; padding:0px;font-family: 'jaf-bernino-sans'; letter-spacing:-1px; word-spacing:0px;padding-top:5px; font-weight: lighter;}

img{ border:0px}

input{font:inherit; color:inherit}

textarea{font:inherit; color:inherit}

button:not([type="button"]){border: 0; height: 30px; padding: 2px 4px !important; box-shadow: 1px 1px 3px #888888;}

button:not([type="button"]):not(.btn):hover{background-color: #939393; box-shadow: 0px 0px 5px #888888;}

button.btn:hover{box-shadow: 0px 0px 5px #888888;}

.typeButtonFix{border: 0; height: 30px; padding: 2px 4px !important; box-shadow: 1px 1px 5px #888888;}

.typeButtonFix:hover{background-color: #939393; box-shadow: 0px 0px 5px #888888;}

.ui-splitbar{
	background-image: url('../images/linen_bg.jpg') !important;
}

::-webkit-scrollbar
{
	width: 6px;
	background-color: #F5F5F5;
}
::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}
::-webkit-scrollbar-thumb
{
	background-color: #7e7e7e;
}

-mox-scrollbar
{
	width: 6px;
	background-color: #F5F5F5;
}
-moz-scrollbar-track
{
	-moz-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}
-moz-scrollbar-thumb
{
	background-color: #7e7e7e;
}


#timeOffLink{
  padding-top:8px;
  margin:0px;
  padding-left:20px;
  position:relative;
  bottom:7px;
}
#timeOffLink a{

  color:#E39831;
  margin:0px;
  padding:0px;
}
#timeOffLink a:hover{
	text-decoration:none;
	color:#E39831;
}
@media only screen and (min-width: 1151px){
	.toolkit-container{
		width: 1000px;
	}
}
@media only screen and (min-width: 793px) and (max-width: 1150px){
	.toolkit-container{
		width: 641px;
	}
}
@media only screen and (max-width: 792px){
	.toolkit-container{
		width: 330px;
	}
}

input[type="submit"]{
	border: 0;
	height: 30px;
	padding: 2px 4px !important;
	margin-right: 10px;
	box-shadow: 2px 2px 5px #888888;
}
input[type="submit"]:hover{
	background-color: #939393;
	box-shadow: 0px 0px 5px #888888;
}
.plus:after{
	content:url("https://www.schedulehead.com/wp-content/uploads/2015/04/plus.png");
	width: 22px;
	height: 21px;
}
.red-worker-count{
	color: #AC5862;
}
.green-worker-count{
	color: #3EB18B;
}

.minus:after{
	content:url("https://www.schedulehead.com/wp-content/uploads/2015/04/minus.png");
	width: 22px;
	height: 21px;
}
.plus:hover:after{
	content:url("https://www.schedulehead.com/wp-content/uploads/2015/04/plus_down.png");
	width: 22px;
	height: 21px;
}
.minus:hover:after{
	content:url("https://www.schedulehead.com/wp-content/uploads/2015/04/minus_down.png");
	width: 22px;
	height: 21px;
}
.ng-invalid.ng-dirty:not(.angular-no-validate) {
	border-color: #FA787E;
}
.ng-valid.ng-dirty:not(.angular-no-validate) {
	border-color: #78FA89;
}
select.ng-valid.ng-dirty {
	border-color: black;
}
.width-maxed{
	width: 100%;
}
.marginTop15{
	margin-top: 15%;
}
.button{
	float: left;
}
.button input{
	vertical-align:text-bottom;
}
.toolkit-button-div{
	position: relative;
	margin: 10px;
	float: left;
}
.toolkit-button{

	float: left;
	width: 300px;
	height: 225px;
	background:#9fd7e3;
	color: black;
	box-shadow: 3px 3px 6px #888888;
	text-align: center;
	line-height:110%;
	font-weight: lighter;
	font-family: 'jaf-bernino-sans';
	font-size: 170%;
	cursor: pointer;
	text-decoration: none;
}
.toolkit-button-dead{

	float: left;
	width: 300px;
	height: 225px;
	background:#d3d3d3;
	color: black;
	box-shadow: 3px 3px 6px #888888;
	text-align: center;
	line-height:110%;
	font-weight: lighter;
	font-family: 'jaf-bernino-sans';
	font-size: 170%;
	text-decoration: none;
}
.toolkit-button:hover{
	background-color: #fac17c;
	box-shadow: 0px 0px 5px #888888;
}
.toolkit-button-dead:hover{
	background-color: #6A6D6D;
	box-shadow: 0px 0px 5px #888888;
}
.emptyGrid, .emptyGridOld{
	min-height: 65px;
	cursor: pointer;
}
.emptyGrid{
	color: white;
}
.emptyGridOld{
	color: #ececec;
	background-color: #ececec;
}
.emptyGrid:hover, .emptyGridOld:hover {
	color: black;
	background-color: #D5FDD5;
}
div.md-subheader-inner{
	padding-bottom: 0 !important;
}
.btn {
	border-radius: 0 !important;
}
.gray-back{
	background:#e4e4e4;
}
.blue-back{
	background:#bddce9;
}
.green-hover:hover{
	background-color: #D5FDD5;
}

.gridViewLegend {
	width: 200px;
	float: left;
	margin-right: 20px;
	margin-top: 10px;
	padding: 10px 20px;
	border: solid 1px grey;
	font-size: 80%;
	text-align: center;
}
.locationCell {
	text-align: center;
	border: solid 1px grey;
	border-top: solid 1px grey;
	border-bottom: solid 1px grey;
}
.singleBased {
	background-color: #BDDCE9;
}
.timeOffRequestCell {
	background-color: #c2c2c2;
}
.recurringBased {
	background-color: #FFE9BC;
}
.gridBased {
	background-color: #8ebbcf;
	cursor: grabbing;
}
.innerViewCells{
	text-align: center;
	flex: 0 0 auto;
	border-bottom: solid 1px grey;
	cursor: pointer;
	text-overflow: ellipsis;
	height: 65px;
	overflow: hidden;
}
.singleBasedConflict{
	background: repeating-linear-gradient(
		45deg,
		rgba(189, 220, 233, 1),
		rgba(189, 220, 233, 1) 20px,
		rgba(255, 0, 0, 0.2) 20px,
		rgba(255, 0, 0, 0.2) 40px
	);
}
.timeOffRequestCellConflict {
	background: repeating-linear-gradient(
		45deg,
		rgba(216, 216, 216, 1),
		rgba(216, 216, 216, 1) 20px,
		rgba(255, 0, 0, 0.2) 20px,
		rgba(255, 0, 0, 0.2) 40px
	);
}
.recurringBasedConflict{
	background: repeating-linear-gradient(
		45deg,
		rgba(255, 233, 188, 1),
		rgba(255, 233, 188, 1) 20px,
		rgba(255, 0, 0, 0.2) 20px,
		rgba(255, 0, 0, 0.2) 40px
	);
}
.uncheckedInConflict{
	background: repeating-linear-gradient(
		45deg,
		rgba(255, 255, 255, 1),
		rgba(255, 255, 255, 1) 20px,
		rgba(255, 0, 0, 0.2) 20px,
		rgba(255, 0, 0, 0.2) 40px
	);
}
.checkedInConflict{
	background: repeating-linear-gradient(
		45deg,
		rgba(165, 213, 159, 1),
		rgba(165, 213, 159, 1) 20px,
		rgba(255, 0, 0, 0.2) 20px,
		rgba(255, 0, 0, 0.2) 40px
	);
}
.gridBasedConflict{
	background: repeating-linear-gradient(
		45deg,
		rgba(142, 187, 207, 1),
		rgba(142, 187, 207, 1) 20px,
		rgba(255, 0, 0, 0.2) 20px,
		rgba(255, 0, 0, 0.2) 40px
	);
}
.dayConflict{
	background: repeating-linear-gradient(
		45deg,
		rgba(0, 0, 0, 0),
		rgba(0, 0, 0, 0) 20px,
		rgba(255, 0, 0, 0.2) 20px,
		rgba(255, 0, 0, 0.2) 40px
	);
}
.rolloverHand{
	cursor:pointer;
	cursor:hand;
}
.grabbingHand{
	cursor:move !important;
}
.innerViewCells:hover {
	background: #D5FDD5 no-repeat fixed center;
}
#hour_slider{ /*Auto texting slider */
	height:5px;
}
#hour_slider .ui-slider-handle{ /*Auto texting slider */
	height: 0.8em;
	width: 0.8em;
}
#multipleShifts_slider{ /*multiple shifts in one day slider */
	height:5px;
}
#multipleShifts_slider .ui-slider-handle{ /*multiple shifts in one day slider */
	height: 0.8em;
	width: 0.8em;
}
#dayOfTheWeek_slider{ /*Auto texting slider */
	height:5px;
}
#dayOfTheWeek_slider .ui-slider-handle{ /*Auto texting slider */
	height: 0.8em;
	width: 0.8em;
}
#min_slider{ /*bailout slider */
	height:5px;
}
#min_slider .ui-slider-handle{ /*bailout slider */
	height: 0.8em;
	width: 0.8em;
}
#email_slider{ /*bailout */
	height:5px;
}
#email_slider .ui-slider-handle{ /*bailout slider */
	height: 0.8em;
	width: 0.8em;
}

#visibility_slider{ /*visibility slider */
	height:5px;
}
#visibility_slider .ui-slider-handle{ /*Visibility slider */
	height: 0.8em;
	width: 0.8em;
}

#webCheckin_slider{ /*visibility slider */
	height:5px;
}
#webCheckin_slider .ui-slider-handle{ /*Visibility slider */
	height: 0.8em;
	width: 0.8em;
}

#default{ /*Restore Default on Autosolicit config*/
	float:right;
}

.text_bg2{
	font-size: 15px;
	line-height: 110%;
	font-weight: lighter;
	font-family: 'jaf-bernino-sans';
}
.floater-left{
	float: left;
}

.smaller-text{
	font-size: large;
}
textarea{
	width:100%;
	height:60px;
}
/*These color classes are used primarily in the header declarations, but occasionally in our job-edit page*/
.red{ color: #E03347;}
.orange{ color:#E39831;}
.pink { color:#e23147;}
.black{ color:#000000; padding-bottom:10px; line-height: 25px;}
.grey{color:grey;}
.green{color:#2fbe2f;}
.blue{color:#bddce9;}
.tutorial-header{
	color:#000;
	padding-bottom:10px;
	padding-top:0px;
}
.content-area{ min-width: 500px; width:100%; border:1px solid #888888; background: #FFF}
.tutorial-style{
	padding:15px 2px 25px 25px;
	margin-top:10px;
	text-align:center;
	width:97%;
	float:left;
	background-color:#BDDCE9;
	text-align:left;
}
#logo{
	display: block;
	writing-mode: tb-rl;
	-webkit-transform: rotate(270deg);
	-moz-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	-o-transform: rotate(270deg);
	transform: rotate(270deg);
	font-family:'jaf-bernino-sans';
	font-size:42px; direction:LTR;
}

.selected { background-color: #999999; color:#FFF}
.selected a{ background-color: #999999; color:#FFF}
.pink-box{ background:#f6d5e0; border:1px solid #afa8aa; margin-top:20px; padding:10px 25px; line-height:21px; }
.green-box{ background:#c8f1c8; border:1px solid #afa8aa; margin-top:20px; padding:10px 25px; line-height:21px; }
.orange-box{ background:#FFE9BC; border:1px solid #afa8aa; margin-top:20px; padding:10px 25px; line-height:21px; }
.purple-box{ background:#DDD3EE; border:1px solid #afa8aa; margin-top:20px; padding:10px 25px; line-height:21px; }
.gray-box{ background:#ebeced; border:1px solid #afa8aa; margin-top:20px; padding:10px 25px; line-height:21px; display:block;}
.blue-box{ background:#bddce9; border:1px solid #afa8aa; margin-top:20px; padding:10px 25px; line-height:21px;}
.drop{ font-size:10px; word-spacing:1px; letter-spacing:0px; color: #4d4d4d}
.clear{ clear:both}
/*******************_Main - Part_********************************/
.main{
	width:1000px;
	margin:0px auto;
	padding-top:10px;
}
.logo{
	width:135px;
	margin:0px;
	float:right;
	text-align:right;
}
/************************_Middle - Contant - Part_**************************/
.middle_main{
	width:698px;
	margin:0px auto;
	padding:0px;
}
.middle_bg{
	width:635px;
	margin:0px auto;
	background-color:#ffffff;
}
.big-links ul {
    text-align: left;
	margin:0px;
	list-style:none;
	padding-left:10px;
    line-height: 40px;
}
.big-links ul li {
	margin-right:20px;
}
.big-links ul li a {
	font-size: 20px;
    color: #4fa4d7;
	margin:0px;
	padding:0px;
	font-family: 'jaf-bernino-sans';
	text-transform: none;
}
#big-links a:hover{
	text-decoration:none;
	color: #4fa4d7;
}
#alert{
    position: relative;
    padding: 10px 0px 10px 10px;
    background-color: #F4CBDB;
    border-style: solid;
    border-width: 1px;
}
#box_top_bg{
/*	background-image:url(../images/box_border_bg_top.jpg); */
	height:2px;
	margin:0px;
	background-repeat:repeat-x;
	background-position:center top;
}
#box_bottom_bg{
/*	background-image:url(../images/box_border_bg_bottom.jpg); */
	height:2px;
	margin:0px;
	background-repeat:repeat-x;
	background-position:center top;
}

#box_border_bg_left{
	width:2px;
/*	background-image:url(../images/box_border_bg_left.jpg); */
	background-repeat:repeat-y;
	background-position:left top;
	margin:0px;
}
#box_border_bg_right{
	width:2px;
/*	background-image:url(../images/box_border_bg_right.jpg); */
	background-repeat:repeat-y;
	background-position:right top;
	margin:0px;
}
.pink_box_font{
	background-color: #F4CBDB;
	color:#6e6a6c;
	font-size:16px;
	padding:5px 10px;
}
#alert-link{
  padding-top:8px;
  margin:0px;
  padding-left:20px;
  position:relative;
  bottom:7px;
}
#alert-link a{

  color:#ff2d2d;
  margin:0px;
  padding:0px;
}
#alert-link a:hover{
	text-decoration:none;
	color:#ff2d2d;
}

#shift-link{
  padding-top:8px;
  padding-left:20px;
  position:relative;
  bottom:7px;
}
#shift-link a{

  color:#4fa4d7;
  margin:0px;
  padding:0px;
}
#shift-link a:hover{
	text-decoration:none;
	color:#4fa4d7;
}

#shift-link2{
  padding-top:8px;
  padding-left:5px;
  position:relative;
  bottom:7px;
}
#shift-link2 a{

  color:#4fa4d7;
  margin:0px;
  padding:0px;
}
#shift-link2 a:hover{
	text-decoration:none;
	color:#4fa4d7;
}

.social_icon{
	float:right;
	padding-right:1px;
	padding-top:10px;
	padding-bottom:10px;
	margin:0px;
}

.box-box-blue
{
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #000;
	background:#9fd7e3;
	width:80%;
	padding:5px;

}


.box-box-green
{
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #000;
	background:#a5d59f;
	width:80%;
	padding:5px;

}


.box-box-red
{
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #000;
	background:#e3988d;
	width:80%;
	padding:5px;

}


.box-box-white
{
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #000;
	background:#fff;
	width:80%;
	padding:5px;
}


.box-box-orange
{
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #000;
	background:#fac17c;
	width:80%;
	padding:5px;

}

.box-box-grey
{
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #000;
	background:#d3d3d3;
	width:80%;
	padding:5px;

}

.box-box-grey-skillsets
{
	margin-left:5px;
	margin-bottom:5px;
	border-top:1px solid #878787;
	border-left:1px solid #878787;
	border-right:1px solid #878787;
	background:#d3d3d3;
	width:80%;
	padding:5px;

}

.box-box-blue-conflict
{
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #000;
	background: repeating-linear-gradient(
		45deg,
		rgba(159, 215, 227, 1),
		rgba(159, 215, 227, 1) 20px,
		rgba(255, 0, 0, 0.3) 20px,
		rgba(255, 0, 0, 0.3) 40px
	);
	width:80%;
	padding:5px;

}


.box-box-green-conflict
{
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #000;
	background: repeating-linear-gradient(
		45deg,
		rgba(165, 213, 159, 1),
		rgba(165, 213, 159, 1) 20px,
		rgba(255, 0, 0, 0.3) 20px,
		rgba(255, 0, 0, 0.3) 40px
	);
	width:80%;
	padding:5px;

}


.box-box-white-conflict
{
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #000;
	background: repeating-linear-gradient(
		45deg,
		rgba(255, 255, 255, 1),
		rgba(255, 255, 255, 1) 20px,
		rgba(255, 0, 0, 0.3) 20px,
		rgba(255, 0, 0, 0.3) 40px
	);
	width:80%;
	padding:5px;
}


.box-box-orange-conflict
{
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #000;
	background: repeating-linear-gradient(
		45deg,
		rgba(250, 193, 124, 1),
		rgba(250, 193, 124, 1) 20px,
		rgba(255, 0, 0, 0.3) 20px,
		rgba(255, 0, 0, 0.3) 40px
	);
	width:80%;
	padding:5px;

}

.box-box-grey-conflict
{
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #000;
	background:#d3d3d3;
	background: repeating-linear-gradient(
		45deg,
		rgba(165, 213, 159, 1),
		rgba(165, 213, 159, 1) 20px,
		rgba(255, 0, 0, 0.3) 20px,
		rgba(255, 0, 0, 0.3) 40px
	);
	width:80%;
	padding:5px;

}



/* Rollover effects for boxes */
.box-box-white:hover{
	background: #fac17c
}
.box-box-blue:hover{
	background: #fac17c
}
.box-box-grey:hover{
	background: #fac17c
}
.box-box-grey-skillsets:hover{
	background: white
}
.box-box-green:hover{
	background: #fac17c
}