/*Copied from /ecommerce/content/cart.css */

.eCommerce body {
    font-family: Open Sans,sans-serif !important
}

.eCommerce h1 {
    font-weight: 700;
    padding: 26px 0 18px;
    color: #6d6d6d;
    font-size: 18px
}

@media screen and (min-width:320px) {
    .eCommerce h1 {
        font-size: calc(14.36364px + 1.13636vw)
    }
}

@media screen and (min-width:1200px) {
    .eCommerce h1 {
        font-size: 28px
    }
}

.eCommerce h2 {
    color: #555;
    padding: 24px 0 18px;
    font-weight: 700;
    font-size: 16px
}

@media screen and (min-width:320px) {
    .eCommerce h2 {
        font-size: calc(12.36364px + 1.13636vw)
    }
}

@media screen and (min-width:1200px) {
    .eCommerce h2 {
        font-size: 26px
    }
}

.eCommerce h3 {
    color: #6d6d6d;
    padding: 22px 0 16px;
    font-weight: 700;
    font-size: 15px
}

@media screen and (min-width:320px) {
    .eCommerce h3 {
        font-size: calc(12.45455px + .79545vw)
    }
}

@media screen and (min-width:1200px) {
    .eCommerce h3 {
        font-size: 22px
    }
}

.eCommerce h4 {
    font-weight: 700;
    padding: 20px 0 14px;
    color: #6d6d6d;
    font-size: 14px
}

@media screen and (min-width:320px) {
    .eCommerce h4 {
        font-size: calc(11.09091px + .90909vw)
    }
}

@media screen and (min-width:1200px) {
    .eCommerce h4 {
        font-size: 22px
    }
}

.eCommerce .cart-cost, .eCommerce .cart-course {
    font-size: 14px
}

@media screen and (min-width:320px) {
    .eCommerce .cart-cost, .eCommerce .cart-course {
        font-size: calc(12.90909px + .34091vw)
    }
}

@media screen and (min-width:1200px) {
    .eCommerce .cart-cost, .eCommerce .cart-course {
        font-size: 17px
    }
}

body, html {
    background: #fff
}

.ecom_btn-theme {
    background: #fff;
    border: 1px solid #be1428;
    color: #be1428
}

.ecom_btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    min-width: 80px;
    width: auto;
    height: 40px;
    font-size: 14px;
    line-height: 23px;
    border-radius: 0;
    margin-left: 40px;
    transition: none;
    color: #be1428;
    padding: 7px 40px
}

    .ecom_btn:hover {
        color: #fff;
        position: relative;
        box-shadow: none;
        background: #be1428
    }

@media (max-width:767px) {
    .ecom_btn {
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 32px
    }
}

@media (max-width:450px) {
    .ecom_btn {
        margin-right: 10px;
        margin-left: 0
    }
}

@media (max-width:350px) {
    .ecom_btn {
        margin-right: 0;
        margin-left: 0;
        margin-top: 32px
    }
}

.btn-checkout, .btn-checkout:hover {
    border: 1px solid #01bc01;
    color: #fff
}

    .btn-checkout:hover {
        box-shadow: none;
        background: #01bc01
    }

.eCommerce .header > .navbar > .container {
    padding: 20px 0
}

