.applicationFormBanner{
	display:block;
	position:relative;
	background-color:#63b3c2;
	width:100%;
	overflow: hidden;
	color: #fff;
	margin: 0 0 20px 0;
}

.applicationFormBanner .title{
	font-size: 130%;
}

.applicationFormBanner p{
	padding: 0;
	margin: 0;
}

.leftCol{
	display:block;
	position: relative;
	text-align:left;
	width:48%;
	float: left;
	margin: 0;
	padding: 0;
}

.rightCol{
	position: relative;
	text-align:left;
	margin:0 0 0 52%;
	width: 48%;
	padding: 0;
}

.userIdDetails{
	background: transparent url(img/icons/80/userApplication_complete_80.png) 20px 25px no-repeat;
	background: transparent url(img/icons/40/userApplication_complete_40.png) 20px 25px no-repeat;
	background-size: 40px 40px;
	padding: 25px 35px 45px 80px;
}

.applicationProgressDetails{
	background-size: 40px 40px;
	padding: 25px 35px 45px 80px;
}

.applicationProgressDetails strong{
	font-size: 116%;
}

.applicationProgressDetails.notComplete{
	background: transparent url(img/icons/80/userApplication_notComplete_80.png) 20px 25px no-repeat;
}

.applicationProgressDetails.complete{
	background: transparent url(img/icons/80/userApplication_complete_80.png) 20px 25px no-repeat;
}
/*
.applicationFormBanner .applicationDateDetails .applicationDate{
	font-weight:bold;
}

.applicationFormBanner .applicationDateDetails .applicationSubmitByDate{
	font-size:18px;
	color:#F00;
	font-weight:bold;
}
*/

.applicationFormBanner .userIdDetails .userId{
	font-size: 116%;
}

.applicationDateDetails{
	display: block;
	position: relative;
	margin: 10px 0;
	padding: 0 50px 0 60px;
	width: 48%;
	background: transparent url(img/icons/80/calendar_80.png) 10px 0 no-repeat;	
	background-size: 40px 40px;
	overflow: hidden;
	clear: both;
}

.applicationDateDetails p{
	padding: 0;
	margin: 0;
	line-heignt: 100%;	
}

.applicationDateDetails .title{
	font-weight: normal;
	font-size: 120%;	
}

.applicationDateDetails .leftCol,
.applicationDateDetails .rightCol{
	color: #999;
}

.introPageInsrtuctions{
	padding: 5px 10px 5px 10px;
	display:block;
	position:relative;
	border: 1px solid #ccc;
	border-radius: 6px;
	height:auto;
	margin: 10px auto;
}

.applicationInstructions{
	padding: 5px 10px 5px 10px;
	display:block;
	border: 1px solid #ccc;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	
	height:50px;
	overflow:hidden;
	margin: 10px auto;
}
.readmore{
	padding: 5px 10px 5px 10px;
	display:block;
	border-bottom: 1px solid #ccc;
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	text-align:center;
	width:645px;
	height:auto;
	overflow:hidden;
	margin: 0 auto;
}

.submitApplicationInstructions {
	display:block;
	height:auto;
}
.submitApplicationInstructions .stepsWarningText {
	font-size:14px;
	color:#F00;
	font-weight:bold;
}

.submitApplicationConfirmation{
	padding: 5px 10px 5px 10px;
	display:block;
	border: 1px solid #ccc;
	border-radius: 6px;
	
	overflow:hidden;
}

ul#applicationTabs{
	display: block;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden;
}

ul#applicationTabs li{
	display: block;
	overflow: hidden;
	float: left;
	margin: 0 2px 0 0 !important;
	padding: 0;
	background: #d8d8d8;
}

ul#applicationTabs li.inProgress{
	background: #e89d07;
}

ul#applicationTabs li.complete{
	background: #37bc00;
}

ul#applicationTabs li.active.inProgress,
ul#applicationTabs li.active.complete,
ul#applicationTabs li.active{
	background: #575866;
	border-bottom: 2px solid #575866;
}

ul#applicationTabs li a{
	display: block;
	padding: 18px 16px 18px 48px;
	padding: 18px 16px 18px 48px;
	text-decoration: none;
	color: #333;
	font-weight: bold;
	font-size: 120%;
	background-size: 28px 28px; 
	background-position: 16px 50% ;
	background-repeat: no-repeat;
	background-color: transparent;
}

ul#applicationTabs li.inProgress a,
ul#applicationTabs li.complete a,
ul#applicationTabs li.active a{
	color: #fff;	
}

ul#applicationTabs li .location,
ul#applicationTabs li.incomplete .location{	
	background-image: url(img/icons/48/application_location_notStarted_48.png);
	background-image: url(img/icons/24/application_location_notStarted_24.png)\9;
}

