﻿/* Onboarding navigation styles */
#divProgressBar {
    width: 100%;
    padding-bottom: 5px;    
}

#onboardingNavigation {    
    width: 550px;
    margin: 20px auto;  
    text-align: center;  
    position: relative;
}

.navTitle {
    font-size: 10px;
    font-family: Arial;
    color: #898989;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

.navTitle .navText {
    float: left;
    font-weight: normal;
    margin: 0 -5px 0 10px;
    position: relative;
}

.navTitle .pageNumber {        
    margin: 0 0 0 15px;        
}

.navTitle .pageNumber span {
    display: none;
}

.navTitle .pageNumber a {
    color: #898989 !important;
}

.navTitle .pageNumber a:hover {
    color: #898989 !important;
    text-decoration: none;
    font-size: 11px;
    font-weight: bold;
}

.navTitle .pageNumberSelected a {
    display: none;
}

.navTitle .pageNumberSelected span {
    display: inline-block;
    font-weight: bold;
    font-size: 11px;
}

.pageNumber .navMark {
    border-left: 1px solid #c1c1c1;
    width: 1px;
    height: 5px;
    position: absolute;
    top: 14px;
    left: 50%;
}

.progressBarContainer {
    background: #f0f0f0;
    width: 445px;
    border-top: 1px solid #c8c8c8;
    border-left: 1px solid #d3d5d4;
    border-right: 1px solid #d3d5d4;
    border-radius: 15px;
    position: absolute;  
    top: 21px;
    left: 36px;
}

.progressBar {
    background: #41aac8; /* Old browsers */
    background: -moz-linear-gradient(top,  #41aac8 0%, #47b5d8 9%, #49b6d7 18%, #5ac7e8 73%, #5fcdee 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#41aac8), color-stop(9%,#47b5d8), color-stop(18%,#49b6d7), color-stop(73%,#5ac7e8), color-stop(100%,#5fcdee)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #41aac8 0%,#47b5d8 9%,#49b6d7 18%,#5ac7e8 73%,#5fcdee 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #41aac8 0%,#47b5d8 9%,#49b6d7 18%,#5ac7e8 73%,#5fcdee 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #41aac8 0%,#47b5d8 9%,#49b6d7 18%,#5ac7e8 73%,#5fcdee 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #41aac8 0%,#47b5d8 9%,#49b6d7 18%,#5ac7e8 73%,#5fcdee 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#41aac8', endColorstr='#5fcdee',GradientType=0 ); /* IE6-9 */
    height: 13px;
    width: 0;
    border-left: 1px solid #4ea2bc;    
    border-radius: 15px;      
}

.navProgressTitle {
    font-size: 15px;
    font-weight: bold;    
    padding-top: 40px;  
}

/********************************/

body {
    background-color: #F5F5F5;
    color: #909090;
}

.fixedWidth {
    width: 1000px !important;
    margin: auto;
}

.fixedWidth .navbar-brand {
    margin-left: -30px !important;
}

.fixedWidth .footerLeft {
    margin-left: 0 !important;
}

.fixedWidth .dropdown {
    margin-right: -16px;
}

.container #content {
    padding: 20px 0 40px !important;    
    margin-bottom: 0 !important;
}

#content > .row-fluid {
    border: 1px solid #383E4C;
    box-shadow: 2px 10px 10px 1px rgba(0, 0, 0, 0.2);
}

.box {
    float: none !important;
    margin: 0 auto !important;
    padding-bottom: 20px;
    box-shadow: none;
}

.formContainer {
    background: #ebebeb;
}

.box .box-content {    
    float: left;  
    width: 100%;  
}

