@import url('https://fonts.googleapis.com/css?family=Lato|Oswald|PT+Sans|Roboto|Roboto+Condensed');

html, body {
    position: relative;
    width: 100%;
    height: 100%;
    font-family: 'PT Sans', sans-serif;
}

.body-content {
    margin-top: 60px;
    padding-bottom: 50px;
}
/*===================================================================================================================================
    General
===================================================================================================================================*/
body.overflow-hidden.is-fixed {
    overflow: hidden;
    -moz-overflow: hidden;
}

body.overflow-hidden {
    overflow: hidden;
    -moz-overflow: hidden;
}

@media all and (min-width: 768px) {
    body.overflow-hidden {
        overflow: hidden;
        -moz-overflow: hidden;
    }
}

ol, ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

a {
    text-decoration: none;
    cursor: pointer;
}

    a:active,
    a:hover,
    a:focus {
        text-decoration: none;
    }

input,
select,
textarea {
    width: 100%;
    max-width: 100%;
}

.no-pd {
    padding: 0 !important;
}

.no-mg {
    margin: 0 !important;
}

.no-pd-mg {
    padding: 0 !important;
    margin: 0 !important;
}

.required {
    -webkit-box-shadow: 0px 0px 2px 0px #c22 !important;
    -moz-box-shadow: 0px 0px 2px 0px #c22 !important;
    box-shadow: 0px 0px 2px 0px #c22 !important;
}

.required_tb {
    -webkit-box-shadow: 0px 0px 2px 0px #c22 !important;
    -moz-box-shadow: 0px 0px 2px 0px #c22 !important;
    box-shadow: 0px 0px 2px 0px #c22 !important;
    background: #fbd646;
}

.valid-summary {
    color: #d33;
    font-weight: 600;
}

    .valid-summary li {
        margin-bottom: 10px;
    }

div[class*="col-"] {
    margin-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
}

.blocktrigger {
    pointer-events: none;
    opacity: 0.5;
}

.blocktb {
    pointer-events: none !important;
    background: rgba(0, 0, 0, .075) !important;
}

.hasothers {
    margin-bottom: 5px;
}

.addalert {
    position: relative;
    font-size: 11px;
    color: #ff0000;
    font-weight: 600;
}

.margin_bottom {
    margin-bottom: 5px;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
}

.float-right {
    float: right;
}

.float-left {
    float: left;
}
/*========================================================================
colors
==========================================================================*/
.blue {
    color: rgb(39,176,217) !important;
}

.gray {
    color: rgba(0, 0, 0, .3) !important;
}

.darkgray {
    color: rgba(0, 0, 0, .4) !important;
}

.red {
    color: #d33 !important;
}

.green {
    color: #00a01c !important;
}

.black {
    color: #333 !important;
}

.orange {
    color: #ff6a00 !important;
}

.white {
    color: #fff;
}

.blue-bg {
    background: #48C2D6 !important;
}

.gray-bg {
    background: rgba(0, 0, 0, .3) !important;
}

.darkgray-bg {
    background: rgba(0, 0, 0, .4) !important;
}

.red-bg {
    background: #d33 !important;
}

.green-bg {
    background: #02c700 !important;
}

.black-bg {
    background: #333 !important;
}

.orange-bg {
    background: #ff6a00 !important;
}

.white-bg {
    background: #fff !important;
}

.blue-bb {
    border-color: #48C2D6 !important;
}

.gray-bb {
    border-color: rgba(0, 0, 0, .3) !important;
}

.darkgray-bb {
    border-color: rgba(0, 0, 0, .4) !important;
}

.red-bb {
    border-color: #d33 !important;
}

.green-bb {
    border-color: #02c700 !important;
}

.black-bb {
    border-color: #333 !important;
}

.orange-bb {
    border-color: #ff6a00 !important;
}

.top-radius6 {
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

.modal-content {
    border-radius: 0;
}

.modal-body {
    background: #fff;
}

.modal-footer {
    background: #fff;
}

.modal-body {
    color: #333;
}

    .modal-body .popoutbtn_ctrl {
        border-top: 1px solid #ddd;
        margin-top: 15px;
        padding-top: 15px;
        text-align: right;
    }
/*========================================================================
pop out confirmation panel
==========================================================================*/
#confirmationpanel {
    width: 100%;
}

    #confirmationpanel .cmd_content {
        color: #333;
        padding: 15px 0;
        text-align: left;
    }

    #confirmationpanel .cfm_cmd {
        text-align: center;
        border-top: 1px solid #ddd;
        padding-top: 15px;
    }
/*========================================================================
    rl_result
==========================================================================*/
.rl_result {
    display: block;
    padding: 10px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    font-weight: 600;
    border: 1px solid;
    position: relative;
}

    .rl_result.low {
        color: #3c763d;
        background-color: #dff0d8;
        border-color: #d6e9c6;
    }

    .rl_result.medium {
        color: #8a6d3b;
        background-color: #fcf8e3;
        border-color: #faebcc;
    }

    .rl_result.high {
        background-color: #f2dede;
        border-color: #ebcccc;
        color: #a94442;
    }

    .rl_result.info {
        color: #31708f;
        background-color: #d9edf7;
        border-color: #bce8f1;
    }
