/* Font */

@font-face {
    font-family: SanFranciscoDisplay;
    src: url("../font/SanFranciscoDisplay-Regular.otf");
}

@font-face {
    font-family: SanFranciscoDisplay-Light;
    src: url("../font/SanFranciscoText-Light.otf");
}

@font-face {
    font-family: NewTimeRoman;
    src: url("../font/Roman-Regular.ttf")
}

@font-face {
    font-family: NewTimeRoman-Bold;
    src: url("../fonts/roman-bold.ttf")
}

.flexslider {
    position: relative;
    z-index: 2;
    background: none;
    border: none;
    margin: 0 0 0;
    border-radius: 0px;
    color: rgba(255, 255, 255, 0.7);
}

.flexslider .probootstrap-heading {
    color: #ffffff;
    font-weight: 300;
    font-size: 70px;
    line-height: 60px;
    font-family: "Rubik", sans-serif;
    text-transform: uppercase;
    font-weight: 700;
}

.flexslider .probootstrap-heading a {
    color: rgba(255, 255, 255, 0.8);
    border-bottom: 2px solid rgba(255, 255, 255, 0.2);
}

.flexslider .probootstrap-heading a:hover {
    border-bottom: 2px solid white;
}

.flexslider .probootstrap-sub-wrap {
    max-width: 700px;
    text-align: left;
    font-size: 18px;
    line-height: 1.5;
}

.flexslider .probootstrap-sub-wrap a {
    color: rgba(255, 255, 255, 0.8);
    border-bottom: 2px solid rgba(255, 255, 255, 0.2);
}

.flexslider .probootstrap-sub-wrap a:hover {
    border-bottom: 2px solid white;
}

.flexslider .text-center .probootstrap-sub-wrap {
    margin: 0 auto;
    text-align: center;
}

.flexslider .probootstrap-slider-text {
    margin-top: 300px;
}

@media screen and (max-width: 480px) {
    .flexslider .probootstrap-slider-text {
        margin-top: 100px;
    }
}

.flexslider.probootstrap-inner {
    height: 500px;
}

.flexslider.probootstrap-inner .probootstrap-slider-text {
    margin-top: 150px;
}

@media screen and (max-width: 480px) {
    .flexslider.probootstrap-inner .probootstrap-slider-text {
        margin-top: 100px;
    }
}

.flexslider .slides>li {
    background-size: cover;
    background-position: center center;
    background-repeat: none;
}

.flexslider .slides>li.overlay:before {
    content: "";
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.flexslider .flex-control-paging {
    position: absolute;
    bottom: 30px;
    z-index: 20;
}

@media screen and (max-width: 480px) {
    .flexslider .flex-direction-nav {
        display: none;
    }
}

.flexslider .flex-direction-nav a {
    text-decoration: none;
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 10;
    overflow: hidden;
    opacity: 0;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    border: 2px solid rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    padding: 30px;
}

.flexslider .flex-direction-nav a:hover,
.flexslider .flex-direction-nav a:active,
.flexslider .flex-direction-nav a:focus {
    outline: none;
}

.flexslider .flex-direction-nav a:before {
    font-family: 'icomoon';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    content: "\e929";
    -webkit-transition: .3s all;
    transition: .3s all;
    font-size: 30px;
    display: inline-block;
    color: white;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.flexslider .flex-direction-nav a.flex-next:before {
    content: "\e92a";
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.flex-direction-nav .flex-prev {
    left: 50px;
}

.flex-direction-nav .flex-next {
    right: 50px;
    text-align: right;
}

.flexslider:hover .flex-direction-nav .flex-prev {
    opacity: 0.7;
    left: 60px;
}

.flexslider:hover .flex-direction-nav .flex-prev:hover,
.flexslider:hover .flex-direction-nav .flex-next:hover {
    opacity: 1;
    background: rgba(255, 255, 255, 0.3);
}

.flexslider:hover .flex-direction-nav .flex-next {
    opacity: 0.7;
    right: 60px;
}

.font_regular {
    font-family: SanFranciscoDisplay-Light;
}

.no-padding {
    padding: 0px;
}

.no-margin {
    margin: 0px;
}

.text-deco-none,
.text-deco-none:hover {
    text-decoration: none;
}

html,
body {
    min-width: 250px;
    font-family: SanFranciscoDisplay-Light;
    height: 100%;
    min-height: 800px;
    position: relative;
}

button {
    outline: none !important;
}

.sec_title {
    margin-top: 5%;
    margin-bottom: 5%;
    font-family: SanFranciscoDisplay;
    font-size: 2.5rem;
}

.container-fluid {
    padding: 0px;
}

.container-fluid .content {
    margin-left: 15%;
    margin-right: 15%;
}

.container-fluid .content_v2 {
    margin-left: 12%;
    margin-right: 12%;
}

.container-fluid .content_v3 {
    height: 100%;
    margin-left: 30%;
    margin-right: 30%;
}

.container-fluid .content_v4 {
    height: 100%;
    color: white;
    margin-left: 18%;
    margin-right: 18%;
}

.content_banner {
    display: block;
    width: 100%;
}

.content_text {
    text-align: center;
    padding-top: 40px;
}

.content_btn {
    width: 150px;
    height: 40px;
    border-radius: 30px;
    background-color: #ad965f;
    box-shadow: 0 4px 12px 1.5px rgba(0, 0, 0, 0.11);
    color: #fff;
    font-size: 16px;
    margin-bottom: 5%;
    cursor: pointer;
}

.video_btn {
    width: 220px;
    height: 60px;
    border-radius: 30px;
    border: none;
    background-color: #ad965f;
    color: #fff;
    font-size: 20px;
    margin-top: 30px;
    margin-left: 15px;
    cursor: pointer;
}

.video_btn_img {
    width: 25%;
    padding-right: 20px
}

.request_btn {
    padding: .5rem 2rem;
    border-radius: 30px;
    border: none;
    background-color: #ad965f;
    color: #fff;
    font-size: 14px;
    line-height: 1.5;
    margin-left: 15px;
    cursor: pointer;
}

.header {
    margin-top: 5%;
    margin-bottom: 5%;
    font-family: SanFranciscoDisplay;
}

.header-top {
    margin-top: 5%;
}

.header-bot {
    margin-bottom: 5%;
    font-family: SanFranciscoDisplay;
}

.img_btn {
    background: none;
    border: none;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.more_btn {
    background: none;
    color: #9d9d9d;
    border: none;
    margin: 0;
    padding: 0;
    cursor: pointer;
}


/* Top Nav */

.navbar-dark .navbar-nav .nav-link {
    color: white;
}

.navbar.transparent.navbar-inverse .navbar-inner {
    border-width: 0px;
    -webkit-box-shadow: 0px 0px;
    box-shadow: 0px 0px;
    background-color: rgba(0, 0, 0, 0.0);
    background-image: -webkit-gradient(linear, 50.00% 0.00%, 50.00% 100.00%, color-stop(0%, rgba(0, 0, 0, 0.00)), color-stop(100%, rgba(0, 0, 0, 0.00)));
    background-image: -webkit-linear-gradient(270deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.00) 100%);
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.00) 100%);
}

.navbar a {
    color: white;
}

.get_start_button {
    width: 150px;
    height: 40px;
    border-radius: 30px;
    border: 3px solid;
    border-color: white;
    background-color: transparent;
    box-shadow: 0 4px 12px 1.5px rgba(0, 0, 0, 0.11);
    color: #fff;
    font-size: 18px;
    cursor: pointer;
}

.nav-table {
    text-align: right;
    margin-right: 20px;
    min-width: 245px;
}

.nav-table td {
    min-width: 245px;
}

.navbar-collapse {
    flex-basis: auto;
}

.dropdown-menu {
    background-color: #6cc0cc;
}

.topnav {
    overflow: hidden;
    background-color: transparent;
}

.topnav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 18px;
}


