@import "./nav.css";
@import "./aside.css";
/* @import "./programme.css"; */
html, body {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
}

body {
    text-align: left;
}

a, a:hover, a:active, a:visited {
    text-decoration: none;
    word-break: break-word;
}

.navbar-end > li:nth-child(3) a {
    word-break: inherit;
}

*:focus {
    outline: none;
}

.color01 {
    font-size: 120%;
}

.size01 {
    font-size: 130%;
}

header {
    background-image: url('../images/shared/eduhk_ug_bg_header.svg'), url('../images/shared/eduhk_ug_bg_header_dual.svg');
    background-position: center top, center top;
    background-repeat: no-repeat;
    background-size: initial, cover;
    background-attachment: initial;
    position: relative;
    text-align: left;
}

.carousel .carousel-item .row > div:nth-child(3) {
    align-self: flex-start;
}

.sidebtns .btns.onlineapp {
    background-image: url('../images/shared/eduhk_ug_ricon_application.svg');
    /*background-color: rgb(0, 115, 223);*/
    background-color: #3232a0;
    background-repeat: no-repeat;
    background-position: left;
    color: #fff !important;
    padding-left: 37px;
    padding-right: 20px;
    line-height: 40px;
}

.row > .sidebtns.home_sidebtns .btns.onlineapp {
    display: none;
}

@media (max-width: 1200px) {
    .sidebtns.home_sidebtns_mobile .btns.onlineapp {
        display: none;
    }

    .row > .sidebtns.home_sidebtns .btns.onlineapp {
        display: block;
        margin: 15px;
    }
}

@media (min-width: 1200px) {
    .sidebtns .btns.onlineapp {
        margin-bottom: 130px;
    }
}

/*
.index header {
  min-height: 604px;
}
*/
header > nav > div:nth-child(1)
    /*header .collapse.navbar-collapse*/
{
    margin-bottom: 0.5em;
}

header > .banner {
    margin-top: 20px;
    position: relative;
    padding-bottom: 1px;
}

footer,
footer a {
    color: #fff;
}

footer {
    background-image: none;
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
    font-size: 90%;
    margin-top: 1em;
}

.error footer {
    position: fixed;
    bottom: 0;
}

footer .year {
    margin: 0 5px;
}

footer .fleft {
    background-color: #0073DF;
}

footer .fleft .arr {
    display: block;
}

footer .fright {
    background-color: #2688E4;
    text-align: center;
}

footer .fright > div > a {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    /*max-width: 20%;*/
}

footer .fright .totop {
    /*
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    */
    position: fixed;
    bottom: 7px;
    right: 20px;
    box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.26);
    /*background-color: rgb(77, 182, 172);*/
    background-color: #016bbf;
    color: #fff;
    padding: 5px;
    border-radius: 20px;
    display: none;
    width: 3.5em;
    height: 3.5em;
    text-align: center;
    line-height: 1em;
}

footer .totop span {
    max-width: 2em;
    word-break: break-word;
}

footer .totop span img {
    width: 1.5em;
}

footer .fright a
footer .fright a:hover,
footer .fright a:active,
footer .fright a:visited {
    color: #fff;
}

@-webkit-keyframes rotateSelf {
    from {
        -webkit-transform: rotateY(0deg);
        -o-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }
    to {
        -webkit-transform: rotateY(180deg);
        -o-transform: rotateY(180deg);
        transform: rotateY(180deg);
    }
}

@keyframes rotateSelf {
    from {
        -ms-transform: rotateY(0deg);
        -moz-transform: rotateY(0deg);
        -webkit-transform: rotateY(0deg);
        -o-transform: rotateY(0deg);
        transform: rotateY(0deg);
    }
    to {
        -ms-transform: rotateY(180deg);
        -moz-transform: rotateY(180deg);
        -webkit-transform: rotateY(180deg);
        -o-transform: rotateY(180deg);
        transform: rotateY(180deg);
    }
}

footer .fright a.totop:hover {
    /*background-color: rgb(0, 162, 153);*/
    background-color: #0177cf;
}

footer .fright a.totop:hover span img {
    -webkit-animation: rotateSelf 1s ease infinite;
    -moz-animation: rotateSelf 1s ease infinite;
    -ms-animation: rotateSelf 1s ease infinite;
    -o-animation: rotateSelf 1s ease infinite;
    animation: rotateSelf 1s ease infinite;
}

.gsc-input,
.gsc-search-button,
.gsc-clear-button,
.gsc-search-box {
    display: none;
}

div > div.gsc-control-cse {
    padding: 0;
}

main .banner img {
    width: inherit;
}

main .banner > div:nth-child(2) > div {
    border-bottom: 3px solid rgb(251, 208, 38);
}

main .banner .container > div > div:nth-child(2) > div {
    border-bottom: 3px solid rgb(251, 208, 38);
}