/*========================================================================
small loader
==========================================================================*/
.small_loader_panel {
    position: relative;
    top: 0;
    left: 0;
    width: 22px;
    height: 22px;
    display: inline-block;
    z-index: 0;
    opacity: 0;
    visibility: hidden;
    -moz-transition: opacity 0.25s ease 0s, visibility 0.35s linear;
    -o-transition: opacity 0.25s ease 0s, visibility 0.35s linear;
    -webkit-transition: opacity 0.25s ease, visibility 0.35s linear;
    transition: opacity 0.25s ease 0s, visibility 0.35s linear;
    transition: 0.5s;
    background: transparent;
}

    .small_loader_panel.is-visible {
        opacity: 1;
        visibility: visible;
        z-index: 999;
        -moz-transition: opacity 0.25s ease 0s, visibility 0.35s linear;
        -o-transition: opacity 0.25s ease 0s, visibility 0.35s linear;
        -webkit-transition: opacity 0.25s ease, visibility 0.35s linear;
        -webkit-transition-delay: 0s, 0s;
        transition: opacity 0.25s ease 0s, visibility 0.35s linear;
        transition: 0.5s;
        background: transparent;
    }

    .small_loader_panel .circularG {
        position: absolute;
        background-color: rgb(39,176,217);
        width: 5px;
        height: 5px;
        border-radius: 2px;
        -o-border-radius: 2px;
        -ms-border-radius: 2px;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        animation-name: bounce_circularG;
        -o-animation-name: bounce_circularG;
        -ms-animation-name: bounce_circularG;
        -webkit-animation-name: bounce_circularG;
        -moz-animation-name: bounce_circularG;
        animation-duration: 1.1s;
        -o-animation-duration: 1.1s;
        -ms-animation-duration: 1.1s;
        -webkit-animation-duration: 1.1s;
        -moz-animation-duration: 1.1s;
        animation-iteration-count: infinite;
        -o-animation-iteration-count: infinite;
        -ms-animation-iteration-count: infinite;
        -webkit-animation-iteration-count: infinite;
        -moz-animation-iteration-count: infinite;
        animation-direction: normal;
        -o-animation-direction: normal;
        -ms-animation-direction: normal;
        -webkit-animation-direction: normal;
        -moz-animation-direction: normal;
    }

    .small_loader_panel .circularG_1 {
        left: 0;
        top: 9px;
        animation-delay: 0.41s;
        -o-animation-delay: 0.41s;
        -ms-animation-delay: 0.41s;
        -webkit-animation-delay: 0.41s;
        -moz-animation-delay: 0.41s;
    }

    .small_loader_panel .circularG_2 {
        left: 2px;
        top: 2px;
        animation-delay: 0.55s;
        -o-animation-delay: 0.55s;
        -ms-animation-delay: 0.55s;
        -webkit-animation-delay: 0.55s;
        -moz-animation-delay: 0.55s;
    }

    .small_loader_panel .circularG_3 {
        top: 0;
        left: 9px;
        animation-delay: 0.69s;
        -o-animation-delay: 0.69s;
        -ms-animation-delay: 0.69s;
        -webkit-animation-delay: 0.69s;
        -moz-animation-delay: 0.69s;
    }

    .small_loader_panel .circularG_4 {
        right: 2px;
        top: 2px;
        animation-delay: 0.83s;
        -o-animation-delay: 0.83s;
        -ms-animation-delay: 0.83s;
        -webkit-animation-delay: 0.83s;
        -moz-animation-delay: 0.83s;
    }

    .small_loader_panel .circularG_5 {
        right: 0;
        top: 9px;
        animation-delay: 0.97s;
        -o-animation-delay: 0.97s;
        -ms-animation-delay: 0.97s;
        -webkit-animation-delay: 0.97s;
        -moz-animation-delay: 0.97s;
    }

    .small_loader_panel .circularG_6 {
        right: 2px;
        bottom: 2px;
        animation-delay: 1.1s;
        -o-animation-delay: 1.1s;
        -ms-animation-delay: 1.1s;
        -webkit-animation-delay: 1.1s;
        -moz-animation-delay: 1.1s;
    }

    .small_loader_panel .circularG_7 {
        left: 9px;
        bottom: 0;
        animation-delay: 1.24s;
        -o-animation-delay: 1.24s;
        -ms-animation-delay: 1.24s;
        -webkit-animation-delay: 1.24s;
        -moz-animation-delay: 1.24s;
    }

    .small_loader_panel .circularG_8 {
        left: 2px;
        bottom: 2px;
        animation-delay: 1.38s;
        -o-animation-delay: 1.38s;
        -ms-animation-delay: 1.38s;
        -webkit-animation-delay: 1.38s;
        -moz-animation-delay: 1.38s;
    }



@keyframes bounce_circularG {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(.3);
    }
}

@-o-keyframes bounce_circularG {
    0% {
        -o-transform: scale(1);
    }

    100% {
        -o-transform: scale(.3);
    }
}

@-ms-keyframes bounce_circularG {
    0% {
        -ms-transform: scale(1);
    }

    100% {
        -ms-transform: scale(.3);
    }
}

@-webkit-keyframes bounce_circularG {
    0% {
        -webkit-transform: scale(1);
    }

    100% {
        -webkit-transform: scale(.3);
    }
}

@-moz-keyframes bounce_circularG {
    0% {
        -moz-transform: scale(1);
    }

    100% {
        -moz-transform: scale(.3);
    }
}
/*========================================================================
laoder with timer
==========================================================================*/
.setloadertimer {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    background: #808080;
    opacity: 0.8;
}

    .setloadertimer.is-visible {
        display: block;
    }

.loadertimer .circle {
    position: absolute;
    border: 3px solid transparent;
    border-top-color: #9ee925;
    border-radius: 50%;
    -webkit-animation: rotate linear infinite;
    animation: rotate linear infinite;
}

    .loadertimer .circle.one {
        height: 50px;
        width: 50px;
        left: 50px;
        top: 50px;
        -webkit-animation-duration: 0.85s;
        animation-duration: 0.85s;
    }

    .loadertimer .circle.two {
        height: 75px;
        width: 75px;
        top: 38px;
        left: 38px;
        -webkit-animation-duration: 0.95s;
        animation-duration: 0.95s;
    }

    .loadertimer .circle.three {
        height: 100px;
        width: 100px;
        top: 25px;
        left: 25px;
        -webkit-animation-duration: 1.05s;
        animation-duration: 1.05s;
    }

.loader_panel .loadertimer {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -90px 0 0 -90px;
}

.loader_panel .text {
    position: absolute;
    top: 40%;
    left: 46%;
    font-size: 18px;
    color: #fff !important;
}

