﻿/* ---- Landing Page ---- */

#TopWrapper {
    font-size: 18px;
    background: url('/images/4995/bg.jpg') no-repeat center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#TopWrapperOverlay {
    background: rgba(255,255,255,.8);
    min-height: calc(100vh - 140px);
}

@media (max-width: 767px) {
    #WrapperContent {
       min-height: calc(100vh - 319px);
    }
}

#TopWrapper #content-message {
    font-size: 24px;
    font-weight: 700;
}

.search.row, .search-container.col-md-12 {
    background: none;
}

.col-md-12.statusCoName, .search-header {
    text-align: center;
}

@media (min-width: 1200px) {
    .invitaion-content-section .col-lg-2 {
        width: 25%;
        margin-left: 8.33333333%;
    }

    .invitaion-content-section .col-sm-5 {
        width: 33.33333333%;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .invitaion-content-section .col-lg-2 {
        margin-left: 8.33333333%;
    }

    .invitaion-content-section .col-sm-5 {
        width: 33.33333333%;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .invitaion-content-section .col-lg-2 {
        width: 33.33333333%;
        float: left;
        text-align: right;
    }

    .invitaion-content-section .col-sm-4 {
        width: 25%;
    }
}

@media (min-width: 768px) {
    .invitaion-content-section .col-sm-5 {
        padding-right: 0;
    }

    .invitaion-content-section .col-lg-2 {
        padding-top: 10px;
    }
}

@media (max-width: 767px) {
    .invitaion-content-section .col-lg-2, .invitaion-content-section .col-sm-4 {
        text-align: center;
    }

        .invitaion-content-section .col-sm-4 input {
            margin-top: 10px;
        }
}


/*@media (min-height: 630px) and (min-width: 768px) {
    #TopWrapperOverlay #WrapperContent > .container.content-container {
        margin-top: calc(55vh - 348px);
    }
}

@media (min-height: 770px) and (max-width: 767px) {
    #TopWrapperOverlay #WrapperContent > .container.content-container {
        margin-top: calc(60vh - 464px);
    }
}*/

#TopWrapper .statusCoName {
    margin-bottom: 20px;
    clear: left;
}

.FlowChartStep {
    background: #fff;
    color: #06183d;
    font-weight: 700;
    font-size: 16px;
    text-align: center;
    border: 2px solid #ff6d10;
    width: 12%;
    height: 100px;
    float: left;
    padding: 5px;
    /* Internet Explorer 10 */
    display: -ms-flexbox;
    -ms-flex-pack: center;
    -ms-flex-align: center;
    /* Firefox */
    display: -moz-box;
    -moz-box-pack: center;
    -moz-box-align: center;
    /* Safari, Opera, and Chrome */
    display: -webkit-box;
    -webkit-box-pack: center;
    -webkit-box-align: center;
    /* W3C */
    display: box;
    box-pack: center;
    box-align: center;
    position: relative;
}

.FlowChartConnector {
    float: left;
    width: 2%;
    height: 100px;
    display: block;
}

@media (min-width: 992px) and (max-width: 1199px) {
    .FlowChartStep {
        font-size: 14px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .FlowChartStep {
        font-size: 12px;
        width: 13%;
    }

    .FlowChartConnector {
        width: 1%;
    }
}


.FlowChartStep ul {
    display: none;
}

@media (min-width:768px) {
    .RegFlowChart {
        width: 750px;
        margin-right: auto;
        margin-left: auto
    }
}

@media (min-width:992px) {
    .RegFlowChart {
        width: 970px;
        margin-right: auto;
        margin-left: auto
    }
}

@media (min-width:1200px) {
    .RegFlowChart {
        width: 1170px;
        margin-right: auto;
        margin-left: auto
    }
}

.RegFlowChart {
    display: block;
}

.FlowChartConnecter:last-of-type {
    margin-bottom: 50px;
}


@media (min-width: 768px) {
    .RegFlowChartExpander {
        margin-top: 50px;
        margin-bottom: 50px;
        min-height: 100px;
        background: url('/images/4995/orange_line.png') repeat-x center;
        margin-left: -2000px;
        margin-right: -2000px;
    }

    .FlowChartStep:before {
        content: "";
        width: 8px;
        height: 8px;
        background: url('/images/4995/dot.svg') no-repeat;
        position: absolute;
        left: -5px;
        top: 44px;
    }

    .FlowChartStep:after {
        content: "";
        width: 8px;
        height: 8px;
        background: url('/images/4995/dot.svg') no-repeat;
        position: absolute;
        right: -5px;
        top: 44px;
    }
}

@media (max-width: 767px) {
    .FlowChartStep {
        width: 150px;
        margin-left: auto;
        margin-right: auto;
        float: none;
    }

    .FlowChartStep:before {
        content: "";
        width: 8px;
        height: 8px;
        background: url('/images/4995/dot.svg') no-repeat;
        position: absolute;
        top: -5px;
        left: 69px;
    }

    .FlowChartStep:after {
        content: "";
        width: 8px;
        height: 8px;
        background: url('/images/4995/dot.svg') no-repeat;
        position: absolute;
        bottom: -5px;
        left: 69px;
    }

    .FlowChartConnector {
        width: 150px;
        height: 20px;
        margin-left: auto;
        margin-right: auto;
        float: none;
        background: url('/images/4995/orange_line_vertical.png') repeat-y center;
    }

    .RegFlowChart > .FlowChartConnector:first-child, .RegFlowChart > .FlowChartConnector:last-child {
        background: none;
    }

    .RegFlowChart > .FlowChartConnector:first-child {
        margin-top: 40px;
    }

    .RegFlowChart > .FlowChartConnector:last-child {
        margin-bottom: 40px;
    }
}



#TopWrapperOverlay {
    overflow-x: hidden;
}

