| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| .wizard { |
| display: block; |
| width: 100%; |
| overflow: hidden; } |
| .wizard a { |
| outline: 0; } |
| .wizard ul { |
| list-style: none !important; |
| padding: 0; |
| margin: 0; } |
| .wizard ul > li { |
| display: block; |
| padding: 0; } |
| .wizard > .steps { |
| position: relative; |
| display: block; |
| width: 100%; } |
| .wizard > .steps .current-info { |
| position: absolute; |
| left: -999em; } |
| .wizard > .steps > ul > li { |
| width: 25%; |
| float: left; } |
| .wizard > .steps a { |
| display: block; |
| width: auto; |
| margin: 0 0.5em 0.5em; |
| padding: 1em 1em; |
| text-decoration: none; |
| -webkit-border-radius: 5px; |
| -moz-border-radius: 5px; |
| border-radius: 5px; } |
| .wizard > .steps a:hover { |
| display: block; |
| width: auto; |
| margin: 0 0.5em 0.5em; |
| padding: 1em 1em; |
| text-decoration: none; |
| -webkit-border-radius: 5px; |
| -moz-border-radius: 5px; |
| border-radius: 5px; } |
| .wizard > .steps a:active { |
| display: block; |
| width: auto; |
| margin: 0 0.5em 0.5em; |
| padding: 1em 1em; |
| text-decoration: none; |
| -webkit-border-radius: 5px; |
| -moz-border-radius: 5px; |
| border-radius: 5px; } |
| .wizard > .steps .disabled a { |
| background: #fff; |
| color: #6c757d; |
| cursor: default; } |
| .wizard > .steps .disabled a:hover { |
| background: #fff; |
| color: #6c757d; |
| cursor: default; } |
| .wizard > .steps .disabled a:active { |
| background: #fff; |
| color: #6c757d; |
| cursor: default; } |
| .wizard > .steps .current a { |
| background: #007bff; |
| color: #fff; |
| cursor: default; } |
| .wizard > .steps .current a:hover { |
| background: #007bff; |
| color: #fff; |
| cursor: default; } |
| .wizard > .steps .current a:active { |
| background: #007bff; |
| color: #fff; |
| cursor: default; } |
| .wizard > .steps .done a { |
| background: #28a745; |
| color: #fff; } |
| .wizard > .steps .done a:hover { |
| background: #28a745; |
| color: #fff; } |
| .wizard > .steps .done a:active { |
| background: #28a745; |
| color: #fff; } |
| .wizard > .steps .error a { |
| background: #dc3545; |
| color: #fff; } |
| .wizard > .steps .error a:hover { |
| background: #dc3545; |
| color: #fff; } |
| .wizard > .steps .error a:active { |
| background: #dc3545; |
| color: #fff; } |
| .wizard > .content { |
| display: block; |
| margin: 0.5em; |
| min-height: 6rem; |
| overflow: hidden; |
| position: relative; |
| width: auto; |
| -webkit-border-radius: 5px; |
| -moz-border-radius: 5px; |
| border-radius: 5px; } |
| .wizard > .content > .title { |
| position: absolute; |
| left: -999em; } |
| .wizard > .content > .body { |
| float: left; |
| width: 100%; |
| height: 100%; |
| padding: 2.5%; } |
| .wizard > .content > .body ul { |
| list-style: disc !important; } |
| .wizard > .content > .body ul > li { |
| display: list-item; } |
| .wizard > .content > .body > iframe { |
| border: 0 none; |
| width: 100%; |
| height: 100%; } |
| .wizard > .content > .body input { |
| display: block; } |
| .wizard > .content > .body input[type="checkbox"] { |
| display: inline-block; } |
| .wizard > .content > .body input.error { |
| background: #fbe3e4; |
| border: 1px solid #fbc2c4; |
| color: #dc3545; } |
| .wizard > .content > .body label { |
| display: inline-block; |
| margin-bottom: 0.5em; } |
| .wizard > .content > .body label.error { |
| color: #dc3545; |
| display: inline-block; |
| margin-left: 1.5em; } |
| .wizard > .actions { |
| position: relative; |
| display: block; |
| text-align: right; |
| width: 100%; } |
| .wizard > .actions > ul { |
| display: inline-block; |
| text-align: right; } |
| .wizard > .actions > ul > li { |
| float: left; |
| margin: 0 0.5em; } |
| .wizard > .actions a { |
| background: #007bff; |
| color: #fff; |
| display: block; |
| padding: 0.5em 1em; |
| text-decoration: none; |
| -webkit-border-radius: 5px; |
| -moz-border-radius: 5px; |
| border-radius: 5px; } |
| .wizard > .actions a:hover { |
| background: #007bff; |
| color: #fff; |
| display: block; |
| padding: 0.5em 1em; |
| text-decoration: none; |
| -webkit-border-radius: 5px; |
| -moz-border-radius: 5px; |
| border-radius: 5px; } |
| .wizard > .actions a:active { |
| background: #007bff; |
| color: #fff; |
| display: block; |
| padding: 0.5em 1em; |
| text-decoration: none; |
| -webkit-border-radius: 5px; |
| -moz-border-radius: 5px; |
| border-radius: 5px; } |
| .wizard > .actions .disabled a { |
| background: #fff; |
| color: #6c757d; } |
| .wizard > .actions .disabled a:hover { |
| background: #fff; |
| color: #6c757d; } |
| .wizard > .actions .disabled a:active { |
| background: #fff; |
| color: #6c757d; } |
|
|
| .tabcontrol { |
| display: block; |
| width: 100%; |
| overflow: hidden; } |
| .tabcontrol a { |
| outline: 0; } |
| .tabcontrol ul { |
| list-style: none !important; |
| padding: 0; |
| margin: 0; } |
| .tabcontrol ul > li { |
| display: block; |
| padding: 0; } |
| .tabcontrol > .steps { |
| position: relative; |
| display: block; |
| width: 100%; } |
| .tabcontrol > .steps .current-info { |
| position: absolute; |
| left: -999em; } |
| .tabcontrol > .steps > ul { |
| position: relative; |
| margin: 6px 0 0 0; |
| top: 1px; |
| z-index: 1; } |
| .tabcontrol > .steps > ul > li { |
| float: left; |
| margin: 5px 2px 0 0; |
| padding: 1px; |
| -webkit-border-top-left-radius: 5px; |
| -webkit-border-top-right-radius: 5px; |
| -moz-border-radius-topleft: 5px; |
| -moz-border-radius-topright: 5px; |
| border-top-left-radius: 5px; |
| border-top-right-radius: 5px; } |
| .tabcontrol > .steps > ul > li:hover { |
| background: #edecec; |
| border: 1px solid #bbb; |
| padding: 0; } |
| .tabcontrol > .steps > ul > li > a { |
| color: #5f5f5f; |
| display: inline-block; |
| border: 0 none; |
| margin: 0; |
| padding: 10px 30px; |
| text-decoration: none; } |
| .tabcontrol > .steps > ul > li > a:hover { |
| text-decoration: none; } |
| .tabcontrol > .steps > ul > li.current { |
| background: #fff; |
| border: 1px solid #bbb; |
| border-bottom: 0 none; |
| padding: 0 0 1px 0; |
| margin-top: 0; } |
| .tabcontrol > .steps > ul > li.current > a { |
| padding: 15px 30px 10px 30px; } |
| .tabcontrol > .content { |
| position: relative; |
| display: inline-block; |
| width: 100%; |
| height: 35em; |
| overflow: hidden; |
| border-top: 1px solid #bbb; |
| padding-top: 20px; } |
| .tabcontrol > .content > .title { |
| position: absolute; |
| left: -999em; } |
| .tabcontrol > .content > .body { |
| float: left; |
| position: absolute; |
| width: 95%; |
| height: 95%; |
| padding: 2.5%; } |
| .tabcontrol > .content > .body ul { |
| list-style: disc !important; } |
| .tabcontrol > .content > .body ul > li { |
| display: list-item; } |
|
|
| .wizard.vertical > .steps { |
| display: inline; |
| float: left; |
| width: 30%; } |
| .wizard.vertical > .steps > ul > li { |
| float: none; |
| width: 100%; } |
|
|
| .wizard.vertical > .content { |
| display: inline; |
| float: left; |
| margin: 0 2.5% 0.5em 2.5%; |
| width: 65%; } |
|
|
| .wizard.vertical > .actions { |
| display: inline; |
| float: right; |
| margin: 0 2.5%; |
| width: 95%; } |
| .wizard.vertical > .actions > ul > li { |
| margin: 0 0 0 1em; } |
|
|