.loader_panel .loader_cancelbtn {
    position: absolute;
    top: 70%;
    left: 43%;
    color: #fff !important;
    text-decoration: none;
    font-weight: 600;
    margin-top: 15px;
}

    .loader_panel .loader_cancelbtn:hover {
        text-decoration: underline !important;
    }

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotateZ(360deg);
        transform: rotateZ(360deg);
    }

    to {
        -webkit-transform: rotateZ(0deg);
        transform: rotateZ(0deg);
    }
}

@keyframes rotate {
    from {
        -webkit-transform: rotateZ(360deg);
        transform: rotateZ(360deg);
    }

    to {
        -webkit-transform: rotateZ(0deg);
        transform: rotateZ(0deg);
    }
}
/*========================================================================
loader
==========================================================================*/
.mainloaderpanel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .5);
    z-index: 0;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.15s, visibility 0.15s;
}

    .mainloaderpanel.is-visible {
        position: fixed;
        z-index: 99999;
        visibility: visible;
        opacity: 1;
        transition: opacity 0.15s, visibility 0.15s;
    }

.mainloader .leftEye,
.mainloader .rightEye {
    width: 5vh;
    height: 5vh;
    border-radius: 50%;
    background: #48C2D6;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-animation: leftEyeAnimation 3s infinite cubic-bezier(0.455, 0.03, 0.515, 0.955);
    animation: leftEyeAnimation 3s infinite cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.mainloader .rightEye {
    -webkit-animation: rightEyeAnimation 3s infinite cubic-bezier(0.455, 0.03, 0.515, 0.955);
    animation: rightEyeAnimation 3s infinite cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.mainloader .mouth {
    width: 10vh;
    height: 10vh;
    border-radius: 50%;
    border: solid 1.3vh #48C2D6;
    border-right: solid 1.3vh rgba(223,223,194,0);
    border-left: solid 1.3vh rgba(223,223,194,0);
    border-bottom: solid 1.3vh rgba(223,223,194,0);
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(360deg);
    transform: translate(-50%, -50%) rotate(360deg);
    -webkit-animation: mouthAnimation 3s infinite cubic-bezier(0.455, 0.03, 0.515, 0.955);
    animation: mouthAnimation 3s infinite cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

@-webkit-keyframes mouthAnimation {
    0% {
        -webkit-transform: translate(-50%, -50%) rotateX(180deg);
        transform: translate(-50%, -50%) rotateX(180deg);
    }

    10% {
        -webkit-transform: translate(-50%, -50%) rotateZ(360deg);
        transform: translate(-50%, -50%) rotateZ(360deg);
    }

    40% {
        -webkit-transform: translate(-50%, -50%) rotateZ(320deg);
        transform: translate(-50%, -50%) rotateZ(320deg);
    }

    60% {
        -webkit-transform: translate(-50%, -50%) rotateZ(900deg);
        transform: translate(-50%, -50%) rotateZ(900deg);
    }

    100% {
        -webkit-transform: translate(-50%, -50%) rotateZ(900deg);
        transform: translate(-50%, -50%) rotateZ(900deg);
    }
}

@keyframes mouthAnimation {
    0% {
        -webkit-transform: translate(-50%, -50%) rotateX(180deg);
        transform: translate(-50%, -50%) rotateX(180deg);
    }

    10% {
        -webkit-transform: translate(-50%, -50%) rotateZ(360deg);
        transform: translate(-50%, -50%) rotateZ(360deg);
    }

    40% {
        -webkit-transform: translate(-50%, -50%) rotateZ(320deg);
        transform: translate(-50%, -50%) rotateZ(320deg);
    }

    60% {
        -webkit-transform: translate(-50%, -50%) rotateZ(900deg);
        transform: translate(-50%, -50%) rotateZ(900deg);
    }

    100% {
        -webkit-transform: translate(-50%, -50%) rotateZ(900deg);
        transform: translate(-50%, -50%) rotateZ(900deg);
    }
}

@-webkit-keyframes leftEyeAnimation {
    0% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    50% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    60% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(-150%, -50%);
        transform: translate(-150%, -50%);
    }

    90% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(-150%, -50%);
        transform: translate(-150%, -50%);
    }

    100% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
}

@keyframes leftEyeAnimation {
    0% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    50% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    60% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(-150%, -50%);
        transform: translate(-150%, -50%);
    }

    90% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(-150%, -50%);
        transform: translate(-150%, -50%);
    }

    100% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
}

@-webkit-keyframes rightEyeAnimation {
    0% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    50% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    60% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(50%, -50%);
        transform: translate(50%, -50%);
    }

    70% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(50%, -50%);
        transform: translate(50%, -50%);
    }

    75% {
        width: 2vh;
        height: 2px;
        -webkit-transform: translate(50%, -50%);
        transform: translate(50%, -50%);
    }

    80% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(50%, -50%);
        transform: translate(50%, -50%);
    }

    90% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(50%, -50%);
        transform: translate(50%, -50%);
    }

    100% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
}

@keyframes rightEyeAnimation {
    0% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    50% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    60% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(50%, -50%);
        transform: translate(50%, -50%);
    }

    70% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(50%, -50%);
        transform: translate(50%, -50%);
    }

    75% {
        width: 2vh;
        height: 2px;
        -webkit-transform: translate(50%, -50%);
        transform: translate(50%, -50%);
    }

    80% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(50%, -50%);
        transform: translate(50%, -50%);
    }

    90% {
        width: 2vh;
        height: 2vh;
        -webkit-transform: translate(50%, -50%);
        transform: translate(50%, -50%);
    }

    100% {
        width: 5vh;
        height: 5vh;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
}
/*========================================================================
input_group
==========================================================================*/
.input_group .small_loader_panel {
    position: absolute;
    top: 26px;
    left: auto;
    right: 20px;
}

.input_group .icon_span {
    position: relative;
    font-size: 11px;
    color: #ff0000;
    font-weight: 600;
}

    .input_group .icon_span.valid {
        color: #00c747;
    }

    .input_group .icon_span.invalid {
        color: #ff0000;
    }
