/*
14 Other Small pages page
-----------------------
- Single post
-coming soon
-video banner home
-department 
-oppoitment 
-----------------------*/

.single-pst-content {
    position: relative;
    display: block;
    margin: 20px 0 40px;
    overflow: hidden;
    h2 {
        font-weight: 300;
        margin-top: 0;
    }
}

.st-error-wrap {
    min-height: 300px;
    width: 100%;
    display: block;
    padding: 20px 20px;
    text-align: center;
    overflow: hidden;
    position: relative;
    h2.error-big-text {
        font-size: 90px;
        transition: all 0.6s ease-in-out 0s;
        margin-bottom: 25px;
    }
    .error-link {
        width: 65px;
        height: 65px;
        border-radius: 100%;
        background: $theme-color;
        color: $white-color;
        overflow: hidden;
        padding: 10px;
        margin: 34px 0 50px;
        display: inline-block;
        text-align: center;
        line-height: 22px;
    }
    .error-sm-text {
        font-size: 40px;
    }
}

.coming-soon-overlay {
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    position: fixed;
    content: "";
    background: rgba($theme-color, 0.5);
    z-index: 0;
}

.coming-soon-body {
    display: block;
    overflow: hidden;
    position: relative;
    z-index: 111;
    .coming-soon-content-wrap {
        position: relative;
        display: block;
        margin-top: 60px;
        .left-img {
            width: 260px;
            height: 360px;
            float: left;
            @include box-sizing (border-box);
            padding-right: 20px;
            img {
                max-width: 100%;
            }
        }
        .right-content {
            @include calc(width, '100% - 260px');
            float: left;
            min-height: 80px;
            padding-left: 30px;
            @include box-sizing (border-box);
            background: rgba($white-color, 1.0);
            h2 {
                text-transform: uppercase;
                font-weight: bold;
                margin-bottom: 25px;
                font-size: 50px;
                margin-top: 0;
            }
            .logo {
                h1 {
                    font-weight: 100;
                    font-size: 30px;
                    span {
                        color: $theme-color;
                        font-weight: bold;
                    }
                }
            }
            .defaultCountdown {
                max-width: 300px;
                height: auto;
                overflow: hidden;
                margin-bottom: 30px;
                border: none;
                background: transparent;
                .countdown-section {
                    .countdown-amount {
                        border: 1px solid darken($theme-color, 20%);
                        width: 60px;
                        padding: 10px 0;
                        height: auto;
                        display: inline-block;
                        margin-bottom: 5px;
                    }
                }
            }
        }
    }
}


/*video banner css */

.video-bannerwrap {
    position: relative;
    display: block;
    clear: both;
    overflow: hidden;
    height: 550px;
    text-align: center;
    .hc-overlay {
        background: rgba($black-color, 0.8);
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        color: "";
        text-indent: -9999px;
    }
    .banner-center {
        max-width: 550px;
        margin: 0px auto auto;
        width: 100%;
        padding: 15px;
        display: block;
        color: $white-color;
        z-index: 111;
        display: inline-block;
        margin-top: 80px;
        h2 {
            font-weight: 100;
            line-height: 40px;
        }
    }
}


/*Our Department*/

.our-department-wrap {
    position: relative;
    padding: 50px 0;
    display: block;
    .department-block {
        position: relative;
        padding: 40px;
        display: block;
        min-height: 200px;
        border: 1px solid darken($dimline-color, 10%);
        margin: 30px 0 0;
        text-align: center;
        h3 {
            position: relative;
            font-weight: 100;
            span {
                position: relative;
                &:after {
                    width: 35px;
                    height: 2px;
                    background: $theme-color;
                    position: absolute;
                    content: "";
                    bottom: -5px;
                    left: 0;
                    right: 0;
                    margin: auto;
                }
            }
        }
        p {
            font-weight: 300;
            color: $footer-text;
        }
    }
}


/*Appointment section*/

.appointment-wrap {
    padding: 35px 0;
    min-height: 450px;
    /*background: lighten($dimline-color, 3%);*/
    position: relative;
    .emergency-content {
        position: relative;
        h3 {
            color: $theme-color;
            font-weight: bold;
            span {
                border-bottom: 1px solid $red-color;
                display: inline-block;
                line-height: 40px;
            }
        }
    }
    .appointment-form {
        .form-group {
            overflow: hidden;
        }
        .require {
            color: $red-color;
            font-weight: 100;
            font-size: 11px;
        }
        .form-control {
            @include border-radius(0px);
            background: transparent;
            padding: 8px 12px;
            height: 40px;
            line-height: 40px;
        }
        .form-row {
            @include clearfix();
            display: block;
            .one-half {
                width: 50%;
                position: relative;
                padding: 0px 15px;
                float: left;
            }
            .text-area {
                width: 100%;
                background: transparent;
                padding: 15px;
                border: 1px solid darken($dimline-color, 15%);
            }
            .one-full {
                width: 100%;
                position: relative;
                padding: 0px 15px;
                float: left;
            }
            .dob {
                width: 31.3333%;
                position: relative;
                padding: 0px 15px;
                float: left;
                margin-right: 2%;
            }
        }
    }
}

