/* Wizard 2 */

.Wizard > .ProgressHorizontal {
  display: block;
}

.Wizard > .Progress {
  display: none;
}

.WizardLayout .SideCol {
  display: none;
}

.WizardLayout .MainCol {
  padding-left: 0;
}

.Wizard > .Screens:after,
.Wizard > .Buttons:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

.Wizard > .StatusBar {
  width: 100%;
  height: 23px;
  border: 1px solid gray;
}

.Wizard > .StatusBar > div {
  background-color: green;
  height: 23px;
  width: 0;
}

.Wizard > .StatusBar.VerticalBar > div {
  background-color: green;
  width: 100%;
  height: 0;
}

.Wizard > .Screens {
  /*overflow: hidden;*/
}

.Wizard > .Screens > div {
  display: none;
}

.Wizard > .Screens > div.Selected {
  display: block;
}

.Wizard > .Buttons {
  clear: both;
}

.WizardButtons.Buttons .k-button {
  margin-bottom: 10px;
}

.WizardButtons .WizardSpinnerWrapper {
  display: inline-block;
  vertical-align: top;
}

.WizardButtons .WizardSpinnerWrapper .SavingMessage {
  display: inline-block;
  margin-top: 9px;
  visibility: hidden;
}

.WizardButtons .WizardSpinnerWrapper #WizardButtonsSpinnerTarget:not(:empty) + .SavingMessage {/* spinner exists */
  -moz-animation: SiteShowButtonsSpinner 0s linear 320ms forwards;/* Firefox */
  -webkit-animation: SiteShowButtonsSpinner 0s linear 320ms forwards;/* Safari and Chrome */
  -o-animation: SiteShowButtonsSpinner 0s linear 320ms forwards;/* Opera */
  animation: SiteShowButtonsSpinner 0s linear 320ms forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

.WizardButtons.Buttons .WizardSpinnerWrapper .saveText,
.WizardButtons.Buttons .WizardSpinnerWrapper #saveText {
  margin-top: 9px;
  float: left;
}

.WizardButtons .WizardSpinnerWrapper #WizardButtonsSpinnerTarget:not(:empty) ~ .saveText,
.WizardButtons .WizardSpinnerWrapper #WizardButtonsSpinnerTarget:not(:empty) ~ #saveText {
  -moz-animation: WizardHideText 0s linear 320ms forwards;/* Firefox */
  -webkit-animation: WizardHideText 0s linear 320ms forwards;/* Safari and Chrome */
  -o-animation: WizardHideText 0s linear 320ms forwards;/* Opera */
  animation: WizardHideText 0s linear 320ms forwards;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@-webkit-keyframes WizardHideText {
  to {
    visibility: hidden;
    width: 0;
    height: 0;
    overflow: hidden;
    margin: 0;
  }
}
@keyframes WizardHideText {
  to {
    visibility: hidden;
    width: 0;
    height: 0;
    overflow: hidden;
    margin: 0;
  }
}

.WizardButtons.Buttons div.DisplayTd.TextRight {
  text-align: right;
}

.Wizard > .Buttons .Cancel {
  float: right;
}

.Wizard > .Progress {
  position: relative;
  margin: 12px 12px 50px 0;
  width: 200px;
}

.Wizard > .ProgressHorizontal {
  position: relative;
  margin:   40px 0 25px 0;
}

.Wizard > .ProgressHorizontal {
  width: 100% !important;
}

.Wizard > .Progress .Steps > div {
  position: relative;
  z-index: 10;
  width: 100%;
  height: 16px;
  color: #9b9b9b;
}

.Wizard > .ProgressHorizontal .Steps > div {
  position: absolute;
  z-index: 10;
  width: 25%;
  height: 16px;
  color: #9b9b9b;
}

.Wizard > .Progress .Steps > div span,
.Wizard > .Progress .Steps > div a {
	display: block;
	height: 16px;
	padding: 0 0 0 24px;
	background: transparent url("../../Media/Images/Step-Incomplete-Inactive.png") no-repeat left top;
	background-image: url("../../Media/Images/Step-Incomplete-Inactive.svg");
  background-size: 16px 16px;
	font-size: 1.4rem;
}

.Wizard > .ProgressHorizontal .Steps > div span,
.Wizard > .ProgressHorizontal .Steps > div a {
	display: block;
	height: 16px;
	padding: 24px 0 0 0;
	background: transparent url("../../Media/Images/Step-Incomplete-Inactive.png") no-repeat center top;
	background-image: url("../../Media/Images/Step-Incomplete-Inactive.svg"),none;
  background-size: 16px 16px;
	font-size: 1.4rem;
	text-align: center;
}

.Wizard > .Progress .Steps > div a,
.Wizard > .ProgressHorizontal .Steps > div a {
	text-decoration: none;
	background-image: url("../../Media/Images/Step-Complete-Inactive.png");
	background-image: url("../../Media/Images/Step-Complete-Inactive.svg"),none;
}

.Wizard > .Progress .Steps > div a:hover,
.Wizard > .ProgressHorizontal .Steps > div a:hover {
  text-decoration: underline;
}

.Wizard > .Progress .Steps > div.Active a,
.Wizard > .Progress .Steps > div.Active span,
.Wizard > .ProgressHorizontal .Steps > div.Active a,
.Wizard > .ProgressHorizontal .Steps > div.Active span {
	color: #555555;
	background-image: url("../../Media/Images/Step-Incomplete-Active.png");
	background-image: url("../../Media/Images/Step-Incomplete-Active.svg"),none;
}