select.form-control {
    background-color: #fff;
    display: inline-block;
    font: inherit;
    line-height: 45px;
    padding: 0 3.5em 0 1em;
    margin: 0;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: linear-gradient(45deg,transparent 50%,grey 0),linear-gradient(135deg,grey 50%,transparent 0),linear-gradient(90deg,#ccc,#ccc);
    background-position: calc(100% - 20px) calc(1em + 6px),calc(100% - 15px) calc(1em + 6px),calc(100% - 2.5em) .5em
}

select.form-control, select:focus {
    background-size: 5px 5px,5px 5px,1px 28px;
    background-repeat: no-repeat
}

select:focus {
    background-image: linear-gradient(45deg,#be1428 50%,transparent 0),linear-gradient(135deg,transparent 50%,#be1428 0),linear-gradient(90deg,#ccc,#ccc);
    background-position: calc(100% - 15px) 1em,calc(100% - 20px) 1em,calc(100% - 2.5em) .5em;
    outline: 0
}

select:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #000
}

span.asterisk {
    color: #be1428
}

input.form-control, select.form-control {
    height: 45px;
    box-shadow: 1px 1px 3px #eee;
    border-radius: 1px
}

    input.form-control.students_input {
        background-color: transparent
    }

hr.section-separator {
    display: none
}

.tooltip.bottom .tooltip-inner, .tooltip.left .tooltip-inner, .tooltip.top .tooltip-inner {
    background-color: #be1428;
    min-width: 250px
}

.tooltip.bottom .tooltip-arrow, .tooltip.left .tooltip-arrow, .tooltip.top .tooltip-arrow {
    border-left-color: #be1428;
    border-top-color: #be1428;
    border-bottom: #be1428
}

svg.tooltip_img {
    height: 18px;
    width: 18px;
    position: relative
}

    svg.tooltip_img:hover .st1 {
        fill: #be1428;
        opacity: .5
    }

.elevator-button {
    display: none;
    background: none;
    margin: 0;
    position: fixed;
    bottom: 0;
    right: 0;
    width: 90px;
    height: 55px;
    z-index: 100;
    text-decoration: none;
    color: #6d6d6d;
    background-color: none;
    text-transform: uppercase;
    font-size: 8px;
    text-align: center;
    line-height: 16px
}

    .elevator-button:hover {
        color: #be1428
    }

    .elevator-button span.upchevron {
        font-size: 45px
    }

.course_name, span.course_name strong {
    color: #be1428 !important
}

.form-control::-ms-expand {
    display: none
}

.form-control + .glyphicon {
    position: absolute;
    right: 16px;
    top: -2px;
    padding: 8px 27px
}

.shopping-cart-placeholder {
    margin-top: 0;
    margin-left: 30%;
    margin-right: 0;
    padding-left: 0
}

.shopping-cart-placeholder-inapp {
    margin-top: 30px;
    margin-left: 30%
}

.shopping-cart {
    padding-top: 0;
    border: none;
    outline: none;
    height: 33px
}

@media only screen and (max-width:992px) {
    .shopping-cart {
        height: 24px
    }
}

button.shopping-cart {
    color: #fff;
    background-color: #be1428;
    border: none;
    outline: none
}

@media only screen and (max-width:768px) {
    button.shopping-cart {
        background-color: #be1428
    }
}

button.shopping-cart:hover {
    border: none;
    outline: none
}

.shopping-cart-fa {
    color: #fff;
    padding-left: 10px !important
}

    .shopping-cart-fa:hover {
        color: #fff !important
    }

.shopping-cart-dropdown {
    width: 300px;
    padding-left: 0;
    padding-right: 0;
    background-color: #fff !important;
    overflow-y: auto;
    position: absolute;
    left: -230px !important;
    border-radius: 0;
    top: 40px
}

.cart {
    background-color: #fff !important;
    padding-left: 20px !important;
    padding-right: 20px !important
}

    .cart, .cart li {
        list-style-type: none;
        width: auto;
        font-family: Lato,Helvetica Neue,Helvetica,Arial,sans-serif;
        font-size: 10pt;
        color: #6d6d6d
    }

        .cart li {
            background-color: #fff;
            line-height: 1.5
        }

        .cart a {
            font-family: Lato,Helvetica Neue,Helvetica,Arial,sans-serif;
            font-size: 10pt !important;
            color: #ba1322
        }

.cart-empty {
    text-align: center;
    padding-top: 10px
}

.dropdown-menu .quantity {
    color: #6d6d6d;
    background-color: #fff;
    padding-right: 10px;
    padding-left: 40px;
    text-align: right;
    float: right;
    overflow: hidden
}

.cart-dropdown-header {
    list-style-type: none !important;
    font-family: Lato,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size: 13pt !important;
    color: #6d6d6d !important;
    padding-left: 0 !important;
    padding-bottom: 10px;
    font-weight: bolder
}

.cart-divider {
    margin-top: 2em
}

.cart-divider, .cart-divider-first {
    background-color: #6d6d6d !important;
    color: #6d6d6d !important;
    margin-bottom: .5em;
    border-style: ridge
}

.cart-divider-first {
    margin-top: .5em
}

.cartlink {
    white-space: nowrap;
    color: #fff
}

    .cartlink a {
        color: #fff;
        font-size: 14px
    }

        .cartlink a:hover {
            color: #be1428;
            text-decoration: none
        }

.btn span.glyphicon {
    opacity: 0
}

.btn.active span.glyphicon {
    opacity: 1
}

.spinner input {
    text-align: right
}

.loading-animation {
    display: none;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: hsla(0,0%,100%,.8) url(../Images/ajax-loader.gif) 50% 50% no-repeat
}

.loading-animation-text {
    position: relative;
    float: left;
    transform: translate(-50%,-150%);
    vertical-align: middle
}

#snackbar, .loading-animation-text {
    top: 50%;
    left: 50%;
    text-align: center
}

#snackbar {
    visibility: hidden;
    min-width: 250px;
    background-color: #333;
    color: #fff;
    border-radius: 10px;
    padding: 16px;
    position: fixed;
    z-index: 1;
    bottom: 30px;
    font-size: 17px;
    width: 250px;
    height: 50px;
    position: center;
    margin-top: -25px;
    margin-left: -125px
}

    #snackbar.show {
        visibility: visible;
        animation: fadein .5s,fadeout .5s 2.5s
    }

@keyframes fadein {
    0% {
        bottom: 0;
        opacity: 0
    }

    to {
        bottom: 30px;
        opacity: 1
    }
}

@keyframes fadeout {
    0% {
        bottom: 30px;
        opacity: 1
    }

    to {
        bottom: 0;
        opacity: 0
    }
}

body.loading {
    overflow: hidden
}

    body.loading .modal {
        display: block
    }

.btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
    min-width: 0;
    box-shadow: none;
    border: none
}

    .btn-circle:hover {
        background: #f2f2f2 !important
    }

.modal {
    text-align: center;
    padding: 0 !important
}

    .modal:before {
        content: "";
        height: 100%;
        margin-right: -4px
    }

    .modal-dialog, .modal:before {
        display: inline-block;
        vertical-align: middle
    }

.modal-dialog {
    text-align: left
}

.model-title {
    background-color: #ff4500 !important;
    font-size: 16px
}

.model-body {
    font-size: 13px
}

#cartDetails .cart_binicon-wrapper, #cartDetails .cart_binicon-wrapper span {
    text-align: right
}

@media screen and (max-width:767px) {
    #cartDetails .cart_binicon-wrapper {
        text-align: left
    }
}

@media screen and (max-width:767px) {
    .cart_row-title {
        display: none
    }
}

.cart_container {
    padding: 90px 15px 60px
}

@media (max-width:992px) {
    .cart_container {
        padding: 136px 15px 60px
    }
}

.cart_attendees-mobile {
    display: none
}

@media screen and (max-width:767px) {
    .cart_attendees-mobile {
        display: block;
        font-weight: 700;
        padding-top: 16px
    }
}

.checkout-main-grid-mobile {
    display: none
}

@media screen and (max-width:767px) {
    .checkout-main-grid-mobile {
        display: block
    }
}

@media screen and (max-width:767px) {
    .inline-quantity-control {
        padding-left: 0
    }
}

.amount_to_be_charged {
    font-weight: 700;
    color: #333;
    font-size: 22px
}

