/* Theme Name: CSU Author: ESD Service Limited Author URI: https://www.esdlife.com Description: Site templated used by the Campaigns Project. Requires at least: 6.4 Tested up to: 6.4 Requires PHP: 8.0 Version: 1.0 */ /* reset css */ *{font-family: 'Noto Sans TC', '微軟正黑體',"Microsoft JhengHei","微軟正黑體",微軟正黑體,"Apple LiGothic Medium","蘋果儷中黑",蘋果儷中黑,Arial,Helvetica,sans-serif;} * {-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;} body { background: #fff; } a, a:hover, a:active, a:focus{text-decoration: none !important} img{margin: 0 auto;padding: 0;border: 0;} .row{margin: 0 auto;} .fa, .far, .fas { font-family: "Font Awesome 5 Free" !important;} .section-inner { margin-left: auto; margin-right: auto; max-width: 120rem; width: calc(100% - 4rem); width: calc(100% - 40px) } .header-inner { max-width: 168rem; padding: 3.15rem 0; z-index: 100; } ul.primary-menu { display: flex; font-size: 1.8rem; font-weight: 500; letter-spacing: -0.0277em; flex-wrap: wrap; justify-content: flex-end; margin:0; padding-left: 0; } ul.primary-menu { display: flex; font-size: 1.8rem; font-weight: 500; letter-spacing: -0.0277em; list-style: none; flex-wrap: wrap; justify-content: flex-end; padding-left: 0; } hr.section-inner {display: none} .icon:before { display: inline-block; vertical-align: middle; } .arrow-btn:before { content: ''; width: 45px; height: 45px; background: url('/multisites/csu/wp-content/themes/CSU/assets/images/common/icon-circle-arrow.svg') no-repeat 50%; background-size: cover; } /* Reference */ body:not(.enable-search-modal) .header-titles-wrapper { justify-content: flex-start; padding-left: 0; text-align: left; } .header-titles-wrapper { align-items: center; display: flex; justify-content: center; padding: 0 4rem; text-align: center; } @media (min-width: 700px){ .section-inner { width: calc(100% - 8rem); } .header-inner { padding: 3.8rem 0; } } @media (min-width: 992px){ .header-inner { align-items: center; display: flex; justify-content: space-between; padding: 2.8rem 0; } .header-titles-wrapper { margin-right: 4rem; max-width: 50%; padding: 0; text-align: left; } .header-titles { align-items: baseline; display: flex; flex-wrap: wrap; justify-content: flex-start; margin: -1rem 0 0 -2.4rem; } ul.primary-menu { flex-wrap: nowrap; padding: 0; } } /* highlight color css */ /*** Works on common browsers ***/ /*::selection { background-color: #FFD1BB; color: #000;} /*#FFF3E6*/ /*** Mozilla based browsers ***/ /*::-moz-selection { background-color: #FFD1BB; color: #000;}*/ /***For Other Browsers ***/ /*::-o-selection { background-color: #FFD1BB; color: #000;} ::-ms-selection {background-color:#FFD1BB;color: #000;}*/ /*** For Webkit ***/ /*::-webkit-selection { background-color: #FFD1BB; color: #000;}*/ button:focus {outline: none;} #top_mask{position: fixed;top: 0; width: 100%;height: 150px;background: rgb(255,255,255);background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 30%, rgba(255,255,255,1) 90%);z-index: 1;display: none;} button.close-nav-toggle i,button.close-nav-toggle i:focus, button.close-nav-toggle i:active,button.close-nav-toggle i:hover {font-size: 24px;color: #aaa; margin-right: 15px;padding: 5px 10px; border: none; text-decoration: none !important;} .primary-menu-modal .toggle{text-decoration: none;} button.close-nav-toggle {padding: 3.1rem 0 10px;} .mobile-menu {display: block;margin-top: calc(50% - 100px);} .reset-list-style, .reset-list-style ul, .reset-list-style ol {list-style: none; margin: 0;} /* a link color css */ /*.color-accent,.color-accent-hover:hover,.color-accent-hover:focus,:root .has-accent-color,.has-drop-cap:not(:focus):first-letter,.wp-block-button.is-style-outline,a { color: #FF9377; }blockquote,.border-color-accent,.border-color-accent-hover:hover,.border-color-accent-hover:focus { border-color: #FF9377; }button:not(.toggle),.button,.faux-button,.wp-block-button__link,.wp-block-file .wp-block-file__button,input[type="button"],input[type="reset"],input[type="submit"],.bg-accent,.bg-accent-hover:hover,.bg-accent-hover:focus,:root .has-accent-background-color,.comment-reply-link { background-color: #FF9377; }.fill-children-accent,.fill-children-accent * { fill: #FF9377; }body,.entry-title a,:root .has-primary-color { color: #000000; }:root .has-primary-background-color { background-color: #000000; }cite,figcaption,.wp-caption-text,.post-meta,.content .wp-block-archives li,.content .wp-block-categories li,.content .wp-block-latest-posts li,.wp-block-latest-comments__comment-date,.wp-block-latest-posts__post-date,.wp-block-embed figcaption,.wp-block-image figcaption,.wp-block-pullquote cite,.comment-metadata,.comment-respond .comment-notes,.comment-respond .logged-in-as,.pagination .dots,.content hr:not(.has-background),hr.styled-separator,:root .has-secondary-color { color: #6d6d6d; }:root .has-secondary-background-color { background-color: #6d6d6d; }pre,fieldset,input,textarea,table,table *,hr { border-color: #dcd7ca; }caption,code,code,kbd,samp,.wp-block-table.is-style-stripes tbody tr:nth-child(odd),:root .has-subtle-background-background-color { background-color: #dcd7ca; }.wp-block-table.is-style-stripes { border-bottom-color: #dcd7ca; }.wp-block-latest-posts.is-grid li { border-top-color: #dcd7ca; }:root .has-subtle-background-color { color: #dcd7ca; }body:not(.overlay-header) .primary-menu > li > a,body:not(.overlay-header) .primary-menu > li > .icon,.modal-menu a,.footer-menu a, .footer-widgets a,#site-footer .wp-block-button.is-style-outline,.wp-block-pullquote:before,.singular:not(.overlay-header) .entry-header a,.archive-header a,.header-footer-group .color-accent,.header-footer-group .color-accent-hover:hover { color: #FF9377; }.social-icons a,#site-footer button:not(.toggle),#site-footer .button,#site-footer .faux-button,#site-footer .wp-block-button__link,#site-footer .wp-block-file__button,#site-footer input[type="button"],#site-footer input[type="reset"],#site-footer input[type="submit"] { background-color: #666666; }.header-footer-group,body:not(.overlay-header) #site-header .toggle,.primary-menu-modal .toggle { color: #000000; }body:not(.overlay-header) ul.primary-menu { background-color: #000000; }body:not(.overlay-header) .primary-menu > li > ul:after { border-bottom-color: #000000; }body:not(.overlay-header) ul.primary-menu ul:after { border-left-color: #000000; }.site-description,body:not(.overlay-header) .toggle-inner .toggle-text,.widget .post-date,.widget .rss-date,.widget_archive li,.widget_categories li,.widget cite,.widget_pages li,.widget_meta li,.widget_nav_menu li,.powered-by-wordpress,.to-the-top,.singular .entry-header .post-meta,.singular:not(.overlay-header) .entry-header .post-meta a { color: #6d6d6d; }.header-footer-group pre,.header-footer-group fieldset,.header-footer-group input,.header-footer-group textarea,.header-footer-group table,.header-footer-group table *,.footer-nav-widgets-wrapper,#site-footer,.primary-menu-modal nav *,.footer-widgets-outer-wrapper,.footer-top { border-color: #dcd7ca; }.header-footer-group table caption,body:not(.overlay-header) .header-inner .toggle-wrapper::before { background-color: #dcd7ca; } body:not(.overlay-header) .primary-menu > li > a, body:not(.overlay-header) .primary-menu > li > .icon, .modal-menu a, .footer-menu a, .footer-widgets a, #site-footer .wp-block-button.is-style-outline, .wp-block-pullquote:before, .singular:not(.overlay-header) .entry-header a, .archive-header a, .header-footer-group .color-accent, .header-footer-group .color-accent-hover{color: #666666} body:not(.overlay-header) .primary-menu > li > a, body:not(.overlay-header) .primary-menu > li > .icon, .modal-menu a, .footer-menu a, .footer-widgets a, #site-footer .wp-block-button.is-style-outline, .wp-block-pullquote:before, .singular:not(.overlay-header) .entry-header a, .archive-header a, .header-footer-group .color-accent, .header-footer-group .color-accent-hover:hover{color: #82383B} */ body{font-size: 100%;} .footer-nav-widgets-wrapper{border: none; height: 210px;} .footer-nav-widgets-wrapper.header-footer-group { margin-top: 100px !important; height: 0 !important; margin-top: 0 !important; } /* Hide Empty p tag generated by WP */ p:empty {display: none;} .header-inner .toggle{position: absolute;right: 1rem; top: 50%; transform: translateY(-50%);} .nav-toggle .toggle-inner{padding-top: 0;height: auto;text-align: center;} .nav-toggle .toggle-icon, .nav-toggle svg{width: 30px; height: 30px;} .toggle-icon {background:none; border:0} .toggle-icon i{font-size: 30px;color:#ae6f53;} .primary-menu-wrapper button.close {position:absolute; right:40px; top:25px; z-index: 3} button.close i{font-size: 24px; color: #aaa;} /* breadcrumb */ .page_bg{ position: relative; padding-top: 167px; overflow: hidden; } .bread_padding{padding-top: 30px; position: relative; z-index: 3} .breadcrumb {background-color:transparent !important;position: relative; z-index: 3} .breadcrumb span{font-weight: 500;font-size: 12px;line-height: 19px;letter-spacing: 0.96px;color: #666666;} .breadcrumb a:hover span{ color: #AE6F53; text-decoration: underline;} .breadcrumb i{margin:0 4px 0 10px} .breadcrumb img { vertical-align: -1px;} .singular .entry-header{background: transparent} /* w css */ .footer-inner.section-inner {text-align: left;padding-top: 140px;max-width: 1070px;} .footer-top.has-footer-menu {display: inline-block; border: none;padding: 0;} a {cursor: pointer;} .article-title {text-align: center;} .left { float: left;} .article-container {margin: 0 8%;} .center {text-align: center;} .main-content {padding-top: 90px; padding-bottom: 80px;background-color: #fff; } .singular .featured-media::before { background: none;} #recent-article a { text-decoration: none;} .modal-menu li {border-width: 1px 0 0 0; border-color: #eee;} .modal-menu {padding: 0 40px;} .modal-menu > li:first-child{border-top: none;} .modal-menu > li:last-child{border-bottom: none;} button.close-nav-toggle svg {margin-right: 20px;} /* article col css */ .latest-article-column {overflow: hidden;width: 100%;background: #FFFFFF; border-radius: 15px; border: 1px solid #F0F0F0; box-sizing: border-box;/*height: 100%;*/transition: all .3s} .latest-article-column:hover { box-shadow: 0px 5px 10px rgb(174 111 83 / 40%); transition: all 0.3s;} .latest-article-thumbnail { height: 220px; border-top-right-radius: 0px; border-top-left-radius: 0px; background-size: cover; background-position: center center;transition: all .8s; overflow: hidden; position: relative;} .latest-article-thumbnail::before { content:""; position:absolute; top:0;right:0;bottom:0;left:0; background:inherit; transition:inherit;} .latest-article-column:hover .latest-article-thumbnail::before{ transform: scale(1.2); } .latest-article-content {text-align: left; padding: 15px 20px 28px;} .article_cat{border:1px solid #82383B;box-sizing:border-box;padding:0 12px;font-style:normal;font-weight:500;font-size:12px;line-height:24px;letter-spacing:.05em;color:#82383B;align-self:center;margin:0 4px 8px 0;text-align:center;display:inline-block;display:none;} .article_headline{color:#62634B;font-size:18px;font-style:normal;font-weight:500;line-height:32px;letter-spacing:.9px;margin-bottom:25px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;min-height:50px} .article_desc{margin-bottom: 10px;} .article_desc p{font-style: normal;font-weight: 300;font-size: 16px;line-height: 23px;letter-spacing: 0.05em;color: #666666;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3 ;min-height: 72px;max-height: 3em;} .main-content .item-box .more,.article_more{position:relative;text-align:left;color:#AE6F53;font-size:15px;font-style:normal;font-weight:700;line-height:normal;letter-spacing:1.2px;display:inline-block} .article_more:after{content:'\f054';font-family:'Font Awesome\ 5 Free';font-weight:900;font-size:15px;color:#AE6F53;padding-left:10px} .article-tags {margin: 50px 15px;} .article-tags button{ font-style: normal; font-weight: bold; font-size: 18px; line-height: 200%; letter-spacing: 0.05em; color: #CCC; padding: 6px 30px; border-radius: 10px; border: 2px solid #CCC; background: #FFF; display: inline-block; margin: 0 20px; transition: all .3s;} .article-tags button.is-checked, .article-tags button:hover { color: #fff; border-color: #FF9377; background: #FF9377; text-decoration: none; } .article-tags button:focus{text-decoration: none;} .btn{background: #FFFFFF; border: 2px solid #F26522; border-radius: 10px; font-weight: 700; font-size: 21px; line-height: 31px; text-align: center; letter-spacing: 0.1em; color: #F26522; padding:10px 70px; transition:background .3s } .btn:hover{ color: #fff; background-color: #111633;} #site-content { overflow: visible;} /* header */ #site-header {top: 0px;position: fixed;width: 100%;z-index: 6;background: #fff;box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05); } .header-inner{ /* max-width:1170px; height: 90px;background: #FFFFFF;padding: 20px 15px; */ /* align-items: start; */ background : #DDC5A8; padding: 0px 15px; /* flex-direction: column; */ } .header-titles{margin: 0;} .nav_logo { position: relative; background: linear-gradient(0deg, rgba(255, 255, 255, 1) 3.8%, rgba(250, 242, 234, 1) 66.1%, rgba(237, 217, 205, 1) 100%); padding: 30px; } .nav_logo:after { content:""; width: 221px; height: 84px; background-image: url('/multisites/csu/wp-content/themes/CSU/assets/images/common/nav-bar-deco.svg'); background-repeat: no-repeat; background-position: top right; background-size: 221px 84px; display: block; position: absolute; right: 0; top: 0; } /* menu css */ ul.primary-menu {/*align-items:center;*/justify-content: space-between; padding:0 15px} .primary-menu a{font-family:'Noto Serif TC', serif; position:relative; color : #666666; text-decoration: none;font-weight: 600; font-size: 16px;line-height: normal;letter-spacing: 1.4px; text-align: center;height: 100%; display: flex; padding: 20px 0; align-items: center;justify-content: center;} .primary-menu a:hover,.primary-menu a:active, .primary-menu a:focus{color: #A85231 !important;text-decoration: none; font-weight:700; transition: all .3s;} /* .primary-menu > li, ul.primary-menu > li{margin-left: 30px;} */ .primary-menu li.current-menu-item > a, .primary-menu li.current-menu-item > .link-icon-wrapper > a, .current_page_parent > a{color : #A85231;text-decoration: none;} /*.primary-menu a:not(:last-child):after, .current_page_parent a:after {content:'';position:absolute;width:100%;transform:scaleY(0);height:2px;bottom:-4px;left:0;background-color:#F26722;transition:all .3s} .primary-menu a:hover:after, .current_page_parent a:after { transform: scaleY(1);}*/ .current_page_item a{color:#EE2D24; font-weight: 700} /* .primary-menu a.test-cta, .mobile-selfass-btn a.test-cta{padding: 10px 25px;height: 50px;background: #EE2D24; border: 1.5px solid #111633; align-self: center;display: block;transition: all .3s; text-align: center; font-size: 18px; font-style: normal; font-weight: 500; line-height: normal; letter-spacing: 1.8px; color:#fff !important;} .primary-menu a.test-cta img{ margin-right: 10px; display: inline-block;} .primary-menu a.test-cta:hover, .mobile-selfass-btn a.test-cta:hover{background: #EE2D24; text-decoration:none; transition: all .3s} .mobile-selfass-btn {position: absolute; right: 100px;} .mobile-selfass-btn a.test-cta{ display: flex; align-items: center; justify-content: center; } .mobile-selfass-btn a p{color:#fff !important; font-size:20px; line-height: 20px; margin-bottom: 0;} .mobile-selfass-btn a p br{display:none} */ hr.separate {border-color : rgba(98, 99, 75, 1);} ul.custom-list { list-style-type: "- " } /* footer css */ /*#site-footer.header-footer-group{background:rgba(255,255,255,1);width:100%;padding:30px 0 35px} .footer-credits {font-size:12px;line-height:19px;letter-spacing:.05em;color:#111633;padding-top:12px;padding-bottom:12px;display:block} .footer-credits a{font-weight:350;color:#111633;text-decoration:none} .footer-credits a:hover{color:#EE2D24} .footer-credits span{margin:0 10px} p.footer-copyright{ width: 100%;line-height: 24px;font-weight: 400;letter-spacing: 0.6px;margin: 0;} img.healthyd_logo{max-width:142px;width:100%} .footer-menu a{font-style: normal;font-weight: 300;font-size: 14px;line-height: 200%;letter-spacing: 0.05em;color: #999999 !important;margin: 30px 0px;} .footer-menu a:hover{color: #EE2D24 !important;} .footer-menu{margin: 0; padding: 0;} .footer-menu li{margin: 0 15px;} .footer-menu li::after{ content: '/'; font-style: normal;font-weight: 300;font-size: 14px;line-height: 200%;letter-spacing: 0.05em;color: #999999;margin: 0 0 0 30px;} .footer-menu li:first-child{margin-left: 0;} .footer-menu li:last-child::after{display: none}*/ /* Footer / References */ .refs-section{background:#FCF5ED;padding:40px 0 0px;font-size:.78rem;color:#777;line-height:1.55} .refs-section p{font-family:'Noto Serif TC',serif; font-weight: 600; font-size:16px;letter-spacing:1.43px;color:#62634B;margin-bottom:12px} .refs-section ol, .refs-section a{font-size:12px;font-weight:400;color:#62634B;} .refs-section ol{padding-inline-start:20px} .refs-section a:hover {text-decoration: underline;color:#62634B;} footer{background:#FCF5ED;font-size:14px;letter-spacing:1.05px;color:#62634B;padding-bottom:40px; padding-top: 20px;} /* homepage css */ .home_kv{margin: 0 auto; } .home_kv img {margin: 0 auto; width: 100%;} /*.home-title,.entry-title{text-align: center;margin-top: 45px; margin-bottom: 20px;}*/ .articles-section h2.entry-title{text-align: center;margin-top: 0px; margin-bottom: 20px;} /*.home-title, h1.entry-title, h2.entry-title { color: #111633; text-align: center; font-size: 35px; font-style: normal; font-weight: 700; letter-spacing: 5px; margin-top: 80px; } .home-title span,h1.entry-title span, h2.entry-title span{ color: #EE2D24; }*/ /* h1.entry-title {color:#111633} .home-title {margin-bottom:30px;}*/ .post-inner{padding: 0;margin: 0 auto;} .content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {max-width: 100%;width: 100%;} .content p, .content ol li , .content ul li{ color: #62634b; text-align: left; font-size: 18px; font-style: normal; font-weight: 400; line-height: 32px; letter-spacing: 0.9px; margin-bottom: 15px; } .article-content .content ol li a {word-break: break-word;} /*.content > *:last-child { margin-bottom: 80px;}*/ .content p span{display: inline;} .main-content .content > *:last-child { margin-bottom: 30px;} .front-page p.entry-leadin {color: #111633;text-align: justify;font-size: 17px;font-style: normal;font-weight: 400;line-height: 32px; letter-spacing: 1.44px; margin-bottom:100px} .font-serif {font-family:'Noto Serif TC', serif;} .hero { position:relative; } .hero h1.entry-title { position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; font-weight: bold; font-size: 38px; letter-spacing: 2.85px; color: #FFFFFF; font-family: 'Noto Serif TC', serif; margin-bottom: 0; text-shadow: 0px 0px 19px rgba(0, 0, 0, 0.55); width: 100%; } /* Intro text */ .intro-section { background: #af9782; padding: 50px 0; } .intro-section p { max-width: 810px; width: 100%; margin: auto; font-family: 'Noto Serif TC', serif; font-size: 22px; letter-spacing: 2.2px; color: #FFFFFF; } .intro-section p > sup{ font-family: 'Noto Serif TC', serif; } /* Homepage Entry: Section cards grid */ .section-block { padding: 0; } .content-card { height: 100%; overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease; } .content-card .card-img-top { height: 260px; object-fit: cover; width: 100%; } .card-body-custom { padding: 28px 5rem; height: 100%; display: flex; flex-direction: column; justify-content: center; gap: 30px; } .card-title-custom { font-family: 'Noto Serif TC', serif; font-weight: bold; font-size: clamp(2rem, 2vw, 2.5rem); letter-spacing: 1.95px; color: #FFE9D4; color: rgb(255, 233, 212); margin-bottom: 12px; } .card-text-custom { font-size: 1.25rem; letter-spacing: 2.1px; color: #FFE9D4; margin-bottom: 0 } /* Color variants for cards */ .card-brown{background:#AE6F53} .card-olive{background:#62634B} .card-pink{background:#DEBEAE} .card-pink *{color:#62634B} .card-pink .arrow-btn:before{filter:contrast(0)} /*Article css*/ .btn.back-btn, .btn.back-btn:hover{ all:unset; position: absolute; left: 0; top: 0; font-weight: 700; font-size: 15px; line-height: 30px ; letter-spacing: 0.2em; border: 2px solid #AE6F53; color: #AE6F53; border-radius: 50px; box-sizing: border-box; background: none; height: 42px; width: 70px; display: flex; align-items: center; justify-content: center; padding: 0; transition: all .3s } .article-content{/*margin-top:40px*/} .article-content h2 { color: #AE6F53; font-size: 30px; font-style: normal; font-weight: 700; line-height: 1.2; letter-spacing: 3px; margin: 0 0 28px; position: relative; } .article-title.entry-title { margin-top: 80px; margin-bottom: 40px; font-style: normal; font-weight: bold; font-size: 34px; line-height: 1.8; text-align: center; letter-spacing: 0.05em; color: #AE6F53; } h1.article-title.entry-title:after, h1.result-title.entry-title:after, .assessment-ctr h1.entry-title:after{display: none} .articles-section {position: relative;z-index: 1} /*.article-listing main:after { content: ''; opacity: 0.2; background: linear-gradient(180deg, rgba(238, 45, 36, 0.40) 0%, #EE2D24 100%); position: absolute; bottom: 0; left: 0; width: 100%; height: calc(100% - 140px); z-index: -1; max-width: 1440px; margin: 0 auto; right: 0; }*/ .articles-section .grid { margin-top: 50px; margin-bottom: 50px; width: 100%; } .articles-section .grid-item {width:100%;float: left;margin-bottom: 40px;} .articles-section .grid-item a:hover{text-decoration: none;} .articles-section p.remarks{color:#111633;font-size:12px;font-style:normal;font-weight:400;line-height:18px;letter-spacing:.6px; margin-bottom: 65px;} .latest-article-thumbnail img{width:100%; height:220px} .articles-section .latest-article-content {margin-bottom:0} p.articles-content, p.articles-intro {text-align:left; margin-bottom:0px} .in-articles-image {margin-top:45px; max-width:700px; width:100% } .featured-media {text-align: center} .featured-media img {margin: 0 auto 20px; width: 100%; height: unset !important; max-width:768px} .article-content img {display:block; max-width:768px;width: 100%; margin: 0 auto 20px;} .post_title{color:#111633;font-size:30px;font-style:normal;font-weight:700;line-height:1.2;letter-spacing:3px;margin:0 0 28px; position: relative;padding-left: 20px;} .post_title:before{content:'';position:absolute;background:#EE2D24;width:4px;height:90%;left:0;top:50%;transform:translateY(-50%)} .post-inner .content table ul { margin: 10px;} /* Recent Article */ /*.front-page .recent-section {background: linear-gradient(180deg, rgba(238, 45, 36, 0.50) 0%, #EE2D24 100%); padding:55px 0 60px} .front-page .recent-section h2.entry-title {position: relative; color: #FFF;font-size: 30px;font-style: normal;font-weight: 900;line-height: 28px; letter-spacing: 6px;text-align: left; display: block; padding-left:25px; margin:0 0 30px} .front-page .recent-section h2.entry-title:before {content: '';position: absolute;background: #fff;width: 4px;height: 100%;left: 0;top: 70%;transform: translateY(-70%);} */ /* Recent Article */ .recent-section { background: #f7efeb; padding: 55px 0 60px; } .recent-section h2 {margin: 0} .recent-section h2 span{ color: #62634B; font-size: 30px; font-style: normal; font-weight: 900; line-height: 28px; letter-spacing: 6px; text-align: center; display: block; margin: 0 0 30px; } .post .recent-section h2.entry-title {position: relative; color: #EE2D24;font-size: 30px;font-style: normal;font-weight: 900;line-height: 28px; letter-spacing: 6px;text-align: center; display: block; /*padding-left:25px;*/ margin:0 0 30px} .post .recent-section h2.entry-title:before {display: none} .page_bg.post .article-content .content table {letter-spacing: 0.9px;} .page_bg.post .article-content .content li::marker {color: #62634b !important;} .page_bg.post .article-content .content a {color: #62634b; text-decoration: underline !important;} .page_bg.post .article-content .content p {margin-bottom: 20px} /* .recent-section h2.entry-title:before { content: ''; position: absolute; background: #fff; width: 4px; height: 100%; left: 0; top: 70%; transform: translateY(-70%); } .recent-section .row-eq-height { justify-content: flex-start !important; }*/ .recent-section .btn { border: 2px solid #111633; background: #FFF; color: #EE2D24; text-align: center; font-size: 22px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 2.2px; max-width: 270px; width: 100%; padding: 10px; border-radius: 0; } .recent-section #recent-article {margin-bottom: 50px;} /*Mobile: dropdown-list*/ .custom_select select {width:100%; text-align-last:center; background-color: #EE2D24 !important; border: 1px solid #EE2D24; color:#fff; height: 45px; border-radius: 25px; margin: 30px 0; font-size:22px; font-weight:700; line-height:22px;-webkit-appearance: none;} .custom_select select::-ms-expand {display: none;} .custom_select:after { content: '\f107'; font-family: 'Font Awesome\ 5 Free'; font-weight: 900; font-size: 22px; color:#fff; top: 39px; right: 30px; position: absolute;} /* Subpage Title */ /* h1.entry-title span { color: #FFFFFF; border: none; font-weight: 700; font-size: 40px; line-height: 1.3; text-align: center; letter-spacing: 0.1em; } */ p.lead-in{font-family:'Noto Serif TC',serif;font-weight:600;font-size:22px;line-height:1.5;letter-spacing:2.2px;color:#62634b;margin-bottom:0} p.lead-in > *{font-family:'Noto Serif TC',serif} .faq p.lead-in, .selftest p.lead-in{padding:5rem 0 } /* Whats is CSU css */ .about h2 { font-size : 34px; font-weight: 700; letter-spacing : 1.88px; color : #AE6F53; } .about h2 ~ p{ font-size : 25px; font-weight: 500; letter-spacing : 1.88px; color : #62634B } .about h2 ~ p b { color : #ae6f53 } .about .condition { display:flex; align-items: center; gap: 12px; } .about .condition p, .about .condition li { font-size : 18px; color : #62634B; } .about .condition p b { color:#ae6f53; } .about .condition ul { padding-left:20px } .about h3 { font-weight : bold; font-size : 32px; letter-spacing : 2.4px; color : #AF9782; margin-bottom: 30px; } .about .how-common .item { margin-bottom: 30px; } .about .how-common .item img { max-height: 160px; } .about .how-common .item p { font-size : 20px; letter-spacing : 1.65px; color : #62634B; } .about #symptomAccordion .card { border-radius: 0; } .about #symptomAccordion .btn-link{ border-radius: 0; flex-direction: column; } .about #symptomAccordion .btn-link .fa-chevron-down { position: relative; top:unset; left: 0; right: 0; transform: unset; transition: transform .3s ease; font-size: 1.25rem; margin-top: 20px; } .about #symptomAccordion .card-body p { font-size : 25px; letter-spacing : 1.88px; color : #62634B; margin-bottom: 15px; } .about #symptomAccordion .btn-link.bg-pink { background: url('/multisites/csu/wp-content/themes/CSU/assets/images/intro/symptomAccordion-bg-pink.svg') no-repeat right / auto 100%; padding: 40px 20px; background-color: #DBAC97; color : #894111; } .about .card.pink .card-body { background : #F7EFEB; } .about #symptomAccordion .btn-link.bg-brown { background: url('/multisites/csu/wp-content/themes/CSU/assets/images/intro/symptomAccordion-bg-brown.svg') no-repeat right / auto 100%; padding: 40px 20px; background-color: #AE6F53; color : #fff; } .about .card.brown .card-body { background : #F3E9E5; } .about #symptomAccordion .btn-link.bg-grey { background: url('/multisites/csu/wp-content/themes/CSU/assets/images/intro/symptomAccordion-bg-grey.svg') no-repeat left / auto 100%; padding: 40px 20px; background-color: #E6E6E6; color : #af9782; } .about .card.grey .card-body { background : #F6F6F6; } .about .card.grey .symptom-title { font-weight : bold; font-size : 22px; letter-spacing : 1.65px; color : #AE6F53; } .about .card.grey .symptom-item { margin-bottom: 30px; } .about .card.grey .symptom-title { font-weight : bold; font-size : 22px; letter-spacing : 1.65px; color : #AE6F53; } .about #symptomAccordion .symptom-card img{ margin:0 } .about #symptomAccordion .symptom-card .symptom-header { gap:30px } .about #symptomAccordion .symptom-card .symptom-title { font-weight : bold; font-size : 22px; letter-spacing : 1.65px; color : #AE6F53; } .about #symptomAccordion .symptom-card ul { padding-left: 0; padding-inline-start: 40px; } .about #symptomAccordion .symptom-card li { text-align: left; font-size : 18px; letter-spacing : 1.65px; color : #62634B; } .about .entry-button img{ object-fit: contain; } li::marker { color: #ae6f53; } .refs-section ::marker { color : #62634B; } .cure h2{font-size:34px;font-weight:700;letter-spacing:1.88px;color:#AE6F53} .cure h2 ~ p{font-size:25px;font-weight:500;letter-spacing:1.88px;color:#62634B} .cure h2 ~ p b{color:#ae6f53} .cure h3{font-weight:700;font-size:32px;letter-spacing:2.4px;color:#AF9782;margin-bottom:30px} .cure .diagnosis-item h3,.cure section.care h3{font-weight:700;font-size:22px;letter-spacing:2.1px;color:#AF9782;margin-bottom:10px} .cure .diagnosis-item li,.cure section.care li{font-size:18px;letter-spacing:1.88px;color:#62634b} section.care{background:#f7efeb;padding:2rem} section.care h2{color:#af9782} .cure .cure-qna{padding-top:42px;padding-bottom:32px;color:#fff;background:#777b65} .cure .cure-qna h2,.cure .cure-qna h2~p{color:#fff} .cure .doctor-section h3~p,.cure .care p{font-size:22px;letter-spacing:1.88px;color:#62634B} .cure .care p.hero-note{font-weight:500} .cure .cure-qna .accordion .btn-link{position:relative;width:100%;font-weight:700;font-size:26px;letter-spacing:2.4px;padding:1rem 1.25rem;text-decoration:none!important;display:flex;align-items:center;justify-content:start;border-radius:28px;background:#D8D8D2;color:#ae6f53} .cure .cure-qna .accordion .btn-link .fa-chevron-down{font-size:1.25rem} .cure .cure-qna .accordion .btn-link[aria-expanded="true"]{border-radius:28px 28px 0 0} .cure .cure-qna .accordion .card-body{background:#D8D8D2;border-radius:0 0 28px 28px;padding:0 2rem 2rem} .cure .cure-qna .accordion .card-body ul{padding-left:10px} .cure .cure-qna .accordion .card-body li{text-align:left;font-size:18px;letter-spacing:1.65px;font-weight:500;color:#62634B} .cure .cure-qna .accordion .card-body li b{color:#ae6f53} .cure .cure-qna p.hero-note{font-size:22px;font-weight:500;letter-spacing:1.65px;color:#fff} .cure .reminder{position:relative} .cure .reminder:after{content:"";background-image:url(/multisites/csu/wp-content/themes/CSU/assets/images/diagnosis/reminder-illustration.svg);position:absolute;width:1024px;height:446px;top:0;right:0} .cure .reminder p{font-weight:700;font-size:28px;letter-spacing:2.7px;color:#DEBEAE;padding-top:20px} .cure .reminder .quiz-btn{margin-top:400px} .cure .reminder .quiz-btn img{margin-left:-200px} .cure .care img{margin-bottom:30px} .cure .care-item{margin-bottom:50px} /*FAQ css*/ .accordion{width:100%} .accordion .card{border:none;margin-bottom:40px;overflow:hidden;background:none} .accordion .card-header{padding:0;border:none!important;background:none;border-radius:0!important} .accordion .btn-link{position:relative;width:100%;text-align:center;font-weight:700;font-size:26px;letter-spacing:2.4px;padding:1rem 1.25rem;text-decoration:none!important;display:flex;align-items:center;justify-content:center;border-radius:38px} .accordion .btn-link .fa-chevron-down{position:absolute;top:50%;right:30px;transform:translateY(-50%);transition:transform .3s ease;font-size:1rem} .accordion .btn-link[aria-expanded="true"] .fa-chevron-down{transform:translateY(-50%) rotate(180deg)} .accordion .card-body{background:transparent;padding:2rem} .answer-item{display:flex;align-items:flex-start;margin-bottom:1rem} .answer-item:last-child{margin-bottom:0} .answer-icon{flex-shrink:0;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-right:.85rem;font-size:1rem;color:#fff} .answer-content{flex:1} .answer-content ul{margin-bottom:0;padding-left:1.1rem;font-size:22px px;color:#62634B} .answer-content li{font-size:22px;color:#62634B; margin-bottom: 10px} .answer-content p{margin-bottom:1rem;font-size:22px;font-weight:500;color:#62634B; letter-spacing: 0.1em;} .answer-content b{color:#AE6F53} .accordion .bg-brown{background:#AE6F53;color:#fff!important} .accordion .bg-olive{background:#62634B;color:#DEBEAE!important} .accordion .bg-sand{background:#AF9782;color:#fff!important} /* .custom_select{background:#EE2D24; box-shadow:0 4px 4px rgba(0,0,0,0.05); cursor:pointer; margin:0 auto; width:100%; padding:10px 0; position:relative; text-align:center; border-radius:25px; transition:all .3s} .custom_select::after{font-family:'Font Awesome\ 5 Free'; content:'\f107'; font-weight:700; font-size:20px; color:#fff; position:absolute; right:20px; top:10px; pointer-events:none} .custom_select .drop{background:#fff;visibility:hidden;height:0;transition:all .3s;left:0;margin-left:0;list-style:none;margin-top:0;opacity:0;padding-left:0;pointer-events:none;position:absolute;right:0;top:100%;z-index:2;border-bottom-left-radius:25px;border-bottom-right-radius:25px;border:1px solid #f4f4f4} .custom_select.active{border-bottom-right-radius:0; border-bottom-left-radius:0} .custom_select .drop li{ margin:0;} .custom_select .drop li a{color:#666; display:block; padding:1rem; text-decoration:none; font-size:18px} .custom_select .drop li:last-child a{ border-bottom-left-radius: 25px; border-bottom-right-radius: 25px;} .custom_select span{color:#fff; font-family:"Century Gothic",CenturyGothic,AppleGothic,sans-serif; font-weight:700; letter-spacing:.01em; font-size:18px} .custom_select .drop li:hover a{background-color:#EE2D24;color:#fff} .custom_select.active .drop{visibility:visible;height:auto;opacity:1;pointer-events:auto}*/ /*Self-test css*/ .assessment { position:relative; background:#f7efebff; margin:0px auto 80px; padding-bottom: 50px; } .assessment:last-of-type { margin-bottom: 20px; } .question_container { padding:80px 0px 0 } .assessment .question_num { background : #AF9782; font-family:'Noto Serif TC', serif; font-size:32px; color:#FFF; width:64px; height:64px; border-radius:50%; display:flex; align-items:center; justify-content:center; position:absolute; top:-32px; left:50%; transform:translateX(-50%); } .assessment .question_text { text-align:center; font-weight:700; font-size:25px; letter-spacing:1.88px; color:#af9782 } .assessment .question_text span { color:#ae6f53 } .assessment .radio_option { display:inline-flex; align-items:center; margin:0 18px 12px 0; vertical-align:top } .assessment .assessment_answers { margin-top:40px } .assessment .answer_container { display: flex; justify-content: space-between; } .assessment .radio_option input[type="radio"] { appearance:none; width:26px; height:26px; margin:0 10px 0 0; border:1px solid #e1e1e1; border-radius:50%; background:#fff; box-shadow:inset 0 0 6px 1px #e1e1e1; cursor:pointer } .assessment .radio_option input[type="radio"]:checked { border-color:#AF9782; box-shadow:inset 0 0 0 5px #fff; background:#AF9782 } .radio_option input[type="radio"]:focus-visible { outline:1px solid #AF9782; outline-offset:2px } .assessment .radio_option label { margin:0; color:#AF9782; font-size:22px; font-weight:700; cursor:pointer } @media (max-width: 575px) { .radio_option { margin-right: 12px; } .radio_option label { font-size: 16px; } } .submit_container { text-align: center; } .selftest .remarks { font-size : 14px; color : #62634B; font-weight: 500; } .selftest button[type="submit"] { font-weight : bold; font-size : 24px; color : #FFFFFF; background:linear-gradient(0deg, #62634b 0%, #afa697 100%); max-width: 215px; width: 100%; margin: 40px auto; outline:0; border-radius:50px; border:0; padding:8px 20px; } .selftest .suggestion { position: relative; } .uct-result { max-width: 980px; margin: 0 auto; padding: 28px 16px 56px; text-align: center; display: flex; flex-direction:column; align-items: center; margin: 0 auto; padding: 34px 48px; border-radius: 50px; color: #fff; gap: 30px; } .uct-result--controlled { background : #62634B; } .uct-result--stable { background : #AF9782; } .uct-result--uncontrolled { background : #AE6F53;} .uct-result__score { text-align: center; flex-direction: row; display: flex; align-items: center; gap:25px } .selftest .selftest .uct-result__score strong { display: block; margin-bottom: 8px; font-size: 50px; line-height: 1; } .selftest .uct-result__score div { font-size: 32px; font-weight:700; line-height: 1.5; color: #FFFFFF; } .selftest .uct-result__description h3 { text-align: center; position: relative; display: inline-block; font-size: 24px; font-weight:500; margin-bottom: 12px; color: #fff; } .selftest .uct-result--controlled .uct-result__description h3 { background: linear-gradient(transparent 75%, #919281 0%); } .selftest .uct-result--stable .uct-result__description h3 { background: linear-gradient(transparent 75%, #C7B6A7 0%); } .selftest .uct-result--uncontrolled .uct-result__description h3 { background: linear-gradient(transparent 75%, #C69A87 0%); } .selftest .uct-result__description p { font-size: 24px; font-weight:500; line-height : 1.5; color : #FFFFFF; } .selftest .assessment-result-actions { display: flex; justify-content: center; gap: 60px; margin-top: 40px; margin-bottom: 60px } /* Result */ .assessment-result-page { padding-top: 50px; } .assessment-result-page h1 { font-size : 38px; letter-spacing : 2.85px; color : #AE6F53; margin: 50px 0; } .assessment-result-page .remarks { font-weight: 500; } .selftest .suggestion p, .assessment-result-page .suggestion p{ font-size : 30px; font-weight:500; color : #62634B; } .assessment-btn:disabled, .assessment-btn:disabled:hover{ cursor: unset; color: #ccc; background-color: #fff !important; border-color: #ccc; opacity: 1;} .assessment-ctr h1.entry-title.result-title {margin-top: 100px;} /*Consultation tips*/ .consultation-tips { background: #F7EFEB; padding:50px 0 } .consultation-tips h3 { font-weight: bold; font-size: 30px; color : #62634B; margin-bottom: 30px; text-align:center } .consultation-tips p { font-weight: 500; font-size: 24px; color : #62634B; margin-bottom: 30px; text-align:center } .tips-items { display: flex; justify-content: space-between; gap: 60px; flex-wrap: wrap; } .tip-item { width: calc((100% / 3) - 60px); aspect-ratio: 1; position: relative; cursor: pointer; } .tip-circle { width: 100%; height: 100%; border-radius: 50%; background-color: #DEBEAE; display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; transition: all 0.35s ease; } /* Lightbulb state (default) */ .tip-circle.icon-state { opacity: 1; transform: scale(1); z-index: 2; } /* Text state (hidden by default) */ .tip-circle.text-state { opacity: 0; transform: scale(0.85); z-index: 1; background-color: #e8ddd0; padding: 24px 18px; box-sizing: border-box; } .tip-circle.text-state p { margin: 0; font-size : 22px; color : #AE6F53; line-height: 1.5; text-align: center; } /* Hover: hide lightbulb, show text */ .tip-item:hover .tip-circle.icon-state { opacity: 0; transform: scale(0.85); z-index: 1; } .tip-item:hover .tip-circle.text-state { opacity: 1; transform: scale(1); z-index: 2; } img.lightbulb { max-width: 180px; margin: auto; } .selftest .reminder p, .assessment-result-page .reminder p { font-size : 24px; color : #62634B; font-weight:500; margin-bottom: 50px; } .selftest .reminder p b, .assessment-result-page .reminder p b { color:#ae6f53 } .selftest .reminder a, .assessment-result-page .reminder a { display:flex; align-items: center; justify-content: center; font-weight: bold; font-size: 24px; color: #FFFFFF; background: linear-gradient(0deg, #62634b 0%, #afa697 100%); max-width: 550px; margin: auto; width: 100%; outline: 0; border-radius: 50px; border: 0; padding: 10px 20px; cursor: pointer; gap: 10px; display: block; } /* CSU Form */ .evaluation h2 { font-weight: bold; font-size: 34px; color: rgb(174, 111, 83); text-align: center; margin-bottom: 16px; } .evaluation h2.green { color: #62634b; margin-bottom: 30px; } .evaluation .button-container img { margin-left: -120px; max-width: 830px; width:100%; } .evaluation .score-section { background: #f7efeb; padding: 38px 0 42px; } .evaluation .img-csu-form { max-width: 900px; margin:0 auto; } .evaluation .score-table { width: 100%; margin-bottom: 0; } .evaluation .score-table-header, .evaluation .score-table-row { display: flex; align-items: center; width: 100%; } .evaluation .score-table-header { min-height: 45px; font-size: 20px; color: #af9782; margin-bottom: 8px; } .evaluation .score-table-row { min-height: 88px; margin-bottom: 16px; padding: 13px 25px; background: #ffffff; border-radius: 50px; text-align: center; } .evaluation .score-col { flex: 0 0 30%; max-width: 30%; padding: 0 8px; text-align: center; font-weight: 500; font-size: 21px; } .evaluation .score-col-wide { flex: 0 0 40%; max-width: 40%; } .evaluation .score-table-row.score-zero { color: #62634b; } .evaluation .score-table-row.score-one { color: #af9782; } .evaluation .score-table-row.score-two { color: #c2937e; } .evaluation .score-table-row.score-three { color: #ae6f53; } .evaluation .meaning-section { padding: 54px 0 55px; background: #ffffff; } .evaluation .meaning-card { display: flex; align-items: center; height: 200px; margin: 0 auto 34px; padding: 15px 42px; border-radius: 110px; } .evaluation .meaning-score { flex: 0 0 30%; max-width: 30%; padding-right: 35px; border-right: 2px dotted #ffffff; color: #ffffff; font-size: 60px; font-weight: 700; text-align: center; height: 100%; align-items: center; display: flex; justify-content: center; } .evaluation .meaning-content { flex: 0 0 70%; max-width: 70%; padding-left: 35px; color: #ffffff; text-align: center; } .evaluation .meaning-content h3 { font-size: 23px; font-weight: 500; line-height: 1.35; display: inline-block; } .evaluation .meaning-content p { margin: 0; font-size: 23px; font-weight: 400; line-height: 1.55; } /* .meaning-zero */ .evaluation .meaning-zero { background: rgba(225, 215, 207, 1); } .evaluation .meaning-zero .meaning-score, .evaluation .meaning-zero .meaning-content { color: #62634b; } .evaluation .meaning-zero .meaning-score { color: #62634f; border-color: #62634f; } .evaluation .meaning-zero .meaning-content h3 { background: linear-gradient(transparent 75%, #af9782 0%); } /* .meaning-one */ .evaluation .meaning-one { background: #af9782; } .evaluation .meaning-one .meaning-content h3 { background: linear-gradient(transparent 75%, #c69a87 0%); } /* .meaning-two */ .evaluation .meaning-two { background: #a38e7e; } .evaluation .meaning-two .meaning-content h3 { background: linear-gradient(transparent 75%, #c69a87 0%); } /* .meaning-three */ .evaluation .meaning-three { background: #caa18f; } .evaluation .meaning-three .meaning-content h3 { background: linear-gradient(transparent 75%, #be8c75 0%); } /* .meaning-four */ .evaluation .meaning-four { background: #ae6f53; } .evaluation .meaning-four .meaning-content h3 { background: linear-gradient(transparent 75%, #d6b7a9 0%); } /*Back-to-Top btn*/ #back-to-top{display: none;} #back-to-top a{display:block;width:50px;height:50px;/*background-image:url(/crs-nasal-polyps-severe-asthma/wp-content/uploads/2020/img/scroll-top-btn.png);*/background-repeat:no-repeat;background-position:center;background-size:50px 50px;position:fixed;bottom:30px;right:30px} .approval_code {font-size: 12px !important;line-height: 24px;letter-spacing: 0.05em;color:#666666 !important;padding-top: 0px;padding-bottom: 0px;margin-bottom: 0 !important;} /* Doctor listing Page */ #doctor_listing_div .category{margin-bottom:50px} .heartfailure-tags{font-style:normal;font-weight:700;font-size:18px;line-height:200%;letter-spacing:.05em;color:#CCC;padding:6px 30px;border-radius:10px;border:2px solid #CCC;background:#FFF;display:inline-block;margin:0 20px;transition:all .3s} .heartfailure-tags a{color:#CCC} .heartfailure-tags.tag-active,.heartfailure-tags:hover{cursor:pointer;color:#fff;background:#FF9377;border-color:#FF9377;text-decoration:none} .heartfailure-tags.tag-active a,.heartfailure-tags:hover a{color:#fff} .dr-search { position: absolute; bottom: 20px; right: 20px; transition: .3s ease; } .dr-search:after { content: "\f061"; font-family: 'Font Awesome\ 5 Free'; font-weight: 900; font-size: 20px; color: #bbb; } .image-container.col-5.col-sm-4 {padding-left:0; padding-right:0px} /* Doctor listing Page - Mobile selector */ #mobile-district-select > span > a { all:unset; } .custom_select .drop li a.heartfailure-tags { all:unset; color: #666; display: block; padding: 1rem; text-decoration: none; font-size: 18px; } .custom_select .drop li:hover a.heartfailure-tags { background-color: #FF9377; color: #fff; } .custom_select .drop li:last-child a.heartfailure-tags { border-bottom-left-radius: 25px; border-bottom-right-radius: 25px; } .card.doctor_details { position: relative; padding: 20px 25px; cursor: pointer; border-radius: 15px; margin-top: 30px; height: 150px; border: 0; } .doctor_details .doctor-image, .doctor_details .image-container img.card-img-top { border-radius: 50%; max-width: 90px; margin: 0 auto; } .doctor_details .card-body { padding:0; padding-left:20px; padding-top:8px; } .doctor_details .card-chinese-title { color: #4e4e4e; font-weight: 700; font-size: 22px; margin-bottom:7px; letter-spacing: 0.05em; } .doctor_details .card-english-title { color: #666; font-weight: 700; font-size: 14px; margin-bottom:7px } .doctor_details .card-text { font-weight: 300; font-size: 14px; letter-spacing: 0.05em; color: #666666; } /* doctor listing - hover effect */ .doctor_details:hover { transition: all .3s ease; box-shadow: 0px 10px 20px 0px #C0DDDD; } .doctor_details:hover .dr-search:after { color: #FF9377; } /* Doctor single Page*/ .blog-section { /* background: url(/crs-nasal-polyps-severe-asthma/wp-content/themes/twentytwenty-child/assets/images/common/section-bg.svg) no-repeat; */ background-size: 1440px auto; background-position: top 190px center; background-color: #DFF4F4; background-blend-mode: overlay; } .blog-section .bread_padding{ padding-top: 20px} #doctor_listing_div h1.entry-title{ margin:40px auto; } #doctor_listing_div .back-btn{ top:40px } .doctor_info_wrapper{ padding: 50px; border: 1px solid #E4E4E4; border-radius: 20px; max-width: 1100px; width: 100%; margin: 0px auto 100px; box-shadow: 0px 4px 4px rgb(0 0 0 / 5%); background: #fff; margin-top: 25px } .doctorInfo {padding-bottom:30px} .doctorInfo .image-container { width: 20%; display: table-cell; vertical-align: middle; } .doctorInfo .image-container img{ border-radius:50%; max-width: 120px; } .doctorInfo .doctor-name { display: table-cell; width: 75%; vertical-align: middle; padding-left: 30px; } .doctor-name .title_zh { color: #391D1E; font-size: 24px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: 1.2px; margin: 0 auto 3px; } .doctor-name .title_en { color: #666; font-size: 16px; font-style: normal; font-weight: 350; line-height: normal; letter-spacing: 0.8px; margin: 0; } .clinics-wrapper { padding: 40px 0; border-top: 1px solid #E4E4E4; } .clinics-wrapper .title_bar{ color: #82383B; font-size: 19px; font-style: normal; font-weight: 500; line-height: 0.5; letter-spacing: 0.95px; display: inline-block; } .clinics-wrapper .title_bar:after{ content:''; background-color:#82383B; height: 2px; width: 100%; display: inline-block; } .doctor-clinics-container h5 { color: #387baf; font-size: 22px; font-weight: bold; } .doctor-clinics-container { margin-top: 25px; } .clinicDistrict { border-radius: 10px; background: #FFFAEE; color: #000; font-size: 14px; font-style: normal; font-weight: 400; line-height: normal; letter-spacing: 0.7px; padding: 4px 16px; margin-bottom: 15px; display: inline-block; margin-right: 10px; } .clinicName { font-size: 18px; font-weight: bold; color: #666; margin: 0 auto 12px; letter-spacing: 0.05em; } .clinicAddress, .clinicTel { color: #000; font-size: 17px; font-style: normal; font-weight: 350; line-height: 30px; letter-spacing: 0.85px; text-indent: -30px; margin-left: 30px; margin-bottom: 6px; } .clinicName { font-size: 18px; font-weight: bold; color: #666; margin: 0 auto 12px; letter-spacing: 0.05em; } .clinicAddress:before { content:""; /* background:url(/crs-nasal-polyps-severe-asthma/wp-content/themes/twentytwenty-child/assets/images/doctor-listing/map-pin.svg) no-repeat; */ background-size:20px 20px; width:20px; height:20px; display: inline-block; margin: -4px 10px 0 0; vertical-align: middle; } .clinicTel:before { content:""; /* background:url(/crs-nasal-polyps-severe-asthma/wp-content/themes/twentytwenty-child/assets/images/doctor-listing/phone.svg) no-repeat; */ background-size:20px 20px; width:20px; height:20px; display: inline-block; margin: -4px 10px 0 0; vertical-align: middle; } .pagination .page-numbers {font-size:24px} /* Hover effect on Desktop only */ @media (-moz-touch-enabled: 0), (pointer: fine) { .question_option label:hover{background-color:#EE2D24;color: #FFF;text-align: center;font-size: 18px;font-style: normal;font-weight: 500;line-height: normal;letter-spacing: 3.6px;transition:all .1s;} .question_option input[type="radio"]:hover + label:after{border:none;content:""; background-color:transparent;line-height: 60px;} .pdf-btn:hover { opacity: 0.85 } } @media (max-width: 1440px){ .page_bg {padding-top: 190px} } @media (max-width: 1250px){ .primary-menu a {font-size:16px} .footer-inner.section-inner { text-align: left;} .article-content {margin-top:0} .primary-menu > li, .primary-menu li {margin-left: 15px;list-style: none;} .header-inner {padding-left: 0; padding-right:0} } @media (max-width: 1199px){ .primary-menu > li, ul.primary-menu > li {margin-left: 12px; } } @media (max-width: 1094px){ .primary-menu > li, ul.primary-menu > li {margin-left: 6px;} .primary-menu a {font-size:13px} } @media (max-width: 1024px){ .footer-top-visible .footer-nav-widgets-wrapper, .footer-top-hidden #site-footer {margin-top: 1rem;} /* .main-content{background-size: 1920px;}*/ .content p span {display: inline-block;} .feature_box{ width: 100%;height: 100%;padding: 30px; zoom: 80%;} .article_headline{min-height: auto;/*-webkit-line-clamp: 1;*/-webkit-line-clamp: 2;} .article_desc p{min-height: auto;-webkit-line-clamp: 2;} /*.footer-inner.section-inner, .footer-top.has-footer-menu{width: 100%;}*/ .footer-menu li{ display: inline-block;} .header-titles-wrapper { position: relative; } .modal-menu > li > a, .modal-menu > li > .ancestor-wrapper > a {text-decoration: none; text-align: center;} .modal-menu a:focus, .modal-menu a:hover, .modal-menu li.current-menu-item > .ancestor-wrapper > a, .modal-menu li.current_page_ancestor > .ancestor-wrapper > a {text-decoration: none;} /*.mobile_cta{ padding: 10px 25px; height: 44px; background: #FF9377; border-radius: 10px; align-self: center; display: block; transition: all .3s; font-weight: 700; font-size: 18px; line-height: 27px; display: flex; align-items: center; letter-spacing: 0.05em; color: #FFFFFF !important; display: block;transition: all .3s;margin-top: 20px;}*/ .page_bg {padding-top: 180px} .evaluation .meaning-score { padding-right: 15px; font-size: 49px; } .evaluation .meaning-content { padding-left: 15px; } } @media (max-width: 992px){ .header-titles-wrapper{position: relative;} .primary-menu a:not(:last-child):after, .current_page_parent a:after {background:transparent} .footer-inner.section-inner { text-align: left;} .back-btn { left: -68px; padding-right: 20px; padding-left: 35px;} .info-container .card-deck{display:flex;flex-wrap:wrap;justify-content:space-between} .info-container .card-deck .card{flex:0 44%;margin-right:15px;margin-left:15px} .btn.back-btn, .btn.back-btn:hover {background-color:#fff; border-color: #111635; color: #111635;} /* .article-title.entry-title {font-size: 26px}*/ } @media (max-width: 991px){ .recent-section .latest-article-column { margin: 0 auto 25px;} /*.latest-article-column {width:80%}*/ #site-header .header-inner {padding: 0 !important; height: 0;} .navbar-collapse { position: fixed; top: 0; bottom: 0; right: 0; width: 100%; padding-top: 25px; padding-right: 1rem; padding-left: 1rem; overflow-y: auto; visibility: hidden; background-color: #ffe9d4; /* border-left: 1px solid #FFF7DE; */ opacity: 0; } .navbar-collapse.show { visibility: visible; opacity: 1; /* transform: translateX(100%);*/ } .primary-menu-wrapper { margin-top: calc(50% - 100px);} ul.primary-menu { background:#ffe9d4; position: relative; left: calc(50% - 50vw); width: 100vw; flex-direction: column; padding: 0 20px; align-items: center; } /*.primary-menu { max-width: 120rem; width: calc(100% - 4rem); }*/ ul.primary-menu li{ border-bottom: 1px solid #ae6f53; text-align: left; padding: 5px 0px; width: 100%; margin: 0; position: relative; } ul.primary-menu li:after { content:""; background:url('data:image/svg+xml,') no-repeat center/cover; width: 24px; height:24px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } ul.primary-menu li a{ font-size:18px !important; color: #A85231; justify-content: flex-start; } button.close i { color: #A85231; } .primary-menu li.current-menu-item > a, .primary-menu li.current-menu-item > .link-icon-wrapper > a, .current_page_parent > a{ border-bottom: none; } .primary-menu > li:last-child, ul.primary-menu > li:last-child {border:0} .nav_logo {text-align: center;padding: 20px 15px} .nav_logo:after { content:""; width: 172px; height: 65px; background-image: url('/multisites/csu/wp-content/themes/CSU/assets/images/common/nav-bar-deco-mob.svg'); background-repeat: no-repeat; background-position: top right; background-size: 172px 65px; display: block; position: absolute; right: unset; left: 0; top: 0; } .page_bg { padding-top: 84px; } .hero h1.entry-title { font-size: 24px; } .cure .diagnosis-item { text-align: center; } .cure .diagnosis-item img { width: 80% !important; margin: auto auto 30px; } .cure .reminder:after { display: none; } .about #symptomAccordion .card { margin:0 -15px 20px; width: calc(100% + 30px); } .about #symptomAccordion .btn-link.bg-brown { background-size: 50%; background-position: right -50% top; } .about #symptomAccordion .btn-link.bg-grey { background-size: 50%; background-position: left bottom; } .cure .reminder .quiz-btn { margin-top: 0 } .cure .reminder .quiz-btn img { margin: 50px auto 0 -200px; } .tip-item { width: calc((100% / 3) - 40px); } img.lightbulb { max-width: 100px; } } @media (max-width: 768px){ .articles-section .grid-item {left:0!important; width:100%} .articles-section .latest-article-thumbnail img{height:300px} #top_mask{height: 120px;} /* .header-inner{ padding: 17px 30px;}*/ .latest-article-thumbnail{height: 200px;} .custom_select{width:80%} .custom_select select{width:80%} /*.custom_select:after{right: 100px;}*/ .back-btn { left: -68px; padding-right: 20px; padding-left: 35px;} .page_bg, .subpage-header {background-size: 1024px auto; height: auto} .bread_padding {padding-top:0} /* .home-title, h1.entry-title, h2.entry-title {margin-top: 0px;}*/ .assessment_container.assessment-home { margin-top:0 } .assessment_container .content p br {display: none;} /*Result*/ .assessment-ctr h1.entry-title.result-title {margin-top: 80px;} .assessment-result-container {margin-top: 180px;} .entry-wrapper {padding: 35px 20px 50px} .article-title.entry-title {font-size: 32px} .article-content h2 {font-size: 24px;/*margin: 3.5rem auto 2rem;*/} .btn.back-btn, .btn.back-btn:hover {background-color:#fff; border-color: #111635; color: #111635;top: -10px; left: -28px; } .about #symptomAccordion .symptom-card { margin-bottom: 30px; } /* #assessment-form .btn-row .assessment-btn{width: 40%; padding: 10px 0;}*/ } @media (max-width:767px){ .front-page h2 { margin-bottom: 30px; } .front-page h2, .front-page h2 span { font-size: 24px; } .intro-section { padding: 25px 0; } .intro-section p { font-size: 16px; } .card-title-custom br { display: none; } .card-body-custom { padding: 28px 26px; } p.lead-in { font-size: 18px; } .faq p.lead-in, .selftest p.lead-in { padding: 3rem 0; } .about h2 { font-size: 25px; } .about h2 ~ p { font-size: 20px; } .accordion .btn-link { font-size: 1.2rem; padding: 0.9rem 1rem; text-wrap: balance; } .accordion .card { margin-bottom: 20px; } .answer-content { font-size: 0.875rem; } .faq .accordion img { width: 75% !important; } .answer-content p, .answer-content li { font-size: 18px; } .assessment .answer_container { flex-direction: column; max-width: 200px; width: 100%; margin: 0 auto; } .uct-result { margin: 0 15px; padding: 28px 10px 56px; } .assessment-result-actions { flex-direction: column; gap: 30px; align-items: center; } .assessment-result-page .suggestion p { font-size: 20px; } .consultation-tips h3, .consultation-tips p { font-size: 20px; } .tips-items { gap: 40x; } img.lightbulb { opacity: 0.15; } .tip-circle { background-color: rgba(222, 190, 174, 0.45); } .tip-item { width: 80%; margin: auto; } .tip-circle.text-state { opacity: 1; transform: scale(1); z-index: 3; background-color: transparent; } .tip-item:hover .tip-circle.icon-state { opacity: 1; transform: scale(1); } .assessment-result-page .reminder p { font-size: 20px; } .assessment-result-page .reminder a { font-size: 22px; } .evaluation h2 { font-size: 25px; } .evaluation .score-heading { font-size: 20px; } .evaluation .button-container img { margin-left: -60px; } .evaluation .score-table-header { font-size: 17px; } .score-table-row { min-height: 78px; padding: 10px 8px; font-size: 16px; } .evaluation .score-col { padding: 0 4px; font-size: 16px; } .evaluation .score-col { flex: 0 0 20%; max-width: 20%; } .evaluation .score-col:last-of-type { flex: 0 0 40%; max-width: 40%; } .evaluation .score-col-wide { flex: 0 0 40%; max-width: 40%; } .evaluation .meaning-score { flex: 0 0 40%; max-width: 40%; padding-right: 0; font-size: 34px; } .evaluation .meaning-card { height: 145px; margin-bottom: 22px; padding: 18px 20px; border-radius: 80px; } .evaluation .meaning-content { flex: 1; max-width: 65%; } .evaluation .meaning-content h3 { margin-bottom: 8px; font-size: 16px; } .evaluation .meaning-content p { font-size: 16px; } } @media (max-width:550px){ /* .header-inner { height: 70px;padding: 20px 0px;} */ .nav_logo a img {width:120px; } .nav_logo:after{ transform: scale(0.8); transform-origin: top left; } .card-deck .card{flex:initial;margin-right:0;margin-left:0} .page_bg { padding-top: 72px; } .main-content {padding-top:70px; padding-bottom: 50px} .entry-btn img {max-width: 70px} .front-page p.entry-leadin { margin-bottom: 50px} p.entry_title {font-size: 16px} /* .mobile-selfass-btn { right: 50px; } .mobile-selfass-btn a p { color: #fff !important; font-size: 16px; line-height: 1.2; margin-bottom: 0;} */ .content .post_title {font-size: 24px} .card-body-custom { padding:28px 15px; flex-direction: row; } .assessment-content #assessment-form .row {margin-bottom: 30px} .assessment-ctr h1.entry-title.result-title {margin-top: 80px;} .subpage-header h1 {margin-top: 40px;} footer {font-size: 11px;} .card-title-custom {font-size: 24px} .accordion .card-body { padding: 1rem; } .about #symptomAccordion .symptom-card img { max-height: 120px; } .evaluation .meaning-score { flex: 0 0 30%; max-width: 30%; font-size: 22px; } .evaluation .score-col { padding: 0 8px; } } @media (max-width: 430px){ .article-title.entry-title { font-size: 24px; } } @media (max-width: 414px){ .toggle-icon i { font-size: 25px;} .breadcrumb {padding-top:0; padding-bottom:0;} /*.bread_padding { padding-top: 125px;}*/ .mobile-selfass-btn a.test-cta { font-size:14px; padding: 7px 15px; } .footer-inner.section-inner { text-align: center;} .entry-wrapper p.entry-leadin { font-size:18px} .content p span{display: none;} .latest-article-column {width: 100%;} /* .article-title.entry-title span {font-size:24px;}*/ /* .article-content { margin-top: 40px;}*/ .footer-menu li{margin: 0 10px;} .footer-menu li::after{margin-left: 20px;} .footer-top-visible .footer-nav-widgets-wrapper, .footer-top-hidden #site-footer{margin-top: -50px;} .in-articles-image {width:100%} p.articles-content {font-size:16px} .custom_select{width:100%} .custom_select select{width:100%} .custom_select:after{right: 30px;} .btn.back-btn {margin-top:0; top: -10px; left: -28px; padding-right: 20px; padding-left: 35px;} .btn.back-btn i{font-size:24px} #back-to-top a {right:15px;bottom: 15px;} .share {margin: 0 auto;} .share span.facebook, .share span.whatsapp {display:inline-block} .share::after {top:40%} /* .a_question { font-size: 16px;}*/ .question_option label {font-size:16px !important} .question_no {font-size:28px; padding-left: 20px;} /*.tab.active {width:100%} .light.active .fa-caret-down, .middle.active .fa-caret-down, .high.active .fa-caret-down {display:none !important}*/ .article-listing-container .col-xs-12 {padding-left:0; padding-right:0} .doctor_info_wrapper {padding:30px} .doctorInfo .doctor-name {width: 50%; padding-left: 15px} .doctorInfo .image-container{width: 30%} .doctorInfo .image-container img,.doctor_details .doctor-image, .doctor_details .image-container img.card-img-top {max-width: 80px;} .doctor_details .card-body {padding-left: 10px} .image-container.col-5.col-sm-4 {padding-left:15px; padding-right:15px} .doctor-name .title_zh {margin:0 auto} .card.doctor_details {padding:20px 15px;} .footer-credits {padding: 0 0 12px !important;} } @media (max-width: 375px){ .home-title, h1.entry-title, h2.entry-title { font-size:30px } } @media (max-width: 320px){ .mobile-selfass-btn a.test-cta { font-size:14px; width:75px; } .footer-menu li::after {margin-left: 10px;} .footer-menu li { margin: 0 0 0 5px;} .doctor_info_wrapper {padding-left: 15px; padding-right: 15px;} } @media (min-width: 768px){} @media (min-width: 992px){ /* .navbar-expand-lg .navbar-collapse {justify-content: flex-end;}*/ .article_headline {min-height: 64px} ul.primary-menu {gap: 30px} ul.primary-menu li {width:calc(100% / 6); text-align:center;} .current_page_item a:after { content: ""; width: 100%; height: 2px; position: absolute; background: #A85231; bottom: 0; } .tip-circle.text-state { background-color: #DEBEAE; } } @media (min-width: 1200px){} /* fix css */ @media (max-width: 1199px){ } /*@media (max-width: 575px){ .main-content .container{ overflow: hidden;}.home_kv img{ }.main-content{background-size: 1000px auto;} }*/ @media (max-width: 320px){ /* .main-content{background-size: 840px auto;}*/ .btn.back-btn { top: -13px;} .article-content {margin-top:0} } .ajax-load-more-wrap.infinite.ring .alm-load-more-btn{ background-image: url(/multisites/wp-content/themes/main_theme/assets/images/common/scrollmore@2x.png) !important; background-size: 150px !important; }