main .course-information {

}

main .course-information > p {
    margin-top: 16px;
    color: #DC370F;
}

main .course-information > .past-course-title {
    color: #333333;
}

.course-video {
    color: #DC370F;
}

main .course-information > h2:first-child {
    margin-bottom: 0;
}

main .course-information > h2:last-child {
    margin-top: 0;
}

main h1,
main h2,
main h3,
main h5 {
    color: #220d50;
}

main h1 {
    font-weight: 700;
    font-size: 2.0em;
}

main h2,
main h3 {
    margin-top: 1.5em;
}

main h2 {
    font-weight: 700;
    font-size: 1.5em;
}

main h3 {
    font-weight: 700;
    font-size: 1.25em;
}

main h4 {
    font-weight: 700;
    font-size: 1em;
}

main h5 {
    font-weight: 700;
    font-size: 1em;
}

main ul.arrow00 {
    list-style: none none;
    margin: 0;
    padding-left: 0;
}

main ul.arrow00 li > span {
    color: #DC370F;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
    display: inline-block;
}

main ul.arrow01 {
    list-style: none none;
    margin: 0;
    padding-left: 30px;
}

main ul.download01 {
    list-style-type: none;
}

main ul.apply01 {
    list-style-type: none;
}

main ul ul {
    list-style-type: disc;
}

main ul ul ul {
    list-style-type: disc;
}

main ul.arrow01 li {
    position: relative;
    margin-bottom: 10px;
}

main ul.arrow01 li > span {
    color: #DC370F;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
    display: inline-block;
}

main ul.arrow01 > li:before {
    content: '';
    background-image: url('../images/shared/list_icon_01.svg');
    background-position: center center;
    background-repeat: no-repeat;
    position: absolute;
    vertical-align: middle;
    left: -30px;
    top: 2px;
    display: inline-block;
    width: 20px;
    height: 20px;
}

main ol {
    padding-left: 20px;
}

main ol li {
    margin-bottom: 10px;
    vertical-align: middle;
    left: -20px;
}

main ol li::before {
    display: inline-block;

}

/* table start */
.programme_list main .table-responsive,
.ch_programme_list main .table-responsive {
    padding-top: 1rem;
}

main .table-responsive .table {
    border-left: 1px solid rgb(219, 219, 219);
    border-right: 1px solid rgb(219, 219, 219);
    border-bottom: 1px solid rgb(50, 50, 160);
}

main .table-responsive .w-10 {
    width: 10% !important;
}

main .table-responsive .w-20 {
    width: 20% !important;
}

main .table-responsive .w-25 {
    width: 25% !important;
}

main .table-responsive .w-30 {
    width: 30% !important;
}

main .table-responsive .w-33 {
    width: 33% !important;
}

main .table-responsive .w-40 {
    width: 40% !important;
}

main .table-responsive .w-50 {
    width: 50% !important;
}

main .table-responsive .w-70 {
    width: 70% !important;
}

main .table-responsive .table {
    margin-bottom: .5rem
}

main .table-responsive .table caption {
    font-style: italic;
    color: #000;
}

main .table-responsive .table caption p {
    font-style: normal;
    color: #000;
}

main .table-responsive .table thead {
    background-color: rgb(50, 50, 160);
    color: #fff;
}

main .table-responsive .table tbody,
main .table-responsive .table tfoot {
    background-color: rgb(241, 241, 241);
}

main .table-responsive .table.bhe_table tbody {
    background-color: #003399;
    color: #fff;
}

main .table-responsive .table.bhe_table tbody tr td:nth-child(2) {
    color: #000;
}

main .table-responsive .table thead th:last-child {
    /*background-color: rgb(242, 101, 34);*/
    background-color: #f26522;
}

main .table-responsive .table thead th:first-child {
    background-color: #0f7b81;
    padding-top: 1em;
    padding-bottom: 1em;
    padding-left: 1rem;
    font-weight: bold;
    text-align: left;
}

main .table-responsive .table thead th:nth-child(2) {
    background-color: #f26522;
    padding-top: 1em;
    padding-bottom: 1em;
    padding-left: 1rem;
    font-weight: bold;
    text-align: left;
}

main .table-responsive .table.prog-table.nf-table tbody td:last-child {
    background-color: rgb(241, 241, 241);
}

main .table-responsive .table.prog-table.nf-table thead th:last-child {
    background-color: rgb(50, 50, 160);
}

main .table-responsive .table thead th:not(:last-child),
main .table-responsive .table tbody td:not(:last-child),
main .table-responsive .table.prog-table tfoot td:not(:last-child) {
    border-right: 2px solid rgb(219, 219, 219);
}

