section#breadcrumb {
    background: url("../images/breadcrumb-bg.jpg") center/cover;
}
section#breadcrumb span {
    display: block;
    padding-left: 15px;
    height: 100%;
    border-left: 2px solid #ff9900;
}

.left-menu {
    max-width: 530px;
    overflow: hidden;
}
.left-menu.make-me-fixed {
    position: fixed;
    height: 100%;
    top: 140px;
}
.left-menu.make-me-absolute {
    position: absolute;
}
.left-menu.make-me-inherit {
    position: inherit;
}
.left-menu::after {
    content: "";
    display: block;
    height: 100%;
    width: 100%;
    background: url("../images/courses/bar03.jpg") top right;
    position: absolute;
    top: 0;
    left: 0;
}
#background-imgs {
    position: absolute;
    top: 0;
    overflow: hidden;
    width: 100%;
}
.left-menu ul {
    position: relative;
    padding: 0;
    list-style: none;
    z-index: 1;
}
.left-menu ul li {
    padding: 12px 15px 12px 0;
    cursor: pointer;
    transition: all ease 0.5s;
    position: relative;
    display: inline-block;
}
.left-menu ul li a {
    color: inherit !important;
}
.left-menu ul li:hover,
.left-menu ul li.active {
    color: #fff;
}
.left-menu ul li::before {
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 0;
    transition: all ease 0.5s;
    z-index: -1;
}
.left-menu ul li.red::before {
    background-color: #c8393c;
}
.left-menu ul li.orange::before {
    background-color: #f4814c;
}
.left-menu ul li.yellow::before {
    background-color: #f2a927;
}
.left-menu ul li.green::before {
    background-color: #1c8686;
}
.left-menu ul li.magenta::before {
    background-color: #8d2e4c;
}
.left-menu ul li.purple::before {
    background-color: #9a57b5;
}
.left-menu ul li.dark-blue::before {
    background-color: #365b74;
}
.left-menu ul li.light-blue::before {
    background-color: #2790d2;
}
.left-menu ul li:hover::before,
.left-menu ul li.active::before {
    width: 100%;
}

.left-menu2 {
    max-width: 530px;
    overflow: hidden;
}
.left-menu2.make-me-fixed {
    position: fixed;
    height: 100%;
    top: 140px;
}
.left-menu2.make-me-absolute {
    position: absolute;
}
.left-menu2::after {
    content: "";
    display: block;
    height: 100%;
    width: 100%;
    background: url("../images/courses/bar03.jpg") top right;
    position: absolute;
    top: 0;
    left: 0;
}
#background-imgs {
    position: absolute;
    top: 0;
    overflow: hidden;
    width: 100%;
}
.left-menu2 ul {
    position: relative;
    padding: 0;
    list-style: none;
    z-index: 1;
}
.left-menu2 ul li {
    padding: 12px 15px 12px 15px;
    cursor: pointer;
    transition: all ease 0.5s;
    position: relative;
    display: inline-block;
}
.left-menu2 ul li a {
    color: inherit !important;
}
.left-menu2 ul li:hover,
.left-menu2 ul li.active {
    color: #fff;
}
.left-menu2 ul li::before {
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 0;
    transition: all ease 0.5s;
    z-index: -1;
}
.left-menu2 ul li.red::before {
    background-color: #c8393c;
}
.left-menu2 ul li.orange::before {
    background-color: #f4814c;
}
.left-menu2 ul li.yellow::before {
    background-color: #f2a927;
}
.left-menu2 ul li.green::before {
    background-color: #1c8686;
}
.left-menu2 ul li.magenta::before {
    background-color: #8d2e4c;
}
.left-menu2 ul li.purple::before {
    background-color: #9a57b5;
}
.left-menu2 ul li.dark-blue::before {
    background-color: #365b74;
}
.left-menu2 ul li.light-blue::before {
    background-color: #2790d2;
}
.left-menu2 ul li:hover::before,
.left-menu2 ul li.active::before {
    width: 100%;
}