/* .topnav a:hover {
background-color: #ddd;
color: black;
} */

.active {
    background-color: #ddd;
    color: black;
}

.topnav .icon {
    display: none;
}

.grey-color {
    color: #999999;
}

.language {
    text-align: center;
    font-size: 12px;
    line-height: 25px;
}


/* Home */




/* Standard syntax 
 background-image: url('../images/backgroundimage2.jpg');*/

.home_table_small {
    width: 50%;
}

.link_btn {
    /* width: 180px; */
    /* text-align: right; */
    background: none;
    border: none;
    padding: 2% 0 2% 2%;
    color: white;
    margin: 15px 0;
    cursor: pointer;
}

.link_img_btn {
    background: none;
    border: none;
    color: white;
    margin: 0;
    padding: 0;
    cursor: pointer;
}

.fa-home {
    padding: 10px;
    font-size: 12px;
    width: 35px;
    text-align: center;
    text-decoration: none;
    border-radius: 50%;
}

.fa-home:hover {
    background: white;
}

.fa-facebook-home {
    background: transparent;
    color: white;
}

.fa-twitter-home {
    background: transparent;
    color: white;
}

.fa-instagram-home {
    background: transparent;
    color: white;
}

.fa-wechat-home {
    background: transparent;
    color: white;
}


/* About */

.about_banner {
    display: block;
    width: 100%;
}

.about_icon {
    display: block;
    height: 50px;
}

.about_sector {
    text-align: center;
    padding-left: 15%;
    padding-right: 15%;
}

.about_content {
    color: #6cc0cc;
    font-size: 16px;
    min-height: 80px;
}

.choose_title {
    min-height: 55px;
}


/* News */

.news_sector {
    padding-left: 5%;
    padding-right: 5%;
}

.news_row {
    margin: 5%;
}

.news_banner {
    display: block;
    width: 100%;
}

.news_header {
    height: 100px;
}

.news_content {
    padding: 30px 0;
    height: auto;
    color: #9a9a9a;
    margin-bottom: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.news_date {
    color: #9a9a9a;
    font-size: 10pt;
    margin-top: 15%;
    padding-bottom: 5%;
    border-bottom: 2px solid #ececec;
}

.news_padding_left {
    padding-left: 5%;
}

.news_padding_right {
    padding-right: 5%;
}


/* Business Apply */

.ba_banner {
    display: block;
    width: 100%;
}


/* Products Options */

.po_list_table {
    width: 100%;
}

.po_header_text {
    margin-left: 20%;
    margin-right: 20%;
}

.po_list_table th {
    font-size: 25pt;
    width: 20%;
    color: #323232;
}

.po_list_title {
    font-size: 15pt;
    /* color: #0f5f5c; */
}

.po_list_content {
    color: #6cc0cc;
}


/* Pricing table*/

.price {
    height: 110%;
    list-style-type: none;
    margin: 0;
    padding: 0;
    padding-top: 25px;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    box-shadow: 1px 2px 3px 1px rgba(0, 0, 0, 0.2);
    border-radius: 8px;
}

.price:hover {
    box-shadow: 3px 8px 12px 5px rgba(0, 0, 0, 0.4);
}

.price .header {
    padding-top: 30px;
    font-size: 25px;
}

.price li {
    padding: 3px;
    text-align: center;
}

.explore_btn {
    border-radius: 30px;
    background-color: #ad965f;
    box-shadow: 0 4px 12px 1.5px rgba(0, 0, 0, 0.11);
    color: #fff;
    font-size: 13px;
    margin-top: 5%;
    cursor: pointer;
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    bottom: 0px;
    margin: 0;
    padding: .5rem 1.5rem;
}

.explore_btn:hover {
    color: white;
    box-shadow: 0 4px 12px 1.5px rgba(0, 0, 0, 0.3);
}

.most-pop {
    position: absolute;
    height: 25px;
    width: 150px;
    max-width: 95%;
    border: solid 0.5px #3f3e3e;
    text-align: center;
    border-radius: 15px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    font-size: 16px;
}


/* News */

#Latest_News {
    margin-top: 5%;
}

#Latest_News .news_main {
    padding: 50px;
    background-color: #f6f6f6;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
}

.news_inner_container {
    padding: 50px 0;
}

.index_news_head {
    font-size: 24px;
    text-align: center;
}

.index_news_foot {
    text-align: center;
}

.index_news_foot .img_btn {
    padding-left: 10px;
}

.index_news_block {
    flex: 1;
    padding-bottom: 20px;
}

.index_news_block .news_img {
    margin-bottom: 20px;
}

.index_news_block img {
    width: 100%
}

.index_news_title {
    font-size: 18px;
    font-weight: bold
}

.index_news_content {
    font-size: 14px;
    padding: 15px 0;
}

.index_news_date {
    color: #9a9a9a;
    font-size: 12px;
}

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

.news_text .index_news_title {
    flex: 2;
}

.news_text .index_news_date {
    flex: 1;
}


/* Get Updated */

#Get_Update {
    height: 40%;
    min-height: 245px;
    background-color: #fafafa;
}

.update_title {
    padding-top: 10%;
    padding-bottom: 3%;
    color: #9d9d9d;
}

.update_content {
    color: #0d1f2d;
    padding-bottom: 3%;
    font-family: SanFranciscoDisplay;
}

.input_email {
    width: 100%;
}

.subscribe_btn {
    width: 150px;
    height: 40px;
    border-radius: 5px;
    background-color: #ad965f;
    box-shadow: 0 4px 12px 1.5px rgba(0, 0, 0, 0.11);
    color: #fff;
    font-size: 13px;
    margin-left: 15px;
    cursor: pointer;
}


/* Demo */

#Demo {
    height: 30%;
    max-height: 280px;
    min-height: 245px;
    background-image: url("../images/footer_origionalsize.jpg");
    background-position: center;
    background-size: cover;
}

.demo_table {
    width: 100%;
    height: 100%;
}

#demo_v2 {
    height: 25%;
    max-height: 245px;
    min-height: 220px;
    background-image: url("../images/footer_origionalsize.jpg");
    background-position: center;
    background-size: cover;
}

#demo_v2 .demo_table {
    height: 60%;
    text-align: center;
}

#demo_v2 .demo_table th {
    padding-top: 12%;
    text-align: center;
}

#demo_v2 .demo_table td {
    vertical-align: middle;
}


/* Modal Page */

#modal_main .modal-dialog {
    -webkit-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
    transform: translate(0, -50%);
    top: 50%;
    margin: 0 auto;
}

#modal_main .modal-content {
    background-color: transparent;
    border: none
}

#modal_main .modal_video_close_btn {
    position: absolute;
    right: -10px;
    top: -10px;
    color: #d3d5d6;
    font-size: 32px;
    opacity: 1;
    outline: none;
}

#modal_main .modal_video_close_btn .fa {
    width: 100%;
}

#modal_main .modal-body {
    padding: 25px;
    margin: 5%;
}


/* Solution Page*/

#solution_home {
    height: 100%;
    width: 100%;
    background-image: url("../images/smartpackagingbackground.jpg");
    background-size: 100% 100%;
    color: white;
    /* padding-left: 5%; */
    min-height: 400px;
}

#solution_home .navbar-brand {
    padding-left: 5%;
}

.packplus-logo-img {
    width: auto;
    height: 70px;
}

#package_and_product {
    /* height: 260%; */
    width: 100%;
}