main .table-responsive .table thead th,
main .table-responsive .table tbody td,
main .table-responsive .table tfoot td {
    padding-top: 1em;
    padding-bottom: 1em;
    border: 2px solid #f0f0f0;
    background-color: #e5f3f0;
}

main .table-responsive .table tbody td a {
    color: #333;
}

main .table-responsive .table tbody td.cpg {
    background-color: #d5f3e4;
    color: #08435a;
    font-weight: bold;
}

main .table-responsive .table tbody td.cpg:not(:first-child) {
    text-align: center;
}

main .table-responsive .table tbody td.cps {
    text-align: center;
}


main .table-responsive .table tbody td:first-child {
    padding-left: 1rem;
}

main .table-responsive .table tbody td:nth-child(2) {
    padding-left: 1rem;
}

main .table-responsive .table tbody td {
    border-bottom: 3px solid #c1b5b5;
}

main .table-responsive .table tfoot td {
    font-weight: 700;
}

body.bwp085 main .table-responsive .table tbody td {
    border-bottom: 2px solid rgb(219, 219, 219);
}

body.cwp001_002 main .table-responsive .table tbody th,
body.ch_cwp001_002 main .table-responsive .table tbody th {
    padding: 0.75em;
}

body.cwp001_002 main .table-responsive .table tbody td.cps,
body.ch_cwp001_002 main .table-responsive .table tbody td.cps {
    text-align: left;
    padding-left: 1rem;
}

body.cwp001_002 main .table-responsive .table tbody td,
body.ch_cwp001_002 main .table-responsive .table tbody td {
    border-bottom: 2px solid #c1b5b5;
}

/* table end */
@media (max-width: 576px) {
    /*
    .carousel .carousel-item .row > div:nth-child(2){
      margin-bottom: 60px!important;
    }
    */
}

@media (min-width: 576px) {
    footer {
        font-size: 100%;
    }

    footer .container {
        max-width: unset;
    }

    footer .fleft .arr {
        display: inline;
    }

    footer .fright {
        text-align: left;
    }
}

@media (min-width: 768px) {
    header {
        background-size: cover, cover;
    }

    /*
    .index header {
      min-height: 624px;
    }
    */
    footer {
        background-image: url('../images/shared/eduhk_ug_bg_footer_dual.svg');
    }

    footer .container {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    footer .container {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    header {
        background-image: url('../images/shared/eduhk_ug_bg_header.svg'), url('../images/shared/eduhk_ug_bg_header_dual.svg');
        background-size: auto, cover;
        padding-left: 40px;
        padding-bottom: 1.5em;
    }

    .index header {
        /* min-height: 704px; */
        padding-bottom: 27px;
    }

    /*
    header > .banner {
    }
    */
    main .banner .h-100 .col-sm-12 {
        margin-left: 12px;
        margin-bottom: 147px;
    }

    main .banner .h-100 .col-sm-12.scholarships_banner_text {
        margin-bottom: 10px;
    }

    footer .container {
        max-width: 1140px;
    }
}

.main_wrap.container {
    max-width: 100%;
    padding-top: 0 !important;
}

.main_wrap.container > div:first-child {
    padding-top: 1.5rem;
}

.main_wrap.container > div:nth-child(2) {
    margin-left: auto !important;
    margin-right: auto !important;
}

.yellow_hr {
    height: 3px;
    max-width: 1024px;
    width: 80%;
    background: rgb(251, 208, 38);
    position: absolute;
    bottom: 0;
    right: 0;
}

.main_wrap .banner {
    position: relative;
    background-color: #f6f7f8;
}

.main_wrap .banner .col-md-7 {
    z-index: 1;
}

.main_wrap .banner .col-md-5 {
    border-bottom: 2px solid #fbd026;
}

.main_wrap .banner .col-md-7, .main_wrap .banner .col-md-5 {
    padding-bottom: 0 !important;
}

.table.somke th {
    background-color: #003399;
    color: #fff;
    border: 2px solid #f0f0f0;
    border-collapse: collapse;
}

.table.somke td {
    /* background-color: #eadfff; */
    border: 2px solid #f0f0f0;
    border-collapse: collapse;
}

/*
ul.one li ::before{
  color: #F8A31A;
}
*/
.ul_orange {
    list-style: none;
}

.ul_orange li::before {
    content: '\2022';
    display: block;
    position: relative;
    max-width: 0;
    max-height: 0;
    left: -20px;
    top: -11px;
    color: #F8A31A;
    font-size: 30px;
}

.ship {
    color: #ff8434;
    font-size: 16px;
}

.carousel .carousel-item .row > div .description, .carousel .carousel-item .row > div .title {
    color: initial;
}

.table td, .table th, .table th strong {
    padding: .5rem;
    font-weight: 400;
}

@media (max-width: 576px) {
    .carousel-inner h2 {
        /* margin-top: 30px; */
    }
}