/*========================================================================
info-group
==========================================================================*/
.info-group {
    width: 100%;
}

    .info-group label {
        font-weight: 600;
        display: block;
        width: 100%;
        text-decoration: underline;
    }

        .info-group label.uncompleted {
            color: #ff0000;
        }

    .info-group span {
        display: block;
    }

.tab-content {
    padding: 30px 25px 50px 25px;
    border: 1px solid #ddd;
    border-top: none;
    background: #fff;
    position: relative;
    min-height: 100px;
}

    .tab-content h3 {
        margin-top: 0;
        margin-left: 0;
        font-weight: 600;
        color: rgba(0, 0, 0, 0.2);
        position: absolute;
        bottom: 10px;
        right: 30px;
        z-index: 1;
        font-style: italic;
    }

.nav-tabs > li > a {
    font-weight: 600;
}
/*==================================================================
ncpanel
==================================================================*/
.ncpanel {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    background: #fff;
    box-sizing: border-box;
    max-width: 100%;
    position: relative;
    z-index: 2;
    transition: .2s;
    flex-shrink: 0;
    background: #fff;
    -moz-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.12),0 1px 5px 0 rgba(0,0,0,0.2);
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.12),0 1px 5px 0 rgba(0,0,0,0.2);
    display: block;
    margin: 0 auto;
    min-height: 0;
    width: 100%;
}

    .ncpanel.px600 {
        width: 600px;
    }

    .ncpanel.p800 {
        width: 800px;
    }

    .ncpanel.px450 {
        width: 800px;
    }

    .ncpanel .nc {
        flex-grow: 1;
        box-sizing: border-box;
        overflow: hidden;
        padding: 25px;
        height: auto;
        min-height: 500px;
        overflow-y: auto;
    }

        .ncpanel .nc h4 {
            font-weight: 600;
            border-bottom: 1px solid #ddd;
            padding-bottom: 15px;
            margin-bottom: 15px;
        }

        .ncpanel .nc .dob_ul {
            width: 100%;
        }

            .ncpanel .nc .dob_ul li {
                width: 32.5%;
                display: inline-block;
            }
/*==================================================================
text box animation
    ==================================================================*/
.input {
    position: relative;
    z-index: 1;
    display: inline-block;
    margin: 10px 5px 10px 5px;
    max-width: 100%;
    width: 100%;
    vertical-align: top;
}

    .input.blocked input {
        pointer-events: none;
    }

.input__field {
    position: relative;
    display: block;
    float: right;
    padding: 10px;
    width: 100%;
    border: none;
    border-radius: 0;
    background: #fff;
    color: #aaa;
    font-weight: 400;
    -webkit-appearance: none; /* for box shadows to show on iOS */
}

    .input__field:focus {
        outline: none;
    }
/* Yoshiko */
.input__field--yoshiko {
    width: 100%;
    background-color: #fff;
    border-bottom: 1px solid #aaa;
    -webkit-transition: background-color 0.25s, border-color 0.25s;
    transition: background-color 0.25s, border-color 0.25s;
}

.input__label--yoshiko {
    width: 100%;
    text-align: left;
    position: absolute;
    bottom: 100%;
    pointer-events: none;
    overflow: hidden;
    -webkit-transform: translate3d(0, 40px, 0);
    transform: translate3d(0, 40px, 0);
    -webkit-transition: -webkit-transform 0.25s;
    transition: transform 0.25s;
    -webkit-transition-timing-function: ease-in-out;
    transition-timing-function: ease-in-out;
}

.input__label-content--yoshiko {
    color: #757575;
    padding: 12px 0;
    -webkit-transition: -webkit-transform 0.25s;
    transition: transform 0.25s;
    -webkit-transition-timing-function: ease-in-out;
    transition-timing-function: ease-in-out;
}

    .input__label-content--yoshiko::after {
        content: attr(data-content);
        position: absolute;
        font-weight: 800;
        bottom: 100%;
        left: 0;
        height: 100%;
        width: 100%;
        padding: 16px 0;
        text-transform: uppercase;
        letter-spacing: 1px;
        font-size: 0.85em;
    }

.input__field--yoshiko:focus + .input__label--yoshiko,
.input--filled .input__label--yoshiko {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
    font-size: 12px;
}

    .input__field--yoshiko:focus + .input__label--yoshiko .input__label-content--yoshiko,
    .input--filled .input__label-content--yoshiko {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        font-size: 12px;
        color: #4285f4;
    }

.input__field--yoshiko:focus + .input__field--yoshiko,
.input--filled .input__field--yoshiko {
    border-color: #4285f4;
}

.input.blocked .input__field--yoshiko {
    border-color: #ddd;
}

.input.require .input__field--yoshiko, .input.require .input__label-content--yoshiko {
    border-color: #d33;
    color: #d33;
}

.input.require .input--filled {
    color: #d33;
}

.input .v_loader {
    position: absolute;
    top: -5px;
    right: 20px;
    left: auto;
}

.input.blocked .input__label-content {
    color: rgba(0, 0, 0, .4);
}

.input .input_error {
    color: #d33;
}
/*==================================================================
btn_div
==================================================================*/
.btn_div {
    width: 100%;
    text-align: right;
}
/*==================================================================
vertical loader
    ==================================================================*/
.v_loader {
    color: #48C2D6;
    font-size: 10px;
    margin: 0 auto;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
    visibility: hidden;
    display: none;
}

    .v_loader.is-visible {
        visibility: visible;
        display: block;
    }

    .v_loader,
    .v_loader:before,
    .v_loader:after {
        border-radius: 50%;
        width: 15px;
        height: 15px;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
        -webkit-animation: load7 1.8s infinite ease-in-out;
        animation: load7 1.8s infinite ease-in-out;
    }



        .v_loader:before,
        .v_loader:after {
            content: '';
            position: absolute;
            top: 0;
        }

        .v_loader:before {
            left: -20px;
            -webkit-animation-delay: -0.32s;
            animation-delay: -0.32s;
        }

        .v_loader:after {
            left: 20px;
        }