#product_process {
    /* height: 260%; */
    width: 100%;
}

#product_process .process_row_r {
    padding: 5% 0;
}

.solution_text {
    text-align: center;
    line-height: normal;
    font-size: 1.5em;
}

.solu_menu {
    position: absolute;
    transform: translateY(-50%);
    z-index: 2;
    width: 80%;
    height: 30%;
    min-height: 265px;
    background-color: #ffffff;
    box-shadow: 0 19px 34px 0 rgba(0, 0, 0, 0.06);
    left: 10%;
    border-radius: 12px;
}

.menu_list {
    margin: 40px 20px;
}

.solu_menu .menu_list {
    margin: 0;
}

.menu_line {
    margin-top: 20px;
    display: none;
    width: 150.5px;
    height: 2px;
    border: solid 2px #6cc0cc;
}

.solu_menu .menu_item {
    padding: 40px 20px;
    cursor: pointer;
}

.solu_menu .menu-text {
    font-size: 1.25rem;
}

.menu_item {
    cursor: pointer;
}


/* .menu_item:hover .menu_line{
display:block;
} */

.menu_text {
    margin: 5px 15px;
    color: #83a7a5;
    line-height: 1.2em;
}

.packnprod-top {
    text-align: center;
    color: #323232;
    margin-top: 180px;
}

.packnprod {
    margin-top: 5%;
    text-align: center;
    color: #323232;
}

.pnp_des {
    padding: 5%;
    line-height: 2em;
}

.solu_menu_img {
    width: 60%;
    height: auto;
}

#something-more .else-img {
    width: 100%;
    height: 60px;
}

#pack_options {
    width: 80%;
    text-align: center;
    margin-left: 10%;
    margin-right: 10%;
    border-radius: 4px;
    border: solid 1px #cccccc;
    border-radius: 4px;
    margin-bottom: 30px;
}

#pack_options td {
    padding: 10px 30px;
    border-right: solid 1px #cccccc;
}

.feature_item {
    text-align: left;
    color: #999999;
}

.pack_img {
    width: auto;
    height: 70px;
    padding-bottom: 20px
}

.process_img {
    width: 100%;
    /* height: 100% */
}

.options_title {
    font-family: SFProDisplay;
    font-weight: bold;
    font-size: 20px;
}

.pro_process {
    margin-top: 2%;
    text-align: center;
    color: #323232;
}

.process_row {
    margin-right: 5%;
    /* height: 500px; */
}

.process_row_r {
    margin-left: 5%;
    /* height: 500px; */
}

.process_padding_left {
    padding-left: 5%;
    padding-top: 25%;
}

.process_padding_right {
    padding-right: 5%;
    padding-top: 25%;
}

.process_text {
    padding-top: 10%;
}

.table-bottom-line {
    height: 70px;
    padding-bottom: 100px;
    border-bottom: solid 1px #cccccc;
}

.icon-padding {
    padding-bottom: 70px;
    text-align: center;
}

.icon-des {
    padding-top: 10px;
}


/*Application section */

#application {
    /* height: 120%; */
    width: 100%;
}

.app-app-title {
    font-size: 1.75rem;
    font-weight: 300;
    cursor: pointer;
}

.web-app,
.native-app {
    padding-top: 5%;
    margin: 30px 10px 0 10px;
}

.app-sub-title {
    padding-bottom: 5%;
    color: #0f5f5c;
    font-weight: 300;
}

.web-app-detail {
    padding: 1% 0;
    color: #0f5f5c;
}

.web-app-more {
    width: 85%;
    padding: 30px 0 40px 0;
    color: #0f5f5c;
    border-bottom: 1px solid #d8d8d8;
}

.webapp-title-padding {
    padding-right: 20px
}

.icon_text {
    display: flex;
    align-items: center;
}


/*Backend section */

#backend {
    /* height: 90%; */
    width: 100%;
    margin: 5% 0;
}

.backend_menu {
    width: 70%;
    padding-top: 40px;
}

.backend_menu .menu_line {
    width: 90%;
}

.back_basic,
.back_crm,
.back_wms {
    padding: 5% 0;
    margin: 30px 10% 0 10%;
}

.menu_des {
    padding-bottom: 50px;
}

.backend-detail {
    padding: 1% 0;
    color: #83a7a5;
}

.solu-slogan {
    font-size: 1.75rem;
    width: 40%;
}

.solu-button {
    margin-top: 30px;
    width: 150px;
    height: 40px;
    border-radius: 30px;
    background-color: #6cc0cc;
    box-shadow: 0 4px 12px 1.5px rgba(0, 0, 0, 0.11);
    color: #fff;
    font-size: 14px;
    cursor: pointer;
}


/* Slogan */

#Slogan {
    margin-bottom: 100px;
}


/* Data Collection Section */

#data-collect {
    width: 100%;
    /* height: 130%; */
}

.data_des {
    padding: 5%;
    color: #4a4a4a;
}

.data-container {
    margin-left: 10%;
    margin-right: 10%;
}

.data-img {
    width: 100%;
    height: auto;
}


/* Data Kind Section */

#data-kind {
    width: 100%;
    /* height: 60%; */
}

.kind_des {
    padding-top: 40px;
    padding-bottom: 40px;
    color: #4a4a4a;
}

.data-kind-icon {
    text-align: center;
    padding: 50px 0 40px 0;
    margin-bottom: 50px;
    border-bottom: solid 1px #cccccc;
}

.data-kind-img-container {
    height: 100px;
}

.data-kind {
    text-align: center;
    padding-bottom: 80px;
    border-bottom: solid 1px #cccccc;
}

.benefit-text {
    color: #83a7a5;
}

#data-kind .helper,
#data-find .helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

#data-kind .img-valign,
#data-find .img-valign {
    vertical-align: middle;
}


/* Data Analysis section */

#data-ana {
    width: 100%;
    /* height: 100%; */
}

.ana_des {
    line-height: 1.5em;
}

.data-ana-img {
    width: 80%;
    height: auto;
}


/* Data Findings section */

#data-find {
    width: 100%;
    /* height: 75%; */
}

.data-find-title {
    margin-bottom: 50px;
}

.finding-container {
    margin: 2% 10%;
    padding-bottom: 60px;
    border-bottom: solid 1px #d8d8d8;
    ;
}

.find-icon-container {
    height: 20%;
    text-align: center;
    border-right: 0.3px solid #494949;
}

.finding-icon {
    margin: 5% 0;
    padding: 10% 0;
    height: 120px;
    width: auto;
}

.menu-height {
    min-height: 20%;
}

.finding-choice {
    cursor: pointer;
}

.find-height {
    height: 210px;
}

.finding-con,
.finding-dem,
.finding-mar,
.finding-pro {
    display: none;
}

.finding_detail_container {
    padding: 0% 5%;
}

.find_detail_box {
    padding: 5% 0;
}

.find_detail_point {
    padding: 3% 0;
}

.find_detail_img {
    height: 30px;
    width: auto;
    margin-right: 20px;
}


/* Benefits Section */

#Benefits_bg {
    /* height: 100%; */
    width: 100%;
    min-height: 770px;
    background-image: url("../images/solution_back.jpg");
    background-size: 100% 100%;
    color: white;
    padding: 5%;
}

#Benefits_details {
    /* height: 110%; */
    width: 100%;
    padding: 5%;
}

.benefit-slogan {
    margin: 0 30%;
    font-size: 2rem;
    line-height: 1.5em;
    padding-bottom: 30px;
}

.benefits-table {
    width: 100%;
    padding: 3% 8%;
}

.benefits-dashboard-img {
    width: 70%;
    height: auto;
}

.benefits-item {
    padding: 4% 5%;
}