.cart-discount-label {
    width: 100%;
    font-weight: 200
}

    .cart-discount-label input.cart-discount-input {
        width: 36%;
        display: inline-block;
        height: 40px;
        border: 1px solid #ccc;
        padding-left: 4px;
        background-color: #e5e5e5;
        transition: ease
    }

        .cart-discount-label input.cart-discount-input:focus {
            background-color: #fff
        }

    .cart-discount-label a.cart-discount-btn {
        width: 24%;
        display: inline-block;
        margin-left: -5px;
        padding: 0;
        line-height: 36px;
        top: -1px;
        position: relative;
        background-color: #e5e5e5 !important;
        border-color: #ccc !important;
        color: #ccc;
        margin-top: 0 !important
    }

        .cart-discount-label a.cart-discount-btn.discount_focus {
            background-color: #01bc01 !important;
            border-color: #01bc01 !important;
            color: #fff
        }

.fees_title {
    text-align: left
}

.cart-discount, .selfenrol-row {
    margin: 8px 0
}

.strikeout {
    text-decoration: line-through
}

.cart_binicon p {
    margin-bottom: 0;
    top: 4px;
    font-size: 11px
}

.cart_binicon i, .cart_binicon p {
    display: inline-block;
    position: relative;
    color: #acacac
}

span.tooltip-students {
    display: none;
    background-color: #be1428;
    position: absolute;
    width: 150px;
    font-size: 11px;
    line-height: 1;
    color: #fff;
    padding: 8px;
    transition: ease
}

    span.tooltip-students:before {
        content: "";
        width: 0;
        height: 0;
        border-bottom: 12px solid transparent;
        border-top: 12px solid transparent;
        border-right: 12px solid #be1428;
        position: absolute;
        top: 0;
        left: -12px
    }

svg.tip_payment, svg.tip_student {
    margin-right: 20px
}

span.tooltip-payment {
    display: none;
    background-color: #be1428;
    position: absolute;
    width: 200px;
    font-size: 11px;
    line-height: 1;
    color: #fff;
    padding: 8px;
    transition: ease
}

    span.tooltip-payment:before {
        content: "";
        width: 0;
        height: 0;
        border-bottom: 12px solid transparent;
        border-top: 12px solid transparent;
        border-right: 12px solid #be1428;
        position: absolute;
        top: 0;
        left: -12px
    }

.has-def-payment {
    display: block
}

.cart_note {
    text-align: right;
    font-size: 11px !important;
    margin-top: 16px;
    padding: 0
}

@media (max-width:480px) {
    .cart_note {
        padding-right: 15px;
        padding-left: 15px
    }
}

.cart_note a {
    color: #be1428;
    font-size: 11px !important
}

.cart_table .sc_table-wrapper .sc_table-LHS {
    flex-direction: column
}

    .cart_table .sc_table-wrapper .sc_table-LHS .sc_table-delivery__row {
        margin-bottom: 22px
    }

.cart_table .sc_table-wrapper h4.cart-header-student {
    margin-top: 0
}

.cart_table .fees_row .sc_table-delivery__row {
    padding-right: 0;
    padding-left: 0
}

button.shopping-cart .cart_icon_holder {
    background-image: url(/img/assets/headerMenu/cart.svg);
    height: 32px;
    position: relative;
    background-repeat: no-repeat;
    width: 32px;
    display: inline-block
}

@media only screen and (max-width:992px) {
    button.shopping-cart .cart_icon_holder {
        height: 20px;
        width: 20px;
        background-size: 20px
    }
}

@media only screen and (max-width:992px) {
    button.shopping-cart {
        padding: 2px
    }
}

button.shopping-cart:hover {
    background-color: #fff;
    color: #be1428
}

    button.shopping-cart:hover .cart_icon_holder {
        background-position-y: 100%
    }

@media only screen and (max-width:992px) {
    button.shopping-cart:hover {
        padding: 2px
    }
}

button.shopping-cart:hover:focus {
    color: #be1428
}

button.shopping-cart:focus {
    color: #fff
}

button.shopping-cart .cart_quantity_holder {
    display: inline;
    position: relative;
    top: -9px
}

@media only screen and (max-width:992px) {
    button.shopping-cart .cart_quantity_holder {
        top: -3px
    }
}

.shopping-cart-dropdown #cartitems li > a {
    color: #be1428;
    width: auto;
    padding: 0;
    border-right: none
}

.shopping-cart-dropdown #cartitems li.btn > a {
    color: #fff
}

    .shopping-cart-dropdown #cartitems li.btn > a:hover {
        color: #be1428
    }

.cart-item ul {
    list-style-type: none;
    margin: 0;
    padding: 10px 20px
}

.field-validation-error {
    color: #be1428;
    font-weight: 700
}

.field-validation-valid {
    display: none
}

input.input-validation-error, select.input-validation-error {
    border: 1px solid #e80c4d
}

.validation-summary-errors {
    color: #be1428;
    font-weight: 700;
    font-size: 1.1em
}

.validation-summary-valid {
    display: none
}

.payment-error, .payment-error h2 {
    color: #be1428;
    font-weight: 700
}

    .payment-error li {
        font-weight: 400;
        color: #be1428;
        list-style-type: circle
    }

.section-separator {
    margin: 0;
    padding: 0 0 10px
}

.applications-fieldset {
    border: .1pt solid #000;
    padding: 5px
}

.applications-course-info-bullets {
    padding: 5px 5px 0 0;
    margin: 16px 0
}

.payment_table {
    margin-bottom: 15px
}

    .payment_table th {
        background-color: #f5f5f5;
        color: #777;
        padding: 10px 5px;
        text-align: center;
        vertical-align: top;
        font-size: 11px
    }

@media screen and (min-width:320px) {
    .payment_table th {
        font-size: calc(8.85714px + .66964vw)
    }
}

@media screen and (min-width:768px) {
    .payment_table th {
        font-size: 14px
    }
}

.payment_table td {
    color: #444;
    padding: 8px 5px 5px;
    text-align: center
}

.btn-delete {
    line-height: 2em !important;
    padding-right: 15px
}

.cart-item-add, .cart-item-minus {
    margin-right: 0 !important;
    color: #707070 !important
}

.cart-item-quantity {
    max-width: 50px;
    text-align: center;
    display: inline;
    background-color: #fff !important
}

.text-info {
    font-size: 13px
}