.overview {
    margin-top: -5px;
}
.overview > div {
    min-height: 250px;
}
.overview-img > img {
    height: 100%;
    object-fit: cover;
    width: calc(100% - 30px);
    position: absolute;
}
.overview-details img {
    border: 2px solid #00397c;
    box-shadow: 1px 1px 2px rgba(153, 153, 153, 0.64);
}
.overview-details img:nth-child(2),
.overview-details > div:hover img:first-child,
.overview-details > div:focus img:first-child {
    display: none;
}
.overview-details > div:hover img:nth-child(2),
.overview-details > div:focus img:nth-child(2) {
    display: inline-block;
}
.overview span,
.overview-details span {
    /*color: #87888b !important;*/
    color: #87888b;
}
.overview-img:hover #enquire-now::before,
.overview-img:focus #enquire-now::before {
    border-right: 130px solid #ff9300;
    border-top: 100px solid rgba(0, 0, 0, 0);
}
.overview-img:hover #enquire-now span,
.overview-img:focus #enquire-now span {
    display: block;
}
.overview-img:hover #enquire-now img,
.overview-img:focus #enquire-now img {
    margin-right: -20px;
}
.overview h2,
.overview h4 {
    line-height: 1.2;
}
.overview h4 {
    color: #555;
    font-weight: bold;
}
.overview p {
    line-height: 24px;
    color: #615e5e;
    max-width: 660px;
}
.table {
    width: calc(100% - 2px);
    margin-bottom: 45px;
}
.panel-wrapper .table-responsive:last-child .table {
    margin-bottom: 0;
}
.table thead tr:first-child {
    background-color: #00397c;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    border: 1px solid #00397c;
    border-bottom: 0;
}
.table thead tr:first-child td {
    border-top: 0;
}
.table thead tr:last-child th {
    background-color: #5282aa;
    text-align: center;
    text-transform: uppercase;
    color: #343536;
    border-top: 0;
    border-bottom: 1px solid #999;
    border-right: 1px solid #999;
    font-weight: normal;
    vertical-align: middle;
    width: 50% !important;
}
.table thead tr:last-child th:first-child {
    border-left: 1px solid #5282aa;
}
.table thead tr:last-child th:last-child {
    border-right: 1px solid #5282aa;
}
.table tbody tr:nth-child(odd) {
    background-color: #f7f4f4;
}
.table tbody td {
    color: #615e5e;
    vertical-align: middle !important;
    border: 1px solid #999 !important;
    line-height: 25px !important;
    height: 80px;
}
.table tbody td span {
    display: block;
    margin: 0 auto;
}
.table tbody td:not(:nth-child(2)) {
    padding: 5px 20px !important;
}
.table tbody td:nth-child(2) {
    padding: 5px !important;
}
.table tbody td:first-child {
    border-left: 1px solid #999 !important;
}
/*.table tbody td:nth-child(2), table tbody td:nth-child(4), table tbody td:nth-child(5){text-align:center;}*/
.table tbody td:nth-child(2),
table tbody td:nth-child(4),
table tbody td:nth-child(5) {
    padding: 5px 20px !important;
}