.Wizard > .Progress > .Bar {
  position: absolute;
  top: 8px;
  bottom: -5px;
  left: 5px;
  z-index: 1;
  width: 6px;
  background-color: #E3E3E3;
}

.Wizard > .ProgressHorizontal > .Bar {
  position: absolute;
  top: 4px;
  left: 50%;
  z-index: 1;
  width: 75%;
  height: 6px;
  background-color: #E3E3E3;
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.Wizard > .ProgressHorizontal.StepCount3 > .Bar {
 
}

.Wizard > .Progress > .Bar > .Fill {
  width: 100%;
  background-color: #c3dbb9;
}

.Wizard > .ProgressHorizontal > .Bar > .Fill {
  width: 100%;
  height: 6px;
  background-color: #c3dbb9;
}

/* Step Counts (4) */
.Wizard > .Progress.StepCount4 {
  height: 166px;
}

.Wizard > .ProgressHorizontal.StepCount4 {
  height: 50px;
}

/*.Wizard > .Progress.StepCount4 > .Bar {
  height: 160px;
}*/

.Wizard > .Progress.StepCount4 > .Steps > div.Step1 {
  position: absolute;
  top: 0;
}

/*.Wizard > .ProgressHorizontal.StepCount4 > .Steps > div.Step1 {
  position: absolute;
  left: 0;
}*/

.Wizard > .Progress.StepCount4 > .Steps > div.Step2{
  position: absolute;
  top: 33%;
}

.Wizard > .ProgressHorizontal.StepCount4 > .Steps > div.Step2 {
  position: absolute;
  left: 25%;
}

.Wizard > .Progress.StepCount4 > .Steps > div.Step3 {
  position: absolute;
  top: 66%;
}
.Wizard > .ProgressHorizontal.StepCount4 > .Steps > div.Step3 {
  position: absolute;
  left: 50%;
}


.Wizard > .Progress.StepCount4 > .Steps > div.Step4 {
  position: absolute;
  top: 100%;
}

.Wizard > .ProgressHorizontal.StepCount4 > .Steps > div.Step4 {
  position: absolute;
  left: 75%;
}

/* Step Counts (3) */
.Wizard > .Progress.StepCount3 {
  height: 116px;
}

.Wizard > .ProgressHorizontal.StepCount3 {
  height: 50px;
}

/*.Wizard > .Progress.StepCount3 > .Bar {
  height: 110px;
}*/

.Wizard > .Progress.StepCount3 > .Steps > div.Step1, .Wizard > .ProgressHorizontal.StepCount3 > .Steps > div.Step1 {
  position: absolute;
  top: 0;
}

.Wizard > .Progress.StepCount3 > .Steps > div.Step2 {
  position: absolute;
  top: 50%;
}

.Wizard > .ProgressHorizontal.StepCount3 > .Steps > div.Step2 {
  position: absolute;
  left: 37%;
}

.Wizard > .Progress.StepCount3 > .Steps > div.Step3 {
  position: absolute;
  top: 100%;
}

.Wizard > .ProgressHorizontal.StepCount3 > .Steps > div.Step3 {
    position: absolute;
    left: 75%;
}

/* Step Counts (2) */
.Wizard > .Progress.StepCount2 {
  height: 66px;
}

.Wizard > .ProgressHorizontal.StepCount2 {
  height: 50px;
  margin-right: auto;
  margin-left: auto;
  max-width: 485px;
}

/*.Wizard > .Progress.StepCount2 > .Bar {
  height: 110px;
}*/

.Wizard > .Progress.StepCount2 > .Steps > div.Step1, .Wizard > .ProgressHorizontal.StepCount2 > .Steps > div.Step1 {
  position: absolute;
  top: 0;
}

.Wizard > .Progress.StepCount2 > .Steps > div.Step2 {
  position: absolute;
  top: 100%;
}

.Wizard > .ProgressHorizontal.StepCount2 > .Steps > div.Step2 {
  position: absolute;
  left: 75%;
}

.Wizard > .Screens,
.Wizard > .Buttons {
  margin-left: 220px;
}

/*.SpinnerActive*/

#WizardButtonsSpinnerTarget {
  position: relative;
  margin: 0 0 0 12px;
  display: inline-block;
  vertical-align: top;
  width: 35px;
  height: 35px;
  visibility: hidden; /* for animations */
}

#WizardButtonsSpinnerTarget:empty {
  display: none;
}

#WizardButtonsSpinnerTarget:not(:empty) {
  -moz-animation: SiteShowButtonsSpinner 0s linear 320ms forwards;/* Firefox */
  -webkit-animation: SiteShowButtonsSpinner 0s linear 320ms forwards;/* Safari and Chrome */
  -o-animation: SiteShowButtonsSpinner 0s linear 320ms forwards;/* Opera */
  animation: SiteShowButtonsSpinner 0s linear 320ms forwards;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

@media (min-width: 955px) {
  .Wizard > .ProgressHorizontal {
    display: none;
  }
  
  .Wizard > .Progress {
    display: block;
  }
  
  .WizardLayout .SideCol {
    display: table-cell;
  }
  
  .WizardLayout .MainCol {
    padding-left: 20px;
  }
}