@-webkit-keyframes load7 {
    0%, 80%, 100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }

    40% {
        box-shadow: 0 2.5em 0 0;
    }
}

@keyframes load7 {
    0%, 80%, 100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }

    40% {
        box-shadow: 0 2.5em 0 0;
    }
}
/*==================================================================
error pages
    ==================================================================*/
.errorpage h2 {
    border-bottom: 1px solid #ddd;
    margin-bottom: 20px;
    padding-bottom: 20px;
    font-weight: 600;
}

.errorpage h3 {
    font-weight: 600;
}

.errorpage .btnctrl {
    display: block;
    margin: 20px 0;
}

@media all {
    .page-break {
        display: none;
    }
}

@media print {
    .page-break {
        display: block;
        page-break-before: always;
        padding-top: 40px;
    }
}
/*========================================================================
pagination
==========================================================================*/
nav[role="navigation"] {
    text-align: center;
}

.cd-pagination {
    width: 100%;
    margin: 2em auto 4em;
    text-align: center;
}

    .cd-pagination li {
        /* hide numbers on small devices */
        display: none;
        margin: 0 .2em;
    }

        .cd-pagination li.pagetitle {
            display: inline-block;
            font-weight: 600;
        }

        .cd-pagination li.button {
            /* make sure prev next buttons are visible */
            display: inline-block;
        }

    .cd-pagination a, .cd-pagination span {
        display: inline-block;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        /* use padding and font-size to change buttons size */
        padding: 10px 15px;
        font-size: 14px;
        color: #333;
    }

    .cd-pagination a {
        border: 1px solid #e6e6e6;
        border-radius: 0.25em;
    }

.no-touch .cd-pagination a:hover {
    background-color: #f2f2f2;
}

.cd-pagination a:active {
    /* click effect */
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -o-transform: scale(0.9);
    transform: scale(0.9);
}

.cd-pagination a.disabled {
    /* button disabled */
    color: rgba(46, 64, 87, 0.4);
    pointer-events: none;
}

.cd-pagination .pagetitle a.disabled {
    /* button disabled */
    color: #333;
}

.cd-pagination a.disabled::before, .cd-pagination a.disabled::after {
    opacity: .4;
}

.cd-pagination .current {
    /* selected number */
    background-color: #64a281;
    border-color: #64a281;
    color: #ffffff;
    pointer-events: none;
}

@media only screen and (min-width: 768px) {
    nav[role="navigation"] {
        text-align: right;
    }

    .cd-pagination {
        text-align: right;
    }

        .cd-pagination li {
            display: inline-block;
        }

            .cd-pagination li.pagetitle {
                display: none;
            }
}

@media only screen and (min-width: 1170px) {
    .cd-pagination {
        margin: 4em auto 8em;
    }
}
/* -------------------------------- 

No space - remove distance between list items

-------------------------------- */
.cd-pagination.no-space {
    width: auto;
    max-width: none;
    display: inline-block;
    border-radius: 0.25em;
    border: 1px solid #e6e6e6;
}

    .cd-pagination.no-space::after {
        clear: both;
        content: "";
        display: table;
    }

    .cd-pagination.no-space li {
        margin: 0;
        float: left;
        border-right: 1px solid #e6e6e6;
    }

        .cd-pagination.no-space li:last-of-type {
            border-right: none;
        }

    .cd-pagination.no-space a, .cd-pagination.no-space span {
        float: left;
        border-radius: 0;
        padding: 10px 15px;
        border: none;
    }

    .cd-pagination.no-space li:first-of-type a {
        border-radius: 0.25em 0 0 0.25em;
    }

    .cd-pagination.no-space li:last-of-type a {
        border-radius: 0 0.25em 0.25em 0;
    }

nav[role="navigation"] .page_summary {
    font-size: 13px;
    font-weight: 600;
}
/* Minoru */
.input__field--minoru {
    width: 100%;
    background: #fff;
    box-shadow: 0px 0px 0px 2px transparent;
    color: #333;
    -webkit-transition: box-shadow 0.3s;
    transition: box-shadow 0.3s;
    height: 30px;
    font-weight: 600;
    font-size: 15px;
}

.input__label--minoru {
    padding: 0;
    width: 100%;
    text-align: left;
}

    .input__label--minoru::after {
        content: '';
        position: absolute;
        top: 0;
        z-index: -1;
        width: 100%;
        height: 4em;
        box-shadow: 0px 0px 0px 0px;
        color: rgba(199,152,157, 0.6);
    }

.input__field--minoru:focus {
    box-shadow: 0px 0px 0px 2px #eca29b;
}

    .input__field--minoru:focus + .input__label--minoru {
        pointer-events: none;
    }

        .input__field--minoru:focus + .input__label--minoru::after {
            -webkit-animation: anim-shadow 0.3s forwards;
            animation: anim-shadow 0.3s forwards;
        }

@-webkit-keyframes anim-shadow {
    to {
        box-shadow: 0px 0px 100px 50px;
        opacity: 0;
    }
}

@keyframes anim-shadow {
    to {
        box-shadow: 0px 0px 100px 50px;
        opacity: 0;
    }
}

.input__label-content--minoru {
    padding: 0;
    font-weight: 600;
    font-size: 13px;
    color: #6a7989;
}