.table tbody td:nth-child(3),
table tbody td:nth-child(4) {
    line-height: 25px;
}
span.legend {
    margin-top: -20px;
}
.panel-wrapper span.bulleted {
    color: #00397c;
    font-weight: bold;
    padding-left: 25px;
    position: relative;
}
.panel-wrapper span.bulleted::before {
    content: "";
    display: block;
    height: 8px;
    width: 8px;
    background-color: #ff9900;
    position: absolute;
    left: 0;
    top: 7px;
}
.panel-wrapper {
    color: #615e5e;
    line-height: 24px;
}
.panel-wrapper p {
    color: #888685;
    line-height: 24px;
}
.modal-dialog {
    max-width: calc(100% - 20px);
    width: 100%;
    background: url("../images/courses/enquiry-bg.jpg") center/cover;
}
.modal-header {
    border-bottom: 0;
    padding: 0;
}
.modal-header h1 {
    color: #00397c;
}
.modal-header p {
    font-weight: 300;
    padding: 10px 0 25px;
}
.modal-header .close {
    font-size: 30px;
}
.modal-body {
    padding: 0;
}
.modal-content {
    background-color: transparent;
    padding: 25px 80px;
}
input,
select,
textarea {
    width: 100%;
    padding: 6px 15px;
    border-radius: 5px !important;
    border: 1px solid #999;
    margin-bottom: 15px;
    resize: none;
    font-weight: 300;
    height: 40px;
    background-color: #fff;
}
textarea {
    height: 80px;
}
select option {
    padding: 5px 15px;
}
.selectbox {
    position: relative;
}
.selectbox::after {
    color: #999;
    content: "";
    font-family: FontAwesome;
    font-size: 24px;
    line-height: 40px;
    position: absolute;
    right: 25px;
    top: 0;
}
input:not([type="submit"]):focus,
select:focus,
textarea:focus {
    border-color: #ff9900;
    box-shadow: 0 0 3px #ff9900;
}
::-webkit-input-placeholder {
    color: #333;
    font-weight: 300;
    opacity: 1;
}
::-moz-placeholder {
    color: #333;
    font-weight: 300;
    opacity: 1;
}
:-ms-input-placeholder {
    color: #333;
    font-weight: 300;
    opacity: 1;
}
:-moz-placeholder {
    color: #333;
    font-weight: 300;
    opacity: 1;
}
input.checkbox {
    display: none;
}
input.checkbox + label {
    padding-left: 40px;
    position: relative;
    line-height: 20px;
    font-weight: normal;
    margin: 15px 0 30px;
    font-weight: 300;
}
input.checkbox + label::before {
    content: "";
    display: inline-block;
    height: 20px;
    width: 20px;
    border-radius: 3px !important;
    border: 1px solid #999;
    left: 0;
    top: 0;
    position: absolute;
    background-color: #fff;
    line-height: 17px;
}
input.checkbox:checked + label::before {
    content: "✓";
    text-align: center;
    font-weight: bold;
}
input[type="submit"] {
    border: none;
    border-radius: 10px !important;
    background-color: #00397c;
    text-align: center;
    color: #fff;
    display: block;
    font-weight: 400;
    font-size: 18px;
    transition: all ease 0.5s;
    height: auto;
}
input[type="submit"]:focus,
input[type="submit"]:hover {
    background-color: #ff9900;
}
.parsley-errors-list {
    color: red;
    list-style: none;
}
.parsley-errors-list li {
    margin-top: -7px;
    margin-bottom: 8px;
}
#parsley-id-multiple-accept {
    padding-left: 55px;
    margin-top: -20px;
    float: left;
}
@media (max-width: 1199px) {
    .left-menu ul li {
        padding-left: 15px !important;
    }
}
@media (max-width: 991px) {
    .left-menu {
        padding: 15px 0;
        position: relative !important;
        height: auto !important;
        bottom: auto !important;
        top: auto !important;
        max-width: 450px;
    }
    .left-menu ul {
        margin: 0 !important;
    }
    .left-menu ul li {
        padding-left: 70px !important;
    }
    .left-menu + div {
        padding-right: 70px;
    }
    #background-imgs img {
        height: 415px;
        object-fit: cover;
    }
}
@media (max-width: 767px) {
    .left-menu {
        max-width: none;
        width: 100%;
    }
    .overview > .row {
        margin: 0;
    }
    .overview-img {
        padding: 0;
    }
    .overview-img > img {
        position: relative;
        width: 100%;
    }
    .overview h3 {
        margin-top: 30px;
    }
    #enquire-now {
        right: 5px;
    }
    .overview-details {
        margin: 30px 0;
        float: left;
        width: 100%;
    }
    span.legend {
        margin-top: 0;
        margin-bottom: 30px;
    }
}
@media (max-width: 699px) {
    input.checkbox + label::before {
        top: 5px;
    }
}
@media (max-width: 579px) {
    .left-menu {
        max-width: 100%;
    }
    .left-menu ul li {
        padding-left: 15px !important;
    }
    .left-menu + div {
        padding: 0 15px;
    }
    #background-imgs img {
        height: auto;
    }
    .modal-content {
        padding: 25px;
    }
    .modal-header h1 {
        text-align: center;
        padding: 0 25px;
    }
    .modal-header p {
        text-align: center;
    }
}
@media (max-width: 376px) {
    .bordered-box {
        margin-top: 0;
    }
    .overview > .row > div:last-child {
        padding: 0;
    }
    .overview > .row > div:last-child > .row > div {
        width: 100% !important;
        max-width: none !important;
        margin-bottom: 20px;
        padding: 0 15px !important;
    }
    .award-wrapper {
        padding: 10px;
        display: block;
        height: auto;
    }
    .award-wrapper img {
        float: none;
        margin: 0 auto;
        display: block;
    }
}
@media (max-width: 319px) {
    .overview-details img {
        margin-right: 0;
    }
}


/* Box duration courses around the duration */
.duration-box {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 2px solid #00397c; /* Fixed box border color */
    padding: 10px; /* Adjust padding */
    width: 75px;
    height: 75px;
    text-align: center;
    font-family: Arial, sans-serif;
    line-height: 1.2;
}

/* Default text duration styling */
.duration-text,
.duration-years {
    color: #00397c!important; /* Default text color */
    transition: color 0.3s ease; /* Smooth hover effect */
}

.duration-text {
    font-size: 20px;
    font-weight: bold;
    
}

.duration-years {
    font-size: 12px;
}

/* Box fees courses around the duration */
.fees-box {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 2px solid #00397c; /* Fixed box border color */
    padding: 10px; /* Adjust padding */
    width: 75px;
    height: 75px;
    text-align: center;
    font-family: Arial, sans-serif;
    line-height: 1.2;
}

/* Hover effect for both texts */
.duration-box:hover .duration-text,
.duration-box:hover .duration-years {
    color: #daa349!important; /* Hover color */
}

/* Default text fees styling */
.rm-text,
.total-fees {
    color: #00397c!important; /* Default text color */
    transition: color 0.3s ease; /* Smooth hover effect */
}

.rm-text {
    font-size: 20px;
    font-weight: bold;
    
}

.total-fees {
    font-size: 12px;
}

/* Hover effect for both texts */
.fees-box:hover .rm-text,
.fees-box:hover .total-fees {
    color: #daa349!important; /* Hover color */
}