.benefits-detail-padding {
    padding: 8% 0 5% 0;
}

.benefits-img-container {
    height: 90px;
}


/* Industry Page */

#industry_home {
    height: 100%;
    width: 100%;
    /*min-height: 770px;*/
    background-image: url("../images/industrybg.png");
    background-size: 100% 100%;
    color: white;
}

#industry_home .navbar-brand {
    padding-left: 5%;
}

#industry_home .text_more {
    font-size: 1em;
}

#industry_menu {
    position: absolute;
    bottom: -12%;
    z-index: 2;
    width: 80%;
    height: 30%;
    background-color: #ffffff;
    box-shadow: 0 19px 34px 0 rgba(0, 0, 0, 0.06);
    left: 10%;
    border-radius: 12px;
    color: #58595B;
}

#industry_menu.pack_img {
    height: 30px;
}

#industry_menu .menu_item .menu_line {
    width: 40%;
    margin-top: 20px;
    display: none;
}

#industry_menu .menu_list {
    margin: 0;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

#industry_menu .menu_item {
    opacity: 0.45;
    padding: 0 2%;
}


/* #industry_menu .menu_item.curr:not(.pend),
#industry_menu .menu_item:hover {
opacity: 1;
}

#industry_menu .menu_item.curr:not(.pend) .menu_line,
#industry_menu .menu_item:hover .menu_line {
display: block;
} */

#industry_menu .menu_item.curr:not(.pend) {
    opacity: 1;
}

#industry_menu .menu_item.curr:not(.pend) .menu_line {
    display: block;
}

#industry_menu_mobile {
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 50px;
    background-color: #0f5f5c;
    box-shadow: 0 19px 34px 0 rgba(0, 0, 0, 0.06);
    align-items: center;
    padding: 0;
    bottom: 0;
}

#industry_menu_mobile .dropdown_menu_list {
    width: 100%
}

#industry_menu_mobile .dropdown_menu_list>ul>li {
    padding: 10px 0;
}

#industry_menu_mobile ul {
    width: 100%;
}

#industry_menu_mobile a,
#industry_menu_mobile span {
    color: white;
}

#industry_menu_mobile .fa {
    padding: 0;
}

#industry_menu_mobile .dropdown-toggle::after {
    display: none;
}

.ml_10 {
    margin-left: 10px;
}

.mr_10 {
    margin-right: 10px;
}

#industry_menu_mobile li.active {
    background-color: #0f5f5c;
    font-weight: 500;
}

#industry_menu_mobile .dropdown-menu {
    position: absolute;
    top: 0;
    transform: none !important;
    border-radius: 0;
    background-color: #0f5f5c;
    border: none;
    padding: 5px;
    margin: 0;
    height: 0;
    display: block;
    -webkit-transition: height 0.5s;
    transition: height 0.5s;
    -webkit-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
    -moz-animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
    overflow: hidden;
}

#industry_menu_mobile .dropdown-menu.show {
    height: 130px;
}

#industry_home #industry_menu_mobile .dropdown-menu.show {
    height: 170px;
}

#industry_menu_mobile .dropdown-menu li {
    padding: 5px;
    height: 40px;
}

#industry_menu_mobile .menu_icon {
    height: 20px;
    width: 50px;
    vertical-align: middle;
    margin-right: 10px;
}

.industry_des {
    font-size: 1.5em;
    margin-top: 10px;
    margin-bottom: 5%;
}

.container-fluid.industry_content {
    color: #78797B;
    line-height: normal;
}

.industry_content .packnprod {
    color: #78797B;
    margin-top: 160px;
}

.img_block img {
    width: 100%;
    box-shadow: 0 8px 23.5px 0 rgba(0, 0, 0, 0.2);
}

.section_block {
    min-height: 150px;
    display: table;
    width: 100%;
    padding: 60px 0;
}

.section_block .center_text {
    display: table-cell;
    vertical-align: middle;
}

.content_box {
    justify-content: space-between;
}

.box_reverse {
    flex-direction: row-reverse;
}

.content_box>div {
    margin-bottom: 30px;
}

.content_box .img_block img {
    /* min-height: 356px; */
    max-width: 100%;
    box-shadow: 0 8px 23.5px 0 rgba(0, 0, 0, 0.2);
}

.content_box .box_des {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding-top: 0;
}

.content_box .box_head {
    padding-bottom: 30px;
}

.content_box .box_text {
    min-height: 40%;
    padding-bottom: 50px;
    font-size: 20px;
}

.content_box .box_btm {
    font-size: 20px;
}

.slogan_industry {
    background-image: url("../images/homepage_hero_image.jpg");
}

.client_logos img {
    /*height: 40px;*/
    width: 100%;
}

.client_logos {
    padding-top: 10px;
    align-items: center;
}

a.nostyle:link {
    text-decoration: inherit;
    color: inherit;
}

a.nostyle:visited {
    text-decoration: inherit;
    color: inherit;
    cursor: auto;
}


/* Tags */

#tags {
    height: 100%;
    width: 100%;
 
    color: white;
    /* padding-left: 5%; */
}

#tags .navbar-brand {
    padding-left: 5%;
}

#tags_content {
    position: relative;
    top: -30%;
    font-weight: 300;
}

#tags_content .menu_list {
    border-radius: 7.5px;
    background-color: #ffffff;
    box-shadow: 0 1px 19px 0 rgba(0, 0, 0, 0.14);
    justify-content: center;
}

#tags_content #tags_menu {
    opacity: 0.84;
    background-color: #ffffff;
    border: none;
    border-right: 0.5px solid #efefef;
}

#tags_content #tags_menu .nav-link {
    border: 2px solid transparent;
    border-radius: 0;
    padding-right: 50px;
}

#tags_content #tags_menu .nav-link:hover {
    background-color: #fbfbfb;
}

#tags_content #tags_menu .nav-link.active {
    background-color: #fbfbfb;
    border-left: 2px solid #37b0c0;
}

#tags_content #tags_panel {
    background-color: #ffffff;
    flex: 1;
    margin: 0 20px;
    padding-bottom: 50px;
}

.tag_box {
    padding: 15px;
    margin-bottom: 40px;
    align-items: center;
    border-radius: 5px;
    background-color: #ffffff;
    box-shadow: 0 3px 13px 0 rgba(0, 0, 0, 0.09);
}

.tag_box .box_img {
    padding-bottom: 12px;
}

.tag_box .box_img img {
    max-width: 100%;
}

.tag_box .box_btn {
    margin: 12px 0;
    padding: 5px 20px;
    border-radius: 50px;
    background-color:#ad965f;
    color: white;
    border: none;
}

#tags_panel .tab-panel.active {
    background-color: #ffffff;
}

#tags_detail .navbar-brand {
    padding-left: 5%
}

#tags_detail_content .email_btn {
    padding: 10px 15px;
    color: #ffffff;
    border-radius: 6px;
    background-color:#ad965f;
    outline: none;
}

#tags_detail_content {
    margin-top: 50px;
    margin-bottom: 70px;
    color: #78797B;
}

#tags_detail_content .box_detail {
    padding-bottom: 10px;
}

.navbar-light.navbar_styled {
    box-shadow: 0 0.3px 1px 0 rgba(0, 0, 0, 0.12);
    background-color: #ffffff;
}

.navbar-light.navbar_styled a {
    color: black;
}

.navbar-light.navbar_styled .navbar-nav .nav-link {
    color: black;
}

.navbar-light.navbar_styled .get_start_button {
    border-radius: 50px;
    background-color: rgba(108, 192, 204, 0.75);
    box-shadow: 0.5px 4px 10.5px 0 rgba(108, 192, 204, 0.3);
    border: none;
}