mark {
    border: 0.5px solid rgba(199,152,157, 0.6);
}
/*==================================================================
input group input    
==================================================================*/
.input-group {
    width: auto;
    display: block;
    position: relative;
    background: #fff;
    padding: 0;
    height: auto;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 0 15px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-align: left;
}

    .input-group i {
        position: absolute;
        top: 15px;
        right: 15px;
        font-size: 1px;
        display: block;
    }

    .input-group .input-content {
        height: auto;
    }

    .input-group .inputval {
        width: 100%;
        height: 43px;
        background: transparent;
        z-index: 6;
        border: none;
        position: relative;
        padding-top: 20px;
        top: 0;
        font-size: 90%;
    }

    .input-group label.title {
        position: absolute;
        top: 15px;
        left: 15px;
        z-index: 1;
        transition: all 0.3s;
        color: #ddd;
        font-weight: 600;
        font-size: 90%;
    }

    .input-group.hasvalue label.title, .input-group input:focus ~ label.title {
        top: 5px;
        font-size: 80%;
        color: #F79421;
        transition: all 0.3s;
    }

    .input-group input.invalid ~ label.title {
        color: #ff0000;
    }

    .input-group input.invalid:not(:focus) ~ label.title {
        color: #999;
    }

    .input-group.hasvalue input.invalid:not(:focus) ~ label.title {
        color: #ff0000;
    }

    .input-group .input-content ~ label.title {
        color: #ff0000;
        animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
        transform: translate3d(0, 0, 0);
        backface-visibility: hidden;
        perspective: 1000px;
    }

    .input-group.requiredfield {
        border-color: #ff0000;
        transition: border-color 0.5s;
    }

    .input-group.withspan .inputval {
        padding-left: 17px;
    }

    .input-group.withspan span {
        position: absolute;
        left: 15px;
        top: 18px;
        visibility: hidden;
        font-weight: 600;
    }

    .input-group.withspan input.invalid:not(:focus) ~ span {
        visibility: hidden;
    }

    .input-group.withspan.hasvalue span, .input-group input:focus ~ span {
        visibility: visible;
    }
    /*==================================================================
  color picker  
==================================================================*/
    .input-group[data-type='colorpicker'] .palette-color-picker-button {
        position: absolute;
        top: 8px;
        right: 5px;
        z-index: 7;
    }

    /*==================================================================
  dropdown  
==================================================================*/
    .input-group[data-type='dropdown'] label.title {
        position: absolute;
        top: 5px;
        left: 15px;
        font-weight: 600;
        font-size: 75%;
        transition: all 0.3s;
        color: #F79421;
    }

    .input-group[data-type='dropdown'] {
        padding: 0;
        border: none;
        height: 50px;
    }

        .input-group[data-type='dropdown'] .dd-selected {
            color: #333;
            font-weight: normal;
            font-size: 95%;
            padding: 21px 0 0 14px;
        }

        .input-group[data-type='dropdown'] .dd-container, .input-group[data-type='dropdown'] .dd-select, .input-group[data-type='dropdown'] .dd-options {
            width: 100% !important;
            font-size: 95%;
        }

        .input-group[data-type='dropdown'] .dd-select {
            height: 45px;
            background: #fff !important;
        }

        .input-group[data-type='dropdown'].graybg .dd-select {
            background: rgb(238, 238, 238) none repeat scroll 0% 0% !important;
        }
        /*with image*/
        .input-group[data-type='dropdown'].withimage .dd-selected-image {
            float: right;
            margin-right: 5px;
        }

        .input-group[data-type='dropdown'].withimage .dd-selected {
            padding: 7px 0 0 14px;
        }

    .input-group.dropdown.withimage .dd-selected .dd-selected-image {
        margin-right: 25px;
    }

    .input-group[data-type='dropdown'].withimage .dd-option-text {
        line-height: 25px !important;
    }

    .input-group[data-type='dropdown'] .dd-selected-text, .input-group[data-type='dropdown'] .dd-option-text {
        width: 74%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: inline-block;
        margin-bottom: 0 !important;
    }

    .input-group[data-type='dropdown'] .dd-option {
        padding: 10px 10px 5px !important;
    }
    /*==================================================================
  calender  
==================================================================*/
    .input-group[data-type='calendar'] input {
        cursor: pointer;
    }

    .input-group[data-type='calendar'] .ddcal {
        position: absolute;
        left: 0;
        top: 46px;
        width: 100%;
        max-width: 280px;
        background: #fff;
        z-index: 3;
        border: 1px solid #ddd;
        padding: 10px 5px;
        opacity: 0;
        visibility: hidden;
    }

    .input-group[data-type='calendar'].show .ddcal {
        opacity: 1;
        visibility: visible;
    }

    .input-group[data-type='calendar'] .select_div {
        margin-bottom: 10px;
        padding: 0 5px;
    }

    .input-group[data-type='calendar'] select {
        font-size: 90%;
        height: 30px;
        padding-left: 10px;
        width: 100%;
    }

        .input-group[data-type='calendar'] select.month_dd {
            display: block;
            margin-right: 5px;
        }

        .input-group[data-type='calendar'] select.year_dd {
            display: block;
            margin-left: 5px;
        }

    .input-group[data-type='calendar'] .cal_ul {
        width: 100%;
    }

        .input-group[data-type='calendar'] .cal_ul li {
            width: 14%;
            display: inline-block;
            color: #536c79;
            font-weight: 600;
            font-size: 80%;
            text-align: center;
        }

        .input-group[data-type='calendar'] .cal_ul.cal_content_ul li {
            padding: 2px 0;
        }

            .input-group[data-type='calendar'] .cal_ul.cal_content_ul li a {
                font-size: 90%;
                background: transparent;
                border-radius: 50%;
                cursor: pointer;
                display: block;
                padding: 6px 4px;
                margin: 0 2px;
            }

            .input-group[data-type='calendar'] .cal_ul.cal_content_ul li:hover a {
                background: #ddd;
            }

            .input-group[data-type='calendar'] .cal_ul.cal_content_ul li.selected a {
                background-color: #1fc77c;
                color: #fff;
            }

            .input-group[data-type='calendar'] .cal_ul.cal_content_ul li.today a {
                border: 0.5px solid #ddd;
            }

    /*===============================================
lds-ripple loader small
===============================================*/
    .input-group .lds-ripple {
        position: absolute;
        top: -5px;
        right: 10px;
    }