.switcherWrap.active {
    left: 0;
}

.switcherWrap {
    background: darken($dimline-color, 10%);
    border-radius: 0 0 6px;
    left: -270px;
    position: fixed;
    width: 270px;
    z-index: 99999;
    min-height: 200px;
    padding: 0px 0px 15px 0px;
    top: 25%;
    color: $white-color;
    .section-switch {
        margin-top: 20px;
        padding: 0 10px 0 10px;
        .color-listed {
            span {
                display: inline-block;
                float: left;
                margin-right: 10px;
                width: 25px;
                height: 25px;
                overflow: hidden
            }
            a {
                display: block;
                cursor: pointer;
                height: 25px;
                width: 25px
            }
            .indigo {
                border: 2px solid #857AFE;
                a {
                    background: #857AFE;
                    display: block;
                    text-indent: -9999px
                }
            }
            .default {
                border: 2px solid #006cd9;
                a {
                    background: #006cd9;
                    display: block;
                    text-indent: -99999px
                }
            }
            .green {
                border: 2px solid #00946d;
                a {
                    background: #00946d;
                    display: block;
                    text-indent: -99999px
                }
            }
            .yello {
                border: 2px solid #d08900;
                a {
                    background: #d08900;
                    display: block;
                    text-indent: -99999px
                }
            }
            .red {
                border: 2px solid #A03123;
                a {
                    background: #A03123;
                    display: block;
                    text-indent: -99999px;
                }
            }
            .theme-active {
                border: 2px solid $white-color;
            }
        }
    }
    .tab-content {
        margin-top: 15px;
        color: $black-color;
    }
    .nav-tabs {
        border-bottom: 1px solid $dim-bg
    }
    .nav-tabs > li.active > a,
    .nav-tabs > li.active > a:hover,
    .nav-tabs > li.active > a:focus {
        border: darken($dimline-color, 10%);
        background: darken($theme-color, 5%);
        color: $white-color;
    }
    .nav-tabs > li a {
        color: $black-color;
        border: darken($dimline-color, 10%);
    }
    .nav-tabs > li a:hover {
        background: transparent;
        border: darken($dimline-color, 10%);
    }
    h4 {
        font-size: 15px;
        background: $dimline-color;
        border-bottom: 1px solid $dim-bg;
        color: $black-color;
        line-height: 35px;
        padding: 5px 0 5px 10px;
        margin: 0;
        color: $white-color;
        background: $black-color;
        a {
            background-color: $theme-color;
            border-radius: 0 6px 6px 0;
            color: #FFFFFF;
            display: block;
            font-size: 25px;
            height: 46px;
            line-height: 46px;
            position: absolute;
            right: -45px;
            text-align: center;
            text-decoration: none;
            top: 0;
            width: 45px
        }
    }
}

// scroll to top
#scrollbkToTop {
    bottom: 84px;
    display: block;
    position: fixed;
    right: 50px;
    width: 40px;
    z-index: 99999;
    a {
        color: $theme-color;
        display: block;
        font-size: 40px;
        text-align: center;
        text-decoration: none;
        text-transform: uppercase;
        transition: all 1s ease 0s;
        width: 50px
    }
    span {
        display: block;
        height: 30px;
        margin-bottom: 7px;
        transition: all 1s ease 0s;
        width: 50px;
    }
    span i {}
    a:hover,
    a:focus,
    a:active {
        color: darken($theme-color, 10%);
    }
}

#preloader {
    background-color: #000;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 999999;
    overflow: hidden;
}

#preloader .spinner {
    width: 100px;
    height: 100px;
    background-color: #f1f1f1;
    position: absolute;
    border-radius: 100%;
    -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
    animation: sk-scaleout 1.0s infinite ease-in-out;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

@-webkit-keyframes sk-scaleout {
    0% {
        -webkit-transform: scale(0)
    }
    100% {
        -webkit-transform: scale(1.0);
        opacity: 0;
    }
}

@keyframes sk-scaleout {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    100% {
        -webkit-transform: scale(1.0);
        transform: scale(1.0);
        opacity: 0;
    }
}


/*Faq Pages css here
--------------------- */

.st-faq-wrapper {
    position: relative;
    padding: 50px 0;
    .faq-content{
        margin-top:20px;
    }
    .panel-default {
        box-shadow: none;
        border: none;
        .panel-heading {
            /*background-color: transparent;*/
            padding: 15px 15px;
            border-bottom: none;
            h4{ line-height: 24px; }
            a {
                display: block;
                position: relative;

            }
            a:after {
                position: absolute;
                width: 30px;
                height: 30px;
                display: block;
                content: "\f147";
                right: -15px;
                z-index: 999;
                top: 0;
                font-family: fontawesome;
            }
            a.collapsed:after {
                position: absolute;
                width: 30px;
                height: 30px;
                display: block;
                content: "\f196";
                right: -15px;
                z-index: 999;
                top: 0;
                font-family: fontawesome;
            }
        }
    }
}