.enrolling-myself {
    padding-top: 10px;
    padding-bottom: 15px;
    font-size: 13px;
    width: 160px;
    text-align: center
}

@media screen and (max-width:767px) {
    .enrolling-myself {
        width: 100%;
        text-align: left;
        padding-left: 0
    }
}

.checkout-main-grid {
    margin-top: .5em;
    margin-bottom: .5em
}

.btn-checkout {
    background-color: #01bc01;
    border-color: #01bc01;
    color: #fff !important
}

.icon-padded {
    padding-top: 10px;
    padding-left: 0;
    padding-right: 30px
}

h4.cart-header-student {
    text-align: center;
    padding: 0
}

.sub-total {
    font-size: 15px;
    font-weight: 700
}

.btn-update {
    padding-right: 0
}

@media (max-width:479px) {
    .btn-update {
        padding-right: 12px !important;
        padding-bottom: 5px !important
    }

    .btn-delete {
        padding-left: 0
    }
}

@media (max-width:796px) {
    .btn-delete {
        padding-left: 15px
    }
}

.info-empty {
    padding-bottom: 1em
}

.cart-course {
    font-weight: 700
}

.cart-course-name, .cart-course-name:visited {
    color: #ba1322
}

.cart-cost {
    font-weight: 700
}

.cart-duration, .cart-location {
    padding-top: 1px;
    padding-bottom: 1px
}

.body-content {
    padding-left: 15px;
    padding-right: 15px
}

.dl-horizontal dt {
    white-space: normal
}

.res_address {
    position: absolute;
    right: 16px;
    top: -2px;
    padding: 8px 27px
}

.checkbox_label {
    margin-top: 6px
}

.address_checkbox {
    vertical-align: bottom;
    margin-left: 10px
}

.bulletpoint_list {
    list-style-type: disc
}

.personalDetails {
    padding-top: 90px;
    padding-bottom: 70px
}

    .personalDetails .course_container h2 {
        padding: 24px 0 0
    }

.course_flex {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap
}

@media screen and (max-width:767px) {
    .course_flex {
        flex-direction: column
    }
}

.course_flex .flex_item {
    border: 1px solid #ccc;
    width: 30%;
    overflow: auto;
    padding: 16px;
    border-radius: 7px;
    margin-right: 24px;
    margin-top: 16px
}

@media (max-width:767px) {
    .course_flex .flex_item {
        width: 100%;
        margin: 8px 0
    }
}

.course_flex .flex_item ul {
    padding-left: 0;
    margin-bottom: 0
}

    .course_flex .flex_item ul li {
        padding: 2px 0
    }

        .course_flex .flex_item ul li label {
            color: #333;
            margin-bottom: 0
        }

.course_flex-single {
    border: 1px solid #ccc;
    display: flex;
    flex-direction: row;
    overflow: auto;
    padding: 16px;
    border-radius: 7px;
    flex-wrap: wrap;
    margin-top: 32px;
    margin-bottom: 24px
}

@media screen and (max-width:991px) {
    .course_flex-single {
        flex-direction: column
    }
}

.course_flex-single .course_flex-item {
    margin: 0 16px auto;
    width: 180px
}

#divProgressBar {
    margin: 22px 0
}

    #divProgressBar ul.nav {
        margin: 0;
        padding: 0;
        list-style: none
    }

@media screen and (max-width:767px) {
    #divProgressBar ul.nav {
        display: flex;
        width: 95%
    }
}

@media screen and (max-width:767px) {
    #divProgressBar ul.nav li {
        flex-grow: 1
    }
}

#divProgressBar ul.nav li a {
    width: 97%;
    height: 50px;
    position: relative;
    background: #eee;
    border-radius: 0
}

@media screen and (max-width:767px) {
    #divProgressBar ul.nav li a {
        width: auto
    }
}

@media (max-width:350px) {
    #divProgressBar ul.nav li a {
        height: 50px
    }
}

#divProgressBar ul.nav li a p {
    margin-left: 15px;
    margin-top: 6px
}

@media screen and (max-width:767px) {
    #divProgressBar ul.nav li a p {
        margin-left: 0;
        margin-top: 0;
        top: 7px;
        position: relative;
        font-size: 10px
    }
}

@media screen and (max-width:767px) and (min-width:320px) {
    #divProgressBar ul.nav li a p {
        font-size: calc(7.85714px + .66964vw)
    }
}

@media screen and (max-width:767px) and (min-width:768px) {
    #divProgressBar ul.nav li a p {
        font-size: 13px
    }
}

@media (max-width:480px) {
    #divProgressBar ul.nav li a p {
        top: 7px;
        position: relative;
        left: 6px
    }
}

@media (max-width:350px) {
    #divProgressBar ul.nav li a p {
        position: relative
    }
}

#divProgressBar ul.nav li a:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-left: 25px solid #fff;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent
}

@media screen and (max-width:350px) {
    #divProgressBar ul.nav li a:after {
        content: "";
        position: inherit;
        left: inherit;
        bottom: inherit;
        width: inherit;
        height: inherit;
        border-left: inherit;
        border-top: inherit;
        border-bottom: inherit
    }
}

#divProgressBar ul.nav li a:before {
    content: "";
    position: absolute;
    right: -25px;
    bottom: 0;
    width: 0;
    height: 0;
    border-left: 25px solid #eee;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
    z-index: 1
}

@media screen and (max-width:350px) {
    #divProgressBar ul.nav li a:before {
        content: "";
        position: inherit;
        right: inherit;
        bottom: inherit;
        width: inherit;
        height: inherit;
        border-left: inherit;
        border-top: inherit;
        border-bottom: inherit;
        z-index: inherit
    }
}

#divProgressBar ul.nav li:first-child a:after {
    left: 0;
    border-left: 0 solid #fff
}

#divProgressBar ul.nav li:first-child a:after, #divProgressBar ul.nav li:last-child a:before {
    content: "";
    position: absolute;
    bottom: 0;
    width: 0;
    height: 0;
    border-top: 0 solid transparent;
    border-bottom: 0 solid transparent
}