ul#applicationTabs li .experience,
ul#applicationTabs li.incomplete .experience{	
	background-image: url(img/icons/48/application_experience_notStarted_48.png);
	background-image: url(img/icons/24/application_experience_notStarted_24.png)\9;

}

ul#applicationTabs li .application,
ul#applicationTabs li.incomplete .application{	
	background-image: url(img/icons/48/application_candidate_notStarted_48.png);
	background-image: url(img/icons/24/application_candidate_notStarted_24.png)\9;

	
}

ul#applicationTabs li .availability,
ul#applicationTabs li.incomplete .availability{	
	background-image: url(img/icons/48/application_hours_notStarted_48.png);
	background-image: url(img/icons/24/application_hours_notStarted_24.png)\9;

}

ul#applicationTabs li .screening,
ul#applicationTabs li.incomplete .screening{	
	background-image: url(img/icons/48/application_quiz_notStarted_48.png);
	background-image: url(img/icons/24/application_quiz_notStarted_24.png)\9;

}

ul#applicationTabs li .submitApplication,
ul#applicationTabs li.incomplete .submitApplication{	
	background-image: url(img/icons/48/application_submit_notStarted_48.png);
	background-image: url(img/icons/24/application_submit_notStarted_24.png)\9;

}

/*active - not started*/
ul#applicationTabs li.active.incomplete .location{	
	background-image: url(img/icons/48/application_location_notStarted_active_48.png);
	background-image: url(img/icons/24/application_location_notStarted_active_24.png)\9;

}

ul#applicationTabs li.active.incomplete .experience{	
	background-image: url(img/icons/48/application_experience_notStarted_active_48.png);
	background-image: url(img/icons/24/application_experience_notStarted_active_24.png)\9;

}

ul#applicationTabs li.active.incomplete .application{	
	background-image: url(img/icons/48/application_candidate_notStarted_active_48.png);
	background-image: url(img/icons/24/application_candidate_notStarted_active_24.png)\9;

}

ul#applicationTabs li.active.incomplete .availability{	
	background-image: url(img/icons/48/application_hours_notStarted_active_48.png);
	background-image: url(img/icons/24/application_hours_notStarted_active_24.png)\9;

}

ul#applicationTabs li.active.incomplete .screening{	
	background-image: url(img/icons/48/application_quiz_notStarted_active_48.png);
	background-image: url(img/icons/24/application_quiz_notStarted_active_24.png)\9;

}

ul#applicationTabs li.active.incomplete .submitApplication{	
	background-image: url(img/icons/48/application_submit_notStarted_active_48.png);
	background-image: url(img/icons/24/application_submit_notStarted_active_24.png)\9;

}


/*in progress*/
ul#applicationTabs li.inProgress .location{	
	background-image: url(img/icons/48/application_location_inProgress_48.png);
	background-image: url(img/icons/24/application_location_inProgress_24.png)\9;

}

ul#applicationTabs li.inProgress .experience{	
	background-image: url(img/icons/48/application_experience_inProgress_48.png);
	background-image: url(img/icons/24/application_experience_inProgress_24.png)\9;

}


ul#applicationTabs li.inProgress .application{
	background-image: url(img/icons/48/application_candidate_inProgress_48.png);
	background-image: url(img/icons/24/application_candidate_inProgress_24.png)\9;

}

ul#applicationTabs li.inProgress .availability{
	background-image: url(img/icons/48/application_hours_inProgress_48.png);
	background-image: url(img/icons/24/application_hours_inProgress_24.png)\9;

}

ul#applicationTabs li.inProgress .screening{
	background-image: url(img/icons/48/application_quiz_inProgress_48.png);
	background-image: url(img/icons/24/application_quiz_inProgress_24.png)\9;

}

ul#applicationTabs li.inProgress .submitApplication{
	background-image: url(img/icons/48/application_submit_inProgress_48.png);
	background-image: url(img/icons/24/application_submit_inProgress_24.png)\9;

}
/*complete*/

ul#applicationTabs li.complete .location{	
	background-image: url(img/icons/48/application_location_complete_48.png);
	background-image: url(img/icons/24/application_location_complete_24.png)\9;

}

ul#applicationTabs li.complete .experience{	
	background-image: url(img/icons/48/application_experience_complete_48.png);
	background-image: url(img/icons/24/application_experience_complete_24.png)\9;

}

ul#applicationTabs li.complete .application{
	background-image: url(img/icons/48/application_candidate_complete_48.png);
	background-image: url(img/icons/24/application_candidate_complete_24.png)\9;

}

ul#applicationTabs li.complete .availability{
	background-image: url(img/icons/48/application_hours_complete_48.png);
	background-image: url(img/icons/24/application_hours_complete_24.png)\9;

}

