html{font-size: 16px;}
body{font-family: "Microsoft JhengHei","微軟正黑體","Microsoft YaHei","微软雅黑体",PMingLiU,"新細明體",'宋体',simsun, Helvetica,Arial,sans-serif;}
html[lang=en-GB] body{font-family: Helvetica,Arial,"Microsoft JhengHei","微軟正黑體","Microsoft YaHei","微软雅黑体",PMingLiU,"新細明體",'宋体',simsun, sans-serif;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{ font-weight: bold;}
.h1, .h2, .h3, h1, h2, h3{ margin-bottom: 1em;}
.h4, .h5, .h6, h4, h5, h6{ margin-bottom: 0.5em;}
html[lang="en-GB"] .h3, html[lang="en-GB"] h3{ font-size: 1.5rem; }
html[lang="en-GB"] .h4, html[lang="en-GB"] h4{ font-size: 1.25rem; }

.container, .container-fluid{padding-left:0; padding-right:0;}
.container>.row, .container-fluid>.row{margin-left:0;margin-right:0;}

.btn-primary, .btn-theme{background-color: #009933; border-color:#009933; color:#FFF}
.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled):active:hover, .btn-primary:not(:disabled):not(.disabled):focus, .btn-primary:not(:disabled):not(.disabled):focus:hover, .btn-primary:not(:disabled):not(.disabled):hover,
.btn-theme:not(:disabled):not(.disabled):active, .btn-theme:not(:disabled):not(.disabled):active:focus, .btn-theme:not(:disabled):not(.disabled):active:hover, .btn-theme:not(:disabled):not(.disabled):focus, .btn-theme:not(:disabled):not(.disabled):focus:hover, .btn-theme:not(:disabled):not(.disabled):hover
{ background-color: #4caf50; border-color:#4caf50; color:#FFF; box-shadow:none;}
.btn-outline-primary, .btn-outline-theme{background-color: #fff; border-color:#009933; color:#009933 !important; box-shadow: none !important}
.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:hover, .btn-outline-primary:not(:disabled):not(.disabled):focus, .btn-outline-primary:not(:disabled):not(.disabled):focus:hover, .btn-outline-primary:not(:disabled):not(.disabled):hover,
.btn-outline-theme:not(:disabled):not(.disabled):active, .btn-outline-theme:not(:disabled):not(.disabled):active:focus, .btn-outline-theme:not(:disabled):not(.disabled):active:hover, .btn-outline-theme:not(:disabled):not(.disabled):focus, .btn-outline-theme:not(:disabled):not(.disabled):focus:hover, .btn-outline-theme:not(:disabled):not(.disabled):hover
{ background-color: #009933; border-color:#009933; color:#FFF !important; box-shadow:none;}

.share-btn-group{ position: relative; display: inline-block; width: 100%; margin-top: 0.25rem}
.share-btn-group .btn{ margin: 0 0.25rem 0.5rem 0;}

.btn-circle{ width: 3rem; height: 3rem; font-size: 1.5rem; border-radius: 50%; overflow: hidden; outline: none !important; border: none;}

.invalid-feedback{text-align: left;}
.easy-tips-js{ position: absolute; top:0; margin:0 auto; background-color: #35484e; color:#FFF; padding: 1em;line-height: 1.2; border-radius: 4px}
.easy-tips-js::before{ content: ""; display: block; position: absolute; bottom:-5px; left:0;  right:0; margin: auto;
	width: 0; height: 0; border-style: solid; border-width: 6px 7px 0 7px; border-color: #35484e transparent transparent transparent;
}
.text-right .easy-tips-js{ right:-68px; left: auto;}
.text-right .easy-tips-js::before{ right:1rem; left:auto;}

.highlight{ font-weight: bold; color:#009933;}
.highlight-title{ border-left: 0.35em #f60 solid; padding-left: 0.5em; color: #222;}

.form-control{ /*border-color: #ced4da;*/ }
.form-control:focus{ box-shadow: none; outline: none;}
.form-control.disabled{ background-color: #e9ecef; opacity: 1;}
.invalid-feedback{ padding: 0; font-weight: bold;}
button[type="submit"]{text-transform: uppercase; font-weight: bold;}

/*#page_body{padding-top: 168px;}*/
.topbar{ /*background-image: url("../images/header_bg.jpg");*/ background-size: cover; background-repeat: no-repeat; background-position: center top; background-color: #009933;
	position: fixed; top:0; right:0; left:0; z-index: 3; margin: auto;
}
.topbar .bar-wrapper { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: center; align-items: center; height: auto; }
.topbar .bar-wrapper>div{background-color: transparent;}
/*.stretch-bar .bar-wrapper>div{ background-color: #FFF; backdrop-filter:none;}*/
.topbar .lower-layer{ background-color: #FFF;}
/*.topbar .logo{width: 32%;}*/
.topbar .header-text{width: 34%; color:#FFF; -ms-flex: 0 01 auto; flex: 0 1 auto; padding: 15px; line-height: 1}
.topbar .menu{ width: calc(100% - 195px); background-color: #FFF; }
.topbar .extra{ width: 195px; padding: 10px 0; background-color: #FFF; }
.topbar .btn-full-height{ background-color: #009933; color:#FFF; padding: 0 25px; line-height: 1; text-align: center; font-weight: bold;} 
.topbar.fixed-top{
-webkit-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.15);
box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.15);
}
.topbar .navbar-nav{ -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: start; justify-content: flex-start;}
.topbar .navbar-nav>li>a{ padding: 0.7em 0.5em; text-decoration: none;}
.topbar .navbar-nav>li.hover>a{ background-color: #093 !important; color:#FFF !important;}

/*.topbar+div.member-system, .text-wrapper-mob+div.member-system{margin-top: 168px}*/
.topbar .edit-btn-wrapper{ top:115px;}

.text-wrapper-mob{display:none; background-color: #48ad61; color:#FFF; line-height: 1.1; padding: 0.5rem 0;}
.mob-s-txt { padding: 0.25rem 15px; }


.light-panel{background-color: #f0f2f6; color:#35484e; padding: 30px 0;}
.light-panel.event-registration-form{padding: 60px 0;}
.light-panel>.container{background-color: #FFF; padding-top: 30px; padding-bottom: 30px;}
.light-panel.event-registration-form>.container{padding-top: 60px; padding-bottom: 60px; }
.light-panel .block-title{ text-align: center; color:#009933;}
.light-panel .block-title h2{font-weight: bold}
.light-panel .block-content{ max-width: 998px; margin: 1em auto;}

.form-row>.col-12{padding-bottom: 1.5rem;}
.form-row .form-row>.col-12{ padding-bottom: 0.5rem;}
.form-row .form-group{ margin-bottom: 0;}

.form-box-lg.form-switch-group label{font-size: 1.1rem; padding: 0.65em 0.75em;}
.form-switch-group input[type=checkbox]:checked+label, .form-switch-group input[type=radio]:checked+label, .form-check-box input[type=checkbox]:checked+label::before, .form-check-box input[type=radio]:checked+label::before, .form-check-box-lg input[type=checkbox]:checked+label::before, .form-check-box-lg input[type=radio]:checked+label::before{ background-color: #009933; border-color:#009933;}
.form-check-box input[type=checkbox]:checked+label, .form-check-box input[type=radio]:checked+label, .form-check-box-lg input[type=checkbox]:checked+label, .form-check-box-lg input[type=radio]:checked+label{ border-color:#009933; color: #009933; font-weight: bold;}

label.align-top{ margin-bottom: 0.25rem;}

.label-box{color:#888;}
.value-box{color:#222;}
.count-participant{ /*display: inline-block;*/ width: 32px; padding: 0 0.25em; font-weight: bold; color:#009933; border: none; outline: none; text-align: center}

.date-format{ white-space: nowrap;}


.inpage-header-by-system{ background-image: url("../images/background/bg.jpg"); background-size: cover; background-position: center bottom; background-repeat: no-repeat; width: 100%; max-width: 100%; margin: 0 auto; padding: 0 0 0.5em; color:#FFF}
.inpage-header-by-system>.container>.row {
    align-items: flex-end;
    min-height: 250px;
}

.details-page-header{ background-size: cover; background-position: center bottom; background-repeat: no-repeat; width: 100%; max-width: 100%; margin: 0 auto; padding: 10px; color:#FFF; }
.details-page-header h1, .details-page-header h2, .details-page-header h3, .details-page-header h4{ line-height: 140%;}
.details-page-header h1{ font-size: 3rem;}
.details-page-header .widget_heading{min-height: 450px; display: -ms-flexbox; display: flex; -ms-flex-align: end; align-items: flex-end; }
.block-fellowship-details .details-page-header{ background-image: url(../../../../filedata/upload/header_bg/header_01.jpg); }

/*.helf-col-container .inter-column .widget_heading, .helf-col-container .inter-column .widget_text{ max-width: 540px; margin: 0 auto}*/
/*.container-fluid>.row>.col-auto .widget_heading, .container-fluid>.row>.col-auto .widget_text, .container-fluid .u_content_heading, .container-fluid .u_content_text, .container-fluid>.row>.col-auto .widget-wrapper{ max-width: 540px; padding: 0 1em; margin: 0 auto}*/

.bg-parallax{background-attachment: fixed;}

.widget_heading>h1, .widget_heading>h2, .widget_heading>h3, .widget_heading>h4.widget_heading>h5, .widget_heading>h6{margin-bottom: 0;}
.widget_image_slideshow .item-thumb .img-fluid{ max-width: none; width: 100%;}

.num-family{display:none;}
.num-family.show-extra{display: -ms-flexbox !important; display: flex !important;}
.num-family>*{-ms-flex: 0 1 auto;flex: 0 1 auto;}
.num-family input.form-control{ margin: 0 0.5em; line-height: 1; border-radius: 0.25rem !important; padding: 0.375rem 0.25rem !important;}

.notice-board{ background-color: #fff9e0; padding: 1rem; font-size: 1.2rem; }
.block-wrappper.notice-board{padding: 2em 0;}
.min-fund{ font-size: 1.5rem; font-weight: bold; color:#009933;margin-bottom: 0.25em;}
html[lang=en-GB] .min-fund{font-size: 1.25rem}
.min-fund .fund-amount{ display: inline; border: none; background: none; color: currentColor; max-width: 6em; font-weight: bold; outline: none !important; cursor: default;
	-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none;-ms-user-select: none; user-select: none; 
}
.fund-info{font-size: 0.9rem}
.fund-info .label-box{ -ms-flex: 0 1 auto; flex: 0 1 auto; width: 195px; color:#855111}
html[lang=en-GB] .fund-info .label-box{ width: 250px;}
.fund-info .value-box{-ms-flex: 1 1 50%; flex: 1 1 50%}


.column-author{max-width: 120px;}
.column-post-date{ max-width: 120px;}

.sermon-table{}
.sermon-table .column-thumb{max-width: 200px;}

.statistics-board{background-color: #eff3ff; padding: 1rem; color:#4f5370; }
.statistics-board .title{font-size: 1.25rem; font-weight: bold; color:#4f5370}
.statistics-board thead th{ border-top-color: #bbc4df}
.statistics-board thead th, .statistics-board td{ border-bottom: 1px #bbc4df solid;}
.statistics-board td, .statistics-board th{ padding: 0.25em}

.fundraiser-info{ padding: 0 1.2rem;  /*margin: 0 auto 30px; border: 1px #ccc solid;background-color: #f0f2f6;*/}
.fundraiser-info dl, .fundraiser-info-mini dl{display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; margin-bottom: 0;}
.fundraiser-info dt{ -ms-flex: 0 0 auto; flex: 0 0 auto; width: 170px; min-height: 1.5em}
.fundraiser-info dd{-ms-flex: 1 1 auto; flex: 1 1 auto; width: calc(100% - 170px); min-height: 1.5em}
html[lang="en-GB"] .fundraiser-info dt{ -ms-flex: 0 0 auto; flex: 0 0 auto; width: 260px;}
html[lang="en-GB"] .fundraiser-info dd{-ms-flex: 1 1 auto; flex: 1 1 auto; width: calc(100% - 260px);}
.fundraiser-info-mini{ font-size: 0.875rem; position: -webkit-sticky;  position: sticky; top: 96px; padding: 1rem 0 1rem 1rem; border-left: 1px #CCC solid;}
.fundraiser-info-mini dt{ -ms-flex: 0 0 auto; flex: 0 0 auto; width: 120px; }
.fundraiser-info-mini dd{-ms-flex: 1 1 auto; flex: 1 1 auto; width: calc(100% - 120px); min-height: 1.5em; text-align: right;}
html[lang="en-GB"] .fundraiser-info-mini dt{ -ms-flex: 0 0 auto; flex: 0 0 auto; width: 100%; }
html[lang="en-GB"] .fundraiser-info-mini dd{-ms-flex: 1 1 auto; flex: 1 1 auto; width: 100%; }
/*
.progress-box{padding: 1em; background-color: #009933; color:#ffedd2; width: 100%; border-radius: 1em; text-align: right; -ms-flex: 0 1 auto; flex: 0 1 auto; }
.progress-box-img{float: left; font-size: 4rem; line-height: 1.2; margin-right: 10px;}
.progress-box-text{ line-height: 1;}
.progress-box .amount{font-size: 2.5rem; line-height: 1; font-weight: bold; padding: 10px 0; color:#FFF;}
.progress-box .currency{font-size: 0.65em;}
.progress-box .progress{height: 10px; background-color:#6d6e70;}
.progress-box .progress-bar{background-color: #ffdb41;}
.progress-box .progress+.progress-box-text{margin-top: 5px;}
*/
.progress-box{padding: 1em; width: 100%; border-radius: 1em; text-align: right; border: 1px #009933 solid; margin-bottom: 1rem;}
.progress-box-img{float: left; font-size: 4rem; line-height: 1.2; margin-right: 10px; color:#009933;}
.progress-box-text{ line-height: 1;}
.progress-box .amount{font-size: 2.5rem; line-height: 1; font-weight: bold; padding: 10px 0; color:#009933;}
.progress-box .currency{font-size: 0.65em;}
.progress-box .progress{height: 10px; background-color:#6d6e70;}
.progress-box .progress-bar{background-color: #009933;}
.progress-box .progress+.progress-box-text{margin-top: 5px;}

.phased-form .tns-item{padding: 0 5px !important;}
.phased-form #flat_type, .phased-form #flat_name, .phased-form #block_type{ width: 40%;}

.deadline-wrapper{ background-color: #009933; color:#FFF; padding: 1em; width: 100%; border-radius: 1em; text-align: right; position: relative;}
.deadline-wrapper::before{ content: "\f017"; display:inline-block; font-family: "Font Awesome 5 Free"; font-size: 3rem; font-weight: bold; line-height: 1; position: absolute; top:1rem; left:1rem; }
.deadline-wrap{line-height: 1.5; margin-bottom: 10px;}
.deadline-date{display: block; font-size: 1.5rem; font-weight: bold; line-height: 1;}

.date-counter{display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: end; justify-content: flex-end; min-width: 100%; margin-left: -0.5rem; }
.date-counter>div{-ms-flex: 0 1 25%;flex: 0 1 25%; display: block; text-align: right; font-size: 2.5rem; line-height: 1; font-weight: bold; padding: 0.5rem;  margin-left: 0.5rem; border-radius: 0.5rem; background-color: #FFF; color:#494a4c;}
.date-counter>div.day-wrap{ -ms-flex: 1 1 25%;flex: 1 1 25%;}
.date-counter>div.expired{-ms-flex: 1 1 auto;flex: 1 1 auto; width: 100%; text-align: center;font-size: 2.5rem;color:#9b2020;letter-spacing:0; }
.date-counter .day-unit, .date-counter .hr-unit, .date-counter .min-unit, .date-counter .sec-unit{ display: block; text-align: right; font-size: 0.8rem; color:#999; line-height: 1; padding-top: 0.25rem;}


.sponsors-list{display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; padding: 15px 0 0;}
.sponsors-list .sponsors-info{-ms-flex: 0 1 auto; flex: 0 1 auto; width: calc(50% - 20px); margin: 0 10px 20px; padding: 15px 30px; border-radius: 30px 30px 30px 0; background-color: #FFF; font-weight: bold; box-shadow: 0 0 10px 0 #ccc;
	display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; min-height: 90px;
	/*-ms-flex-direction: column; flex-direction: column; -ms-flex-pack: justify; justify-content: space-between;*/
}
.sponsors-name{ font-size: 1.15rem; color:#222; -ms-flex: 1 1 auto; flex: 1 1 auto; order: 0; width: 60%;}
.sponsors-message{ color:#666; -ms-flex: 1 1 auto; flex: 1 1 auto; font-weight: normal; line-height: 1.25; order: 2; width: 100%; margin-top: 10px;}
.sponsors-amount{ font-size: 1.75rem; color:#009933; -ms-flex: 0 0 auto; flex: 0 0 auto; order: 1; width: 40%; text-align: right; line-height: 1}

.group-fundraising{}
.field-hide, .fields-wrap-hide{display:none;}
.col-row-num{width:22px; text-align: center;}
.group-fundraising tbody{ counter-reset: counter_row;}
.group-fundraising tbody>tr{counter-increment: counter_row;}
.group-fundraising tbody>tr>td:first-child::before{ content: counter(counter_row); display:inline;}
.col-real-name{width:100px}
.col-display-name{width:100px}
.col-message{width:260px}
.col-amount{width:80px}
.col-tool{width:28px; text-align: center; padding-left: 0 !important; padding-right:0 !important;}
.col-full-name{ width: 50%;}
.col-gender{ width: 94px; text-align: center}
html[lang=en-GB] .col-gender{ width: 150px;}
.col-age{ width: 120px;}
.col-is-child{ width: 100px; text-align: center; padding-left: 0 !important; padding-right:0 !important;}
html[lang=en-GB] .col-is-child{ width: 80px;}
.table-responsive{ position: relative;}
.group-fundraising .table-responsive th, .group-fundraising .table-responsive td{ white-space: nowrap;}
.group-fundraising .form-group{vertical-align: top;}
.group-fundraising .count-amount, .group-fundraising .total-amount{ text-align: right;}
.group-fundraising .btn-remove{ border: none; padding: 0.25rem;}
.group-fundraising input.total-amount[readonly]{ background-color: #FFF; pointer-events: none;}

html[lang=en-GB] .group-fundraising .col-amount{width: 105px;}


.table-tiny td, .table-tiny th {padding: 2px; font-size: 0.875rem;}
.sticky-col {
		left: 0;
  position: -webkit-sticky;
  position: sticky;
  background-color: white !important;
}
.sticky-vert{
		top: 96px; z-index: 3;
  position: -webkit-sticky;
  position: sticky;
}

.with-step{ padding: 0 0.5em; font-size: 1.25rem; font-weight: bold; padding-top: 0.375rem; padding-left: 0; margin-bottom: 1rem;
	transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
	-ms-transition:0.5s all;
}
.step-num{ display:inline-block; background-color: #009933; color:#FFF; width: 1.667em; height: 1.667em; line-height: 1.6; border-radius: 50%; overflow: hidden; text-align: center; font-size: 1.2em; font-weight: bold; vertical-align: middle; margin-top: -0.25em; margin-right: 0.25em;}

ol.step-tags{list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; padding: 0; margin: 0 0 2rem;}
ol.step-tags>li{padding-left: 0; margin: 0; padding:2.5rem 1rem 1rem; -ms-flex:1 1 0; flex:1 1 0; position: relative; text-align: center; line-height: 1.25; color:#999;}
ol.step-tags>li:not(:first-child)::before{content: ""; display:block; /*width: 100%;*/ height: 8px; background-color: rgba(0,0,0,0.3); border-radius: 0; position: absolute; top:0.8em; right:50%; left:-50%; z-index: 0; }
ol.step-tags>li:not(:first-child)::before{content: ""; display:block; /*width: 100%;*/ height: 8px; background-color: rgba(0,0,0,0.3); border-radius: 0; position: absolute; top:0.8em; right:50%; left:-50%; z-index: 0; }
ol.step-tags>li:not(:first-child)::after{content: ""; display:block; /*width: 0%;*/ height: 8px; background-color: #009933; position: absolute; top:0.8em; right:150%; left:-50%; z-index: 0;
	transition:0.35s right;
	-webkit-transition:0.35s right;
	-moz-transition:0.35s right;
	-o-transition:0.35s right;
	-ms-transition:0.35s right;
}
ol.step-tags>li.active:after,ol.step-tags>li.pass:after{/* width: 100%;*/ right: 50%}
ol.step-tags>li.active{ color:#009933;}
ol.step-tags>li.pass{ color:#35484e;}


ol.step-tags .step-num{position: absolute; top:0; left:0; right:0; z-index: 1; margin: auto; line-height: 1.5; transition-delay: 0.35s;}
ol.step-tags>li .step-num{ background-color: #b2b2b2; color:#FFF; border: 2px #b2b2b2 solid; }
ol.step-tags>li.pass .step-num{ background-color: #FFF; color:#009933; border: 2px #009933 solid; }
ol.step-tags>li.active .step-num{ background-color: #009933; color:#FFF; border: 2px #009933 solid; }

.how2know-group{}
.how2know-group .form-extra-textbox label{ max-width: 57% !important}
.how2know-group .form-check-box-lg .extra-textbox{ max-width: 40%; margin-left: 3%;}

div.show-extra{ display:block !important;}
div.show-extra.row, div.show-extra.form-row, div.show-extra.d-flex{ display: -ms-flexbox !important; display:flex !important;}
div.close-extra{display:none !important;}

.center-address{ padding-top: 1rem;}

.req-group-error{ background-color: #fff5f6;padding: 5px 0;margin: 0 0 10px;border: 1px #dc3545 dashed; border-radius: 4px;}
.req-group-1-checker+.invalid-feedback, .req-group-2-checker+.invalid-feedback{margin: -5px 5px 0;}

.remarks{ font-size: 0.875rem; color:#6c757d; margin-top: 1rem;}
.form-preview-ori{display: none;}
.form-preview{ padding: 1rem; background-color: #f5f5f5; color:#000; margin-bottom: 1rem;}

.form-preview dl{ display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; margin-bottom: 0;}
.form-preview dt{ -ms-flex: 0 1 auto; flex: 0 1 auto; width: 220px; padding-right: 1rem; padding-bottom: 0.5rem; margin-bottom: 0.5rem; color:#777; border-bottom: 1px #ddd solid;}
.form-preview dd{ -ms-flex: 1 1 auto; flex: 1 1 auto; width: calc(100% - 220px); padding-bottom: 0.5rem; margin-bottom: 0.5rem; min-height: 32px; border-bottom: 1px #ddd solid;}

.thankyou-message-box{ width: 96%; max-width: 680px; padding: 1.5rem; margin: 0 auto;
/*display: -ms-flexbox; display: flex;
-webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;
-ms-flex-align: center; align-items: center;*/
}
.thankyou-message-box>*{-ms-flex: 0 0 auto; flex: 0 0 auto; width: 100%;}
.thankyou-message{ text-align: center; color:#4caf50; font-size: 2rem; line-height: 1; margin-bottom: 1em; }
html[lang=en-GB] .thankyou-message{ font-size: 1.75rem;}
.thankyou-message-box .fas{ font-size: 7rem; margin-bottom: 1rem; }
.thankyou-message-box p{margin-bottom: 3rem;}
.thankyou-message-box .link-to-page{ display: block; padding: 0.5rem; border: 1px #ddd solid; border-radius: 4px; text-align: center; font-weight: bold; word-break: break-all; position: relative;}
.thankyou-message-box .password-code-wrapper{display: block; padding: 0.25rem;  text-align: center}
.thankyou-message-box .password-code{display: inline-block; padding: 0.2em 1em; font-weight: bold; color:#009933; background-color: #eee; font-size: 1.2em}
#copyLink{word-break: break-all;}	
.link-hide{ width: 1px; height: 1px; overflow: hidden; position: absolute; top:0; right:0; }

.lang-en{display: block;}
.lang-inline{display: inline-block;}
.e-receipt-wrapper{max-width: 665px; margin: 0 auto 2rem;}
.e-receipt-header{ display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: end; align-items: flex-end;}
.e-receipt-header .org-logo{-ms-flex: 0 1 auto;flex: 0 1 auto; order: 2;}
.e-receipt-header .org-name{-ms-flex: 1 1 auto;flex: 1 1 auto; order: 1; color:#222; font-weight: bold; margin-bottom: 0.8rem;}
.e-receipt-body{ border: 2px #009933 solid; border-bottom: none; padding: 2rem 2rem 0 2rem;}
.e-receipt-title{ margin-bottom: 1rem; padding-bottom: 0.5rem; border-bottom: 1px #ddd solid; color: #009933; font-weight: bold; font-size: 1.2em;}
.e-receipt-table{min-width: 100%; border-collapse: collapse;}
.e-receipt-table tr{ border-bottom: 1px #BBB solid;}
.e-receipt-table tr.highlight{ background-color: #fff9e0; cursor: pointer;}
.e-receipt-table th, .e-receipt-table td{padding: 0.75em 1em; line-height: 1.2}
.e-receipt-table th{  color:#326500;}
.e-receipt-table th.horz-left{ width: 150px;}
.e-receipt-table th .lang-en, .e-receipt-table td .lang-en{ font-size: 0.825em; vertical-align: text-top;}
.e-receipt-footer{border: 2px #009933 solid; border-top: none; padding: 1rem 2rem 2rem 2rem; font-size: 0.825em; color:#777;}
.e-receipt-footer p:last-child{margin-bottom: 0;}

.e-receipt-wrapper+div{ max-width: 695px; margin: auto;}
.e-receipt-wrapper+div .btn{line-height: 1.2; font-weight: bold}
.e-receipt-wrapper+div .lang-en{font-size: 0.75em;}

.e-receipt-wrapper-full{ width: 100%; max-width: 100%;}
.e-receipt-table .col-real-name, .e-receipt-table .col-display-name{ width: 35%;}
.e-receipt-table .col-amount{ width: 90px;}
.e-receipt-table .col-actions{ width: 240px;}

.hidden-row:not(.show){ border-bottom: none !important; padding: 0 !important}
/*tr.hidden-row{ border-bottom: none;}
tr.hidden-row.show{ border-bottom: none;}*/
.hidden-row th, .hidden-row td{padding: 0 !important;}
.hidden-row .inner-box{display: none; padding: 0.75em 1em;}

#card_expiry_date_month-error, #card_expiry_date_year-error{ width: 50%; display: inline-block !important;}

.certificate-wrapper{ border: none; border-collapse: collapse; max-width: 100%;}
.certificate-wrapper th, .certificate-wrapper td{padding: 0; margin: 0; text-align: center; border: none;}
.certificate-name{ font-size: 24px; font-weight: bold; color:#009933; height: 2.7em}
.certificate-year{ font-size: 18px; font-weight: bold; color:#222; height: 1.8em}

.empty-min-height{max-width: 480px; min-height: 500px; margin: 0 auto}
.empty-min-height .alert{ width: 100%; text-align: center;}

.gallery-wrapper{background-color: #f0ddce;}
.gallery-title{ padding: 10px; font-size: 1.5rem; }
.gallery-intro{ padding: 10px;}

.inter_content{}
.inter-content-footer{ margin-top: 2rem; text-align: center}

td.column-thumb{ max-width: 250px;}

.overlay_notification_box {
		background: rgba(15,80,30,0.7);
		/*bottom: 0px;
		width: 100%;*/
		position: fixed;
	right:0; bottom:0; left:0; z-index: 2; margin: auto;
	}

	.overlay_notification_container {
		width: 980px;
		margin: auto;
		padding: 5px;
	}

	.notification_button {
		background: none;
		color: #fff;
		padding: 5px 10px;
		border: 1px solid #fff;
		border-radius: 5px;
		cursor: hand;
		cursor: pointer;
	}

footer{}
footer.bottom-bar{ background-color: #093; color:#FFF; font-size: 14px; padding: 2em 0;}
footer.bottom-bar a{ color: inherit !important;}
.over-footer{ background-color: #6d6e70; color:#FFF; padding: 1em 0; font-size: 0.875rem; text-align: center; }
.over-footer a{color: inherit;}
.footer-inner{ padding: 1em 0; font-size: 0.875rem; text-align: center;}
.under-footer {padding: 1em 0; font-size: 0.875rem; text-align: center; color:#999}

.modal-header{ background-color: #009933; color:#FFF; font-weight: bold}
.modal-header .close{ color:inherit; text-shadow: none; opacity: 1; outline: none;}
.modal-content{position: relative;}
.modal-body{ max-height: 75vh; overflow-y: auto; padding-bottom: 3rem; position: relative;}
/*.modal-body::after{content: ""; display:block; position: absolute; right:18px; bottom:0; left:0; height: 3rem; pointer-events: none;
background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); 
background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); 
}*/

.member-system{padding: 30px 0;}
.member-system .alert-single{max-width: 640px;}
.member-system label{line-height: 1.2;}
.member-system .text-eng{font-size: 0.8; opacity: 0.7; padding-left: 0.5em}
.login-page{ padding: 0; background-color: #f5f5f5; background-size: cover; background-repeat: no-repeat; background-position: center top;}
.login-page .container{ min-height: 74vh; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-align: center; align-items: center; -ms-flex-pack: center; justify-content: center; }
.login-panel{ width: 96%; max-width: 320px;}
.form-panel-sm .captcha-img{height: 38px !important; min-width: 104px !important;}
.forget-link{margin-top: -0.8rem; margin-bottom: 1rem; font-size: 0.835rem; text-align: right}
.register-link{margin: 10px 0;}


@media (max-width: 1280px){
	.small-txt-1280{font-size: 1rem;}
}

@media (max-width: 1024px){
	/*#page_body{ padding-top: 184px;}*/
	.topbar .logo{ /*width: calc(100% - 170px);*/}
	.topbar .logo>a{-ms-flex-align: start; align-items: flex-start;}
	.topbar .logo img{/*width: 100%; max-width: 100%;*/ height: 100%;}
	.topbar .mobile-toggle{ -ms-flex: 0 0 auto;  flex: 0 0 auto; width: 2.5em; height: 2.5em; margin-left: 15px; margin-right: 1em; }
	.topbar .extra{width: auto; margin-right: 0; margin-left: auto;}
.topbar .mobile-toggle.btn-full-height { padding: 0; background-color: #FFF; color: #222; }
.stretch-menu .extra .btn-full-height{font-size: 18px;}
	.topbar .header-nav{ position: fixed; top:11.5rem; }
	/*.topbar .header-nav::before, .topbar .navbar-nav{position: absolute; top:0;}*/
	.topbar .dropdown-menu{ border: none;}
	.topbar .navbar-nav>li{ width: 100%; display: block;}
	.topbar .nav>li>a { font-size: 1rem;  padding: 16px 40px;}
	.small-txt-1024{ font-size: 1rem;}
	/*.topbar+div.member-system{margin-top: 184px;}*/
}

@media (max-width: 991px){
	.hide-desktop{display: unset !important;}
	.hide-mobile{display: none !important}
	/*#page_body{ padding-top: 70px;}
	.topbar{height: 70px;}*/
	.topbar .header-nav{ top:70px;}
	.topbar .header-text{display:none;}
	.topbar .lower-layer{ background-color: transparent; position: fixed; top:10px; right:0; left:0; margin: auto; pointer-events: none;}
	.topbar .extra{ pointer-events: all; width: auto}
	.topbar .edit-btn-wrapper{ top:80px;}
	.text-wrapper-mob{display:block;}
	/*.topbar+div.member-system, .topbar+div.text-wrapper-mob{ margin-top: 70px;}*/
	/*.text-wrapper-mob+div.member-system{margin-top: 0}*/
	.mob-s-txt{font-size: 14px;padding: 0.25rem 15px;}
	.sponsors-list .sponsors-info{ width: 100%;}
	.fundraiser-info-mini{ padding-left: 0; padding-bottom: 0 0 1rem 0; margin-bottom: 1rem; border-left: none; border-bottom: 1px #CCC solid;}
	.date-counter{font-size: 14px;}
	.extra>.dropdown>.btn-link{ color:#FFF !important;}
	/*.topbar+div.member-system{margin-top: 70px;}*/
}
@media (max-width: 991px) and (min-width: 769px){
	.deadline-date{font-size: 20px;}
	.date-counter>div{ font-size: 32px;}
	/*.topbar+div.member-system{margin-top: 69px;}*/
}
@media (max-width: 768px){
	.topbar .logo{ width: 250px;}
.deadline-date{ font-size: 1.2em;}
.date-counter>div{ font-size: 28px; width: 25%;}
	.day-unit{font-size: 10px;}	
}
@media (max-width: 767px){
.form-row{ margin-bottom: 1rem;}
.form-row>.col-12 { padding-bottom: 0.5rem;}
.fundraiser-info{margin-bottom: 1rem;}
.form-preview dt{ width:100%; border-bottom: none; padding-bottom: 0; margin-bottom: 0;}
.form-preview dd{ width: 100%; margin-bottom: 1rem}
.col-is-child, .col-tool{ padding-left: 0.5em !important; padding-right: 0.5em !important; }
	td.column-thumb{max-width: 100%;}
	ol.step-tags>li>*:not(.step-num){ display: none }
	.e-receipt-table, .e-receipt-table tr, .e-receipt-table th, .e-receipt-table td{display: block; width: 100% !important; }
	.e-receipt-table thead, .e-receipt-table tbody, .e-receipt-table tfoot{ display:block; width: 100%;}
	.e-receipt-table tr{padding: 0.5em 0;}
	.e-receipt-table th, .e-receipt-table td{padding: 0.25em 0;}
	.e-receipt-table th .lang-en{ display: inline-block;}
	.e-receipt-wrapper+div{margin-left: -15px; margin-right: -15px;}
	.e-receipt-wrapper+div .btn{ margin-bottom: 1rem;}
	.e-receipt-table tr.highlight{ padding-left: 1rem; padding-right: 1rem;}
	.e-receipt-table tr.highlight .col-actions{ text-align: right}
	.e-receipt-hide-sm{ display: none !important;}
	.hidden-row .inner-box{position: relative; padding: 8px 0 16px 125px;}
	.hidden-row .inner-box::before{ content: attr(aria-label); display: inline-block; white-space: pre; color:#326500; font-size: 14px; width: 110px; position: absolute; top:0; left: 0;}
	.hidden-row .col-actions .inner-box{padding: 0; text-align: right;}
	
	.deadline-wrapper{max-width: 300px; margin: 0 auto;}
}
@media (max-width: 575px){
	.container, .container-fluid{ padding-left: 1rem; padding-right: 1rem;}
	.topbar .lower-layer{ right: 0;}
	.mob-s-txt{padding: 0.25rem 2rem;}
	.mob-s-txt, .mob-s-txt *{text-align: left !important; }
}
@media (max-width: 520px){
	.e-receipt-header{-ms-flex-align: start; align-items: flex-start;}
	.e-receipt-header .org-logo{width: 220px; }
	.e-receipt-header .org-name{ margin-bottom: 0; font-size: 0.825rem;}
	.e-receipt-body{margin-top: 0.5rem;}
	
	html[lang="en-GB"] .table-responsive-breakline td[aria-label]{padding-left: 4px !important; text-align: right}
	html[lang="en-GB"] .table-responsive-breakline td[aria-label]::before {position: relative;left: auto;top:auto;width: 100%;padding: 0.5em;white-space: normal;}
	html[lang="en-GB"] .col-full-name .d-flex{display: block !important; text-align: right;}
	html[lang="en-GB"] .col-full-name .d-flex .d-block{ text-align: left;}
}

@media (max-width: 464px){
	.topbar .extra{ -ms-flex-pack: end; justify-content: flex-end;}
	.topbar .btn-login{display: none;}
	.topbar .mobile-toggle{ -ms-flex:0 0 auto; flex:0 0 auto; width: 2.5em; height: 2.5em; margin-right: 1em;}
}

@media (max-width: 424px){
	.fund-note .d-flex{ -ms-flex-wrap: wrap; flex-wrap: wrap;}
	.fund-note .label-box, .fund-note .value-box{ -ms-flex: 1 1 100%; flex: 1 1 100%; width: 100%; }
	.fundraiser-info dl, .fundraiser-info-mini dl{ display: block;}
.fundraiser-info dt, .fundraiser-info-mini dt, .fundraiser-info dd, .fundraiser-info-mini dd{ width: 100% !important;}
	.step-tags{display:none;}
}

@media (max-width: 374px){
	.topbar .logo>a{-ms-flex-align: center; align-items: center;}
	.form-extra-textbox{}
	.how2know-group .form-extra-textbox label{ max-width: 100% !important}
	.form-extra-textbox .extra-textbox{ width: 100% !important; max-width: 100% !important; margin: 0.25em 0 0.5em 0}
	.e-receipt-header .org-name{ font-size: 0.75rem;}
	.date-counter>div{ font-size: 28px;}
}