#divProgressBar ul.nav li:last-child a:before {
    right: 0;
    border-left: 0 solid #eee;
    z-index: 1
}

#divProgressBar ul.nav li.active a {
    background-color: #be1428
}

    #divProgressBar ul.nav li.active a:before {
        content: "";
        position: absolute;
        right: -25px;
        bottom: 0;
        width: 0;
        height: 0;
        border-left: 25px solid #be1428;
        border-top: 25px solid transparent;
        border-bottom: 25px solid transparent;
        z-index: 1
    }

@media screen and (max-width:350px) {
    #divProgressBar ul.nav li.active a:before {
        content: "";
        position: inherit;
        right: inherit;
        bottom: inherit;
        width: inherit;
        height: inherit;
        border-left: inherit;
        border-top: inherit;
        border-bottom: inherit;
        z-index: inherit
    }
}

#divProgressBar ul.nav li.active:last-child a:before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-left: 0 solid #eee;
    border-top: 0 solid transparent;
    border-bottom: 0 solid transparent;
    z-index: 1
}

@media (-ms-high-contrast:none),screen and (-ms-high-contrast:active) {
    #divProgressBar ul.nav li.item0 p, #divProgressBar ul.nav li.item1 p {
        top: 0;
        position: relative
    }
}

@media screen and (max-width:991px) and (-ms-high-contrast:active),screen and (max-width:991px) and (-ms-high-contrast:none) {
    #divProgressBar ul.nav li.item0 p, #divProgressBar ul.nav li.item1 p {
        top: 0;
        position: relative
    }
}

@media screen and (max-width:767px) {
    .nav-pills > li + li {
        margin-left: 0
    }
}

@media screen and (max-width:767px) {
    #divProgressBar .step_completed {
        display: none
    }
}

#divProgressBar span.steps_cheveon {
    display: none
}

@media screen and (max-width:767px) {
    #divProgressBar span.steps_cheveon {
        display: none;
        font-size: 10px
    }
}

@media screen and (max-width:767px) and (min-width:320px) {
    #divProgressBar span.steps_cheveon {
        font-size: calc(7.85714px + .66964vw)
    }
}

@media screen and (max-width:767px) and (min-width:768px) {
    #divProgressBar span.steps_cheveon {
        font-size: 13px
    }
}

@media (max-width:768px) {
    #frmPersonalDetails .personalDetails_label {
        margin-bottom: 0
    }
}

#frmPersonalDetails {
    margin-bottom: 60px
}

    #frmPersonalDetails p.personalDetails_instruction {
        color: #6d6d6d;
        font-size: smaller;
        margin-bottom: 22px
    }

    #frmPersonalDetails label {
        line-height: 15px;
        padding-top: 12px;
        padding-right: 2px
    }

.requiredFieldToggle:after, label[for=PersonalDetailsInfo_AboriginalTorresStraitIslander]:after, label[for=PersonalDetailsInfo_BirthCountry]:after, label[for=PersonalDetailsInfo_BirthCountryInput]:after, label[for=PersonalDetailsInfo_CITBCardNumber]:after, label[for=PersonalDetailsInfo_ConfirmationEmail]:after, label[for=PersonalDetailsInfo_DateOfBirth]:after, label[for=PersonalDetailsInfo_Email]:after, label[for=PersonalDetailsInfo_EmergencyContactFirstName]:after, label[for=PersonalDetailsInfo_EmergencyContactLastName]:after, label[for=PersonalDetailsInfo_EnglishProficiency]:after, label[for=PersonalDetailsInfo_FirstName]:after, label[for=PersonalDetailsInfo_Gender]:after, label[for=PersonalDetailsInfo_HasADisabilityOrMedicalCondition]:after, label[for=PersonalDetailsInfo_HasCITBCard]:after, label[for=PersonalDetailsInfo_HasUniqueStudentIdentifier]:after, label[for=PersonalDetailsInfo_HelpWithEnglish]:after, label[for=PersonalDetailsInfo_HomeLanguage]:after, label[for=PersonalDetailsInfo_HowFind]:after, label[for=PersonalDetailsInfo_LastName]:after, label[for=PersonalDetailsInfo_MobilePhone]:after, label[for=PersonalDetailsInfo_PostalBuildingNumber]:after, label[for=PersonalDetailsInfo_PostalPostcode]:after, label[for=PersonalDetailsInfo_PostalState]:after, label[for=PersonalDetailsInfo_PostalStreet]:after, label[for=PersonalDetailsInfo_PostalSuburb]:after, label[for=PersonalDetailsInfo_ReasonForStudy]:after, label[for=PersonalDetailsInfo_ResidencyStatus]:after, label[for=PersonalDetailsInfo_ResidentialBuildingNumber]:after, label[for=PersonalDetailsInfo_ResidentialPostcode]:after, label[for=PersonalDetailsInfo_ResidentialState]:after, label[for=PersonalDetailsInfo_ResidentialStreet]:after, label[for=PersonalDetailsInfo_ResidentialSuburb]:after, label[for=PersonalDetailsInfo_WasBornInAustralia]:after, label[for=PersonalDetailsInfo_YearOfArrival]:after {
    content: "*";
    color: #be1428;
    font-weight: 400
}

#disabilities input.btn, #new-disability input.btn {
    margin-top: 8px
}

@media (max-width:768px) {
    .trippleddldatetime .col-sm-3 {
        width: 22%
    }
}

@media (max-width:480px) {
    .trippleddldatetime .col-sm-3 {
        width: 100%
    }
}

@media (max-width:992px) {
    #divProgressBar li.hide_on_mob {
        display: none
    }
}

.header_spacer {
    padding: 35px
}

ul.af_list li.af_item {
    padding: 10px !important
}

.education_conatiner {
    margin-bottom: 60px
}