.navbar-light.navbar_styled .dropdown-menu {
    background-color: #ffffff;
}

a.email_request_btn:hover {
    color: #ffffff;
}


/* About Us */

#about-us {
    height: auto;overflow: hidden; padding-bottom: 20px;
    min-height: 680px;
 
    color: white;
    /* padding-left: 5%; */
}

#about-us .navbar-brand {
    padding-left: 5%
}

#about-us .more-information {
    text-align: center;
    padding-top: 25px;
}

#about-us .more-information-herf {
    color: white;
}

#about-us .more-information-herf:hover {
    text-decoration: none;
}

#mission .our-mission {
    width: 100%;
    height: auto;
    padding: 5% 30%;
}

#mission .content {
    width: 100%;
}

.our-resources {
    position: relative;
    height: 54vw;
    color: white;
    padding-top: 30px;
    padding-left: 100px;
    padding-right: 100px;
}

.our-resources-box {
    margin: 5% 15%;
    box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.15);
}

.our-resources-subtitle {
    text-decoration: underline;
    text-decoration-color: #6f6f70;
}

.our-resources .blur {
    position: absolute;
    background-color: #24242499;
    top: 0;
    left: 0;
    z-index: 0;
}

.our-resources>.content {
    width: 60%;
    margin: 0;
}

.resources-header {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.resources-header .h1 {
    height: 50px;
}

.our-resources .h3 .underline {
    border-bottom: 1px solid white;
    width: 100px;
    padding-top: 10px;
    display: block;
    margin: 0 auto;
}

.our-resources .h1,
.our-resources .h3 {
    margin: 0;
}

.resources-content {
    position: relative;
}

.resources-content .h1 {
    padding-bottom: 30px;
}

.our-resources#printing {
    background: url("../images/factory.jpg");
    background-position: center;
    background-size: auto 102%;
}

.our-resources#chip-bonding {
    background: url("../images/chip.jpg");
    background-position: center;
    background-size: auto 102%;
}

.our-resources#smart-packaging {
    background: url("../images/smartpackaging.jpg");
    background-position: center;
    background-size: auto 102%;
}

.our-resources#system {
    background: url("../images/system.jpg");
    background-position: center;
    background-size: auto 102%;
}

.container-fluid#professional-business {
    padding-top: 50px;
    padding-bottom: 50px;
}

#professional-business .font_regular {
    color: grey;
    text-align: center;
}

#professional-business .request_btn {
    margin: 15px 0;
}

#professional-business table {
    text-align: center;
    width: 100%;
}

#professional-business th {
    text-align: center;
}

#professional-business td {
    /* vertical-align: middle; */
}

.btn.btn-round-corner {
    border-radius: 20px;
    cursor: pointer;
}

.btn.btn-round-corner:hover {
    background-color: transparent;
}


/* About Us HY */

#HY-Link {
    height: 50%;
    min-height: 680px;
    background-image: url("../images/hy-link_bcgpicture.png");
    /* background-position: center; */
    background-size: cover;
    color: white;
    /* padding-left: 5%; */
}

#HY-Link .navbar-brand {
    padding-left: 5%
}

.HY-Link-Science-Te {
    width: 80%;
    font-family: SFProDisplay;
    font-size: 35px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
    margin-left: 14%;
    margin-right: 14%;
    margin-top: 4%;
}

.More-information-abo {
    width: 70%;
    font-family: SFProDisplay;
    font-size: 20px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ffffff;
    margin-left: 15%;
    margin-right: 15%;
    margin-top: 4%;
}

.HYLINK_logo {
    width: 150px;
    height: auto;
}

.HYLink-Info {
    text-align: center;
    color: #6f6f70;
}

.HYLink-Info-Content {
    text-align: center;
    color: #6f6f70;
    font-size: 1.2rem;
}

.Company-details {
    width: 80%;
    font-family: SFProDisplay;
    font-size: 20px;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #6f6f70;
    margin-left: 8%;
    margin-right: 8%;
}

.prod_inf_color {
    color: #616f70;
}

.prod_coll_border {
    width: 50%;
    border: 1px solid;
}

.tag_brand {
    margin: 10%;
    width: 200px;
    height: 40%;
}

.tag_brand_d {
    margin: 10%;
    width: 200px;
    height: 20%;
}

.contact_content {
    font-size: 16px;
    margin-top: 5%;
}


/* Contact Us */

.contact_head {
    padding: 5%;
    background-color: #f6fcfd;
}

.navbar_styled .navbar-brand {
    padding-left: 5%;
}

#contact_us_hkmap {
    height: 110%;
    min-height: 1180px;
    width: 100%;
    background-image: url("../images/maphklarge.jpg");
    background-position: center;
    background-size: cover;
    padding-left: 5%;
}

#contact_us_cnmap {
    height: 110%;
    min-height: 1180px;
    width: 100%;
    background-image: url("../images/mapcnlarge.jpg");
    background-position: center;
    background-size: cover;
    background-size: 1920px 1180px;
    padding-left: 5%;
}

.contact_email_btn {
    width: 200px;
    /*height: 60px;*/
    padding: 10px 12px;
    border-radius: 30px;
    border: none;
    background-color: #ad965f;
    color: #fff;
    font-size: 20px;
    margin-top: 30px;
    cursor: pointer;
}

.contact_email_btn:hover {
    color: #fff;
}

#contact_us_hkmap_new {
    background-image: url("../images/maphk.jpg");
    background-position: center;
    background-size: cover;
    width: 100%;
    height: 100%;
}

.contact_us_map {
    width: 100%;
    min-height: 750px;
}

.contact_img {
    width: 70px;
    height: auto;
}


/* Footer */

#Footer {
    background: #0f5f5c;
    color: white;
    padding: 0;
    padding-left: 8%;
    padding-right: 8%;
}

#Footer .content {
    margin: 0;
}

#footer-mobile {
    background: #0f5f5c;
    color: white;
    padding: 0 50px;
    padding-top: 20px;
}

#footer-mobile .card {
    background-color: transparent;
    border: none;
}

#footer-mobile .card-header {
    background-color: transparent;
    border: none;
    padding-left: 0;
    padding-right: 0;
    font-size: 1.75rem;
}

#footer-mobile .card-header a {
    display: inline-block;
    width: 100%;
}

#tags_content #tags_menu #footer-mobile .card-toggle {
    float: right;
    padding: 0;
    line-break: 22px;
}

#footer-mobile .card-body {
    padding: 0.5rem;
    line-height: 2rem;
    font-size: 1rem;
}

#footer-mobile a {
    color: white;
}

#Footer a {
    color: white;
}

#footer-mobile .email-subscription {
    font-size: 12px;
    width: 60%;
}

#footer-mobile .social-media div {
    font-size: 12px;
}

.email-subscription-input-container {
    background-color: white;
    border-radius: 4px;
    font-size: 1rem;
    padding: 5px 10px;
}

.email-subscription-input {
    width: calc(100% - 40px);
    border: none;
    padding: 0;
    outline: none;
    background-color: transparent;
}

.email-subscription-submit {
    border: 0;
    background: transparent;
    padding: 0;
    float: right;
}

.email-subscription-submit .fa {
    padding: 0;
}

.footer_table {
    max-width: 95%;
    line-height: 2.15;
    font-size: 13pt;
    overflow: auto;
}

.footer_table th {
    padding-top: 20px;
    padding-bottom: 10px;
}

.footer_table td {
    font-size: 10pt;
}

.tandc {
    font-size: 8pt;
    padding-top: 10%;
}

