﻿tr:hover {
    background-color: White !important;
}

tr:nth-child(even), tr:nth-child(odd) {
    background-color: transparent;
}

tr:nth-child(odd) {
    background-color: white;
}

td {
    padding: 0px;
    text-align: left;
    font-size: 100%;
}

.nextbtn {
    float: left;
}


/* Boostrap overwrite */
.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    opacity: .65 !important;
    transform: scale(.75) translateY(-.5rem) translateX(.15rem) !important;
}

/* status bar */
#statuswrapper {
    position: relative;
    z-index: 0;
    border: none;
}

#status {
    text-align: center;
    position: relative;
    margin-top: 20px
}

#progressbar {
    margin-bottom: 30px;
    overflow: hidden;
    color: lightgrey;
    padding: 0px;
}

    #progressbar .active {
        color: #0D83C6
    }

    #progressbar li {
        list-style-type: none;
        font-size: 15px;
        width: 20%;
        float: left;
        position: relative;
        font-weight: 400
    }

    #progressbar #step1.active.complete:before {
        content: '';
        background: url('/media/engineering/status_complete.png');
    }

    #progressbar #step1.active:before {
        /*font-family: FontAwesome;
        content: "\f13e"*/
        content: '';
        background: url('/media/engineering/status_circle_1.png');
    }

    #progressbar #step2.active.complete:before {
        content: '';
        background: url('/media/engineering/status_complete.png');
    }

    #progressbar #step2:before {
        /*font-family: FontAwesome;
        content: "\f007"*/
        content: '';
        background: url('/media/engineering/status_circle_2_gray.png');
    }

    #progressbar #step2.active:before {
        /*font-family: FontAwesome;
        content: "\f007"*/
        content: '';
        background: url('/media/engineering/status_circle_2.png');
    }

    #progressbar #step3.active.complete:before {
        content: '';
        background: url('/media/engineering/status_complete.png');
    }

    #progressbar #step3:before {
        /*font-family: FontAwesome;
        content: "\f030"*/
        content: '';
        background: url('/media/engineering/status_circle_3_gray.png');
    }

    #progressbar #step3.active:before {
        /*font-family: FontAwesome;
        content: "\f007"*/
        content: '';
        background: url('/media/engineering/status_circle_3.png');
    }

    #progressbar #step4.active.complete:before {
        content: '';
        background: url('/media/engineering/status_complete.png');
    }

    #progressbar #step4:before {
        /*font-family: FontAwesome;
        content: "\f00c"*/
        content: '';
        background: url('/media/engineering/status_circle_4_gray.png');
    }

    #progressbar #step4.active:before {
        /*font-family: FontAwesome;
        content: "\f007"*/
        content: '';
        background: url('/media/engineering/status_circle_4.png');
    }

    #progressbar #step5:before {
        /*font-family: FontAwesome;
        content: "\f00c"*/
        content: '';
        background: url('/media/engineering/status_circle_5_gray.png');
    }

    #progressbar #step5.active:before {
        /*font-family: FontAwesome;
        content: "\f007"*/
        content: '';
        background: url('/media/engineering/status_complete.png');
    }

    #progressbar #step1.active:before, #progressbar #step1.active.complete:before,
    #progressbar #step2:before, #progressbar #step2.active:before, #progressbar #step2.active.complete:before,
    #progressbar #step3:before, #progressbar #step3.active:before, #progressbar #step3.active.complete:before,
    #progressbar #step4:before, #progressbar #step4.active:before, #progressbar #step4.active.complete:before,
    #progressbar #step5:before, #progressbar #step5.active:before, #progressbar #step5.active.complete:before {
        background-size: 50px;
        background-repeat: no-repeat;
        width: 50px;
        height: 50px;
        display: block;
    }

    #progressbar li:before {
        width: 50px;
        height: 50px;
        line-height: 45px;
        display: block;
        font-size: 20px;
        color: #ffffff;
        background: lightgray;
        border-radius: 50%;
        margin: 0 auto 10px auto;
        padding: 2px
    }

    #progressbar li:after {
        content: '';
        width: 100%;
        height: 2px;
        background: lightgray;
        position: absolute;
        left: 0;
        top: 25px;
        z-index: -1
    }

    #progressbar li.active:before,
    #progressbar li.active:after {
        background: #0D83C6
    }

.heading1sym {
    font-family: "Arial Black";
    color: #33475B;
    /*font-size: 1.875em;*/
    /*font-size: 1.675em;*/
    font-size: calc(.75em + 3vw);
    line-height: 1.25em;
    letter-spacing: 0em;
    padding: 5px 0px;
}

@media (min-width:820px) {
    .nextbtn {
        float: right;
    }

    .listsize {
        width: 50%;
        text-align: left;
    }
}

@media (min-width:1200px) {
    .heading1sym {
        /*padding: 25px 0px;*/
        padding-top: 0px;
        color: white;
        font-size: calc(.75em + 1vw);
    }

}
