﻿#wizardcontainer .jumbotron{
    background-color:#30a540;
    height:225px;
}
#wizardcontainer h2{
    color:white;
    text-transform:uppercase;
}
.wizardNavigation{
    width:100%;
}
.wizardNavigationItem{
    height:48px;
    font-size:18px;
    line-height:48px;    
    display:inline-block;
    position: relative;
    cursor:pointer;
}
.wizardNavigationItem div{
    width:100%;
    height:100%;
    position: relative;
    padding-left:36px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    background-color:#eee;
    color:#0066ad;
}
.wizardNavigationItem.first div{
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.wizardNavigationItem.last div{
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}
.wizardNavigationItem div:after{
    width: 0px;
    height: 0px;
    border-top: 24px inset transparent;
    border-bottom: 24px inset transparent;
    border-left: 24px solid #eee;
    position: absolute;
    content: "";
    top: 0;
    right: -24px;
    z-index: 2;
}
.wizardNavigationItem.active div{
    background-color:#0066ad;
    color:white;
    /*padding-left:16px;*/
}
.wizardNavigationItem.active div:after{
    width: 0px;
    height: 0px;
    border-top: 24px inset transparent;
    border-bottom: 24px inset transparent;
    border-left: 24px solid #0066ad;
    position: absolute;
    content: "";
    top: 0;
    right: -24px;
    z-index: 2;
}
.wizardNavigationItem.last div:after{
    width: 0px;
    height: 0px;
    position: absolute;
    content: "";
    top: 0;
    right: 0px;
    z-index: 2;
}
.wizardNavigationItem:not(:first-child) > div:before{

    width: 0px;
    height: 0px;
    border-top: 30px inset transparent;
    border-bottom: 30px inset transparent;
    border-left: 30px solid #30a540;
    position: absolute;
    content: "";
    top: -6px;
    left: 0;
}
.wizardBody{
    padding-left:15px;
    padding-right:15px;
    padding-bottom:15px;
    padding-top:5px;
    border:1px solid #ddd;
    border-radius:4px;   
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    position:relative;
    padding-bottom:90px;
    margin-bottom:30px;
}
.stepDesc{
    background-color:#0066ad;
    color:white;
    padding-top:3px;
    padding-bottom:3px;
    font-style:italic;
    font-size:smaller;
    position:absolute;
    left:0;
    right:0;
    padding-left:15px;
}
.stepDescInner{
    left:-15px;
    right:-15px;
    position:relative;
    margin-bottom:15px;
}
.wizardBody form{
    position:relative;
    top:30px;
}
.formrow{
    margin-bottom:5px;
    min-height:52px;
    position:relative;
}
.formLabel{
    line-height:34px;
    margin-bottom: 0px; 
}
.formerror{
    font-size:small;
    padding-left:20px;
    color:firebrick;
}
.wizardBody form .frmbutton, .frmbutton{
    width:130px;
    right:12px;    
}
.wizardBody form .frmbutton.btnlast, .frmbutton.btnlast{
    position:relative;
    float:right;
    right:15px;
}
.wizardBody form .frmbutton.btnfirst, .frmbutton.btnfirst{
    position:relative;
    float:left;
    left:15px;
}
label.error, span.error{
    padding-top:3px;
    position:absolute;
    font-size:small;
    color:firebrick;
    font-weight:bold
}
input.error:not([type=submit]):not([type=file]), .input-validation-error {
  color:firebrick;
  border-color:firebrick;
}
input.valid:not([type=submit]):not([type=file]) {
  color:forestgreen;
  border-color:forestgreen;
}
.req { 
    position:absolute;
    top:9px;
    right:20px;
}
@media (max-width: 1200px) {
    .wizardBody form{
        padding-bottom:35px;
    }
    .formLabel {
        padding-top:10px;
    }
    .btnrow{
        top:25px;
    }
    .formrow{
    margin-top:35px;
    }
    hr{
        opacity:0;
    }
    .stepDescInner{
    left:-15px;
    right:-15px;
    position:relative;
    margin-top:15px;
}

} 