label[for=EducationInfo_HasTertiaryEducation]:after, label[for=EducationInfo_HighestSecondaryEducationCompleted]:after, label[for=EducationInfo_IsStillAtSecondaryEducation]:after, label[for=EducationInfo_YearHighestSecondaryEducationCompleted]:after, label[for=EmploymentInfo_EmploymentPostcode]:after, label[for=EmploymentInfo_EmploymentState]:after, label[for=EmploymentInfo_EmploymentStatus]:after, label[for=EmploymentInfo_EmploymentSuburb]:after {
    content: "*";
    color: #be1428;
    font-weight: 400
}

#divTertiary .table > tbody > tr > td {
    padding: 15px 8px 4px
}

td {
    vertical-align: middle
}

@media (max-width:768px) {
    #frmEducation .education_label {
        margin-bottom: 0
    }
}

.panel {
    margin-bottom: 0
}

    .panel, .panel a {
        text-decoration: none
    }

        .panel a {
            color: #be1428
        }

            .panel a:hover {
                color: #333
            }

            .panel a .panel-heading {
                background-color: #eee
            }

                .panel a .panel-heading h4 {
                    padding: 16px 0;
                    display: inline-block
                }

                .panel a .panel-heading i.fa-minus {
                    display: inline-block;
                    padding: 0 8px;
                    font-size: 22px;
                    top: 3px;
                    position: relative
                }

                .panel a .panel-heading i.fa-plus {
                    display: none
                }

            .panel a.collapsed {
                color: #be1428
            }

                .panel a.collapsed .panel-heading {
                    background-color: #eee
                }

                    .panel a.collapsed .panel-heading h4 {
                        padding: 16px 0;
                        display: inline-block
                    }

                    .panel a.collapsed .panel-heading i.fa-plus {
                        display: inline-block;
                        padding: 0 8px;
                        font-size: 22px;
                        top: 3px;
                        position: relative
                    }

                    .panel a.collapsed .panel-heading i.fa-minus {
                        display: none
                    }

#qualifications td div.year {
    text-align: center
}

.panel-default > .panel-heading a:after {
    content: "";
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: Glyphicons Halflings;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    float: right;
    transition: transform .25s linear;
    -webkit-transition: -webkit-transform .25s linear
}

.panel-default > .panel-heading a[aria-expanded=true]:after {
    content: "\2212";
    transform: rotate(180deg)
}

.panel-default > .panel-heading a[aria-expanded=false]:after {
    content: "\002b";
    transform: rotate(90deg)
}

.accordion-option {
    width: 100%;
    float: left;
    clear: both;
    margin: 15px 0
}

    .accordion-option .title {
        font-size: 20px;
        font-weight: 700;
        float: left;
        padding: 0;
        margin: 0
    }

@media (max-width:767px) {
    #accordion .form-group:not(.accordion_userInput), #accordion .form-group:not(.accordion_userInput) label {
        margin-bottom: 0
    }
}

.student_card-flexWrapper {
    display: flex;
    flex-wrap: wrap
}

.card-fieldset {
    margin: 8px;
    width: 260px
}

    .card-fieldset .student_card {
        border: 1px solid #6d6d6d;
        border-radius: 7px
    }

        .card-fieldset .student_card .student_card-titleblock {
            height: 20px;
            border-radius: 5px 5px 0 0;
            background-color: #be1428
        }

        .card-fieldset .student_card .card-container {
            padding: 10px
        }

@media screen and (max-width:767px) {
    .card-fieldset .student_card {
        flex-direction: column
    }
}

table.applicant-card-table i {
    margin-right: 4px;
    position: relative;
    top: 3px
}

.review_course-wrapper {
    border: 1px solid #ccc;
    border-radius: 7px;
    padding: 16px;
    margin: 16px 0
}

    .review_course-wrapper h3 {
        padding: 0 0 16px
    }

    .review_course-wrapper .students_enrolling-wrapper {
        margin-bottom: 0
    }

#divDisability > table.table.remove-buffer-bottom > tbody > tr > th:nth-child(2) {
    position: relative;
    left: 108px
}

@media screen and (max-width:767px) {
    #divDisability > table.table.remove-buffer-bottom > tbody > tr > th:nth-child(2) {
        left: 0
    }
}

label[for=ApplicantInfo_ConfirmationEmail]:after, label[for=ApplicantInfo_DateOfBirth]:after, label[for=ApplicantInfo_Email]:after, label[for=ApplicantInfo_FirstName]:after, label[for=ApplicantInfo_Gender]:after, label[for=ApplicantInfo_HasCITBConcession]:after, label[for=ApplicantInfo_HasConcession]:after, label[for=ApplicantInfo_HasUniqueStudentIdentifier]:after, label[for=ApplicantInfo_LastName]:after, label[for=ApplicantInfo_MobilePhone]:after, label[for=ApplicantInfo_ResidentialAddressInput]:after, label[for=ApplicantInfo_ResidentialBuildingNumber]:after, label[for=ApplicantInfo_ResidentialPostcode]:after, label[for=ApplicantInfo_ResidentialState]:after, label[for=ApplicantInfo_ResidentialStreet]:after, label[for=ApplicantInfo_ResidentialSuburb]:after, label[for=ApplicantInfo_UniqueStudentIdentifier]:after, label[for=PrivacyDetailsInfo_ConfirmationEmail]:after, label[for=PrivacyDetailsInfo_ContactFirstName]:after, label[for=PrivacyDetailsInfo_ContactLastName]:after, label[for=PrivacyDetailsInfo_Email]:after, label[for=PrivacyDetailsInfo_Phone]:after {
    content: "*";
    color: #be1428;
    font-weight: 400
}

@media (max-width:767px) {
    #applicants .form-group {
        margin-bottom: 0
    }
}

#applicantDetails {
    margin-bottom: 60px
}

    #applicantDetails p.applicant_instructions {
        color: #6d6d6d;
        font-size: smaller;
        margin-bottom: 22px
    }

    #applicantDetails label {
        line-height: 15px;
        padding-top: 12px;
        padding-right: 2px
    }

ul.applications-course-info-bullets li label {
    padding-top: 0 !important;
    margin-bottom: 0
}