.fa {
    padding: 10px;
    font-size: 12px;
    width: 35px;
    text-align: center;
    text-decoration: none;
    border-radius: 50%;
}

.fa-facebook {
    background: #3b5998;
    color: white;
}

.fa-twitter {
    background: #55acee;
    color: white;
}

.fa-instagram {
    background: #125688;
    color: white;
}

.fa-wechat {
    background: #1e9c3e;
    color: white;
}


/* 404 Not Found Page*/

.nf_container {
    position: relative;
    width: 380px;
}

.nf_container .nf_link {
    position: absolute;
    bottom: 0;
    left: 40px;
    width: 300px;
    height: 60px;
}


/* Individual News Page */

#indi-news {
    height: 40%;
    min-height: 350px;
    background-image: url("../images/news_bg1.jpg");
    background-size: cover;
    color: white;
    /* padding-left: 5%; */
}

#indi-news .navbar-brand {
    padding-left: 5%;
}

#news_content p {
    font-family: Helvetica;
}

.news_container {
    margin: 5% 10% 10% 10%;
    padding-bottom: 40px;
    border-bottom: solid 2px #c8c8c8;
}

#news_content .search_container {
    width: 100%;
    border-radius: 6px;
    background-color: #f5f5f5;
    padding: 10%;
}

#news_content .search_container input {
    width: 100%;
    border-radius: 6px;
    background-color: #ffffff;
    /* box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.25); */
}

#news_content .search_container .find_btn {
    border-radius: 6px;
    background-color: #b8b8b8;
    color: #ffffff;
    margin: 15px 0;
    padding: 4px 12px;
}

#news_content .recent_container {
    width: 100%;
    /*margin-top: 25px;*/
}

#news_content .recent_container ul {
    list-style: none;
    padding: 0;
}

#news_content .recent_container ul li {
    color: #37b0c0;
    padding-top: 5px;
    padding-bottom: 10px;
    border-bottom: solid 1px #e9e9e9;
}

#news_content .news_img_container {
    float: left;
    padding: 0;
    margin-right: 20px;
}

#news_content .news_img {
    width: 100%;
    height: auto
}

@media screen and (min-width: 1200px) {

    /* Nav */
    .get_start_button {
        margin-left: 0 !important
    }
}

@media screen and (max-width: 991px) {

    /* About Us */
    .our-resources-subtitle_s {
        margin-top: 25%;
    }

    .our-resources {
        padding-top: 15px;
        background-size: auto 102%;
    }

    .our-resources>.content {
        width: 100%;
    }

    .our-resources .h1 {
        font-size: 30px;
    }

    .our-resources .h3 {
        font-size: 24px;
    }

    .our-resources .h6 {
        line-height: 20px;
    }

    /* Tag */
    #tags_detail_content .box_desc ul {
        display: inline-block;
        text-align: left;
    }
}

@media screen and (min-width: 769px) {
    #news_table_paginate .paginate_button.current {
        border-radius: 50%;
        border: solid 2px #6cc0cc;
    }

    .tag_brand {
        margin: 10%;
        width: 80%;
        height: 60%;
    }

    .tag_brand_d {
        margin: 10%;
        width: 70%;
        height: 35%;
    }
}

@media screen and (min-width: 992px) {

    /* Nav */
    .get_start_button {
        margin-left: auto
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {

    /* Nav */
    .get_start_button {
        margin-left: auto
    }

    .navbar-collapse {
        flex-basis: 100%;
    }

    /* Index */
    .price .header {
        font-size: 2vw;
        font-weight: bold;
    }

    /* Tags */
    #tags_content #tags_menu {
        border: none;
        justify-content: center;
    }

    #tags_content #tags_menu .nav-link {
        padding: .5rem 1rem;
    }

    #tags_content #tags_menu .nav-link:hover {
        background-color: #ffffff;
    }

    #tags_content #tags_menu .nav-link.active {
        background-color: #ffffff;
        border-left: 2px solid transparent;
    }

    #tags_content #tags_menu .nav-link:after {
        content: "";
        position: relative;
        display: block;
        border-bottom: 2px solid transparent;
        width: 80%;
        left: 10%;
    }

    #tags_content #tags_menu .nav-link.active:after {
        content: "";
        position: relative;
        display: block;
        border-bottom: 2px solid #37b0c0;
        width: 50%;
        left: 25%;
    }

    /*About us */
    #About_content .solution_text {
        font-size: 2.3vw;
    }
}


/* Mobile version */