ul#applicationTabs li.complete .screening{
	background-image: url(img/icons/48/application_quiz_complete_48.png);
	background-image: url(img/icons/24/application_quiz_complete_24.png)\9;

}

ul#applicationTabs li.complete .submitApplication{
	background-image: url(img/icons/48/application_submit_complete_48.png);
	background-image: url(img/icons/24/application_submit_complete_24.png)\9;

}

.stepTitle{
	display: block;
	position: relative;
	margin: 0;
	padding: 12px 15px 12px 24px ;
	color: #adadb1 !important;
	background: #575866;
}

.stepTitle h3{
	color: #fff;
	margin: 0;
	padding: 0;
	line-height: 100%;
	font-weight: normal !important;
	font-size: 100%;
}

.stepContent{
	display: block;
	position: relative;
	margin: 0;
	padding: 12px 15px 12px 24px ;
	overflow: hidden;
}


/*location picker*/
.dataPicker{
	display: block;
	margin: 0;
	padding: 8px 12px;
	border: 1px dashed #ccc;
	border-radius: 3px;
}

.dataPicker .container{
	display: block;
	position: relative;
	width: 100%;
	clear: both;
	overflow: hidden;
	margin: 0;
	padding: 0;
}

.dataPicker .container p{
	text-align: center;
	color: #999;
	padding: 0;
	margin: 0;
}

ul.selectedDataList{
	display: block;
	position: relative;
	float: left;
	margin: 3px 6px 3px 0 !important;
	padding: 0 !important;
	overflow: hidden;
}
ul.selectedDataList li{
	display: block;
	position: relative;
	list-style-type: none;
	float: left;
	background: #d8d8d8;
	color: #333;
	padding: 4px 10px !important;
	margin: 0 1px 0 0 !important;
	overflow: hidden;
}

ul.selectedDataList li:first-child{
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}

ul.selectedDataList li:last-child{
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
}

ul.selectedDataList a{
	text-decoration: none;
	color: inherit !important;
	font-weight: bold;
}

/*availability picker*/
.formCrtl{
	display: block;
	position: relative;
	overflow: hidden;
	padding: 6px 15px;
	clear: both;
	margin: 0;
}

.formCrtl:last-child{
	margin-bottom: 40px;	
}


.formCrtl .ctrlHolder{
	display: block;
	position: relative;
	overflow: hidden;
	padding: 8px 0;
}

.formCrtl label{
	width: 30%;
	padding: 0 0 0 10px;
	float: left;
	color: #666 !important;	
}

.formCrtl label.mandatory:before{
	position: absolute;
	content: "*";
	color: #f00;
	left: 0;
}
.formCrtl select{ 
	min-width: 130px;
	padding: 2px 3px;
	background: #f6f6f6;
	border: 1px solid #999;
	z-index: 100;
}
.colLayout{
	display: block;
	position: relative;
	overflow: hidden;
	padding: 0;
	margin: 20px 0 10px 0;
}
.colLayout li{
	display: block;
	float: left;
	position: relative;
	overflow: hidden;
	padding: 0;
	margin: 0;
	list-style-type: none;
}


