/*
  Multi Step Forms

  CSS properties to customize the multi step forms functionality.
  The styling is restricted to the class 'multi-step-form' in order to
  isolate this styling from the rest of the Lifeway style.

  @author: ptoc/javen
  @date: 2018/05/16
*/

.multi-step-form [id$="_guide-item-container"] > [id$="_guide-item"] { display: none; }

.multi-step-form [id$="_guide-item-container"] > [id$="_guide-item"].active { display: block; }

.multi-step-form .guidetoolbar [id$="_guide-item"] { display: inline-block; }

.multi-step-form .guidetoolbar [id$="_guide-item"].hidden { display: none; }

.multi-step-form .hidden { display: none; }

.multi-step-form .toolbar { margin-bottom: 20px; text-align: right; }

.multi-step-form .wizard-navigators > li { border: 0; outline: 0; display: none; }

.multi-step-form .wizard-navigators > li { counter-increment: item; display: inline-block; border: solid 0 #000; -webkit-border-radius: 200px; border-radius: 200px; -webkit-border-bottom-left-radius: 0; border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; border-top-left-radius: 0; margin-right: 10px; position: relative; color: #666; background-color: #fff; }

.multi-step-form .wizard-navigators > li > a { color: inherit; display: table; padding: 0 0 0 36px; font-size: inherit; text-decoration: none; word-break: break-word; white-space: normal; }

.multi-step-form .wizard-navigators > li.stepped { background-color: #fff; }

.multi-step-form .wizard-navigators > li.completed { background-color: #fff; }

.multi-step-form .wizard-navigators > li.active { color: #0079c1; background-color: #fff; }

.multi-step-form .wizard-navigators > li.active .indicator { border-bottom-color: #0079c1; }

.multi-step-form #guideContainer-rootPanel___guide-item-nav-container { display: block !important; }

.multi-step-form [id*='toolbar-previtemnav___guide-item'] { float: left; }

.multi-step-form [id*='toolbar-previtemnav___widget']:before { content: '< '; display: inline-block; margin-right: 3px; }

.multi-step-form [id*='toolbar-nextitemnav___widget']:after { content: ' >'; display: inline-block; margin-left: 3px; }

.multi-step-form .toolbar .guideToolbarNode.toolbar { border-top: 1px solid #ddd; margin-top: 1rem; padding-top: 1rem; }

.multi-step-form .guideFieldError[role='alert'] { padding: .5rem 1rem; margin-bottom: 1rem; margin-top: -.5rem; border: 1px solid transparent; -webkit-border-radius: 3px; border-radius: 3px; background-color: #f2dede; border-color: #ebcccc; color: #c33f3d; }

.multi-step-form div.guideToolbarNode.toolbar .guidetoolbar:after { clear: both; content: ''; display: table; width: 100%; }

.multi-step-form .wizard-nav-arrow { display: none; }

.multi-step-form #guideContainer-rootPanel___guide-item-nav-container { display: block; }

.multi-step-form #guideContainer-rootPanel___layoutContainer > .col-md-12.clearfix > .guide-tab-scroller { display: none; }

.multi-step-form #guideContainer-rootPanel___layoutContainer > .col-md-12.clearfix > .guide-tab-scroller + .col-md-10.col-sm-10 { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; padding: 0; max-width: 100%; width: 100%; }

.multi-step-form #guideContainer-rootPanel___guide-item-nav-container { padding: 0; width: 100%; display: -webkit-box !important; display: -webkit-flex !important; display: -ms-flexbox !important; display: flex !important; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }

@media screen and (min-width: 480px) { .multi-step-form #guideContainer-rootPanel___guide-item-nav-container { width: 83%; } }

.multi-step-form #guideContainer-rootPanel___guide-item-nav-container li { margin-right: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 33%; width: 100%; }

.multi-step-form #guideContainer-rootPanel___guide-item-nav-container li[style*='width:31'] { -webkit-box-flex: 0; -webkit-flex: 0 0 33.333%; -ms-flex: 0 0 33.333%; flex: 0 0 33.333%; max-width: 33.333%; width: 33.333%; }

.multi-step-form #guideContainer-rootPanel___guide-item-nav-container li[style*='width:23'] { -webkit-box-flex: 0; -webkit-flex: 0 0 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; width: 25%; }

.multi-step-form #guideContainer-rootPanel___guide-item-nav-container li[style*='width:47'] { -webkit-box-flex: 0; -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; width: 50%; }

.multi-step-form #guideContainer-rootPanel___guide-item-nav-container li a { padding: 10px; background: #eee; color: #747474; width: 100%; text-align: center; }

.multi-step-form #guideContainer-rootPanel___guide-item-nav-container li.completed a { background: #4d91cc; color: #fff; }

.multi-step-form #guideContainer-rootPanel___guide-item-nav-container li.active a, .multi-step-form #guideContainer-rootPanel___guide-item-nav-container li.completed.active a { background: #0275d8; color: #fff; }

.guideFieldError{
color:#CC0000;
padding-bottom: 10px;
}