@media screen and (max-width: 768px) {

    html,
    body {
        min-height: 540px;
    }

    /* Top Nav */
    .navbar {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1030;
        background: #0f5f5c;
    }

    /* Nav */
    /*.navbar {
        padding-bottom: 0;
    }*/
    .navbar-collapse {
        flex-basis: 100%;
        max-height: calc(90vh - 62px);
        overflow: auto;
    }

    .nav-collapse-heading {
        text-transform: uppercase;
        border-bottom: 1px solid #9a9a9a;
        color: #9a9a9a;
        font-size: 12px;
        line-height: 40px;
    }

    .language {
        text-align: left;
        font-size: 1rem;
    }

    /* Mobile version for Home Page */
    #Home {
        height: auto;
        min-height: 400px;
    }

 

    .home-small-title-div {
        padding: 25% 0;
        width: 50%;
    }

    .home_sec_title {
        font-size: 1rem;
        padding: 10% 0;
    }

    .video_btn {
        margin: 0;
        width: auto;
        height: 40px;
        font-size: 18px;
    }

    .video_btn_img {
        width: 20%;
        padding-right: 5px;
    }

    .link_btn {
        /* width: 140px; */
        text-align: center;
        font-size: 14px;
    }

    .about_icon {
        width: 70%;
        height: auto;
    }

    .client-icon {
        width: 100%;
        height: auto;
    }

    #Business-content-small {
        height: 200%;
        width: 100%;
    }

    .industry-div-small {
        width: 100%;
        height: 25%;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    .container-fluid .business-content-div-small {
        height: 100%;
        width: 100%;
        color: #ffffff;
        text-align: left;
    }

    .business-grey {
        padding: 15% 15% 25% 15%;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
    }

    #business-small-1 {
        background-image: url("../images/coscosmetic.jpg");
    }

    #business-small-2 {
        background-image: url("../images/tabbaco.jpg");
    }

    #business-small-3 {
        background-image: url("../images/medicine2.jpg");
    }

    #business-small-4 {
        background-image: url("../images/fashion.jpg");
    }

    .business-grey .more_btn {
        color: white;
    }

    #Product_Options .price {
        height: auto;
    }

    .po_header_text {
        padding: 30px 0;
        line-height: 1;
        margin-left: 0;
        margin-right: 0;
    }

    #Get_Update {
        height: auto;
        padding-bottom: 20%;
    }

    #Get_Update .content_v3 {
        margin-left: 10%;
        margin-right: 10%;
    }

    #Get_Update .subscribe_btn {
        margin-top: 30px;
        margin-left: 0;
    }

    .demo-req-small {
        padding: 10% 5%;
        color: white;
    }

    .demo-req-small .request_btn {
        margin-left: 0;
        margin-bottom: 20px;
    }

    .solution_text {
        font-size: 1.2em;
    }

    .packnprod-top {
        margin-top: 60px;
    }

    /* Mobile version for Solution Page sub menu*/
    .solu_menu .menu_list .menu-text {
        margin: 0;
        font-size: 0.8rem;
    }

    .solu_menu .menu_list .menu-text {
        font-size: 0.8rem;
    }

    .solu_menu .menu_list .menu_item:first-child {
        border-radius: 12px 0 0 12px;
    }

    .solu_menu .menu_list .menu_item:last-child {
        border-radius: 0 12px 12px 0;
    }

    .solu_menu .menu_list .menu_item {
        padding: 20px 15px 10px 15px;
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    }

    .solu_menu .menu_list .menu_item.menu_active {
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), inset 0 1px 3px 0 rgba(0, 0, 0, 0.2);
    }

    .solu_menu .menu_list .menu_item .pack_img {
        height: 37px;
        padding-bottom: 10px;
    }

    /* Mobile version for Solution(Package and Product) Page */
    #pack_options,
    #product_process,
    .table-bottom-line,
    .topnav {
        display: none;
    }

    .container-fluid .content {
        margin: 0% 7%;
    }

    .container-fluid .content_v4 {
        margin: 0;
    }

    .container-fluid .content_v5 {
        margin: 0 0%;
    }

    h1 {
        font-size: 2rem;
    }

    #solution_home {
        height: 85%;
        padding-left: 0;
        position: relative
    }

    .packplus-logo-img {
        padding-left: 30px;
    }

    .sec_title {
        font-size: 2rem;
        padding-top: 30px;
    }

    .mobile-menu {
        position: absolute;
        bottom: 0;
        height: 40px;
        width: 100%;
        background-color: #0f5f5c;
    }

    .bottom_nav_img {
        height: 30px;
        width: auto;
    }

    .solu_menu_img {
        width: 100%;
        height: auto;
    }

    .pnp_des {
        line-height: 1.5em;
    }

    .options {
        margin: auto;
        height: 33%;
        margin-bottom: 30px;
        line-height: 1.75em;
    }

    .explore_btn {
        bottom: 5em;
    }

    .price .header {
        padding-top: 0;
    }

    .pro_process_small {
        margin: 50px 0;
    }

    .header-top {
        margin: 5% 0 10% 0;
    }

    .option-text {
        color: #83a7a5;
    }

    #package_and_product,
    #packing_options {
        padding-top: 10%;
        background-color: #f4feff;
    }

    #product_process_mobile .process_text {
        padding-top: 0;
        font-size: 1.2rem;
        line-height: 1.2;
    }

    #packing_options .options .price {
        background-color: #ffffff;
        height: 450px;
    }

    #product_process_mobile .header-top {
        margin: 3% 0;
        font-size: 1.8rem;
    }

    #product_process_mobile .numbered_icon {
        min-width: 10px;
    }

    #something-more .content .row {
        align-items: center;
    }

    #something-more .icon-des {
        text-align: left;
        padding-left: 10px;
    }

    .webapp-title-padding {
        padding-right: 10px;
    }

    .carousel-item .item-padding-small {
        font-size: 1rem;
    }

    #product_process_mobile>.row {
        line-height: 1.15;
    }

    /* Mobile version for Solution(Application and System) Page */
    #application,
    #backend {
        display: none;
    }

    #application_small #web_app_small,
    #application_small #native_app_small,
    #primary_man_small,
    #application_small #crm_small {
        padding-bottom: 70px;
        border-bottom: solid 1px #cccccc;
        margin-bottom: 50px;
    }

    .item-padding-small {
        padding: 20px 0 20px 0;
    }

    .solu-slogan {
        width: 85%;
    }

    #application_small {
        padding-top: 10%;
        background-color: #f4feff;
        box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.1);
    }

    #web_app_small .carousel-control-next,
    #primary_man_small .carousel-control-next,
    #web_app_small .carousel-control-prev,
    #primary_man_small .carousel-control-prev {
        align-items: start;
    }

    #web_app_small .app-sub-title,
    #primary_man_small .app-sub-title {
        padding-top: 5px;
    }

    #web_app_small .packnprod {
        margin-top: 15%;
    }

    #application_small #web_app_small {
        border-bottom: none;
    }

    .app-sub-title {
        color: black;
    }

    #application_small .item-padding-small,
    #backend_small .item-padding-small {
        display: flex;
        align-items: center;
    }

    #package_and_product .carousel-indicators li {
        width: 10px;
        height: 10px;
        border-radius: 100%;
        border: solid 1px #83a7a5;
        background-color: #83a7a5;
    }

    #package_and_product .carousel-indicators li.active {
        background-color: #ffffff;
    }

    /* Mobile version for Solution(Operation & Data Analysis) Page */
    #data-collect {
        height: auto;
        padding-bottom: 15%;
        padding-top: 10%;
        background-color: #f4feff;
        border: 0;
    }

    #data-kind {
        background-color: #f4feff;
        box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.1);
    }

    #data-collect .data_des {
        padding: 5% 0;
    }

    #data-kind,
    #data-ana,
    #data-find,
    #Benefits_bg {
        height: auto;
        margin-bottom: 50px;
    }

    #data-kind .data-kind-container {
        padding: 30px 0;
    }

    #Benefits_details {
        height: auto;
    }

    #Benefits_bg {
        min-height: auto;
    }

    #data-kind .data-container {
        border: 0;
    }

    #data-kind .data-kind-icon {
        padding-top: 0;
    }

    #data-ana .ana_des {
        line-height: 1;
    }

    #data-ana .content .data-container {
        margin: 0;
    }

    .data-ana-img {
        width: 100%;
    }

    #data-find .finding-choice {
        padding: 20px 10px;
    }

    #data-find .finding-container {
        padding-bottom: 0;
    }

    .find-icon-container,
    .finding-container {
        border: 0;
    }

    .menu_line {
        width: auto;
    }

    .benefit-slogan {
        margin: 0;
        font-size: 1.5rem;
    }

    .benefits-dashboard-img {
        width: 100%;
        height: auto;
    }

    .carousel-item {
        min-height: 230px;
    }

    #Benefits_details .carousel-inner {
        min-height: 320px;
    }

    .carousel-inner .active {
        background-color: transparent;
    }

    .benefits-img-container {
        height: auto;
    }

    .data-kind-icon {
        border: none;
    }

    #Benefits_details .carousel-indicators {
        bottom: 0px;
    }

    #Benefits_details .carousel-indicators li {
        border-radius: 10px;
        margin: 1px 3px;
        height: 10px;
        max-width: 10px;
        border: 1px solid #FFF;
        background-color: #83a7a5;
    }

    #Benefits_details .carousel-indicators .active {
        background-color: #fff;
        border: 1px solid #83a7a5;
        max-width: 12px;
        margin: 0 3px;
        height: 12px;
    }

    /* Mobile Version for Solution Dropdown*/
    /* DROPDOWN */
    /* .dropdown * {
font-size: 12px;
} */
    .dropdown .btn,
    .dropdown .btn:active,
    .dropdown .btn:focus {
        height: 35px;
        width: 100%;
        background: #0f5f5c !important;
        border: none;
        border-radius: 0;
        box-shadow: none !important;
        line-height: 23px;
    }

    .dropdown .fa {
        width: 15px;
        text-align: center;
    }

    .dropdown .btn .toggle-icon {
        float: right;
        line-height: 23px;
    }

    .dropdown.show .btn {
        background: #0f5f5c;
        box-shadow: none;
    }

    .dropdown-menu {
        width: 100%;
        border-radius: 0;
    }

    .dropdown-menu.show {
        transform: none !important;
        /* top: 100%!important; */
        margin: 0;
        border: none;
        background: #0f5f5c;
    }

    .dropdown-item {
        color: white;
        padding: .375rem .75rem;
    }

    /* Mobile Version for Demo */
    #Demo {
        height: 25%;
        max-height: 245px;
        min-height: 220px;
        background-image: url("../images/footer_origionalsize.jpg");
        background-position: center;
        background-size: cover;
    }

    .demo_table {
        height: 60%;
        text-align: center;
    }

    .demo_table th {
        padding-top: 12%;
        text-align: center;
    }

    .demo_table td {
        vertical-align: middle;
    }

    /* Mobile Version for Industries */
    #industry_home {
        height: 85%;
        position: relative;
    }

    .industry_des {
        font-size: 1rem;
    }

    .industry_content {
        padding-top: 10%;
    }

    .industry_content h3 {
        font-size: 1.5rem;
    }

    .content_box .box_text,
    .content_box .box_btm {
        font-size: 1rem;
    }

    .industry_content .packnprod {
        margin-top: 60px;
    }

    .content_box .img_block img {
        min-height: auto;
    }

    .content_box .box_des {
        padding-top: 50px;
    }

    /* Mobile version for Industry Page sub menu*/
    #industry_menu {
        bottom: 5%;
        height: auto;
        min-height: auto;
        min-width: 350px;
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto;
    }

    #industry_menu .menu_list {
        margin: 0;
        font-size: 0.8rem;
        transform: none;
    }

    #industry_menu .menu_list h5 {
        font-size: 0.6rem;
    }

    #industry_menu .menu_list .menu_item:first-child {
        border-radius: 12px 0 0 12px;
    }

    #industry_menu .menu_list .menu_item:last-child {
        border-radius: 0 12px 12px 0;
    }

    #industry_menu .menu_list .menu_item {
        padding: 5% 3%;
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    }

    #industry_menu .menu_list .menu_item.curr {
        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), inset 0 1px 3px 0 rgba(0, 0, 0, 0.2);
    }

    #industry_menu .menu_list .menu_item .pack_img {
        height: 37px;
        padding-bottom: 10px;
    }

    #industry_menu .menu_item .menu_line {
        margin-top: 10px;
        width: 80%;
    }

    /* Mobie Version for Tags */
    #tags {
        height: 85%;
    }

    #tags_content {
        top: 0;
    }

    #tags_content .menu_list {
        margin: 0;
    }

    #tags_content #tags_panel {
        margin-left: 0;
        margin-right: 0;
    }

    #tags_panel .tag_box {
        padding-left: 0;
        padding-right: 0;
    }

    #tags_panel .row {
        margin-left: 0;
        margin-right: 0;
    }

    #tags_panel .row .col-md-4 {
        padding-left: 0;
        padding-right: 0;
    }

    #dropdown_tag_filter {
        padding: 10px;
    }

    #dropdown_tag_filter select {
        background-color: #ffffff;
        border: none;
    }

    /* Mobile Version for About Us */
    #about-us {
        min-height: 500px;
    }

    .container-fluid #mission {
        padding-left: 5%;
        padding-right: 5%;
    }

    #mission .our-mission.en {
        content: url("../img/mission_eng_small.jpg");
        padding: 5% 20%;
    }

    .our-resources {
        min-height: 550px;
        padding-left: 20px;
        padding-right: 20px
    }

    .resources-header {
        position: relative;
    }

    .resources-content {
        text-align: center;
    }

    .resources-content .h1 {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .container-fluid#professional-business .content_v4 {
        margin: 0;
    }

    .container-fluid#professional-business .content_v4 {
        margin: 0;
    }

    .container-fluid#professional-business {
        padding-left: 25px;
        padding-right: 25px;
    }

    .our-resources-text {
        min-height: 300px;
    }

    /* Mobile Version for Contact Us */
    .nav-link {
        color: white !important
    }

    .dropdown-item {
        color: white !important
    }

    .dropdown-item:hover {
        background-color: transparent
    }

    #contact_us_hkmap {
        height: 450px;
        min-height: 650px;
        max-height: 650px;
        padding-left: 0;
        width: 100%;
        background-image: url("../images/maphksmall.jpg");
        background-position: center;
        background-size: cover;
    }

    #contact_us_cnmap {
        height: 450px;
        min-height: 650px;
        max-height: 650px;
        padding-left: 0;
        width: 100%;
        background-image: url("../images/mapcnsmall.jpg");
        background-position: center;
        background-size: cover;
    }

    .contact_info_box {
        height: auto;
        list-style-type: none;
        margin: 0;
        padding: 0;
        padding-bottom: 20px;
        border-radius: 5px;
        -webkit-transition: 0.3s;
        background-color: white;
        transition: 0.3s;
        box-shadow: 1px 2px 3px 1px rgba(0, 0, 0, 0.2);
    }

    .contact_info_box:hover {
        box-shadow: 3px 8px 12px 5px rgba(0, 0, 0, 0.4);
    }

    .contact_info_box li {
        padding-left: 20px;
        padding-right: 20px;
        text-align: left;
        color: #58595B;
    }

    .special_li {
        color: #0f5f5c !important
    }

    .contact_info_box .header {
        font-family: SanFranciscoDisplay;
        padding-top: 10%;
        font-size: 25px;
        font-weight: bold;
        text-align: center;
    }

    .contact_email_btn {
        width: 180px;
        height: 35px;
        border-radius: 25px;
        border: none;
        background-color: #6cc0cc;
        color: #fff;
        font-size: 15px;
        margin-top: 20px;
        cursor: pointer;
    }

    .contact_container_hk {
        width: 100%;
        position: absolute;
        top: 560px;
    }

    .contact_container_cn {
        width: 100%;
        position: absolute;
        top: 1200px;
    }

    .contact_info_box {
        margin-top: -30%;
        padding: 10% 0;
    }

    .contact_info_box h1 {
        font-size: 1.5rem;
    }

    .contact_info_box h3 {
        font-size: 1.2rem;
    }

    .contact_us_map {
        min-height: 0;
    }

    #contactus_main .map_group {
        padding-bottom: 10%;
    }

    #contact_main {
        padding-top: 70px;
    }

    /* 404 Not Found Page*/
    .nf_container {
        width: 180px;
    }

    .nf_container .nf_link {
        position: absolute;
        left: 15px;
        width: 150px;
        height: 30px;
    }

    /* Latest News Page */
    #indi-news {
        background-position: center;
    }

    .news_container {
        border-bottom: 0;
    }

    #news_content .news_img_container {
        padding: 0 25px 10px 25px;
    }

    .HYLINK_logo {
        width: 28%;
        height: 18%;
        object-fit: contain;
        margin-top: 40%;
    }
}