.btn-primary {
    background: #cccacb; /* Old browsers */
    background: -moz-linear-gradient(top,  #cccacb 0%, #c9c7c8 15%, #bfbfbf 40%, #a9a9a9 90%, #a8a8a8 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cccacb), color-stop(15%,#c9c7c8), color-stop(40%,#bfbfbf), color-stop(90%,#a9a9a9), color-stop(100%,#a8a8a8)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #cccacb 0%,#c9c7c8 15%,#bfbfbf 40%,#a9a9a9 90%,#a8a8a8 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #cccacb 0%,#c9c7c8 15%,#bfbfbf 40%,#a9a9a9 90%,#a8a8a8 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #cccacb 0%,#c9c7c8 15%,#bfbfbf 40%,#a9a9a9 90%,#a8a8a8 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #cccacb 0%,#c9c7c8 15%,#bfbfbf 40%,#a9a9a9 90%,#a8a8a8 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccacb', endColorstr='#a8a8a8',GradientType=0 ); /* IE6-9 */
    border-bottom : 1px solid #676767;
    border-left: 1px solid #8b8b8b;
    border-right: 1px solid #8b8b8b;
    border-top: 1px solid #acacac;
}

.btn-primary:hover{
    background: #a8a8a8; /* Old browsers */
    background: -moz-linear-gradient(top,  #a8a8a8 0%, #a9a9a9 10%, #bfbfbf 60%, #c9c7c8 85%, #cccacb 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a8a8a8), color-stop(10%,#a9a9a9), color-stop(60%,#bfbfbf), color-stop(85%,#c9c7c8), color-stop(100%,#cccacb)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #a8a8a8 0%,#a9a9a9 10%,#bfbfbf 60%,#c9c7c8 85%,#cccacb 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #a8a8a8 0%,#a9a9a9 10%,#bfbfbf 60%,#c9c7c8 85%,#cccacb 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #a8a8a8 0%,#a9a9a9 10%,#bfbfbf 60%,#c9c7c8 85%,#cccacb 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #a8a8a8 0%,#a9a9a9 10%,#bfbfbf 60%,#c9c7c8 85%,#cccacb 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a8a8a8', endColorstr='#cccacb',GradientType=0 ); /* IE6-9 */
    border-bottom : 1px solid #676767;
    border-left: 1px solid #8b8b8b;
    border-right: 1px solid #8b8b8b;
    border-top: 1px solid #acacac;
}

#btnSave, #btnSubmit {
    float: right;
    margin: 0 50px 20px;
    background: #21bded; /* Old browsers */
    background: -moz-linear-gradient(top, #21bded 0%, #22bdeb 11%, #39c4ef 71%, #3ec6ec 89%, #41c6ef 93%, #42c5ef 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#21bded), color-stop(11%,#22bdeb), color-stop(71%,#39c4ef), color-stop(89%,#3ec6ec), color-stop(93%,#41c6ef), color-stop(100%,#42c5ef)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #21bded 0%,#22bdeb 11%,#39c4ef 71%,#3ec6ec 89%,#41c6ef 93%,#42c5ef 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #21bded 0%,#22bdeb 11%,#39c4ef 71%,#3ec6ec 89%,#41c6ef 93%,#42c5ef 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #21bded 0%,#22bdeb 11%,#39c4ef 71%,#3ec6ec 89%,#41c6ef 93%,#42c5ef 100%); /* IE10+ */
    background: linear-gradient(to bottom, #21bded 0%,#22bdeb 11%,#39c4ef 71%,#3ec6ec 89%,#41c6ef 93%,#42c5ef 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#21bded', endColorstr='#42c5ef',GradientType=0 ); /* IE6-9 */
    border: 1px solid #c2c7cd;
}

#btnSave, #btnSubmit:hover{
    background: #42c5ef; /* Old browsers */
    background: -moz-linear-gradient(top,  #42c5ef 0%, #41c6ef 7%, #3ec6ec 11%, #39c4ef 29%, #22bdeb 89%, #21bded 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#42c5ef), color-stop(7%,#41c6ef), color-stop(11%,#3ec6ec), color-stop(29%,#39c4ef), color-stop(89%,#22bdeb), color-stop(100%,#21bded)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #42c5ef 0%,#41c6ef 7%,#3ec6ec 11%,#39c4ef 29%,#22bdeb 89%,#21bded 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #42c5ef 0%,#41c6ef 7%,#3ec6ec 11%,#39c4ef 29%,#22bdeb 89%,#21bded 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #42c5ef 0%,#41c6ef 7%,#3ec6ec 11%,#39c4ef 29%,#22bdeb 89%,#21bded 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #42c5ef 0%,#41c6ef 7%,#3ec6ec 11%,#39c4ef 29%,#22bdeb 89%,#21bded 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#42c5ef', endColorstr='#21bded',GradientType=0 ); /* IE6-9 */
}



.onboarding-btn {
    
	background-color:#734d76;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	font-style:normal;
	height:30px;
	line-height:30px;
	width:200px;
	text-align:center;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.onboarding-btn:hover {
	background-color:#770474;
    cursor: pointer;
}

.onboarding-btn:active {
	position:relative;
	top:1px;
}

.clearer {
    clear: both;
}

.span
{
    display: block;
    width: 100px;
    word-wrap: break-word;
}


.parsley-error {
    -webkit-box-shadow: 0 0 6px #f8b9b7 !important;
    -moz-box-shadow: 0 0 6px #f8b9b7 !important;
    box-shadow: 0 0 6px #f8b9b7 !important;
}

.formTitle {
    text-align: left; 
    font-size: 21px;
    line-height: 21px;
    font-weight: 700;
    color: #1d9e8b;
}

.locationLabel, .teamNameLabel, .jobPositionNameLabel {
    text-align: center;
    font-size: 32px;
    color: #909090;
}

.onboarding-table > thead {
    background:  #1d9e8b;
    color: white;
}

.unused {
    color: #ccc;
    cursor: default;
}

.warningContainer {
    margin-top: 40px !important;
    text-align: center;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    padding: 5px !important;
    margin-bottom: 0px !important;
}

.popover-title {
    background:  #1d9e8b;
    color: white;
    overflow: hidden;
}

.popoverTitle {
    float: left;
    width: 90%;
}

.popoverIconContainer {
    float: left;
    width: 10%;
    padding-top: 3px;
}

.popoverClose {
    float: right;
    cursor: pointer;
}

.modal-title {
    color: #1D9E8B;
    font-size: 22px;
    font-weight: bold;
}

#divDescription {
    width: 100%;
}

#onboardingTitle {
    text-align: center;
}

#onboardingPageDescription {
    text-align: center;
    font-size: 16px;
    margin-top: 17px;
    width: 73%;
    margin-left: auto;
    margin-right: auto;
}

#content {
    height: auto;
}

.well {
    border: 1px solid #ddd;
    border-radius: 10px;
    background-color: #f9f9f9;
}

.modal-body {
    font-size: 16px;
    font-weight: normal;
}

.modal-footer {
    margin-top: 0px;
}

.panelHeader {
    padding-bottom: 16px;
    border-bottom: 1px solid #DEDEDE;
    margin-bottom: 10px;
}

.panelTitle {
    margin-bottom: 0px;
    font-weight: bold;
    font-style: italic;
}

.panelDescription {
    font-size: 13px;
    font-style: italic;
    margin-bottom: 0px;
    margin-top: 5px;
}

.btn {
    border-radius: 6px;
}

input[type=text] {
   border-radius: 5px;
}

.tableWrapper table {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.tableWrapper {
    border: 1px solid #ddd;
    border-radius: 6px;
    overflow: hidden;
    padding: 0px;
}

.onboarding-table {
    border-style: hidden;
}

.userName label {
    font-weight: bold;
}

.ui-multiselect-menu label {
    font-weight: normal;
}