.payment_instructions, p.applicant_instructions {
    color: #6d6d6d;
    font-size: smaller;
    margin-bottom: 22px
}

    .payment_instructions:after {
        content: "*";
        color: #be1428;
        font-weight: 400
    }

.payment_notes {
    color: #6d6d6d;
    font-size: smaller;
    margin-bottom: 22px
}

#frmPaymentDetails img {
    height: 45px;
    top: -2px;
    position: relative
}

#frmPaymentDetails label.payment-note {
    font-weight: 400
}

.total-charge_row {
    min-height: 60px
}

label[for=ddlExpiryMonth]:after, label[for=PayerInfo_NameOnCard]:after, label[for=PaymentInfo_CreditCardNumber]:after, label[for=PaymentInfo_CVC]:after {
    content: "*";
    color: #be1428;
    font-weight: 400
}

.flex-container {
    display: flex;
    justify-content: space-evenly;
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    flex-flow: row wrap
}

.flex-item {
    color: #fff;
    margin: 10px 0;
    position: relative
}

.flex-item, .flex-item-inner {
    height: 242px;
    padding: 0;
    width: 242px
}

.flex-item-inner {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    margin: 0
}

    .flex-item-inner a {
        color: #fff;
        cursor: pointer
    }

.card-back, .card-front {
    position: absolute;
    top: 0;
    left: 0;
    width: 240px;
    height: 240px;
    padding: 20px;
    margin: 0;
    backface-visibility: hidden;
    transition: transform .3s;
    justify-content: flex-end;
    background-color: #be1428
}