.colLayout li.col1{
	width: 32%;
	padding: 0 0 0 14px;
}
.weekdayTitle {
	text-transform: capitalize;
	font-weight: bold;

}
/*experiences*/
div.preferenceScaleMeter {
	position: relative;
	border : 0;
	padding: 10px 0;
	width : 32px;
	background-image: -webkit-linear-gradient(top,#2EF057,#935E26,#F30015);
	background-image: -moz-linear-gradient(top,#2EF057,#935E26,#F30015);
	background-image: -ms-linear-gradient(top,#2EF057,#935E26,#F30015);
	background-image: -o-linear-gradient(top,#2EF057,#935E26,#F30015);
	background-image: linear-gradient(top,#2EF057,#935E26,#F30015);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2ef057', endColorstr='#f30015',GradientType=0 );
	float:left;
	overflow: hidden;
	border-radius: 16px;
}

div.preferenceScaleMeter:before{
	position: absolute;
	height: 24px;
	width: 100%;
	top:4px;
	left:0;
	background: transparent url(img/icons/48/face_happy_48.png) no-repeat 50% 0;
	background: transparent url(img/icons/24/face_happy_24.png) no-repeat 50% 0 \9;
	background-size: 24px;	
	content:""
}

div.preferenceScaleMeter:after{
	position: absolute;
	height: 24px;
	width: 100%;		
	left:0;
	bottom: 4px;
	background: transparent url(img/icons/48/face_sad_48.png) no-repeat 50% 0;	
	background: transparent url(img/icons/24/face_sad_24.png) no-repeat 50% 0 \9;	
	background-size: 24px;	
	content:""
}
	
.sortDragTable{
	margin-top: 5px; 
	width:80%; 
	margin-left:50px;
}

.sortDragTable tr td:first-child{
	width: 20px;	
}

.dragPanel {  
	display: block;
	background: #F2F2F2 url(img/icons/26/reorder_27.png) 12px 50% no-repeat; 
	cursor: pointer;
	color: #666;
	overflow: hidden;
	border: 1px solid #999;
	border-radius: 6px;
	padding: 8px 12px 8px 50px;
}

/* APPLICATION STATUS */
.appProgressPanel{
	display: block;
	position: relative;
	overflow: hidden;
	width: 99%;
	margin: 0 0 12px 0;
	clear: right;
	padding: 0;
}
.appProgressPanel .appIcon{
	position: absolute;
	top: 40px;
	left: 0;
	display: block;
	width: 40px;
	height: 40px;
	background-color: #0C0;
	background-position: 50% 50%;
	border-radius: 20px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	z-index: 1000;
}

.appLayout{
	display: block;
	position: relative;
	overflow: hidden;
	border: 3px solid #0C0;
	margin: 0 0 0 20px;
	padding: 12px 16px 6px 32px;
	z-index: 100;
}

.appProgressPanel .leftCol{
	display: block;
	float: left;
	width: 48%;
	margin: -12px -16px -6px -32px;	
	padding: 12px 16px 6px 32px;
	background: #fff;
}

.appProgressPanel .rightCol{
	margin: 0 0 0 calc(50% + 16px);
	padding: 0;
	width: 48%;
}

.appLayout h3{
	margin: 0;
	padding: 0;
	line-height: 160%;
	font-size: 130%;
	text-transform: none !important;
}

.appLayout h4{
	margin: 0;
	padding: 0;
	line-height: 160%;
	font-size: 120%;
	text-transform: none !important;
	font-weight: normal;
}

.actionsPanelList{
	display: block;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden;
}

.actionsPanelList li.jobApplicationLocationActions,
.actionsPanelList li.jobApplicationLocationTransitionDetails{
	display: block;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

.appLayout ul.applicationActionsList{
	display: block;
	overflow: hidden;
	margin: 0 !important;
	padding: 0 !important;
}

.appLayout ul.applicationActionsList li{
	display: block;
	margin: 4px 0 !important;
	padding: 0 0 0 30px !important;
	background: url(img/icons/48/arrow_48.png) 10px 50% no-repeat !important;
	background: url(img/icons/12/arrow_12.png) 10px 50% no-repeat\9 !important;
	background-size: 12px 12px !important;
	list-style-type: none;
}


.jobApplicationLocationStatusForm {
	display: block;
	padding: 0 !important;
	margin:  0 !important;
}

.availabilityCustomTable{
	display: block;
	padding: 0;
	border-collapse: collapse;
	margin: 0;
}
.availabilityCustomTable td select{
	width: 80px !important;
	margin: 0 !important;
}

.hiringAreaLegendContainer{
	display: none;
	clear: both;
	position: relative;
}


.hiringAreaLegendContainer.visible{
	display: block;
}
.hiringAreaLegend{
	width: 100%;
	padding: 5px;
	padding-bottom:10px; 
	font-size:0.8em;
}

.selectionTestPagination{
	display: block;
	padding: 0;
	margin: 0;
	line-height: 130%;
	font-weight: normal;
	overflow: hidden;
	color: #999;
}

.selectionTestQuestion{
	display: block;
	padding: 0;
	margin: 0 0 10px 0;
	overflow: hidden;
}


input[type="radio"] + label.selectQuizOption{
	display: block ;
	padding: 4px 6px;
	overflow: hidden;
	margin: 0  !important;
	padding: 16px 24px 16px 38px !important;
	background-position: 10px 16px !important;
	border-bottom: 1px solid #E1F4F8;
	
}
.selectQuizOption:hover,
input[type="radio"]:checked + label.selectQuizOption{
	background-color: #E1F4F8 !important;
}

#jobApplicationControlPanel{
	overflow: hidden;
	#f00;
}

.applicationStats{
	position: relative;
	margin: 0;
	display:block;
	background-color: #EFEBEF;
	padding: 8px 12px;
}

.applicationStats .leftCol{
	width: 63%;
}

.applicationStats .leftCol .content{
	padding: 4px 6px;
	text-align: center;
}

.applicationStats .rightCol{
	margin-left: 65%;
	width: 35%;
	background: #fff;
}

.applicationStats .rightCol .content{
	padding: 12px 15px;
	text-align: center;
}

.statsTitle{
	font-size: 130%;
	font-weight:bold;
	line-height: 130%;
}

.statsBold{
	font-size: 110%;
	font-weight:bold;
}

.statsNormal{
	font-size: 110%;
	font-weight: normal;
}