html{
    scroll-behavior: smooth;
}

.handbook-page{
    font-family: "PingFang HK";
    font-weight: 500; 
    background-color: #f7f8f2;   
}

.handbook-page .title-wapper{
    margin-bottom: 10px;
    background-color: #008898;

}

.handbook-page .title-wapper:before {
    display:none;
}

.handbook-page .title-wapper>div{
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100px;
}

.handbook-page .info-icon img{
    max-width: 28px;
}

.handbook-page .info-icon a{
    margin: 0px 10px;
}

.handbook-page .page-title{
    font-weight: 400;
    color: #FFFFFF;
    font-size: 30px;
}


/* Style the list */
ul.breadcrumb {
  padding: 10px 16px;
  list-style: none;
  background-color: unset;
}

/* Display list items side by side */
ul.breadcrumb li {
  display: inline;
  font-weight: 400;
  font-size: 16px;
}

/* Add a slash symbol (/) before/behind each list item */
ul.breadcrumb li+li:before {
  padding: 8px;
  color: #c1c0b3;
  content: "/\00a0";
}

/* Add a color to all links inside the list */
ul.breadcrumb li a {
  color: #c1c0b3;
  text-decoration: none;
}

/* Add a color on mouse-over */
ul.breadcrumb li a:hover {
  color: #01447e;
  text-decoration: underline;
}


.interview-nav .nav-title{
    font-size: 27px;
    border-right: 5px solid #d6d1bb;
    border-bottom: 0px;
}


.interview-nav .nav-link a {
    color: #5e5e5e;
}

.interview-nav .open-nav {
    display: flex;
    float: left;
    margin-left: -10%;
    cursor: pointer;
}

.interview-nav .nav-iocn{
    display: inline-block;
}

.interview-nav .open-nav-txt{   
    display: inline-block;
    color: #585857;
    margin-top: 2px;
    margin-left: 5px;
}

.interview-nav .nav-iocn img{
    max-width: 18px;
}

.handbook-page .handbook-titiel-wapper{
    padding: 40px 0px;
    width: 100%;
}

.handbook-page .handbook-titiel {
    color: #ffffff;
    font-size: 30px;
    padding: 30px 0px 20px 30px;
    background-color: #008898;
    margin-bottom: 60px;
}

.handbook-page .handbook-content{
    padding-left: 3%;
    font-weight: 400;
    line-height: 1.8;
}

.handbook-page .content-img{
    text-align: center;
}

.handbook-page .content-img img{
    max-height: 250px;
}

.handbook-content .bold-title{
    font-weight: 600;
    padding-bottom: 10px;
}

.handbook-point-list {
  counter-reset: list;
}

.handbook-point-list > li {
  list-style: none;
}

.handbook-point-list > li:before {
    counter-increment: list;
    content: counter(list, decimal) ") ";
    position: absolute;
    left: 2em;
}

.handbook-disc-list {
    list-style-type:disc;
}

.handbook-none-list{
    list-style-type:none;
}

.handbook-decimal-list{
    list-style-type:decimal;
}

.handbook-upperalpha-list{
    list-style-type:upper-alpha;
}

.handbook-page .table td{
    border-top: 0px;
    border-bottom: 1px solid #e4e2d2;
}


.handbook-page .table td:nth-child(2) {
    background-color: #ffffff;
}

.handbook-page  .handbook-second-table td:nth-child(1){
    width: 120px;
}

.content-six .bold-title  {
    margin-top: 30px;
    margin-bottom: 20px;
    padding-bottom: 0px;
}

.content-six ul li {
    margin-bottom: 8px;
}

.handbook-content .card{
    background-color: #f7f8f2; 
    border: 0px;
    border-bottom: 1px solid rgba(0,0,0,.125);
}

.handbook-content .card-header{
    background-color: #f7f8f2; 
    border-bottom: 0px;
}

.handbook-content .card-header a{
    color: #000000;
}


.info-support-wapper{
    color: #ffffff;
    background-color: #00a0b3;
}

.info-support-wapper > div{
    padding-left: 7%;
}

.info-support-wapper img{
    max-width: 100%;
}

.info-support-wapper .info-support-title{
    font-size: 28px;
    padding: 30px 0px;
}

.info-support-wapper .doc-name{
    font-size: 23px;
    padding-bottom: 15px;
}

.info-support-wapper hr{
    background-color: #81bab9;
}

.relate-info-title{
    padding: 30px 40px;
    font-size: 30px;
}

.handbook-page .relate-slider{
    margin-bottom: 8%;
}

.relate-slider .relate-item{
    padding: 10px 30px;
}

.relate-item:focus{
    outline: none;
}

.relate-item .relate-content{
    text-align: left;
}

.relate-item img{
    max-width: 100%;
    height:230px;
}

.relate-item .relate-content .relate-title{
    color: #527561;
    padding: 20px 0px;
    font-size: 24px;
}

.relate-item .relate-content .relate-desc{
    color: #9f9f9b;
}

.relate-slider .slick-prev {
    display: block;
    left: 0px;
    background-size: cover !important;
    background: url(../images/handbook_imgs/slider-left-arrow.svg);
}

.relate-slider  .slick-next {
    display: block;
    right: 0px;
    background-size: cover !important;
    background: url(../images/handbook_imgs/slider-right-arrow.svg);
}

.relate-slider .slick-prev, .relate-slider .slick-next {
    font-size: 0;
    opacity: 1;
    color: white;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.relate-slider .slick-prev, .relate-slider .slick-next {
    opacity: 0.5;
    border: 0px;
    border-radius: 0;
    position: absolute;
    box-shadow: none;
    margin-top: -35px;
    height: 50px;
    top: 50%;
    width: 50px;
    z-index: 1;
    cursor: pointer;
    -webkit-transition: opacity .3s linear;
    -moz-transition: opacity .3s linear;
    -ms-transition: opacity .3s linear;
    -o-transition: opacity .3s linear;
    transition: opacity .3s linear;
}

.relate-slider .slick-prev:hover, .relate-slider  .slick-next:hover{
    opacity: 1;
}


@media (max-width: 991px){
    .interview-nav .nav-title {
        border-right: 0px;
        border-bottom: 5px solid #d6d1bb;
    }
    
}