.card-front {
    background-image: url(https://www.tafesa.edu.au/images/default-source/hostedassets/tile_background_2.jpg);
    background-size: 242px
}

    .card-front i.tile-icon {
        display: block;
        margin: 10px auto 20px;
        text-align: center
    }

    .card-front h4 {
        font-size: 18px;
        font-weight: 400;
        margin: 10px 0;
        text-transform: uppercase;
        position: absolute;
        bottom: 0;
        font-weight: 700;
        color: #be1428
    }

    .card-front p.detail {
        font-size: 24px;
        font-weight: 700;
        margin: 0
    }

.card-back {
    background-color: #be1428;
    transform: rotateY(-180deg)
}

    .card-back p.title {
        color: #333;
        margin-top: 0;
        text-transform: uppercase
    }

    .card-back p.desc {
        color: #fff;
        overflow: auto;
        height: 134px;
        text-overflow: ellipsis
    }

    .card-back p.link {
        color: #fff;
        text-transform: uppercase
    }

.flex-item:hover .card-front {
    transform: rotateY(-180deg)
}

.flex-item:hover .card-back {
    transform: rotateY(0)
}

ul.additional_resources p {
    display: inline-block;
    top: -5px;
    position: relative
}

ul.additional_resources a {
    color: #333
}

    ul.additional_resources a:hover {
        color: #be1428
    }

ul.additional_resources li {
    padding: 8px 0
}

    ul.additional_resources li:before {
        background-position: bottom;
        content: "";
        height: 23px;
        width: 23px;
        display: inline-block;
        background-repeat: no-repeat;
        margin-right: 8px;
        background-image: url(https://www.tafesa.edu.au/docs/default-source/sgvassets/lnr-select.svg)
    }

label[for=ApprenticeshipEnquiryInfo_ApprenticeInterest]:after, label[for=ApprenticeshipEnquiryInfo_BusinessIndustry]:after, label[for=ApprenticeshipEnquiryInfo_BusinessName]:after, label[for=ApprenticeshipEnquiryInfo_ConfirmationEmail]:after, label[for=ApprenticeshipEnquiryInfo_Email]:after, label[for=ApprenticeshipEnquiryInfo_EmployerInterest]:after, label[for=ApprenticeshipEnquiryInfo_FirstName]:after, label[for=ApprenticeshipEnquiryInfo_LastName]:after, label[for=ApprenticeshipEnquiryInfo_Phone]:after, label[for=ApprenticeshipEnquiryInfo_StaffNumber]:after, label[for=RegisterPersonalInfo_ConfirmationEmail]:after, label[for=RegisterPersonalInfo_Email]:after, label[for=RegisterPersonalInfo_FirstName]:after, label[for=RegisterPersonalInfo_LastName]:after, label[for=RegisterPersonalInfo_Postcode]:after, label[for=RegisterPersonalInfo_State]:after, label[for=RegisterPersonalInfo_Suburb]:after, label[for=VETRegisterPersonalInfo_ConfirmationCoordinatorEmail]:after, label[for=VETRegisterPersonalInfo_ConfirmationEmail]:after, label[for=VETRegisterPersonalInfo_CoordinatorEmail]:after, label[for=VETRegisterPersonalInfo_CoordinatorFirstName]:after, label[for=VETRegisterPersonalInfo_CoordinatorLastName]:after, label[for=VETRegisterPersonalInfo_CoordinatorSchoolOrCompanyName]:after, label[for=VETRegisterPersonalInfo_CourseLocation]:after, label[for=VETRegisterPersonalInfo_DateOfBirth]:after, label[for=VETRegisterPersonalInfo_Email]:after, label[for=VETRegisterPersonalInfo_FirstName]:after, label[for=VETRegisterPersonalInfo_LastName]:after, label[for=VETRegisterPersonalInfo_Phone]:after, label[for=VETRegisterPersonalInfo_PostalBuildingNumber]:after, label[for=VETRegisterPersonalInfo_PostalPostcode]:after, label[for=VETRegisterPersonalInfo_PostalSuburb]:after, label[for=VETRegisterPersonalInfo_PostState]:after, label[for=VETRegisterPersonalInfo_ResidentialBuildingNumber]:after, label[for=VETRegisterPersonalInfo_ResidentialPostcode]:after, label[for=VETRegisterPersonalInfo_ResidentialState]:after, label[for=VETRegisterPersonalInfo_ResidentialStreet]:after, label[for=VETRegisterPersonalInfo_ResidentialSuburb]:after, label[for=VETRegisterPersonalInfo_SchoolName]:after, label[for=VETRegisterPersonalInfo_YearLevel]:after {
    content: "*";
    color: #be1428;
    font-weight: 400
}

.inline_Link {
    cursor: pointer
}

    .inline_Link, .inline_Link:hover {
        color: #be1428
    }

.pd_flex {
    display: flex;
    flex-direction: row;
    align-items: center
}

    .pd_flex .add_margin-right {
        margin: 0 20px
    }

@media only screen and (max-width:992px) {
    .pd_flex {
        flex-direction: column;
        align-items: flex-start
    }

        .pd_flex .add_margin-right {
            margin: 20px 0
        }
}

.pd_flex .form-group {
    margin-bottom: 0
}

.displayNone {
    display: none
}

.attch_btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    min-width: 180px;
    width: auto;
    height: 40px;
    font-size: 14px;
    line-height: 40px;
    border-radius: 0;
    transition: none;
    color: #be1428;
    border: 1px solid #be1428;
    padding: 0;
    background-color: #fff
}

    .attch_btn:hover {
        color: #fff;
        position: relative;
        box-shadow: none;
        background: #be1428
    }

@media (max-width:767px) {
    .attch_btn {
        margin-left: 10px;
        margin-right: 10px;
        margin-top: 32px
    }
}

@media (max-width:450px) {
    .attch_btn {
        margin: 0
    }
}

@media (max-width:350px) {
    .attch_btn {
        margin-right: 0;
        margin-left: 0;
        margin-top: 32px
    }
}

.divUploadDocuments {
    position: relative;
    display: none
}

.showUploads {
    display: block
}

::-webkit-file-upload-button {
    background: #fff;
    color: #be1428;
    padding: 10px 40px;
    border: 1px solid #be1428;
    margin-bottom: 4px
}

input[type=file] {
    border: none;
    box-shadow: none;
    padding: 0;
    width: auto;
    height: 40px
}

.file-upload-wrapper {
    display: flex;
    flex-direction: row
}

    .file-upload-wrapper input[type=submit] {
        border-radius: 0;
        top: -2px;
        position: relative
    }

        .file-upload-wrapper input[type=submit]:before {
            content: "\f0aa";
            font-family: Font Awesome\ 5 Free;
            font-size: 18px;
            font-weight: 400
        }

        .file-upload-wrapper input[type=submit]:hover {
            color: #be1428 !important;
            background-color: #fff !important
        }

@media (max-width:767px) {
    .file-upload-wrapper input[type=submit] {
        margin-top: 12px;
        margin-left: 0;
        width: 152px
    }
}

@media (max-width:767px) {
    .file-upload-wrapper {
        flex-direction: column
    }
}

.single_attchment_item {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    margin: 16px 0;
    border: 1px solid #e5e5e5
}

@media only screen and (max-width:992px) {
    .single_attchment_item {
        flex-direction: column
    }
}

.single_attachment_item-upload {
    margin-right: 15px;
    padding: 18px
}

.personalDetails_label {
    display: flex;
    flex-direction: column
}

.has-been-uploaded {
    background-color: #e5e5e5;
    padding: 16px;
    width: 100%;
    min-height: 132px
}

    .has-been-uploaded ol.has-been-uploaded-list form:not(:last-child) {
        margin-bottom: 12px
    }

    .has-been-uploaded ol.has-been-uploaded-list li {
        display: flex;
        flex-direction: row;
        align-items: center
    }

.btn-delete-wrapper {
    margin-left: 16px;
    display: flex;
    position: relative;
    margin-bottom: 0;
    font-size: 11px;
    color: #acacac;
    padding: 2px 8px;
    align-items: center;
    border: 1px solid #ccc
}

    .btn-delete-wrapper:hover {
        color: #333;
        border: 1px solid #333
    }

    .btn-delete-wrapper i {
        padding: 0 4px;
        vertical-align: middle;
        font-size: 14px
    }

label[for=ChildCareInvoiceDetailsInfo_ChildCareCentre]:after, label[for=ChildCareInvoiceDetailsInfo_ConfirmationEmail]:after, label[for=ChildCareInvoiceDetailsInfo_Email]:after, label[for=ChildCareInvoiceDetailsInfo_FirstName]:after, label[for=ChildCareInvoiceDetailsInfo_InvoiceNumber]:after, label[for=ChildCareInvoiceDetailsInfo_LastName]:after, label[for=ChildCareInvoiceDetailsInfo_Total]:after, label[for=PaymentPlanApplicationInfo_ConfirmationEmail]:after, label[for=PaymentPlanApplicationInfo_CourseName]:after, label[for=PaymentPlanApplicationInfo_CourseYear]:after, label[for=PaymentPlanApplicationInfo_DateOfBirth]:after, label[for=PaymentPlanApplicationInfo_Email]:after, label[for=PaymentPlanApplicationInfo_FirstName]:after, label[for=PaymentPlanApplicationInfo_HasConsented]:after, label[for=PaymentPlanApplicationInfo_LastName]:after, label[for=PaymentPlanApplicationInfo_Phone]:after, label[for=PaymentPlanApplicationInfo_PostalBuildingNumber]:after, label[for=PaymentPlanApplicationInfo_PostalPostcode]:after, label[for=PaymentPlanApplicationInfo_PostalState]:after, label[for=PaymentPlanApplicationInfo_PostalSuburb]:after, label[for=PaymentPlanApplicationInfo_ResidentialBuildingNumber]:after, label[for=PaymentPlanApplicationInfo_ResidentialPostcode]:after, label[for=PaymentPlanApplicationInfo_ResidentialState]:after, label[for=PaymentPlanApplicationInfo_ResidentialStreet]:after, label[for=PaymentPlanApplicationInfo_ResidentialSuburb]:after, label[for=PaymentPlanApplicationInfo_StudentId]:after, label[for=PaymentPlanApplicationInfo_TotalExpenses]:after, label[for=PaymentPlanApplicationInfo_TotalIncome]:after {
    content: "*";
    color: #be1428;
    font-weight: 400
}