/*===============================================
lds-dual-ring
===============================================*/
.lds-dual-ring {
    display: inline-block;
    width: 50px;
    height: 50px;
    margin-top: 5px;
}

    .lds-dual-ring:after {
        content: " ";
        display: block;
        width: 40px;
        height: 40px;
        margin: 1px;
        border-radius: 50%;
        border: 5px solid #fff;
        border-color: #fff transparent #fff transparent;
        animation: lds-dual-ring 1.2s linear infinite;
    }

@keyframes lds-dual-ring {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/*===============================================
check box
===============================================*/
.input-group[data-type='checkbox'] {
    padding: 0;
    height: 50px;
    width: auto;
    display: block;
    position: relative;
    border: none;
}

    .input-group[data-type='checkbox'] .switch {
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.cmn-toggle {
    position: absolute;
    /*margin-left: -9999px;*/
    visibility: hidden;
    width: 100%;
    height: 100%;
}

    .cmn-toggle ~ label {
        display: block;
        position: relative;
        cursor: pointer;
        outline: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

input.cmn-toggle-yes-no ~ label {
    width: 100%;
    height: 45px;
    position: absolute;
    top: 0 !important;
    left: 0 !important;
}

    input.cmn-toggle-yes-no ~ label:before, input.cmn-toggle-yes-no ~ label:after {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        color: #fff;
        font-size: 14px;
        text-align: center;
        line-height: 45px;
    }

    input.cmn-toggle-yes-no ~ label:before {
        background-color: #dddddd;
        content: attr(data-off);
        -webkit-transition: -webkit-transform 0.5s;
        -moz-transition: -moz-transform 0.5s;
        -o-transition: -o-transform 0.5s;
        transition: transform 0.5s;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    input.cmn-toggle-yes-no ~ label:after {
        background-color: #8ce196;
        content: attr(data-on);
        -webkit-transition: -webkit-transform 0.5s;
        -moz-transition: -moz-transform 0.5s;
        -o-transition: -o-transform 0.5s;
        transition: transform 0.5s;
        -webkit-transform: rotateY(180deg);
        -moz-transform: rotateY(180deg);
        -ms-transform: rotateY(180deg);
        -o-transform: rotateY(180deg);
        transform: rotateY(180deg);
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
    }

input.cmn-toggle-yes-no:checked ~ label:before {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

input.cmn-toggle-yes-no:checked ~ label:after {
    -webkit-transform: rotateY(0);
    -moz-transform: rotateY(0);
    -ms-transform: rotateY(0);
    -o-transform: rotateY(0);
    transform: rotateY(0);
}
/*==================================================================
  text area  
==================================================================*/
.input-group.textarea .inputval {
    padding-top: 20px;
}
/*==================================================================
phone
==================================================================*/
.phone {
    width: 100%;
}

    .phone .dropdown {
        width: 38%;
        display: inline-block;
    }

        .phone .dropdown img {
            width: 25px;
            height: auto !important;
        }

        .phone .dropdown label {
            line-height: 12px !important;
        }

        .phone .dropdown .dd-selected-text, .phone .dropdown .dd-option-text {
            width: 60%;
        }

    .phone[data-type='textbox'] {
        width: 60%;
        display: inline-block;
        vertical-align: top;
    }

/*===============================================
check box : alternative
===============================================*/
.checkbox-group input[type=checkbox] {
    height: 0;
    width: 0;
    visibility: hidden;
    position: absolute;
    top: 0;
}

.checkbox-group label {
    cursor: pointer;
    text-indent: -9999px;
    width: 100px;
    height: 50px;
    background: grey;
    display: block;
    border-radius: 50px;
    position: relative;
    margin: 0 auto;
    vertical-align: top;
}

    .checkbox-group label:after {
        content: '';
        position: absolute;
        top: 5px;
        left: 5px;
        width: 40px;
        height: 40px;
        background: #fff;
        border-radius: 40px;
        transition: 0.3s;
    }

.checkbox-group input:checked + label {
    background: #bada55;
}

    .checkbox-group input:checked + label:after {
        left: calc(100% - 5px);
        transform: translateX(-100%);
    }

.checkbox-group label:active:after {
    width: 130px;
}
/*==================================================================
 ripple   
==================================================================*/
.ripple {
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.4);
    transform: scale(0);
    position: absolute;
    opacity: 1;
}

.rippleEffect {
    animation: rippleDrop .6s linear;
}

@keyframes rippleDrop {
    100% {
        transform: scale(2);
        opacity: 0;
    }
}

@import url('https://fonts.googleapis.com/css?family=Raleway');

html, body {
    position: relative;
    width: 100%;
    height: 100%;
    font-family: 'Raleway', sans-serif;
}

body {
    width: 100%;
    height: 100%;
    position: relative;
    background: url(/images/O7MF5N0.jpg) fixed;
    object-fit: cover;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover;
    background-size: cover;
    overflow-x: hidden;
    overflow-y: auto;
}

.loginpanel {
    margin-left: auto;
    margin-right: auto;
    min-height: 364px;
    min-width: 100%;
    max-width: 100%;
    width: 100%;
    height: auto;
    padding: 36px;
    margin-bottom: 28px;
    background-color: #fff;
    -webkit-box-shadow: 0 2px 3px rgba(0,0,0,.55);
    -moz-box-shadow: 0 2px 3px rgba(0,0,0,.55);
    box-shadow: 0 2px 3px rgba(0,0,0,.55);
    border: 1px solid #818c94;
    border: 1px solid rgba(0,0,0,.4);
    background: #fff;
    position: absolute;
    top: 0;
    left: 0;
}



    .loginpanel .companylogo {
        max-height:50px;
    }
    .loginpanel .profile_img {
        width: 50px;
        float:right;
    }
    .loginpanel hr {     
       color:#333;
    }
    .loginpanel h5 {
        margin-bottom:10px;
    }
    .loginpanel .input {
        margin: 10px 0 10px 0;
    }
    .loginpanel input {
        display: inline-table;
        background: #f0efee;
        float: none;
        padding: 10px 0 10px 10px;
    }
    .loginpanel input.required {
       background:#f6c9c9;
    }

    .loginpanel .btn {
        -moz-user-select: none;
        -moz-transition: background .2s .1s;
        transition: background .2s .1s;
        border: 0;
        -moz-border-radius: 3px;
        border-radius: 3px;
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        font-weight: 500;
        min-width: 4em;
        outline: none;
        overflow: hidden;
        position: relative;
        text-align: center;
        text-transform: uppercase;
        z-index: 0;
        -moz-transition: box-shadow .28s cubic-bezier(0.4,0.0,0.2,1);
        transition: box-shadow .28s cubic-bezier(0.4,0.0,0.2,1);
        background: #dfdfdf;
        -moz-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.12),0 1px 5px 0 rgba(0,0,0,0.2);
        box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.12),0 1px 5px 0 rgba(0,0,0,0.2);
        background: #4285f4;
        color: #ffffff;
        line-height: 20px;
        min-width: 88px;
        white-space: nowrap;
        padding:10px 0;
        float:right;
    }
        .loginpanel .btn .btncontent {
            position: relative;
        }
            .loginpanel .btn .btncontent span {
                margin: 8px 16px;
            }
    .loginpanel .btncontrol{
        position:relative;
        padding-bottom:25px;
    }
    .loginpanel .panel_p {
        background: none;
        border: none;
        display: inline-block;       
        padding: 0;
        position: relative;
        white-space: nowrap;
        color: #4285f4;
        cursor: pointer;
        text-decoration: none;
        outline: none;
        font-size:12px;
        font-weight:600;
        margin-top:15px;      
    }

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .loginpanel {
        margin-left: auto;
        margin-right: auto;
        min-height: 364px;
        min-width: 320px;
        max-width: 412px;
        width: calc(100% - 40px);
        padding: 36px;
        margin-bottom: 28px;
        background-color: #fff;
        position: absolute;
        top: 10%;
        left: calc(50% - 206px);
    }
    body {
        overflow-x: hidden;
        overflow-y: hidden;
    }
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
   
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
}

    /*csss loader*/
.loader-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.14);
    z-index: 4;
    display:none;
}
    .loader-bg.is-visible {
        display: block;
    }
    .cssload-loader {
    position: relative;
    left: calc(50% - 31px);
    top: calc(50% - 31px);
    width: 62px;
    height: 62px;
    border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    perspective: 780px;
    z-index: 5;
}