@media screen and (max-width: 568px) {
    #product_process_mobile .process_text {
        padding-top: 0;
        font-size: 0.6rem;
        line-height: 1.2;
    }

    #product_process_mobile .header-top {
        margin: 3% 0;
        font-size: 0.8rem;
    }

    .HYLINK_logo {
        width: 28%;
        height: 18%;
        object-fit: contain;
        margin-top: 65%;
    }

    .our-resources-subtitle_s {
        margin-top: 25%;
    }
}



.container .paging {
  text-align: center;
  margin-top: 40px;
}
 

.container .paging   a, .container .paging   span {
  text-align: center;
  font-size: 16px; margin-left: 8px;margin-right: 8px;
  color: #333333;
  display: inline-block;
  background: #e9e9e9;
  padding: 5px 15px; 
}

span.fypage_current{background: #6cc0cc !important;color: #fff !important}

.box_desc {margin-bottom: 20px;height: auto; overflow: hidden}
.box_desc ul {margin: 0px; padding: 0px; list-style: none}

.box_desc ul li { list-style: none;
  width: 31.33%;
  float: left;
  cursor: pointer;
  background: #f3f3f3;
  margin: 0 3% 2% 0;
  box-sizing: border-box;
}
.box_desc ul li img {
  width: 100%;
}
.box_desc ul li:nth-child(3n) {
  margin-right: 0;
}
.box_desc  ul li.on {
  border: 2px solid #ec450b;
}