.cssload-inner {
    position: absolute;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}

    .cssload-inner.cssload-one {
        left: 0%;
        top: 0%;
        animation: cssload-rotate-one 1.15s linear infinite;
        -o-animation: cssload-rotate-one 1.15s linear infinite;
        -ms-animation: cssload-rotate-one 1.15s linear infinite;
        -webkit-animation: cssload-rotate-one 1.15s linear infinite;
        -moz-animation: cssload-rotate-one 1.15s linear infinite;
        border-bottom: 3px solid rgb(0,158,11);
    }

    .cssload-inner.cssload-two {
        right: 0%;
        top: 0%;
        animation: cssload-rotate-two 1.15s linear infinite;
        -o-animation: cssload-rotate-two 1.15s linear infinite;
        -ms-animation: cssload-rotate-two 1.15s linear infinite;
        -webkit-animation: cssload-rotate-two 1.15s linear infinite;
        -moz-animation: cssload-rotate-two 1.15s linear infinite;
        border-right: 3px solid rgb(0,158,11);
    }

    .cssload-inner.cssload-three {
        right: 0%;
        bottom: 0%;
        animation: cssload-rotate-three 1.15s linear infinite;
        -o-animation: cssload-rotate-three 1.15s linear infinite;
        -ms-animation: cssload-rotate-three 1.15s linear infinite;
        -webkit-animation: cssload-rotate-three 1.15s linear infinite;
        -moz-animation: cssload-rotate-three 1.15s linear infinite;
        border-top: 3px solid rgb(0,158,11);
    }







@keyframes cssload-rotate-one {
    0% {
        transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
    }
}

@-o-keyframes cssload-rotate-one {
    0% {
        -o-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
    }

    100% {
        -o-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
    }
}

@-ms-keyframes cssload-rotate-one {
    0% {
        -ms-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
    }

    100% {
        -ms-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
    }
}

@-webkit-keyframes cssload-rotate-one {
    0% {
        -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
    }

    100% {
        -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
    }
}

@-moz-keyframes cssload-rotate-one {
    0% {
        -moz-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
    }

    100% {
        -moz-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
    }
}

@keyframes cssload-rotate-two {
    0% {
        transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
    }
}

@-o-keyframes cssload-rotate-two {
    0% {
        -o-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
    }

    100% {
        -o-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
    }
}

@-ms-keyframes cssload-rotate-two {
    0% {
        -ms-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
    }

    100% {
        -ms-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
    }
}

@-webkit-keyframes cssload-rotate-two {
    0% {
        -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
    }

    100% {
        -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
    }
}

@-moz-keyframes cssload-rotate-two {
    0% {
        -moz-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
    }

    100% {
        -moz-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
    }
}

@keyframes cssload-rotate-three {
    0% {
        transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
    }

    100% {
        transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
    }
}

@-o-keyframes cssload-rotate-three {
    0% {
        -o-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
    }

    100% {
        -o-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
    }
}

@-ms-keyframes cssload-rotate-three {
    0% {
        -ms-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
    }

    100% {
        -ms-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
    }
}

@-webkit-keyframes cssload-rotate-three {
    0% {
        -webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
    }

    100% {
        -webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
    }
}

@-moz-keyframes cssload-rotate-three {
    0% {
        -moz-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
    }

    100% {
        -moz-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
    }
}
.alertmessage li {
    font-size: 13px;
    text-align: center;
    padding-bottom: 10px;
    color: #ff0000;
}