body, html { font-family: '\5FAE\8EDF\6B63\9ED1\9AD4', 'Microsoft JhengHei', 'Montserrat', Helvetica, Arial, sans-serif !important; }
html body .content.app-content, footer { min-width:320px; }
/* login */
html body.bg-full-screen-image { background:none; background-color:#cccccc; }
.bg-authentication { background-color: #FFFFFF; }
.login_logo { width: 100%; height: auto; }
html body.bg-full-screen-image .content .content-wrapper { margin-top: 0px; }
/* header */
.header-navbar.floating-nav { margin: 0px!important; border-radius: 0px!important; width: calc( 100vw - (100vw - 100%) - 220px); }
body.vertical-layout.vertical-menu-modern.menu-collapsed .header-navbar.floating-nav { width: calc(100vw - (100vw - 100%) - 50px); }
.vertical-overlay-menu .navbar.header-navbar.floating-nav { width: calc(100vw - (100vw - 100%)); min-width: 320px; }
@media (max-width: 575.98px) {
.header-navbar.floating-nav { width: calc(100vw - (100vw - 100%)) !important; }
}
.header-navbar { font-family: "\5FAE\8EDF\6B63\9ED1\9AD4", "Microsoft JhengHei", "Montserrat", Helvetica, Arial, sans-serif !important; }
.vertical-overlay-menu .main-menu, .vertical-overlay-menu.menu-hide .main-menu { width: 220px; left: -260px; }
html body .content { margin-left: 220px; }
/* nav */
/* nav - width */
body.vertical-layout.vertical-menu-modern.menu-expanded .main-menu { width: 220px; }
body.vertical-layout.vertical-menu-modern.menu-expanded .navbar .navbar-header { width : 220px; }
body.vertical-layout.vertical-menu-modern.menu-expanded .main-menu .main-menu-footer { width : 220px; }
body.vertical-layout.vertical-menu-modern.menu-expanded .footer { margin-left : 220px; }
body.vertical-layout.vertical-menu-modern.menu-collapsed .navbar .navbar-header.expanded { width : 220px; }
body.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu.expanded { width : 220px; }
@media (min-width: 992px) {
body.vertical-layout.vertical-menu-modern .main-menu { width : 220px; }
body.vertical-layout.vertical-menu-modern .navbar .navbar-header { width : 220px; }
body.vertical-layout.vertical-menu-modern .footer { margin-left : 220px; }
body.vertical-layout.vertical-menu-modern.menu-flipped .content { margin-right : 220px; }
body.vertical-layout.vertical-menu-modern.menu-flipped .navbar .navbar-container { margin-right : 220px; }
body.vertical-layout.vertical-menu-modern.menu-flipped .footer { margin-right : 220px; }
}
.main-menu .navbar-header { width: 220px; height:4rem; padding: 0rem 0.6rem 0rem 0rem; }
.main-menu .navbar-header .navbar-brand .brand-logo { background: url("../../app-assets/images/logo/logo.png") no-repeat; background-size: 40px auto; background-position: 5px 10px; width: 160px; height:32px; }
.main-menu.expanded .navbar-header .navbar-brand .brand-logo { background-size: 130px auto; background-position: 5px 0px; width: 150px; height:43px; }
.main-menu.expanded .navbar-header { padding: 0rem 0.6rem 0rem 0.6rem; }
.main-menu .navbar-header .navbar-brand { margin-top: 0.7rem; }
.nav .modern-nav-toggle { padding: 1.25rem 0; }
.main-menu .navbar-header .navbar-brand .brand-text { color: #666666; font-size: 1.3rem; line-height:1.8rem; font-weight:500; }
.main-menu ul.navigation-main > li:first-child { margin-top: 0rem; }
.navigation { font-size: 1rem; font-family: '\5FAE\8EDF\6B63\9ED1\9AD4', 'Microsoft JhengHei', 'Montserrat', Helvetica, Arial, sans-serif !important; }
.main-menu.menu-light .navigation > li { padding: 0 0px; }
.main-menu.menu-light .navigation > li.open > a, .main-menu.menu-light .navigation > li.sidebar-group-active > a { border-radius: 0px; margin-bottom: 0px; }
.main-menu.menu-light .navigation > li ul .active { background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)); background: linear-gradient(90deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)); box-shadow: 0 0 0px 0px rgba(0, 0, 0, 0.1); border-radius: 0px; color: #494949; background-colour:#98cdea; }
.main-menu.menu-light .navigation > li ul .active > a { color: #494949; }
.main-menu.menu-light .navigation > li.active > a { background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)); background: linear-gradient(90deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)); box-shadow: 0 0 0px 0px rgba(0, 0, 0, 0.1); color: #494949; border-radius: 0px; }
.main-menu.menu-light .navigation li.has-sub ul.menu-content { padding: 0px; margin: 0px; }
body.vertical-layout.vertical-menu-modern .main-menu .navigation .menu-content > li > a > i { margin-right: 0.5rem; font-size: 1.2rem; width: 24px; text-align: center; }
body.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu { width: 50px; }
body.vertical-layout.vertical-menu-modern.menu-collapsed .app-content, body.vertical-layout.vertical-menu-modern.menu-collapsed .footer { margin-left: 50px; }
.dropdown .dropdown-menu { width: auto!important; min-width: max-content; }
.header-navbar .navbar-container ul.nav li.dropdown-user .dropdown-menu-right { width: auto!important; min-width: max-content; }
.header-navbar .navbar-container ul.nav li.dropdown-user .dropdown-menu-right .dropdown-item:hover, .header-navbar .navbar-container ul.nav li.dropdown-user .dropdown-menu-right .dropdown-item:active { background: #2f286d; }
.main-menu .main-menu-content { padding-top: 8px; }
.navbar-floating .header-navbar-shadow { display: none; }
.main-menu .shadow-bottom { display: none!important; }
.main-menu.menu-light .navigation > li.sidebar-group-active > a { background:#2f286d; color: #ffffff; }
.main-menu.menu-light .navigation > .nav-item.active > a { background:#2f286d; color: #ffffff; }
body.vertical-layout.vertical-menu-modern.menu-collapsed .main-menu:not(.expanded) .navigation li.active a { background:#2f286d; color: #ffffff;}
.main-menu.menu-light .navigation > li ul li > a { padding: 6px 15px 6px 40px; }
.main-menu.menu-light .navigation > li ul li.hover > a { padding: 6px 15px 6px 45px; }
/* content */
html body .content .content-wrapper { padding: 1rem 1rem; margin-top: 4.5rem; }
.breadcrumb { padding: 0.3rem 0 0.3rem 1rem !important; }
/* form */
/*.form-group { margin-bottom: 1rem; }*/
.form-group .help-block ul { margin-bottom: 0; }
.form-control { border-radius: 0px; }
.form-control:focus { border-color:#2f286d; color:#000000; box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0); }
.form-control::-webkit-input-placeholder { font-size:1rem; }
.form-control::-moz-placeholder { font-size:1rem; }
.form-control:-ms-input-placeholder { font-size:1rem; }
.form-control::-ms-input-placeholder { font-size:1rem; }
.form-control::placeholder { font-size:1rem; }
.form-group { margin-bottom: 1rem; }
/* upload file field */
.custom-file-label { position:absolute; top:0; right:0; left:0; z-index:1; height: calc(1.25em + 1.4rem + 1px)!important; padding:0.6rem 1rem; line-height:20px; overflow: hidden; font-weight: 400; color: #6e6b7b; background-color:#fff; border:1px solid #d8d6de; border-radius:0px; margin-bottom:0px!important; }
.custom-file-input:lang(en) ~ .custom-file-label::after { content: '瀏覽'; color: #ffffff; background-color: #2f286d; border-radius:0px; border:1px solid #2f286d;}
.custom-file-input:focus, .custom-file-label:focus { border-color:#2f286d; color:#000000; box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0); }
.custom-file-input:focus ~ .custom-file-label { border-color : #2f286d; box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0); }
/* link, color and button */
a { color: #2f286d; }
a:hover { color: #695aea; }
.action_col a:not([href]):not([tabindex]) { color: #2f286d; }
.action_col a:not([href]):not([tabindex]):hover { color: #695aea; }
a.btn:not([href]):not([tabindex]) { color: #FFFFFF; }
.btn { border-radius:0px; }
.btn:hover { box-shadow: 0 0px 0px 0px #7367F0; }
.content-header .btn { padding: 0.5rem 1rem; }
.btn-primary { border-color: #2f286d !important; background-color: #2f286d !important; color: #FFFFFF; }
.btn-primary:hover { border-color: #2f286d !important; background-color: #2f286d !important; color: #FFFFFF; }
.btn-outline-primary { color: #2f286d; border-color: #2f286d; border:1px solid #2f286d; }
.btn-outline-primary:hover { background-color: #2f286d !important; border:1px solid #2f286d; color:#ffffff; }
.modal .modal-header .close span { color: #2f286d; }
.primary { color: #2f286d !important; }
.text-primary { color: #2f286d !important; }
.bg-rgba-primary { background: rgba(64, 48, 209, 0.15) !important; }
.btn .fa { margin-right:5px; font-size:16px; margin-top: -10px; margin-bottom: -10px; }
.alert-primary { background: rgba(64, 48, 209, 0.15) !important; color:#2f286d !important; }
.alert { border-radius: 0rem; }
/* data table add on elements */
/* search row */
.search_row { padding:0px 0px 1rem 0px; overflow:hidden; }
.search_row .align-left { float:left; }
.search_row .align-right { float:right; }
.search_row .info_text { height:35px; line-height:35px; display:inline-table; }
.search_row .grid_icon { display:nonex; /*display:inline-block;*/ margin-left:10px; margin-right:0px; }
.search_row .grid_icon .fa:before { font-size:20px; color:#2f286d; margin-right:5px; position: relative; top: 2px; }
.search_row .grid_icon .view_grid, .search_row .grid_icon .view_list { opacity:0.6; cursor:pointer; }
.search_row .grid_icon .view_grid:hover, .search_row .grid_icon .view_list:hover { opacity:1; }
.search_row .grid_icon .view_grid.selected, .search_row .grid_icon .view_list.selected { opacity:1; }
/* export buttons */
.search_row .export_group { display:nonex; /*display:inline-block;*/ margin-left:10px; padding-left:15px; border-left:1px solid #e5e6e7; }
/* search */
.search_row .search_field { position:relative; display:inline-block; height:35px; vertical-align:top; }
.search_row .search_field input.form-control { margin:0px; display:inline; border-radius:0px; height:35px; }
.search_row .search_field input.form-control:focus { border-color: #2f286d; box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0); }
.search_row .search_field .btn-search-icon { font:normal normal normal 14px/1 FontAwesome; position:absolute; right:0px; top:0px; height:100%; width:35px; background-color:transparent; border-width:0px; margin:0px; color:#999999; outline:none; }
.search_row .search_field .btn-search-icon:after { content:"\f002"; width:35px; line-height:35px; position:absolute; right:0px; top:0px; }
.search_row .search_field .btn-search-icon:hover { color:#666666; }
.search_row .add_new { display:inline-block; margin-left:10px; }
.search_row .add_new .btn { height:35px; padding: 0.75rem 2rem; }
/* multiple select row */
.multiple_function_row { height:0px; padding:0px; margin:0px; overflow:hidden; -webkit-transition-property:all; -webkit-transition-duration:.5s; -webkit-transition-timing-function:cubic-bezier(0, 1, 0.5, 1); -moz-transition-property:all; -moz-transition-duration:.5s; -moz-transition-timing-function:cubic-bezier(0, 1, 0.5, 1); -ms-transition-property:all; -ms-transition-duration:.5s; -ms-transition-timing-function:cubic-bezier(0, 1, 0.5, 1); transition-property:all; transition-duration:.5s; transition-timing-function:cubic-bezier(0, 1, 0.5, 1); }
.multiple_function_row .align-left { float:left; padding: 4px 5px 4px 0.75rem; }
.multiple_function_row .align-right { float:right; padding:4px 0.75rem 4px 5px; }
.multiple_function_row .myCheck .details_input:before { padding-right:10px; }
.multiple_function_row.show { height:inherit; padding:5px 0px; border-top:1px solid #e5e6e7; }
.multiple_function_row .fa:before { font-size:24px; }
.text_editable.form-control { border:1px solid transparent; background-color:transparent; padding-left:0px; padding-right:0px; border-left:0px; border-right:0px; }
.text_editable_field { width:100%; display:none; }
.text_editable_field input { max-width:inherit!important; min-width:inherit!important; padding-left:5px; padding-right:5px; width:inherit!important; box-sizing:border-box; }
.text_editable_field textarea { max-width:inherit!important; min-width:inherit!important; padding-left:5px; padding-right:5px; width:inherit!important; box-sizing:border-box; height:auto; }
.text_link_hide { position:absolute; top:-500px; }
/* table style */
.dataTables_wrapper { padding-bottom:0px; }
.dataTables_wrapper .dt-buttons { display:none; }
.dataTables_wrapper .dataTables_filter { display:none; }
table.dataTable { border: 1px solid #e5e6e7; clear:both; margin-top:0px !important; margin-bottom:0px !important; max-width:none !important; /*border-collapse: collapse!important;*/ }
table.dataTable th, table.dataTable td { border-top: 1px solid #e5e6e7; border-bottom: 0px; }
table.dataTable tfoot { display:none; }
table.dataTable thead th { font-size:14px; font-weight:normal; color:#000000; }
table.dataTable thead>tr>th.sorting_asc, table.dataTable thead>tr>th.sorting_desc, table.dataTable thead>tr>th.sorting, table.dataTable thead>tr>td.sorting_asc, table.dataTable thead>tr>td.sorting_desc, table.dataTable thead>tr>td.sorting { padding-right: 20px; }
table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before { font-size:12px; left:inherit; right:10; top:15px; bottom:inherit; opacity:0.5; display:none; }
table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after { font-size:12px; left:inherit; right:10; top:13px; bottom:inherit; opacity:0.5; }
table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc { background-color:#dadada; }
table.dataTable thead .sorting:hover:after, table.dataTable thead .sorting_asc:hover:after, table.dataTable thead .sorting_desc:hover:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after { opacity:0.7; }
table.dataTable thead .sorting_asc:before { content:"\f883"; }
table.dataTable thead .sorting_desc:before { content:""; }
table.dataTable thead .sorting_asc:after { content:"\f160"!important; font-family:"FontAwesome"!important; color:#1AAD19; }
table.dataTable thead .sorting_desc:after { content:"\f161"!important; font-family:"FontAwesome"!important; color:#1AAD19; }
.table>caption+thead>tr:first-child>td, .table>caption+thead>tr:first-child>th, .table>colgroup+thead>tr:first-child>td, .table>colgroup+thead>tr:first-child>th, .table>thead:first-child>tr:first-child>td, .table>thead:first-child>tr:first-child>th { border-top:0; box-sizing:border-box; }
table.dataTable tbody tr td.sorting_1 { background-color:#F8F8F8; }
table.dataTable tbody tr:hover td.sorting_1 { background-color:#f5f5f5; }
table.dataTable tbody tr.selected { background-color: #e9f7e9!important; color: #222222!important; box-shadow: 0 0 0px 0 #ffffff!important; border-radius: 0px!important; }
table.dataTable tbody tr.selected td.sorting_1 { background-color:#ddf3dd; }
table.dataTable tbody tr.selected:hover { background-color: #d1efd1!important; }
table.dataTable tbody tr.selected:hover td.sorting_1 { background-color:#d1efd1; }
table.dataTable tbody tr.selected a, table.dataTable tbody th.selected a, table.dataTable tbody td.selected a { color: #2f286d; }
table.dataTable td.td_field { padding-top:5px; padding-bottom:5px; }
table.dataTable tr.total { background-color:#f0f0f0; font-weight:bold; }
.check_col { width:24px; }
.check_col .myCheck span.details_input { margin-right:0px; margin-top:4px; }
.check_col .myRadio span.details_input { margin-right:0px; margin-top:4px; }
th.action_col { position:relative; }
th .myCheck { position:absolute; top:5px; right:6px; }
table.dataTable td.image_col { padding: 0px!important;}
.thumnail_col { width:150px; }
.action_col { white-space: nowrap; width:50px; }
.action_col .fa:before { font-size:20px; }
.action_col .feather:before { font-size:20px; }
.action_col span[data-toggle="tooltip"] { display:inline-block; }
.action_col span[data-toggle="tooltip"] a { display:inline-block; }
.action_col a[data-toggle="tooltip"] { display:inline-block; }
.multiple_function_row span[data-toggle="tooltip"] { display:inline-block; }
.multiple_function_row span[data-toggle="tooltip"] a { display:inline-block; }
.multiple_function_row a[data-toggle="tooltip"] { display:inline-block; }
.fa-edit:before { vertical-align:inherit; }
.fa-trash:before { vertical-align:text-bottom; }
.table_bottom_btn { margin-top:15px; }
/* table image + lightgallery */
.media_thumb { width: auto; height: auto; flex-shrink: 0; min-width: 100%; min-height: 100%; max-width: 100px; object-fit: cover; }
.lightgallery.image_hide img { display:none; }
.image_fill { display: flex!important; overflow: hidden; position: relative; justify-content: center; align-items: center; }
.image_fill img { width: auto; height: auto; flex-shrink: 0; min-width: 100%; min-height: 100%; object-fit: cover;}
.home_event_image { max-height:300px; overflow: hidden; }
.home_event_image img { width:100%; height:auto; }
.album_frame { background-color: #f8f8f8; }
.gallery_image { height:200px; }
.gallery_image img { max-width:100%; max-height:400px;}
.volunteer_image { height:200px; }
.volunteer_image img { max-width:100%; max-height:400px;}
/* thumb enlarge */
.media_thumb {
-webkit-transition:-webkit-transform 0.15s ease 0s; -moz-transition:-moz-transform 0.15s ease 0s; -o-transition:-o-transform 0.15s ease 0s; transition:transform 0.15s ease 0s; -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); }
.cover_photo { border: 4px solid #76ce76; }
.lightgallery { width:100%; display: block; }
.lightgallery a:hover .media_thumb { -webkit-transform:scale3d(1.1, 1.1, 1.1); transform:scale3d(1.1, 1.1, 1.1); }
.lightgallery a { display:inherit; overflow:hidden; position:relative; z-index: 9; width:100%; height:100%; }
.lightgallery a:before {
display:block; content:""; position:absolute; width:100%; height:100%; background-color:rgba(0, 0, 0, 0); -webkit-transition:background-color 0.15s ease 0s; -o-transition:background-color 0.15s ease 0s; transition:background-color 0.15s ease 0s; z-index:190; }
.lightgallery a:after {
font:normal 24px/1 FontAwesome; color:#ffffff; content:"\f002"; width:24px; height:24px; line-height:24px; position:absolute; margin-left:-12px; margin-top:-12px; left:50%; top:50%; opacity:0; -webkit-transition:opacity 0.3s ease 0s; -o-transition:opacity 0.3s ease 0s; transition:opacity 0.3s ease 0s; z-index:200; }
.lightgallery a:hover:before { background-color:rgba(0, 0, 0, 0.4); }
.lightgallery a:hover:after { opacity:1; }
.lightgallery.image_hide a:hover:before { display:none; }
.lightgallery.image_hide a:hover:after { display:none; }
.lg-backdrop { z-index:2040!important; }
.lg-outer { z-index:2050!important; }
.lg-icon { font-family: feather!important; }
.lg-toolbar .lg-close:after { content: "\e8f6"; }
.lg-toolbar .lg-download:after { content: "\e864"; }
.lg-autoplay-button:after { content: "\e8ae"; }
.lg-show-autoplay .lg-autoplay-button:after { content: "\e8cb"; }
.lg-fullscreen:after { content: "\e908"; }
.lg-fullscreen-on .lg-fullscreen:after { content: "\e88d"; }
#lg-zoom-in:after { content: "\e8f9"; }
#lg-zoom-out:after { content: "\e8fa"; }
#lg-actual-size:after { content: "\e855"; }
.lg-outer #lg-share:after { content: "\e8c0"; }
.lg-outer .lg-dropdown .lg-icon { font-family: FontAwesome!important; }
.lg-outer #lg-share-facebook .lg-icon:after { content: "\f082"; }
.lg-outer #lg-share-twitter .lg-icon:after { content: "\f081"; }
.lg-outer #lg-share-googleplus .lg-icon:after { content: "\f0d4"; }
.lg-outer #lg-share-pinterest .lg-icon:after { content: "\f0d3"; }
.lg-actions .lg-prev:after { content: "\e843"; }
.lg-actions .lg-next:before { content: "\e844"; }
.lg-outer .lg-thumb-item { border: 3px solid #FFF; border:0; border-radius: 0px; opacity:0.5; -webkit-transition:opacity 0.3s ease 0s; -o-transition:opacity 0.3s ease 0s; transition:opacity 0.3s ease 0s; }
.lg-outer .lg-thumb-item:hover { /*border-color: #2f286d;*/ border:0; opacity:1; }
.lg-outer .lg-thumb-item.active { /*border-color: #76ce76;*/ border:0; opacity:1; }
ul#lightGallery { list-style: none; margin:0px; padding:0px; }
ul#lightGallery li { margin:0px; padding:0px; border:2px solid #ffffff; cursor:pointer; width:100%; height:180px; z-index: 9; display: flex!important; overflow: hidden; position: relative; justify-content: center; align-items: center; }
ul#lightGallery li:before { display:block; content:""; position:absolute; width:100%; height:100%; background-color:rgba(0, 0, 0, 0); -webkit-transition:background-color 0.15s ease 0s; -o-transition:background-color 0.15s ease 0s; transition:background-color 0.15s ease 0s; z-index:190; }
ul#lightGallery li:after { font:normal 24px/1 FontAwesome; color:#ffffff; content:"\f002"; width:24px; height:24px; line-height:24px; position:absolute; margin-left:-12px; margin-top:-12px; left:50%; top:50%; opacity:0; -webkit-transition:opacity 0.3s ease 0s; -o-transition:opacity 0.3s ease 0s; transition:opacity 0.3s ease 0s; z-index:200; }
ul#lightGallery li:hover img { -webkit-transform:scale3d(1.1, 1.1, 1.1); transform:scale3d(1.1, 1.1, 1.1); }
ul#lightGallery li img { -webkit-transition:-webkit-transform 0.15s ease 0s; -moz-transition:-moz-transform 0.15s ease 0s; -o-transition:-o-transform 0.15s ease 0s; transition:transform 0.15s ease 0s; -webkit-transform:scale3d(1, 1, 1); transform:scale3d(1, 1, 1); width: auto; height: auto; flex-shrink: 0; min-width: 100%; min-height: 100%; max-width:200px; object-fit: cover; }
ul#lightGallery li:hover:before { background-color:rgba(0, 0, 0, 0.4); }
ul#lightGallery li:hover:after { opacity:1; }
ul#lightGallery li a { width:100%; height:100%; }
/* pagination */
.dataTables_wrapper .dataTables_paginate { width:100%; margin:0px; border-left:1px solid #e5e6e7; border-right:1px solid #e5e6e7; border-bottom:1px solid #e5e6e7; height:auto; }
.pagination { border-radius: 0rem; margin:0px; }
div.dataTables_wrapper div.dataTables_paginate ul.pagination { margin-top: 0rem; padding-bottom: 0px; margin: 0px 0;}
.pagination .page-item { border-radius: 0rem; border-left: 1px solid #e5e6e7; }
.pagination .page-item .page-link { border-radius: 0rem; color:#626262; background-color: #ffffff; border-color: #e5e6e7; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); padding: 0rem 0.9rem; }
.pagination .page-item.active .page-link { border-radius: 0rem; color:#626262; background-color: #f4f4f4; border-color: #e5e6e7; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }
.pagination .page-item:last-child:not(.next-item) .page-link { border-top-right-radius: 0rem; border-bottom-right-radius: 0rem; }
.pagination .page-item:first-child:not(.prev-item) .page-link { border-top-left-radius: 0rem; border-bottom-left-radius: 0rem; }
.pagination .page-item.prev-item .page-link, .pagination .page-item.next-item .page-link, .pagination .page-item.first .page-link, .pagination .page-item.last .page-link { color: inherit; }
.pagination .page-item .page-link:hover { color: #2f286d; }
/*.pagination .page-item.disabled { display:none; }*/
.pagination .page-item.disabled .page-link { color: #e5e6e7; }
.pagination .page-item.first.disabled .page-link { color: #e5e6e7; }
.pagination .page-item.last.disabled .page-link { color: #e5e6e7; }
.pagination .page-item.first a, .pagination .page-item.previous a, .pagination .page-item.next a, .pagination .page-item.last a { display: table-cell; width: 36px; line-height: 36px; text-indent: -9999px; overflow: hidden; text-overflow: ellipsis; }
.pagination > li.first > a:after, .pagination > li.first > span:after { content: "\f100"; font: normal 20px FontAwesome; padding: 0px 0px 0px 30px; line-height: 36px; }
.pagination > li.previous > a:after, .pagination > li.previous > span:after { content: "\f104"; font: normal 20px FontAwesome; padding: 0px 2px 0px 30px; line-height: 36px; }
.pagination > li.next > a:after, .pagination > li.next > span:after, .pagination .page-item.next .page-link:after { content: "\f105"; font: normal 20px FontAwesome; padding: 0px 0px 0px 30px; line-height: 36px; }
.pagination > li.last > a:after, .pagination > li.last > span:after, .pagination .page-item.last .page-link:after { content: "\f101"; font: normal 20px FontAwesome; padding: 0px 0px 0px 30px; line-height: 36px; }
.pagination .page-item:not(.prev-item) .page-link, .pagination .page-item:not(.next-item) .page-link, .pagination .page-item:not(.first) .page-link, .pagination .page-item:not(.last) .page-link, .pagination .page-item:not(.active) .page-link { line-height: 36px; font-weight:400; font-size:15px; }
@media only screen and (max-width: 768px) {
.pagination .page-item:last-child { border-right: 1px solid #e5e6e7; }
.pagination .page-item .page-link { padding: 0rem 0.7rem; }
.pagination .page-item.first a, .pagination .page-item.previous a, .pagination .page-item.next a, .pagination .page-item.last a { width: 30px; text-indent: -60px; }
.pagination .page-item.previous a { text-indent: -110px; }
}
.table-responsive { position: relative; min-height: 160px !important; } /* min height for no result message */
/* no record handle */
table.dataTable p.no_record { padding:20px 20px 30px 20px!important; margin:0px; }
div.no_record_template { display:none; }
table.dataTable td.dataTables_empty { width:100%; }
table.dataTable.table-hover.empty tbody tr:hover { background-color:transparent; border-top:0px; border-bottom:0px; }
table.dataTable.empty { height:100%; position: absolute; } /* if set absolute, need to set min height for table responsive for no result */
table.dataTable.empty tbody { height:100%; }
table.dataTable.empty tbody tr { height:100%; }
table.dataTable.empty tr:hover { background-color:transparent!important; border-top:0px; border-bottom:0px; }
table.dataTable.empty td { background-color:transparent; border-top:0px; border-bottom:0px; }
table.dataTable.empty td:hover { background-color:transparent; border-top:0px; border-bottom:0px; }
table.dataTable.empty tbody tr:hover td.dtfc-fixed-left { background-color:transparent!important; }
table.dataTable.empty tbody tr:hover td.dtfc-fixed-right { background-color:transparent!important; }
table.dataTable.empty thead { display:none; }
/*table.dataTable.empty { display:none; }
table.dataTable.empty + .no_record_template { display:block; }*/
/* fund select template */
table.fund_select_template { display:none; }
/* event time group */
.event_time_btn { max-width:65px; margin-left:-10px;}
.event_time { width:calc(100% - 65px); }
.event_time_template { display:none; }
.event_time_group .action_col span { position:relative; top:5px; }
/* check box and radio button */
.myCheck { display:inline-block; max-width:100%; margin-bottom:5px; font-weight:normal; cursor:pointer; }
.myCheck input { display:none; }
.myCheck span.details_input:before { color:#76ce76; font:normal 24px/1 FontAwesome; content:"\f10C"; width:24px; height:24px; line-height:24px; position:relative; top:3px; }
.myCheck input:checked + span.details_input:before { content:"\f058"; }
.myCheck_x input:checked + span.details_input:before { content:"\f057"; }
.myCheck.minus span.details_input:before { content:"\f056"; }
.check_col .myCheck { margin-bottom:0px; }
.check_col .myCheck span.details_input:before { top:0px; }
.check_col label.myCheck, .multiple_function_row label.myCheck { font-size: 0.85rem; padding-left: 0rem; }
.myCheck input:disabled ~ span:before { color:#cccccc; cursor:default; }
.myRadio { display:inline-block; max-width:100%; margin-bottom:5px; font-weight:normal; cursor:pointer; }
.myRadio input { display:none; }
.myRadio span.details_input:before { color:#76ce76; font:normal 24px/1 FontAwesome; content:"\f10C"; width:24px; height:24px; line-height:24px; position:relative; top:3px; }
.myRadio input:checked + span.details_input:before { content:"\f058"; }
label.error { margin-left:0px; }
.myRadio.error input:checked + span.details_input:before { color:#96172e; margin-left:0px; content:"\f057"; }
.custom-control-input:not(:disabled):active ~ .custom-control-label::before { background-color: #2f286d; border-color: #2f286d; }
.custom-control-input:checked ~ .custom-control-label::before { color: #FFFFFF; border-color: #2f286d; background-color: #2f286d; }
.custom-control-input:focus ~ .custom-control-label::before { box-shadow : 0 3px 10px 0 rgba(0, 0, 0, 0); }
.custom-control-input:focus:not(:checked) ~ .custom-control-label::before { border-color : #2f286d; }
.custom-switch .custom-control-input:disabled:checked ~ .custom-control-label::before { background-color: rgba(64, 48, 209, 0.5); }
/*.list-unstyled { display: flex; }*/
.list-unstyled li { /*margin-right: 1rem !important;*/ white-space: nowrap; }
.vs-checkbox-primary input:checked ~ .vs-checkbox { border-color: #2f286d !important; }
.vs-checkbox-primary input:active:checked + .vs-checkbox .vs-checkbox--check { background-color: #2f286d !important; }
.vs-checkbox-con .vs-checkbox { border-width: 1px; border-style: solid; border-color: #D9D9D9; border-radius: 0px; }
.vs-checkbox-primary input:checked ~ .vs-checkbox .vs-checkbox--check { background-color: #2f286d !important; }
.vs-checkbox-con { margin: 0px 0 0px 0; padding: 8px 8px 8px 8px;}
.vs-checkbox-con:hover { background-color:rgba(64, 48, 209, 0.15); }
.vs-checkbox-con input { padding: 10px 0; margin-left: -10px; }
.vs-checkbox-con input:hover ~ .vs-checkbox { border-color: #2f286d; }
.custom-radio { margin: 0px 0 0px 0; padding: 8px 8px 8px 28px; cursor:pointer; }
.custom-radio:hover { background-color:rgba(64, 48, 209, 0.15); }
.custom-radio input { padding: 10px 0; position:absolute; width:100%; height:100%; top: 0px; left: 0px; z-index: 100; }
.custom-radio input:hover ~ .vs-checkbox { border-color: #2f286d; }
.custom-radio .custom-control-label::before, .custom-control-label::after { width: 1.143rem; height: 1.143rem; top: 0.2rem; }
.custom-radio:hover .custom-control-label::before { border: #2f286d solid 1px; }
.input-group-text { border-radius: 0px; border: 1px solid #D9D9D9; }
/* dropzone - single image style */
.dz_init, .dz_template { display:none; }
.dropzone.single_image { min-height: 250px; margin:0px auto; border: 1px dashed #D9D9D9; background: #F8F8F8; border-radius:0px; padding:0px; cursor:pointer; position:relative; }
.dropzone.single_image .dz-message:before { display:none; }
.dropzone.single_image .dz-message { text-align:center; font-size:24px; top:0px; color: #444444; padding: 1.25rem; margin-top: 0px; margin-bottom: 0px; height: 100%; width:100%; left:0px; margin:0px; }
.dropzone.single_image.dz-started .dz-message { opacity:0; display:none; }
.dropzone.single_image .upload_container { /*display: table-cell; width: 100%; height: 100%;*/ line-height: 20px; font-weight: bold; vertical-align: middle; margin-left: auto; margin-right: auto; }
.dropzone.single_image .upload_container:before { content: '\f093'; font-family: 'FontAwesome'; font-size: 40px; color: #2f286d; }
.dropzone.single_image .upload_container div { font-size:24px; line-height:30px; padding-top:20px; }
.dropzone.single_image .upload_container div.remarks { font-weight:normal; font-size:13px; line-height:20px; padding-top:10px; }
.dropzone.single_image .upload_container img.icon_upload{ width:86px; height:86px; }
.dropzone.single_image .dz-image img { width:100%; height:auto; max-width:inherit; }
.dropzone.single_image .dz-image video { width:100%!important; height:auto!important; max-width:inherit; max-height: 514px; display: inherit; z-index:50; margin: 0px auto; }
.dropzone.single_image .dz-preview { position: relative; min-height:250px; margin: 0px; padding: 0px; border: 0px; box-shadow: none; display:block; }
.dropzone.single_image .dz-preview.dz-success:hover .dz-remove { opacity:0.5; margin:0px; }
.dropzone.single_image .dz-preview .dz-progress { opacity:1; text-indent:-9999px; position:absolute; width:100%; height:100%; min-height:200px; top:0px; left:0px; background-color:rgba(0,0,0, 0.5); }
/*.dropzone.single_image .dz-preview .dz-progress .dz-loading { opacity:1; text-indent:0; position:absolute; width:100%; height:100%; min-height:200px; top:50%; margin-top:-30px; left:0px; background-color:rgba(0,0,0, 0.5); }*/
.dropzone.single_image .dz-preview.dz-success .dz-progress {
opacity:0; -webkit-transition:opacity 0.4s ease-in; -moz-transition:opacity 0.4s ease-in; -ms-transition:opacity 0.4s ease-in; -o-transition:opacity 0.4s ease-in; transition:opacity 0.4s ease-in; }
.dropzone.single_image .dz-preview .dz-upload-info { opacity:0; }
.dropzone.single_image .dz-preview.dz-image-preview .dz-upload-info { opacity:1 ; display:block; width:70%; height:60px; margin:-30px auto; top:50%; position:absolute; left:15%; }
.dropzone.single_image .dz-preview.dz-file-preview .dz-upload-info { opacity:1 ; display:block; width:70%; height:60px; margin:-30px auto; top:50%; position:absolute; left:15%; }
.dropzone.single_image .dz-preview .dz-image { opacity:0; }
.dropzone.single_image .dz-preview.dz-success .dz-image { opacity:1; }
.dropzone.single_image .dz-upload { display:block; width:100%; background-color:rgba(255,255,255, 0.3); height:20px; bottom:0px; position:absolute; left:0px; border-radius:10px; overflow: hidden; }
.dropzone.single_image .dz-upload-bar { display:block; width:100%; background-color:rgba(255,255,255, 0.7); height:20px; bottom:0px; position:absolute; left:0px; border-radius:0px; }
.dropzone.single_image .dz-upload-text { text-indent:0px; display:block; position:absolute; top:0px; left:0px; color:#cccccc; font-size:24px; width:100%; height:30px; line-height:30px; text-align:center; }
.dropzone.single_image .dz-remove { opacity:0; text-indent:-9999px; position:absolute; width:60px; height:60px; /*min-height:200px;*/ top:0px; right:0px; background-color:rgba(0,0,0, 0.5); background-image: none; border: 0px; margin: 0px; cursor: pointer; }
.dropzone.single_image .dz-remove:before, .dz-remove:after { position:absolute; top:50%; left:50%; margin-top:-25px; margin-left:-4px; content:' '; height:50px; width:8px; background-color:transparent; border-radius:0px; }
.dropzone.single_image .dz-remove:before { /*transform:rotate(45deg);*/ }
.dropzone.single_image .dz-remove:after { /*transform:rotate(-45deg);*/ }
.dropzone.single_image .dropzone-choose { width:100%; height:100%; }
.dropzone .dz-default.dz-message span, .dropzone .dz-default.dz-message button { display:table!important; width:100%; height:100%; border:0px; background:transparent; padding:0px; }
/* newer version */
/* dropzone - single image style */
.dz_init, .dz_template { display:none; }
.dropzone.single_image { min-height:inherit; margin:0px auto; border: 1px dashed #D9D9D9; background: #F8F8F8; border-radius:0px; padding:0px; cursor:pointer; position:relative; }
.dropzone.single_image .dz-message:before { display:none; }
.dropzone.single_image .dz-message { position:relative; text-align:center; font-size:24px; top:0px; color: #444444; padding: 50px 1.25rem; margin-top: 0px; margin-bottom: 0px; height: 100%; width:100%; left:0px; margin:0px; background-color: #ffffff; }
.dropzone.single_image.dz-started .dz-message { opacity:0; display:none; }
.dropzone.single_image .upload_container { /*display: table-cell; width: 100%; height: 100%;*/ line-height: 20px; font-weight: bold; vertical-align: middle; margin-left: auto; margin-right: auto; }
/*.dropzone.single_image .upload_container:before { content: '\f093'; font-family: 'FontAwesome'; font-size: 40px; color: #2f286d; }*/
.dropzone.single_image .upload_container svg { width:40px; height:40px; color:#009688; }
.dropzone.single_image .upload_container div { font-size:24px; line-height:30px; padding-top:20px; }
.dropzone.single_image .upload_container div.remarks { font-weight:normal; font-size:13px; line-height:20px; padding-top:10px; }
.dropzone.single_image .upload_container img.icon_upload{ width:86px; height:86px; }
.dropzone.single_image .dz-image img { width:100%; height:auto; max-width:inherit; }
.dropzone.single_image .dz-image video { width:100%!important; height:auto!important; max-width:inherit; max-height: 514px; display: inherit; z-index:50; margin: 0px auto; }
.dropzone.single_image .dz-preview { position: relative; min-height:200px!important; margin: 0px; padding: 0px; border: 0px; box-shadow: none; display:block; }
.dropzone.single_image .dz-success { min-height:inherit!important; }
.dropzone.single_image .dz-processing { /*in-height:inherit!important;*/ min-height:200px!important; }
.dropzone.single_image .dz-complete { min-height:inherit!important; }
.dropzone.single_image .dz-image-preview { min-height:inherit!important; }
.dropzone.single_image .dz-preview .dz-progress { opacity:1; text-indent:-9999px; position:absolute; width:100%; height:100%; min-height:100%; top:0px; left:0px; background-color:rgba(0,0,0, 0.5); }
/*.dropzone.single_image .dz-preview .dz-progress .dz-loading { opacity:1; text-indent:0; position:absolute; width:100%; height:100%; min-height:200px; top:50%; margin-top:-30px; left:0px; background-color:rgba(0,0,0, 0.5); }*/
.dropzone.single_image .dz-preview.dz-success .dz-progress {
opacity:0; -webkit-transition:opacity 0.4s ease-in; -moz-transition:opacity 0.4s ease-in; -ms-transition:opacity 0.4s ease-in; -o-transition:opacity 0.4s ease-in; transition:opacity 0.4s ease-in; margin:0px; border-radius:0px; }
.dropzone.single_image .dz-preview .dz-upload-info { opacity:0; }
.dropzone.single_image .dz-preview.dz-image-preview .dz-upload-info { opacity:1 ; display:block; width:70%; height:60px; margin:-30px auto; top:50%; position:absolute; left:15%; }
.dropzone.single_image .dz-preview.dz-file-preview .dz-upload-info { opacity:1 ; display:block; width:70%; height:60px; margin:-30px auto; top:50%; position:absolute; left:15%; }
.dropzone.single_image .dz-preview .dz-image { opacity:0; }
.dropzone.single_image .dz-preview.dz-success .dz-image { opacity:1; border-radius:0rem; width:100%; height:auto; }
.dropzone.single_image .dz-upload { display:block; width:100%; background-color:rgba(255,255,255, 0.3); height:20px; bottom:0px; position:absolute; left:0px; border-radius:10px; overflow: hidden; }
.dropzone.single_image .dz-upload-bar { display:block; width:100%; background-color:rgba(255,255,255, 0.7); height:20px; bottom:0px; position:absolute; left:0px; border-radius:0px; }
.dropzone.single_image .dz-upload-text { text-indent:0px; display:block; position:absolute; top:0px; left:0px; color:#cccccc; font-size:24px; width:100%; height:30px; line-height:30px; text-align:center; }
.dropzone.single_image .dropzone-choose { opacity:0; position:absolute; width:60px; height:60px; margin:0px; background-color:rgba(0,0,0, 0.5); background-image: none; border: 0px; margin: 0px; cursor: pointer; -webkit-transition:opacity 0.4s ease-in; -moz-transition:opacity 0.4s ease-in; -ms-transition:opacity 0.4s ease-in; -o-transition:opacity 0.4s ease-in; transition:opacity 0.4s ease-in; top: 50%!important; left: calc(50% - 100px)!important; /* top:10px; right:80px; */ margin-top:-30px!important; z-index:1; }
.dropzone.single_image .dz-preview.dz-success:hover .dropzone-choose { opacity: 0.8; }
.dropzone.single_image .dz-preview.dz-success:hover .dropzone-choose:hover { opacity: 1; }
.dropzone.single_image .dropzone-choose:before { content:"1"; text-indent:-9999px; display:inline-block; width:40px; height:40px; position: absolute; margin-top: -20px; top: 50%; left: 50%; margin-left: -20px; background-image: url("data:image/svg+xml,"); background-size:100% auto; filter: invert(100%) sepia(100%) saturate(1%) hue-rotate( 46deg) brightness(105%) contrast(101%); opacity:0.7; -webkit-transition:opacity 0.4s ease-in; -moz-transition:opacity 0.4s ease-in; -ms-transition:opacity 0.4s ease-in; -o-transition:opacity 0.4s ease-in; transition:opacity 0.4s ease-in; }
.dropzone.single_image .dropzone-choose:hover:before { opacity:1; }
.dropzone.single_image .dropzone-crop { opacity:0; position:absolute; width:60px; height:60px; margin:0px; background-color:rgba(0,0,0, 0.5); background-image: none; border: 0px; margin: 0px; cursor: pointer; -webkit-transition:opacity 0.4s ease-in; -moz-transition:opacity 0.4s ease-in; -ms-transition:opacity 0.4s ease-in; -o-transition:opacity 0.4s ease-in; transition:opacity 0.4s ease-in; top: 50%!important; left: calc(50% - 30px)!important; margin-top:-30px!important; z-index:1; }
.dropzone.single_image .dz-preview.dz-success:hover .dropzone-crop { opacity: 0.8; }
.dropzone.single_image .dz-preview.dz-success:hover .dropzone-crop:hover { opacity: 1; }
.dropzone.single_image .dropzone-crop:before { content:"1"; text-indent:-9999px; display:inline-block; width:40px; height:40px; position: absolute; margin-top: -20px; top: 50%; left: 50%; margin-left: -20px; background-image: url("data:image/svg+xml,"); background-size:100% auto; filter: invert(100%) sepia(100%) saturate(1%) hue-rotate( 46deg) brightness(105%) contrast(101%); opacity:0.7; -webkit-transition:opacity 0.4s ease-in; -moz-transition:opacity 0.4s ease-in; -ms-transition:opacity 0.4s ease-in; -o-transition:opacity 0.4s ease-in; transition:opacity 0.4s ease-in; }
.dropzone.single_image .dropzone-crop:hover:before { opacity:1; }
.dropzone.single_image .dz-remove { opacity:0; text-indent:-9999px; position:absolute; width:60px; height:60px; margin:0px; background-color:rgba(0,0,0, 0.5); background-image: none; border: 0px; margin: 0px; cursor: pointer; -webkit-transition:opacity 0.4s ease-in; -moz-transition:opacity 0.4s ease-in; -ms-transition:opacity 0.4s ease-in; -o-transition:opacity 0.4s ease-in; transition:opacity 0.4s ease-in; overflow:hidden; top: 50%!important; left: calc(50% + 40px)!important; margin-top: -30px!important; z-index:1; border-radius: 0px; }
#text_file .dz-remove { left: 50%!important; margin-left: -30px!important; }
#csv_file .dz-remove { left: 50%!important; margin-left: -30px!important; }
.dropzone.single_image .dz-preview.dz-success:hover .dz-remove { opacity:0.8; }
.dropzone.single_image .dz-preview.dz-success:hover .dz-remove:hover { opacity: 1; }
.dropzone.single_image .dz-remove:before { content:"1"; text-indent:-9999px; display:inline-block; width:40px; height:40px; position: absolute; margin-top: -20px; top: 50%; left: 50%; margin-left: -20px; background-image: url("data:image/svg+xml,"); background-size:100% auto; filter: invert(100%) sepia(100%) saturate(1%) hue-rotate( 46deg) brightness(105%) contrast(101%); opacity:0.7; -webkit-transition:opacity 0.4s ease-in; -moz-transition:opacity 0.4s ease-in; -ms-transition:opacity 0.4s ease-in; -o-transition:opacity 0.4s ease-in; transition:opacity 0.4s ease-in; }
.dropzone.single_image .dz-remove:hover:before { opacity:1; }
.dropzone.single_image .dz-remove:after { content: ""; display:none; }
.dropzone.single_image .dz-preview.dz-success:before { opacity:0; position: absolute; width:100%; height:100%; content:" "; background-color:rgba(255, 255, 255, 0.6); display:block; -webkit-transition:opacity 0.4s ease-in; -moz-transition:opacity 0.4s ease-in; -ms-transition:opacity 0.4s ease-in; -o-transition:opacity 0.4s ease-in; transition:opacity 0.4s ease-in; }
.dropzone.single_image .dz-preview.dz-success:hover:before { opacity:1; }
.dropzone .dz-default.dz-message span, .dropzone .dz-default.dz-message button { display:table!important; width:100%; height:100%; border:0px; background:transparent; padding:0px; }
.dropzone .convert-overlay { position: absolute; top: 0; left: 0; right: 0; height: 100%; background-color: rgba(34, 41, 47, 0.5); display:flex; visibility: hidden; opacity: 0; transition: all 0.5s ease; z-index:-1; }
.dropzone .convert-overlay .spinner-border { height: 4vw; width: 4vw; margin:auto; }
.dropzone.converting .convert-overlay { opacity: 1; visibility: visible; z-index: 10; }
.dropzone ~ .help-block .danger { color: #EA5455; font-size: 0.875rem; padding-top: 0.2rem; }
/* dropzone multiple */
.dropzone.multiple_images .dz-preview { width:10%; height:80px; float:left; border:2px solid #ffffff;}
.dropzone.multiple_images .dz-preview img { width:100%; height:auto; flex-shrink:cover; }
.dropzone.multiple_images { min-height: 250px; margin:0px auto; border: 1px dashed #D9D9D9; background: #F8F8F8; border-radius:0px; padding:1rem; cursor:pointer; position:relative; }
.dropzone.multiple_images .dz-message:before { display:none; }
.dropzone.multiple_images .dz-message { text-align:center; font-size:24px; top:0px; color: #444444; padding: 1.25rem; margin-top: 0px; margin-bottom: 0px; height: 100%; width:100%; left:0px; margin:0px; }
.dropzone.multiple_images.dz-started .dz-message { opacity:0; display:none; }
.dropzone.multiple_images .upload_container { /*display: table-cell; width: 100%; height: 100%;*/ line-height: 20px; font-weight: bold; vertical-align: middle; margin-left: auto; margin-right: auto; }
.dropzone.multiple_images .upload_container:before { content: '\f093'; font-family: 'FontAwesome'; font-size: 40px; color: #2f286d; }
.dropzone.multiple_images .upload_container div { font-size:24px; line-height:30px; padding-top:20px; }
.dropzone.multiple_images .upload_container div.remarks { font-weight:normal; font-size:13px; line-height:20px; padding-top:10px; }
.dropzone.multiple_images .upload_container img.icon_upload{ width:86px; height:86px; }
.dropzone.multiple_images .dz-image img { width:100%; height:auto; max-width:inherit; }
.dropzone.multiple_images .dz-image video { width:100%!important; height:auto!important; max-width:inherit; max-height: 514px; display: inherit; z-index:50; margin: 0px auto; }
.dropzone.multiple_images .dz-preview { position:relative; height:100%; }
.dropzone.multiple_images .dz-preview.dz-success:hover .dz-remove { opacity:0.5; }
.dropzone.multiple_images .dz-preview .dz-progress { opacity:1; /*text-indent:-9999px;*/ position:absolute; width:100%; height:100%; /*min-height:200px;*/ top:0px; left:0px; background-color:rgba(0,0,0, 0.5); }
.dropzone.multiple_images .dz-preview.dz-success .dz-progress {
opacity:0; -webkit-transition:opacity 0.4s ease-in; -moz-transition:opacity 0.4s ease-in; -ms-transition:opacity 0.4s ease-in; -o-transition:opacity 0.4s ease-in; transition:opacity 0.4s ease-in; }
.dropzone.multiple_images .dz-preview .dz-upload-info { opacity:0; }
.dropzone.multiple_images .dz-preview.dz-image-preview .dz-upload-info { opacity:1 ; display:block; width:70%; height:60px; margin:-30px auto; top:50%; position:absolute; left:15%; }
.dropzone.multiple_images .dz-preview.dz-file-preview .dz-upload-info { opacity:1 ; display:block; width:70%; height:60px; margin:-30px auto; top:50%; position:absolute; left:15%; }
.dropzone.multiple_images .dz-preview .dz-image { opacity:0; }
.dropzone.multiple_images .dz-preview.dz-success .dz-image { opacity:1; }
.dropzone.multiple_images .dz-upload { display:block; width:100%; background-color:rgba(255,255,255, 0.3); /*height:20px; bottom:0px; position:absolute; left:0px;*/ border-radius:10px; overflow: hidden; }
.dropzone.multiple_images .dz-upload-bar { display:block; width:100%; background-color:rgba(255,255,255, 0.7); height:20px; bottom:0px; position:absolute; left:0px; border-radius:0px; }
.dropzone.multiple_images .dz-upload-text { text-indent:0px; display:block; position:absolute; top:0px; left:0px; color:#cccccc; font-size:24px; width:100%; height:30px; line-height:30px; text-align:center; }
.dropzone.multiple_images .dz-remove { opacity:0; text-indent:-9999px; position:absolute; width:100%; height:100%; /*min-height:200px;*/ top:0px; right:0px; background-color:rgba(0,0,0, 0.5); }
.dropzone.multiple_images .dz-remove:before, .dz-remove:after { position:absolute; top:50%; left:50%; margin-top:-25px; margin-left:-4px; content:' '; height:50px; width:8px; background-color:#ffffff; border-radius:4px; }
.dropzone.multiple_images .dz-remove:before { transform:rotate(45deg); }
.dropzone.multiple_images .dz-remove:after { transform:rotate(-45deg); }
.dropzone.multiple_images .dropzone-choose { width:100%; height:100%; }
/* dropzone audio preview */
.dropzone.single_image .dz-audio { position:absolute; width:100%; height:54px; margin-top:-27px; top:50%; border: 0px; }
.dropzone .dz-audio audio { width:90%; display:block; margin:auto; }
audio::-webkit-media-controls-panel { }
audio::-webkit-media-controls-mute-button { }
audio::-webkit-media-controls-play-button { }
audio::-webkit-media-controls-timeline-container { }
audio::-webkit-media-controls-current-time-display { /*display: none;*/}
audio::-webkit-media-controls-time-remaining-display { display: none; }
audio::-webkit-media-controls-timeline { }
audio::-webkit-media-controls-volume-slider-container { }
audio::-webkit-media-controls-volume-slider { }
audio::-webkit-media-controls-seek-back-button { }
audio::-webkit-media-controls-seek-forward-button { }
audio::-webkit-media-controls-fullscreen-button { }
audio::-webkit-media-controls-rewind-button { }
audio::-webkit-media-controls-return-to-realtime-button { }
audio::-webkit-media-controls-toggle-closed-captions-button { }
/* summernote */
.note-editor.note-airframe .note-status-output, .note-editor.note-frame .note-status-output { display: none; }
.note-editor.note-airframe .note-editing-area, .note-editor.note-frame .note-editing-area { background-color: #ffffff; }
.note-modal .modal-dialog { box-shadow:none; }
.note-editor.card { box-shadow:none; border-radius:0px; }
.note-editor .note-toolbar { display:block; }
.note-editor.note-frame .note-status-output { display:none; }
/*.note-editor .btn { padding:10px 15px; }
.note-editor .dropdown-toggle::after { display:none; }
.note-editor .dropdown-toggle .note-icon-caret:before { margin-left:6px; }
.note-editor .panel-heading.note-toolbar .dropdown-menu { margin-top:0px; border-radius: 0px; }
.note-editor .panel-heading.note-toolbar .note-style .dropdown-menu { padding:10px; width: max-content; }
.note-editor .panel-heading.note-toolbar .note-style .dropdown-menu > li:hover { background-color:#f0f0f0; }
.note-editor .panel-heading.note-toolbar .note-style .dropdown-menu > li { padding:8px 10px; }
.note-editor .panel-heading.note-toolbar .note-style p { margin:0px; }*/
.note-editor h4, .note-editor h5, .note-editor h6 { margin-top:0px; margin-bottom:0px; }
.note-editor .modal { z-index:6500!important; }
.note-editor .modal.show { display:flex!important; padding:0px!important; }
.note-editor .modal.show .modal-dialog { transform: none; margin:auto; width:95vw; max-width:480px; }
/* 20241009 add these 2 lines*/
.note-modal.show .modal-dialog { transform: none; margin:auto; width:95vw; max-width:480px; }
.note-modal .note-group-image-url { display:none; }
.note-editor .modal .modal-content { border-radius:0px; }
.note-editor .modal .modal-header { border-radius:0px; position:relative; }
.note-editor .modal .modal-header .close { padding: 0.2rem 0.62rem; box-shadow: 0 0px 0px 0 rgb(34 41 47 / 0%); border-radius:0px; background-color:transparent; opacity: 1; transition: all 0.23s ease 0.1s; position:absolute; transform:none; top:24px; right:24px; }
.note-editor .modal .modal-header .modal-title { line-height:40px; font-weight:bold; }
.note-editor .modal .modal-footer { border-radius:0px; }
.note-editor .modal .modal-footer .note-btn-primary { border-radius:0px!important; }
.note-editor .modal .checkbox { position:relative; line-height:22px; padding-top:10px; padding-bottom:10px; padding-left:0px; }
.note-editor .modal .checkbox label { position:relative; cursor:pointer; padding-left:32px; }
.note-editor .modal .checkbox input[type="checkbox"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; padding: 0px 30px 0px 0px; border-radius:0px; text-align: center; margin:0px; position: absolute; left: 0px; }
.note-editor .modal .checkbox input[type="checkbox"]:before { content:" "; display:block; border:1px solid #D9D9D9; background-color:#ffffff; width:24px; height:24px; position:absolute; top:0px; left:0px; }
.note-editor .modal .checkbox input[type="checkbox"]:after { content:" "; display:block; width:16px; height:16px; position:absolute; top:4px; left:4px; display:inline-block; background-image:none; background-size:100% auto; filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(288deg) brightness(102%) contrast(102%); }
.note-editor .modal .checkbox input[type="checkbox"]:checked:before { background-color:#2f286d; }
.note-editor .modal .checkbox input[type="checkbox"]:checked:after { background-image: url("data:image/svg+xml,"); }
.note-popover.popover { display: none; }
.note-link-popover { border-radius:0px; }
.note-link-popover .popover-content { padding:5px 10px; }
.note-link-popover .popover-content > .btn-group { margin:0px; }
.note-popover .btn { padding:10px; }
/* 20241009 revise this */
.note-form-group .note-image-input { text-indent: -9999px; display: block; color: #5F5F5F; border: 1px solid #D9D9D9; border-radius:0px; display: block; width: 100%; height: calc(1.25em + 1.4rem + 1px); padding: 0.7rem 0.7rem; font-size: 0.96rem; font-weight: 400; line-height: 1.25; background-color: #FFFFFF; background-clip: padding-box; -webkit-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; -webkit-box-shadow:none; box-shadow:none; }
.note-editor .form-control { color: #5F5F5F; border: 1px solid #D9D9D9; border-radius:0px; display: block; width: 100%; height: calc(1.25em + 1.4rem + 1px); padding: 0.7rem 0.7rem; font-size: 0.96rem; font-weight: 400; line-height: 1.25; background-color: #FFFFFF; background-clip: padding-box; -webkit-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; -webkit-box-shadow:none; box-shadow:none; }
.note-editor .form-control:focus { border-color:#2f286d; color:#000000; outline: 0; -webkit-box-shadow:none; box-shadow:none; }
.note-editor.note-frame.card { margin-bottom:0px; }
.note-editor.note-frame.card.fullscreen { margin-bottom:0px; z-index: 8000; }
/* cropper */
#modal_crop.show { height:100%; width:100%; margin: 0px; display: block!important; padding: 0px!important; overflow: hidden; }
/*#modal_crop { height:100vh; width:100vw; margin: 0px; display: none!important; padding: 0px!important; overflow: hidden; }
#modal_crop.show { display: block!important; }*/
#modal_crop .modal-dialog { height:100%; width:100%; max-width:inherit; margin: 0px; padding: 0px!important; }
#modal_crop .modal-dialog .modal-content { height:100%; width:100%; max-width:inherit; margin: 0px; padding: 0px!important; }
#modal_crop .modal-body { height:calc(100% - 62px - 69px); max-height:inherit; padding: 0px!important; overflow-y:hidden; }
#modal_crop .img-container { height:100%; width:100%; padding: 0px!important; }
#modal_crop .img-container img { width:auto; max-height:100%; }
#modal_crop .img-container #crop_image { opacity:0; }
#modal_crop.modal.fade .modal-dialog {
-webkit-transform: none!important;
-ms-transform: none!important;
transform: none!important;
-webkit-transition: none!important;
-moz-transition: none!important;
-o-transition: none!important;
transition: none!important;
}
#modal_crop .modal-header .close { margin-top:-1rem; }
/* Sweet alert */
/* Select 2 */
.select2 { width:100%!important; }
.select2-container { /*z-index: 6000;*/ z-index:6000; font-size:0.96rem; }
.app-content .select2-container { z-index: 2; }
.input-group > .select2 { position: relative; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; width: auto!important; }
.select2-container--classic .select2-selection--single, .select2-container--default .select2-selection--single { min-height: 39px; }
.select2-container--classic .select2-selection--multiple .select2-selection__choice, .select2-container--default .select2-selection--multiple .select2-selection__choice { background-color: #dadada !important; color: #626262 !important; padding: 2px 5px 2px 7px; margin-right: 4px; margin-top: 4px; border: 0px; border-radius: 0px; }
.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove, .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: #626262 !important; float: right; margin-left: 0.5rem; }
.select2-container--classic.select2-container--focus .select2-selection--multiple, .select2-container--default.select2-container--focus .select2-selection--multiple { border-color: #2f286d !important; outline: 0; border-radius: 0px; min-height:39px; }
.select2-container--classic .select2-selection--multiple, .select2-container--default .select2-selection--multiple { border-radius: 0px; }
.select2-container--classic .select2-selection--single, .select2-container--default .select2-selection--single { border-radius: 0px; }
.form-group.error .select2-container--classic .select2-selection--single, .form-group.error .select2-container--default .select2-selection--single { border-radius: 0px; border-color: #EA5455; }
.select2-container--classic.select2-container--open .select2-selection--single, .select2-container--default.select2-container--open .select2-selection--single { border-color: #2f286d !important; outline: 0; }
.select2-container--classic .select2-selection--single:focus, .select2-container--default .select2-selection--single:focus { outline: 0; border-color: #2f286d !important;box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0) !important; }
.select2-search--dropdown { border-top: 1px solid #aaa; }
.select2-search__field::-webkit-input-placeholder { color : rgba(34, 41, 47, 0.4); -webkit-transition : all 0.2s ease; transition : all 0.2s ease; }
.select2-search__field:-moz-placeholder { color : rgba(34, 41, 47, 0.4); -moz-transition : all 0.2s ease; transition : all 0.2s ease; }
.select2-search__field:-ms-input-placeholder { color : rgba(34, 41, 47, 0.4); -ms-transition : all 0.2s ease; transition : all 0.2s ease; }
.select2-search__field::-ms-input-placeholder { color : rgba(34, 41, 47, 0.4); -ms-transition : all 0.2s ease; transition : all 0.2s ease; }
.select2-search__field::placeholder { color : rgba(34, 41, 47, 0.4); -webkit-transition : all 0.2s ease; transition : all 0.2s ease; }
.select2-search__field:-ms-input-placeholder { color : #C5C5C5; }
.select2-search__field:focus::-webkit-input-placeholder { -webkit-transform : translate(5px); transform : translate(5px); -webkit-transition : all 0.2s ease; transition : all 0.2s ease; }
.select2-search__field:focus::-moz-placeholder { transform : translate(5px); -moz-transition : all 0.2s ease; transition : all 0.2s ease; }
.select2-search__field:focus:-ms-input-placeholder { -ms-transform : translate(5px); transform : translate(5px); -ms-transition : all 0.2s ease; transition : all 0.2s ease; }
.select2-search__field:focus::-ms-input-placeholder { -ms-transform : translate(5px); transform : translate(5px); -ms-transition : all 0.2s ease; transition : all 0.2s ease; }
.select2-search__field:focus::placeholder { -webkit-transform : translate(5px); -ms-transform : translate(5px); transform : translate(5px); -webkit-transition : all 0.2s ease; transition : all 0.2s ease; }
.select2-container--classic .select2-search--dropdown .select2-search__field, .select2-container--default .select2-search--dropdown .select2-search__field { outline: none !important; }
.select2-container--default .select2-selection--multiple .select2-selection__rendered li .select2-search__field { margin-top: 0px; padding: 0.5rem 0.35rem; height: calc(1.25em + 1rem + 1px); }
.select2-container--default .select2-selection--multiple .select2-selection__rendered { padding: 1px 5px; min-height:37px;}
.select2-container--default .select2-selection--multiple { min-height: 31px !important; display: flex; border: 1px solid #D9D9D9; }
.select2-dropdown { border-color: #aaa; border-radius: 0px; }
/* tab */
.nav.nav-tabs .nav-item .nav-link:not(:first-child) { padding-left:35px; }
.nav.nav-tabs .nav-item .nav-link.active { color: #2f286d; }
.nav.nav-tabs .nav-item .nav-link.active:after { background: -webkit-linear-gradient(60deg, #2f286d, rgba(64, 48, 209, 1)) !important; background: linear-gradient(30deg, #2f286d, rgba(64, 48, 209, 1)) !important; box-shadow: 0 0 0px 0 rgba(115, 103, 240, 0) !important; }
/* icon in tab */
.nav-item .nav-item-icon.valid:before { color: #76ce76; content: "\f058";}
.nav-item .nav-item-icon:before { color: #cccccc; font: normal 24px/1 FontAwesome; content: "\f056"; width: 24px; height: 24px; line-height: 24px; top: 0px; position:absolute; padding:6px; }
.nav.nav-tabs .nav-item .nav-item-icon ~ a.nav-link { color:#cccccc; }
.nav.nav-tabs .nav-item .nav-item-icon.valid ~ a.nav-link { color: #626262!important; }
/* editor */
.note-editor.note-frame { border: 1px solid #ddd; }
/*.note-editor.note-frame .note-editing-area .note-editable { min-height: 200px; }*/
.note-editor .dropdown-toggle::after { content: ""!important; }
.panel-default>.panel-heading { color: #333; background-color: #f5f5f5; border-color: #ddd; padding:0px 5px 5px 5px; }
.note-editor .modal-header .close { position: absolute; right: 0px; }
.note-popover {display:none; }
/* website page preview */
.summary {
white-space: nowrap;
width: 50px;
overflow: hidden;
text-overflow: ellipsis;
}
#tc-summary-preview { max-width:400px; }
#en-summary-preview { max-width:400px; }
/* profile item */
div.profile_item { display:flex; }
div.profile_item > div { display:table-cell; padding:10px 0px 10px 10px; float:left; border-bottom:1px solid #e5e6e7; }
div.profile_item > div:first-child { font-weight:bold; width:120px; background-color: #F8F8F8; }
div.profile_item > div:nth-child(2) { width:calc(100% - 120px); }
.profile_image { max-width:270px; }
.profile_info { width:calc(100% - 270px); }
div.news_item { display:flex; }
div.news_item > div { display:table-cell; padding:10px 0px 10px 10px; float:left; border-bottom:1px solid #e5e6e7; }
div.news_item > div:first-child { font-weight:bold; width:100px; background-color: #F8F8F8; }
div.news_item > div:nth-child(2) { width:calc(100% - 100px); padding:10px 10px 10px 10px; }
@media (max-width: 767.98px) {
.profile_row { display:block; }
.profile_image { max-width:inherit; width:100%; }
.profile_image img { max-width:250px; margin:0px auto; display:block; }
.profile_info { width:100%; }
}
/* gennext style adjust */
h4.text-primary { padding-bottom:1rem; border-bottom: 1px solid rgba(34, 41, 47, 0.1); margin-bottom: 1rem; width:100%; padding-right:50px; }
.button-group-pills .btn { margin: 0px; padding: 8px 8px 8px 8px; border-radius: 0px; }
.button-group-pills .btn input[type="checkbox"], .button-group-pills .btn input[type="radio"] { display: none; }
.button-group-pills .btn:hover { background-color:rgba(64, 48, 209, 0.15); }
.button-group-pills .btn:hover input ~ .tick i { border-color: #2f286d; }
.button-group-pills .btn input[type="checkbox"] ~ .tick i:before { position:absolute; top:0px; -webkit-transform: translate(100%); -ms-transform: translate(100%); transform: translate(100%); -webkit-transform-origin: right; -ms-transform-origin: right; transform-origin: right; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }
.button-group-pills .btn input[type="checkbox"]:checked ~ .tick i { border-color: #2f286d; -webkit-transform: translate(0); -ms-transform: translate(0); transform: translate(0); }
.button-group-pills .btn input[type="checkbox"]:checked ~ .tick i:before { top:-1px; -webkit-transform: translate(0); -ms-transform: translate(0); transform: translate(0); }
.button-group-pills .btn input ~ .tick { display: inline-flex; line-height: 19px; }
.button-group-pills .btn input[type="checkbox"] ~ .tick i { display: inline-block; width:20px; height:20px; border-width: 1px; border-style: solid; border-color: #D9D9D9; border-radius: 0px; margin-right: 0.5rem; overflow:hidden; position: relative; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }
.button-group-pills .btn input[type="checkbox"] ~ .tick i.fa-check:before { width:26px; height:26px; background-color: #2f286d; font-family: feather!important; color:#ffffff; content: "\e83f"; font-style:normal; box-sizing: border-box; position:absolute; left:-4px; }
.button-group-pills .btn input[type="radio"] ~ .tick i { border-width: 1px; border-style: solid; border-color: #D9D9D9; border-radius:50%; width: 1.143rem; height: 1.143rem; top: 0.1rem; margin-right: 0.5rem; }
.button-group-pills .btn input[type="radio"]:checked ~ .tick i { background-color: #2f286d; border-color: #2f286d; }
.button-group-pills .btn input[type="radio"] ~ .tick i.fa-check:before { display:none; }
#gennext_parent .form-group.row { margin-bottom: 0rem; }
#gennext_parent .form-group.row .mb-3 { margin-bottom: 1.5rem!important; }
#gennext_parent .form-group.row .mb-sm-0 { margin-bottom: 1.5rem!important; }
#gennext_tutor .form-group.row { margin-bottom: 0rem; }
#gennext_tutor .form-group.row .mb-3 { margin-bottom: 1.5rem!important; }
#gennext_tutor .form-group.row .mb-sm-0 { margin-bottom: 1.5rem!important; }
#gennext_child .form-group.row { margin-bottom: 0rem; }
#gennext_child .form-group.row .mb-3 { margin-bottom: 1.5rem!important; }
#gennext_child .form-group.row .mb-sm-0 { margin-bottom: 1.5rem!important; }
/* calendar */
/*.fc .fc-view-container .fc-body .fc-day-top.fc-today a, .fc .fc-view-container .fc-body .fc-day-top.fc-today span { background-color: #2f286d; color: #FFFFFF; padding: 5px 10px; margin-top: 2px; margin-right: 2px; border-radius: 0px; }*/
.fc .fc-view-container .fc-body .fc-week table tbody .fc-day.fc-today { background-color: rgba(64, 48, 209, 0.15); }
.fc .fc-header-toolbar .fc-right .fc-button { background-color: #2f286d; border-radius: 0px; padding: 0.4rem 0.8rem; height: 32px; width: inherit; font-size: 1em; line-height: 1.5em; margin-left: 0.5rem;}
.fc .fc-header-toolbar .fc-right .fc-button:focus { background-color: #2f286d; border:0px; }
.btn-outline-primary.disabled, .fc .disabled.fc-button, .btn-outline-primary:disabled, .fc .fc-button:disabled { color: #FFFFFF; }
.fc .fc-header-toolbar .fc-right .fc-button.fc-prev-button { margin-right: 0rem; }
.fc .fc-header-toolbar .fc-right div:first-child { float:right; }
.fc .fc-header-toolbar .bullets-group-1, .fc .fc-header-toolbar .bullets-group-2 { margin: 0.3rem 0.6rem!important; float: left; }
.fc .fc-header-toolbar .fc-right .fc-button.fc-prev-button .fc-icon, .fc .fc-header-toolbar .fc-right .fc-button.fc-next-button .fc-icon { top: -2px; width: 15px; }
.btn-outline-primary:not(:disabled):not(.disabled):active, .fc .fc-button:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, .fc .fc-button:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle, .fc .show > .dropdown-toggle.fc-button { color: #FFFFFF; background-color: #2f286d; border-color: #2f286d; }
.btn-light { color: #ffffff; }
/* date picker */
.ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; background-color:#FFFFFF; border:1px solid #D9D9D9; }
.ui-datepicker .ui-datepicker-header { position: relative; padding: .2em 0; }
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; top: 2px; width: 1.8em; height: 1.8em; }
.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }
.ui-datepicker .ui-datepicker-prev { left: 2px; }
.ui-datepicker .ui-datepicker-next { right: 2px; }
.ui-datepicker .ui-datepicker-prev-hover { left: 1px; }
.ui-datepicker .ui-datepicker-next-hover { right: 1px; }
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block;position: absolute;left: 50%;margin-left: -8px; top: 50%; margin-top: -8px; }
.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }
.ui-datepicker .ui-datepicker-title select { font-size: 1em;margin: 1px 0; }
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year { width: 45%; }
.ui-datepicker table { width: 100%; font-size: .9em;border-collapse: collapse;margin: 0; }
.ui-datepicker th { padding: .7em .3em; text-align: center;font-weight: bold;border: 0; }
.ui-datepicker td { border: 0;padding: 1px; }
.ui-datepicker td.ui-datepicker-today a { background-color:#2f286d; color:#FFFFFF; border:1px solid #2f286d; }
.ui-datepicker td span, .ui-datepicker td a { width:30px; height:30px; line-height:30px; text-align: center; display: block; padding:0px; text-decoration: none; color:#626262; }
.ui-datepicker td span:hover, .ui-datepicker td a:hover { color:#2f286d;}
.ui-datepicker td:hover span, .ui-datepicker td:hover a { background-color:#e5e6e7; }
.ui-datepicker .ui-datepicker-calendar .ui-state-highlight a { background-color: rgba(64, 48, 209, 0.15); color:#2f286d;}
.ui-datepicker .ui-datepicker-buttonpane { background-image: none;margin: .7em 0 0 0; padding: 0 .2em; border-left: 0;border-right: 0;border-bottom: 0; }
.ui-datepicker .ui-datepicker-buttonpane button { float: right;margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width: auto; overflow: visible; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: left; }
/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi { width: auto; }
.ui-datepicker-multi .ui-datepicker-group { float: left; }
.ui-datepicker-multi .ui-datepicker-group table { width: 95%; margin: 0 auto .4em; }
.ui-datepicker-multi-2 .ui-datepicker-group { width: 50%; }
.ui-datepicker-multi-3 .ui-datepicker-group { width: 33.3%; }
.ui-datepicker-multi-4 .ui-datepicker-group { width: 25%; }
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width: 0; }
.ui-datepicker-multi .ui-datepicker-buttonpane { clear: left; }
.ui-datepicker-row-break { clear: both; width: 100%; font-size: 0; }
/* Icons */
.ui-datepicker .ui-icon { display: block; text-indent: -99999px;overflow: hidden; background-repeat: no-repeat; left: .5em; top: .3em; }
.ui-datepicker-prev:before { position:absolute; content: "\e843"; font-size: 1.5em; font-family: feather!important; speak: none; font-style: normal; font-weight: 400; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; color:#333333; top:3px; }
.ui-datepicker-next:before { position:absolute; content: "\e844"; font-size: 1.58em; font-family: feather!important; speak: none; font-style: normal; font-weight: 400; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; color:#333333; top:3px; }
/* home carousel */
.carousel-item { overflow:hidden; }
.carousel-indicators { margin-top:-30px; right:0px; bottom:inherit; left:inherit; top:0px; margin-right:1.5rem; margin-left:0px; }
.carousel-indicators li { width: 30px; background-color : #2f286d; }
.card.home_event_calendar, .card.home_event_today { height: calc( 100% - 2.2rem); }
/* spacing and responsive adjustment */
.card-body { padding: 1.5rem; }
.card .card-header { padding: 1.5rem 1.5rem 0rem 1.5rem!important; margin-bottom: -1rem; }
.table th, .table td { padding: 0.75rem; }
.content-header-left { margin-bottom: 1rem!important; }
.card_link { cursor:pointer; }
.card .card-header .heading-elements-toggle { display:none!important; }
.carousel-control-prev:before, .carousel-control-next:before { font-family: feather!important;
speak: none;
font-size:80px;
font-style: normal;
font-weight: 400;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.carousel-control-prev:before { content: "\e843"; }
.carousel-control-next:before { content: "\e844"; }
.carousel-control-prev-icon { display:none; }
.carousel-control-next-icon { display:none; }
.carousel-control-prev, .carousel-control-next { color: #FFFFFF; opacity: 0.5; }
.carousel-control-prev:hover, .carousel-control-prev:focus, .carousel-control-next:hover, .carousel-control-next:focus { color: #FFFFFF; opacity: 0.9; }
@media (max-width: 991.98px) {
.heading-elements .list-inline { display:block; }
}
.form-group label { font-size: 1rem; margin-bottom: 0.2rem;}
.nav.nav-tabs .nav-item .nav-link { font-size: 1rem; }
.row { margin-right: -10px; margin-left: -10px; }
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto { padding-right: 10px; padding-left: 10px; }
@media (max-width: 575.98px) {
.card { margin-left:-1rem; margin-right:-1rem; border-radius: 0rem; }
.card.card-fullscreen { left: 1rem; bottom: 0; overflow: auto; }
.card-body { padding: 1rem; }
.card .card-header { padding: 1rem 1rem 0rem 1rem!important; margin-bottom: -1rem; }
.row { margin-right: -6px; margin-left: -6px; }
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto { padding-right: 6px; padding-left: 6px; }
}
@media (min-width: 576px) {
}
@media (min-width: 768px) {
}
@media (min-width: 992px) {
}
@media (min-width: 1200px) {
}
@media (max-width: 575.98px) {
/*.breadcrumb-wrapper { display:none; }*/
.search_row .align-right { float: none; }
.search_row .search_field { width: 58%; }
.search_row .add_new { margin:0px; width: 40%; float: right; }
.search_row .add_new .btn { width: 100%; padding: 0.75rem 1rem; }
}
@media (max-width: 767.98px) {
.search_row .align-left { float: none; margin-bottom:0.5rem; }
}
@media (max-width: 991.98px) {
}
@media (max-width: 1199.98px) {
}
/* print style */
@media print {
.no_print { display:none; }
.breadcrumb-wrapper, .check_col, .action_col, .search_row, .dataTables_paginate, footer { display:none; }
.card-body { padding:0px; }
}
/* member profile */
.profile_pic img { width:100%; height:auto; }
/*.grid_icon { display:none; }*/
.grid_view table { display:block; border-collapse:separate; }
.grid_view table thead { padding:0px; background: #F8F8F8; display: block; }
.grid_view table thead tr { position:relative; padding:0px; display:inline-block; background-color: #F8F8F8; border:0px; width:100%; vertical-align: top; white-space: nowrap; }
/*.grid_view table thead tr { display:block; }*/
.grid_view table tbody { display:table-row; border-bottom:0px;}
.grid_view table tbody tr { position:relative; padding:0px; display:inline-block; background-color:#ffffff; border-top:1px solid #e5e6e7; width:25%; vertical-align: top; }
.grid_view table tr { border-top:0px; }
.grid_view table > tbody > tr > td { display:inherit!important; width:100%; padding:0px; border-bottom:0px solid #e5e6e7; border-top:0px solid #e7eaec; }
.grid_view table tbody td.check_col { display:none!important; position:absolute; top:14px; left:14px; width:24px; height:24px; box-sizing:border-box; padding:0px!important; z-index:10; }
.grid_view table .check_col .myCheck span.details_input { margin-top:0px; }
.grid_view table td { text-align:center; width:100%; overflow:hidden; text-overflow:ellipsis; }
.grid_view table tbody tr { padding: 15px; /*border-left:1px solid #e7eaec;*/ }
/*.grid_view table tbody tr:last-child:not { padding: 15px; border-left:1px solid #e7eaec; }*/
.grid_view table tbody tr:hover { background-color: rgba(34, 41, 47, 0.075); }
.grid_view table tbody tr:hover td.check_col { display:block!important; } /* check box column */
.grid_view table tbody tr.selected td.check_col { display:block!important; }
.grid_view table tbody tr.selected td.check_col { padding-top:10px; }
.grid_view table tbody tr td { padding-bottom:5px; }
.grid_view table tbody tr td.action_col { padding-top:10px; }
.grid_view table tbody tr:hover td.sorting_1 { background-color:transparent; }
/* datatable sorting style for grid view */
.grid_view table thead .sorting_asc, .grid_view table thead .sorting_desc { background-color:#dadada; /*border-bottom: 1px solid #f0f0f0;*/}
.grid_view table tbody tr td.sorting_1 { background-color:transparent; }
.grid_view table tbody tr.selected td.sorting_1 { background-color:transparent; }
.grid_view table thead .sorting, .grid_view table thead .sorting_asc, .grid_view table thead .sorting_desc { border-bottom: 0px; white-space: nowrap; float:left; }
.grid_view table thead th.sorting_disabled { display:none; }
.grid_view .lightgallery a { display: flex; overflow: hidden; position: relative; height:150px; justify-content: center; align-items: center; }
.grid_view .media_thumb { width: auto; height: auto; flex-shrink: 0; min-width: 100%; min-height: 100%; max-width: 100px; object-fit: cover; }
.grid_view table.empty tbody { display: block; }
.grid_view table.empty tbody tr { width: 100%!important; padding: 0.75rem; }
.grid_view table.empty tbody tr td { padding: 0px; }
@media (max-width: 991.98px) {
.grid_view table tbody tr { width:33.3%; }
}
@media (max-width: 767.98px) {
.grid_view table tbody tr { width:50%; }
}
@media (max-width: 575.98px) {
.grid_view table tbody tr { width:100%; }
}
.drag-target { display:none; }
.programmer_remarks { color:#cc0000; margin-bottom:20px; }
.video-container {
overflow: hidden;
position: relative;
width: 100%;
}
.video-container::after {
padding-top: 56.25%;
display: block;
content: "";
}
.video-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* 20211025 select avatar */
#avatar_image { position:relative; cursor:pointer; width:250px; margin-left:auto; margin-right:auto; }
#avatar_image img { border-radius: 500px; }
.profile_pic .profile_pic_edit { position:absolute; bottom:10px; right:10px; width:40px; height:40px; line-height:0; border-color:#dfe7ed!important; background-color:#dfe7ed!important; padding:8px; }
.profile_pic .profile_pic_edit i { font-size:20px; line-height:24px; }
.select_avatar img { box-sizing: content-box; border:7px solid transparent; max-width:120px; width:100%; height:auto; margin-bottom:20px; opacity:0.3; border-radius: 200px; cursor:pointer; }
.select_avatar img.selected { border:7px solid #072e75; opacity:1; }
.select_avatar img:hover { border:7px solid #072e75; opacity:1; }
.table_profile_pic img { width:60px; height:60px; }
/* table action dropdown */
.table_actions .dropdown-menu { padding:0px; border-radius:0px; animation-duration: 0.3s; animation-fill-mode: both; animation-name: fadeIn; left: -20px!important; z-index:100; }
.table_actions .dropdown-menu .dropdown-item { padding: 1rem 1.2rem; }
.table_actions .dropdown-menu .dropdown-item:hover { color:#000001; background-color:#eeeeee; }
.table_actions .dropdown-menu .dropdown-item:active { color:#000001; background-color:#eeeeee; }
.table_actions .dropdown-menu .dropdown-item:focus { color:#000001; background-color:#eeeeee; }
.table_actions .dropdown-menu .dropdown-divider { margin: 0px; }
.table thead th, .table tfoot th { text-transform:inherit; }
.table_actions .dropdown-toggle { height:100%; width:100%; }
.table_actions .dropdown-toggle svg { color:#58f3a7; width:22px; height:22px; }
.table_actions .dropdown-toggle::after { content:''; display:none; }
.table_actions .dropdown-menu::before { display:none; }
/* fixed column */
table.dataTable thead th.dtfc-fixed-left { background-color:#F8F8F8!important; z-index:1!important; }
table.dataTable thead th.dtfc-fixed-right { background-color:#F8F8F8!important; z-index:1!important; }
.public-site table.dataTable thead th.dtfc-fixed-left { background-color:#fff!important; z-index:1!important; } /* 20220327 */
.public-site table.dataTable thead th.dtfc-fixed-right { background-color:#fff!important; z-index:1!important; } /* 20220327 */
table.dataTable td.dtfc-fixed-left { background-color:#ffffff!important; /*z-index:1!important;*/ -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
table.dataTable td.dtfc-fixed-right { background-color:#ffffff!important; /*z-index:1!important;*/ -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
table.dataTable tbody tr:hover td.dtfc-fixed-left { background-color: #f9f9f9!important; }
table.dataTable tbody tr:hover td.dtfc-fixed-right { background-color: #f9f9f9!important; }
/* sorting */
table.dataTable thead>tr>th.sorting_asc, table.dataTable thead>tr>th.sorting_desc, table.dataTable thead>tr>th.sorting, table.dataTable thead>tr>td.sorting_asc, table.dataTable thead>tr>td.sorting_desc, table.dataTable thead>tr>td.sorting { padding-right: 20px; }
table.dataTable thead .sorting:before, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc_disabled:before { font-size:12px; left:inherit; right:10; top:15px; bottom:inherit; opacity:0.5; display:none; }
table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after { font-size:12px; left:inherit; right:10; top:21px; bottom:inherit; opacity:0.5; }
table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc { background-color:#dadada!important; }
table.dataTable thead .sorting:hover:after, table.dataTable thead .sorting_asc:hover:after, table.dataTable thead .sorting_desc:hover:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:after { opacity:0.7; }
table.dataTable thead .sorting_asc:before { content:"\f883"; }
table.dataTable thead .sorting_desc:before { content:""; }
table.dataTable thead .sorting_asc:after { content:"\f160"!important; font-family:"FontAwesome"!important; color:#009688; background-image:none; padding-left:5px;}
table.dataTable thead .sorting_desc:after { content:"\f161"!important; font-family:"FontAwesome"!important; color:#009688; background-image:none; padding-left:5px;}
.table>caption+thead>tr:first-child>td, .table>caption+thead>tr:first-child>th, .table>colgroup+thead>tr:first-child>td, .table>colgroup+thead>tr:first-child>th, .table>thead:first-child>tr:first-child>td, .table>thead:first-child>tr:first-child>th { border-top:0; box-sizing:border-box; }
table.dataTable td { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
table.dataTable td { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
table.dataTable tbody tr:hover td { background-color: #f9f9f9!important; }
table.dataTable tbody tr:hover td { background-color: #f9f9f9!important; }
table.dataTable tbody tr td.sorting_1 { background-color:#F8F8F8; }
table.dataTable tbody tr:hover td.sorting_1 { background-color:#f5f5f5; }
table.dataTable tbody tr.selected { background-color: #e9f7e9!important; color: #222222!important; box-shadow: 0 0 0px 0 #ffffff!important; border-radius: 0px!important; }
table.dataTable tbody tr.selected td.sorting_1 { background-color:#ddf3dd; }
table.dataTable tbody tr.selected:hover { background-color: #d1efd1!important; }
table.dataTable tbody tr.selected:hover td.sorting_1 { background-color:#d1efd1; }
table.dataTable tbody tr.selected a, table.dataTable tbody th.selected a, table.dataTable tbody td.selected a { color: #2f286d; }
table.dataTable td.td_field { padding-top:5px; padding-bottom:5px; }
/*table.dataTable>thead .sorting:before, table.dataTable>thead .sorting:after, table.dataTable>thead .sorting_asc:before, table.dataTable>thead .sorting_asc:after, table.dataTable>thead .sorting_desc:before, table.dataTable>thead .sorting_desc:after, table.dataTable>thead .sorting_asc_disabled:before, table.dataTable>thead .sorting_asc_disabled:after, table.dataTable>thead .sorting_desc_disabled:before, table.dataTable>thead .sorting_desc_disabled:after { position:static; display: inline; }*/
table.dataTable>thead .sorting:after, table.dataTable>thead .sorting_asc:after, table.dataTable>thead .sorting_desc:after, table.dataTable>thead .sorting_asc_disabled:after, table.dataTable>thead .sorting_desc_disabled:after { position:static; display: inline; }
/* sorting in fixed column */
table.dataTable thead .sorting_asc.dtfc-fixed-left, table.dataTable thead .sorting_desc.dtfc-fixed-left { background-color:#dadada!important; }
table.dataTable tbody tr td.sorting_1.dtfc-fixed-left { background-color:#F8F8F8!important; z-index:1; }
table.dataTable tbody tr:hover td.sorting_1.dtfc-fixed-left { background-color:#f5f5f5!important; }
table.dataTable thead .sorting_asc.dtfc-fixed-right, table.dataTable thead .sorting_desc.dtfc-fixed-right { background-color:#dadada!important; }
table.dataTable tbody tr td.sorting_1.dtfc-fixed-right { background-color:#F8F8F8!important; }
table.dataTable tbody tr:hover td.sorting_1.dtfc-fixed-right { background-color:#f5f5f5!important; }
table.dataTable tbody tr.dim td { background: #efffef !important; }
table.dataTable tbody tr.dim td.sorting_1 { background: #efffef !important; }
table.dataTable tbody tr.dim:hover td { background: #efffef !important; }
table.dataTable tbody tr.dim:hover td.sorting_1 { background: #efffef !important; }
.form-control.date_filter[readonly] { background-color: #ffffff; }
table.dataTable { border: 0px solid #e5e6e7; }
.table-responsive { border: 1px solid #e5e6e7; min-height:150px; }
/* modal */
.modal.show { display:flex!important; padding:0px!important; overflow: hidden; }
.modal .modal-dialog { transform: none; /*margin:auto;*/ padding:10px 0px; width:95vw; /*max-width:800px;*/ }
.modal .modal-dialog.modal-lg { max-width:800px!important; }
.modal .modal-dialog.modal-dialog-lg { max-width:800px!important; }
/*.modal .modal-dialog.modal-md { max-width:800px!important; }*/
.modal .modal-dialog.modal-sm { max-width:500px!important; }
.modal .modal-content { border-radius:0px; }
.modal .modal-header { border-radius:0px; position:relative; padding: 0.8rem 1.4rem; }
.modal .modal-header .close { padding: 0.2rem 0.62rem; box-shadow: 0 0px 0px 0 rgb(34 41 47 / 0%); border-radius:0px; background-color:transparent; opacity: 1; transition: all 0.23s ease 0.1s; position:absolute; transform:none; top:24px; right:24px; }
.modal .modal-header .modal-title { line-height:30px; font-weight:bold; align-self: center; }
.modal .modal-footer { border-radius:0px; margin-top:0px; }
.modal .modal-header .close:hover, .modal .modal-header .close:focus, .modal .modal-header .close:active { transform: translate(0px, 0px); }
/* set all to scrollable modal */
.modal { overflow-y:hidden; }
.modal .modal-body { max-height:calc(100vh - 160px); overflow-y:auto; }
.modal { min-width:320px; z-index:5800; }
.modal.modal-slide-in { /*margin-top:62px;*/ margin-top:0px; }
.modal-slide-in .modal-dialog .modal-content { position:relative; }
.modal-slide-in .modal-dialog { /*margin-top:62px;*/ margin-top:0px; }
.modal-slide-in .modal-dialog { width:100%; min-width:320px; }
.modal-header { min-height:62px; height:auto; padding-right:35px; }
.modal-slide-in .close { top:26px; right:20px; }
.modal-slide-in .modal-dialog .modal-body { padding:20px; padding-bottom:100px; margin:0px 0px 0px 0px; overflow-y:auto!important; }
.modal.modal-slide-in .modal-title { line-height: 40px; }
.modal.modal-slide-in .modal_button { position:fixed; bottom:0px; left:0px; z-index: 100; }
.modal.modal-slide-in#modal_add .modal_button { display:none; }
.modal.modal-slide-in#modal_edit .modal_button { display:none; }
@media (min-width: 576px) {
.modal-slide-in .modal-dialog.sidebar-lg { width:400px!important; }
}
.modal-dialog-slideout { min-height: 100%; margin: 0 0 0 auto; background: #fff; }
.modal.fade .modal-dialog.modal-dialog-slideout { -webkit-transform: translate(100%, 0)scale(1); transform: translate(100%, 0)scale(1); }
.modal.fade.show .modal-dialog.modal-dialog-slideout { -webkit-transform: translate(0, 0); transform: translate(0, 0); display: flex; align-items: stretch; -webkit-box-align: stretch; height: 100%; padding:0px;}
.modal.fade.show .modal-dialog.modal-dialog-slideout .modal-body { overflow-y: auto; overflow-x: hidden; max-height: calc(100vh - 130px); }
.modal-dialog-slideout .modal-content { border: 0; }
/* button choice checkbox */
.button_choice { margin-right: -4px; margin-left: -4px; }
.button_choice .choice-group { padding-right: 4px; padding-left: 4px;}
.button_choice .choice-group label span { font-size: 1rem; font-weight: 400; line-height: 1.45; }
.button_choice label { padding-left: 0rem; padding-right: 0.2rem; /*width:100%;*/ display:flex; }
.button_choice label input[type="checkbox"] { position:absolute; left:-9999px; }
.button_choice label span { height:100%; width:100%; padding: 10px 8px; border:1px solid #cccccc; color: #333; background-color: #fff; border-radius:0px; -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; cursor:pointer; }
.form-group.error .button_choice label span:hover { border-color: #EA5455; }
.form-group.error .button_choice label span { border-color: #EA5455; }
.button_choice label span:hover { background-color: #e6e6e6; border-color: #adadad; }
.button_choice label input[type="checkbox"]:checked ~ span { color: #fff; background-color:#29c76f; border-color:#29c76f; }
.button_choice label input[type="checkbox"]:checked:focus ~ span { color: #fff; background-color:#29c76f; border-color:#29c76f; }
.repeat_option_week .button_choice label { width: auto !important; }
.repeat_option_week .button_choice { margin-left: 0px !important; }
.vs-radio-con input:checked ~ .vs-radio .vs-radio--circle { background: #2f286d; box-shadow: none; }
/* button choice radio */
.button_choice label input[type="radio"] { position:absolute; left:-9999px; }
.button_choice label input[type="radio"]:checked ~ span { color: #fff; background-color:#2f286d; border-color:#2f286d; }
.button_choice label input[type="radio"]:checked:focus ~ span { color: #fff; background-color:#2f286d; border-color:#2f286d; }
.button_choice label .input-group-prepend span { border-top-right-radius: 0px; border-bottom-right-radius: 0px; }
.button_choice.logo_image label span { padding:0px; }
.button_choice.logo_image label span img{ border-radius: 4px;}
/* full calendar override */
.fc .fc-event { background: #2f286d; border: 1px solid #2f286d; padding: 1px 4px; border-radius: 0px; border: none; padding-left:4px; margin:0px 1px 1px 1px!important; }
th.fc-col-header-cell { height: 40px; line-height: 40px; font-weight: normal; border-left: 0px; border-right: 0px; }
.fc .fc-event-future { background-color: #29c76f; color: #ffffff !important; }
.fc-daygrid-dot-event .fc-event-title { font-weight: normal; }
.fc-event-time { font-weight: normal !important; }
.fc-event-past { opacity: 0.6 !important; }
.fc-direction-ltr .fc-timegrid-col-events { margin: 0 0 0 0; }
.fc .fc-button { border-radius:0px; padding: 0.6rem 0.8rem; }
.fc .fc-button { background-color: #2f286d; }
.fc .fc-button:hover { color: #FFFFFF; background-color: #0075bc; border-color: #0075bc; }
.fc .fc-button:not(:disabled).fc-button-active { background-color: #0075bc; }
.fc .disabled.fc-button, .btn-outline-primary:disabled, .fc .fc-button:disabled { background-color: #2f286d; }
.text-booked { color:#0075bc; }
.fc-direction-ltr .fc-toolbar>*>:not(:first-child) { margin-left:2px; }
.fc .fc-button .fc-icon { font-size: 1em; }
.fc .fc-button, .fc .fc-button .fc-icon, .fc .fc-button-group, .fc .fc-timegrid-slot-label { vertical-align: initial; }
.fc .fc-button:focus { outline: 0; box-shadow:none!important; }
.fc .fc-toolbar-title { font-size: 1.75em; margin-bottom:6px; }
.fc .fc-toolbar.fc-header-toolbar { margin-bottom:10px; }
.swal2-container { z-index: 6060!important; }
.bullet.bullet-primary { background-color: #2f286d; }
.bullet.bullet-booked { background-color: #0075bc; }
/* time slot table */
table.time-slot-list { position: relative; border-collapse: collapse; display:block; height:350px; overflow-y:auto; margin-bottom:0px; }
table.time-slot-list thead { background: white; position: sticky; top: 0; display:inline-table; width:100%; z-index: 10; }
table.time-slot-list thead tr:first-child th { border-top:1px solid #e5e6e7!important; }
table.time-slot-list thead th { width:12%; min-width:38px; border-bottom:1px solid #e5e6e7; border-left:1px solid #e5e6e7; border-right:0px; text-align:center; }
table.time-slot-list thead th:first-child { width:16%; min-width:55px; border-left:0px; text-align:left; }
table.time-slot-list tbody { display:inline-table; width:100%; text-align:left; }
table.time-slot-list tbody th { background: #ffffff; width:16%; min-width:55px; border-bottom:1px solid #e5e6e7; border-left:0px; border-right:0px; text-align:left; }
table.time-slot-list tbody td { background: #f2f2f2; width:12%; min-width:38px; border-bottom:1px solid #e5e6e7; border-left:1px solid #e5e6e7; border-right:0px; text-align:center; }
table.time-slot-list tbody tr:last-child th { border-bottom:0px; }
table.time-slot-list tbody tr:last-child td { border-bottom:0px; }
table.time-slot-list .bg-success { position:relative; }
table.time-slot-list .bg-success label { padding: 0px; position:absolute; top:0px; left:0px; height:100%; width:100%; overflow:hidden;}
table.time-slot-list .bg-success label span { text-align:center; position:absolute; top:0px; left:15px; height:100%; width:100%; opacity:0; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
table.time-slot-list .bg-success label span:after { content:"\e83f"; color:#ffffff; font-size: 24px; font-family: feather!important; position:relative; top:2px; }
table.time-slot-list .bg-success label input[type='checkbox'] { position:absolute; top:0px; left:-60px; }
table.time-slot-list .bg-success label input[type='checkbox']:checked~span { opacity:1; left:0px;}
.legend { width:26px; height:24px; display:inline-block; text-align:center; }
.legend.not_available { background-color: #f2f2f2; }
.legend.bg-success { position:relative; }
.legend.bg-success.selected { position:relative; }
.legend.bg-success.selected:after { content:"\e83f"; color:#ffffff; font-size: 14px; font-family: feather!important; position:relative; top:2px; }
/* 20220316 user calendar picker */
.flatpickr-calendar.inline { width: 100%; box-shadow:none; border-radius: 0px; border: 1px solid #e5e6e7; }
.flatpickr-calendar:before, .flatpickr-calendar:after { display:none; }
.flatpickr-rContainer { width: 100%; }
.dayContainer { width: 100%; min-width: 100%; max-width: 100%; }
.flatpickr-months { padding:0.75rem; font-size: 1.14rem; align-items: center !important; /*border-bottom: 1px solid #e5e6e7;*/ }
.flatpickr-days { width: 100%; }
.flatpickr-day { border-radius:0px; width: 14.2857143%; flex-basis: 14.2857143%; /*margin-top:2px; margin-bottom:2px; margin-left:1%; margin-right:1%;*/ max-width:inherit; border-top: 1px solid #e5e6e7!important; border-right: 1px solid #e5e6e7!important; border-bottom:0px; border-left:0px; }
.flatpickr-day:nth-child(7n) { border-right:0px!important; }
.flatpickr-day.today:after { content:""; display:block; position:absolute; top:0px; left:0px; height:100%; width:100%; /*border:2px solid #2f286d!important;*/background-color:#2f286d; opacity:0.2; z-index:-1; }
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange, .flatpickr-day.selected.inRange, .flatpickr-day.startRange.inRange, .flatpickr-day.endRange.inRange, .flatpickr-day.selected:focus, .flatpickr-day.startRange:focus, .flatpickr-day.endRange:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange:hover, .flatpickr-day.endRange:hover, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.endRange.nextMonthDay { background: #2f286d; border-color: #2f286d; }
.flatpickr-current-month { width: auto; left: 0px; padding:0px; text-align: left; font-size:100%; line-height:30px; }
.flatpickr-current-month .numInputWrapper span { display:none!important; }
.flatpickr-current-month .numInputWrapper:hover { background: rgba(0,0,0,0)!important; }
.flatpickr-current-month .numInputWrapper input { pointer-events: none; }
.flatpickr-current-month .flatpickr-monthDropdown-months { pointer-events: none; -webkit-appearance: none; padding:0px; font-size: 1.14rem!important; font-weight: 500; line-height: 1.2; }
.flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month { height:30px; padding: 5px 10px; }
.flatpickr-months .flatpickr-month { height: 30px; }
.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month, .flatpickr-months .flatpickr-next-month.flatpickr-prev-month { left:inherit; right:30px; }
.flatpickr-months .flatpickr-prev-month:hover svg, .flatpickr-months .flatpickr-next-month:hover svg { fill: #29c76f; }
.flatpickr-current-month input.cur-year { font-size: 1.14rem!important; font-weight: 500; line-height: 1.2; }
.flatpickr-current-month input.cur-year[disabled], .flatpickr-current-month input.cur-year[disabled]:hover { color: rgba(0,0,0,1); }
/* month arrow */
.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month, .flatpickr-months .flatpickr-next-month.flatpickr-prev-month { top: 0.75rem; left: inherit; right: calc(30px + 1rem) ; border-color: #2f286d !important; background-color: #2f286d !important; color: #FFFFFF; -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; padding: 0.5rem; height:30px; width:30px; line-height: 14px;}
.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month svg, .flatpickr-months .flatpickr-next-month.flatpickr-prev-month svg { width:12px; height:12px; filter: invert(100%) sepia(0%) saturate(7485%) hue-rotate(143deg) brightness(103%) contrast(104%); }
.flatpickr-months .flatpickr-prev-month.flatpickr-next-month, .flatpickr-months .flatpickr-next-month.flatpickr-next-month { right: 0.75rem; top: 0.75rem; border-color: #2f286d !important; background-color: #2f286d !important; color: #FFFFFF; -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; padding: 0.5rem; height:30px; width:30px; line-height: 14px; }
.flatpickr-months .flatpickr-prev-month.flatpickr-next-month svg, .flatpickr-months .flatpickr-next-month.flatpickr-next-month svg { width:12px; height:12px; filter: invert(100%) sepia(0%) saturate(7485%) hue-rotate(143deg) brightness(103%) contrast(104%); }
.flatpickr-months .flatpickr-prev-month.flatpickr-disabled, .flatpickr-months .flatpickr-next-month.flatpickr-disabled { display:block; opacity:0.5; }
.flatpickr-weekdays { height:inherit; }
span.flatpickr-weekday { border-top: 1px solid #e5e6e7!important; border-right: 1px solid #e5e6e7!important; width: 14.2857143%; flex-basis: 14.2857143%; max-width: inherit; border-bottom: 1px solid #e5e6e7!important; border-right: 1px solid #e5e6e7!important; border-bottom: 0px; border-left: 0px; height:40px; line-height:40px; }
span.flatpickr-weekday:last-child { border-right:0px!important; }
.flatpickr-time { display: block; height:40px; border-top: 1px solid #e5e6e7!important; }
/*#login_page { background-color: #2f286d;}*/
#login_page .card .card-header {
padding: 1.5rem 1.5rem 0.8rem 1.5rem !important;
margin-bottom: inherit;
}
#login_page .card-body {
padding: 1.25rem !important;
}
@media (max-width: 575.98px) {
#login_page .card { margin-left: inherit; margin-right: inherit; }
}
/* 20240507 start */
.loading-overlay { position: fixed; top: 0; left: 0; right: 0; height: 100%; background-color: rgba(34, 41, 47, 0.5); display:flex; visibility: hidden; opacity: 0; transition: all 0.5s ease; z-index:-1; }
.loading-overlay.show { opacity:1; visibility: visible; width:100%; height:100%; z-index: 6000; }
.loading-overlay .spinner-border { height:8vw; width:8vw; margin:auto; }
.loading-overlay.inside { position:absolute; }
.loading-overlay .loading-text { position:absolute; width:100%; top:calc(50% + 4vw); left:0px; text-align:center; z-index:500; color:#ffffff; }
.loading-overlay.small .spinner-border { height:4vw; width:4vw; margin:auto; }
.loading-overlay.small.inside.show { z-index:100; display:flex!important; }
.loading-overlay.small .loading-text { position:absolute; width:100%; top:calc(50% + 2vw); left:0px; text-align:center; z-index:500; color:#ffffff; }
@media (max-width:575.9px) {
.loading-overlay.small .spinner-border { height:8vw; width:8vw; }
.loading-overlay.small .loading-text { top:calc(50% + 4vw); }
}
/* step label */
.step_ribbon { font-family: 'Montserrat', '\5FAE\8EDF\6B63\9ED1\9AD4', 'Microsoft JhengHei', Helvetica, Arial, sans-serif !important; padding: 4px 10px; text-align:center; width: 32px; height: 32px; background: #2f286d; left: 0px; color: #ffffff; position: relative; display: table-cell; border-radius: 50%; border: 1px solid #2f286d; vertical-align: middle; }
.step_ribbon.inactive { padding:4px 10px; text-align:center; width: 32px; height: 32px; background:#cccccc; border:1px solid #cccccc; left:0px; color:#ffffff; position:relative; display:table-cell; vertical-align: middle; }
.step_title .feather-chevron-right{
height:30px !important;
}
/* 20240507 end */
.card.collapsable .card-header { padding-top:1.2rem!important; }
.card.collapsable .card-header h4 { border-bottom: 0px; }
.card.collapsable .card-body { border-top: 1px solid rgba(34, 41, 47, 0.1); }
.video_frame_4_3 { aspect-ratio: 640 / 480; background-color:#000000; }
.video_frame_16_9 { aspect-ratio: 16 / 9; background-color:#000000; }
/* activity content style - need to apply to cms */
#modal_preview .modal-dialog { max-width: 1060px; margin-left:auto; margin-right:auto; }
/* font size */
.activity_content, .activity_content p, .activity_content div, .activity_content span, .activity_content li { font-size: 18px; line-height:32px; color:#5e5873; font-family: 'Montserrat', '\5FAE\8EDF\6B63\9ED1\9AD4', 'Microsoft JhengHei', Helvetica, Arial, sans-serif !important; }
.activity_content h3 { margin-top:0; line-height:1.2; text-align:left; };
.card_actions .dropdown-menu { font-size:16px; }
.activity_actions .dropdown-menu { font-size:16px; }
.activity_content .card-body h2 { font-size:26px; font-weight:bold; margin-top:4px; margin-bottom: 10px; color:#5e5873; line-height: 1.2; }
.activity_content .card-body h3 { font-size:22px; font-weight:bold; margin-top:4px; margin-bottom: 8px; color:#5e5873; line-height: 1.2; }
.activity_content .card-body h4 { font-size:18px; font-weight:bold; margin-top:4px; margin-bottom: 6px; color:#5e5873; line-height: 1.2; }
.activity_content .card-body h5 { font-size:16px; font-weight:bold; margin-top:4px; margin-bottom: 6px; color:#5e5873; line-height: 1.2; }
.activity_content .card-body h6 { font-size:14px; font-weight:bold; margin-top:4px; margin-bottom: 6px; color:#5e5873; line-height: 1.2; }
.activity_content hr { margin-top: 2rem; margin-bottom: 2rem; }
/* card and header */
.activity_content.card { border-radius: 20px; }
.activity_content.card .card-header { position: relative; display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; border-bottom: none; padding: 1.5rem; background-color: transparent; padding: 1.5rem 1.5rem 1rem 1.5rem !important; border-radius: 20px 20px 0px 0px;}
.activity_content .card-body { padding:10px 70px 20px 70px!important; border-radius: 20px;}
@media (max-width:1440px) {
.activity_content .card-body { padding:1.4vw 5vw!important; }
}
@media (max-width: 575.98px) {
.activity_content.card { margin-left:0px; margin-right:0px; border-radius:20px; }
.activity_content.card .card { margin-left:0px; margin-right:0px; }
.activity_content.card .card-header { padding: 1rem 1rem 0.5rem 1rem !important; }
}
.activity_content .card .card-header .heading-elements, .card .card-header .heading-elements-toggle { position: relative; top: inherit; right: inherit; cursor: pointer; padding-right: 30px !important; }
.activity_content .card .heading-elements a[data-action='collapse'].rotate i, .card .card-header .heading-elements a[data-action='collapse'].rotate svg { position: relative; top: 3px; left: 5px; }
.activity_content section.card { border-bottom: 1px solid #eeeeee; border-radius: 20px 20px 0px 0px; }
.activity_content section.card:last-child { border-bottom:0px; }
.activity_content div[aria-expanded='false'] .heading-elements:after { transform: rotate(-180deg); top:-2px; right: 5px; }
.activity_content div[data-toggle='collapse'] { position:relative; }
.activity_content div[data-toggle='collapse'] .heading-elements:after { position: absolute; top:7px; right: 5px; /*content: "\e842";*/ content: "\e845"; font-family: 'feather' !important; color: #2f286d !important; width: 21px; font-size: 22px; height: 15px; line-height: 15px; transition: all 300ms linear 0s; }
#mobile_submenu.sticktotop { position:sticky; top:23px; right:0px; z-index:100; }
/* 20241017 activity image and slider image size */
.activity_content img[width='100%'] { width:70%!important; height:auto!important; }
.activity_content img[style='width: 100%;'] { width:70%!important; height:auto!important; }
.activity_content .swiper-container img[width='100%'] { width:100%!important; height:auto!important; }
.activity_content .swiper-container img[style='width: 100%;'] { width:100%!important; height:auto!important; }
.activity_content .swiper-container { width:70%!important; margin-left:0px; margin-right:inherit; }
@media (max-width:1200px) {
.activity_content img[width='100%'] { width:80%!important; height:auto!important; }
.activity_content img[style='width: 100%;'] { width:80%!important; height:auto!important; }
.activity_content .swiper-container img[width='100%'] { width:100%!important; height:auto!important; }
.activity_content .swiper-container img[style='width: 100%;'] { width:100%!important; height:auto!important; }
.activity_content .swiper-container { width:80%!important; }
}
@media (max-width:1000px) {
.activity_content img[width='100%'] { width:100%!important; height:auto!important; }
.activity_content img[style='width: 100%;'] { width:100%!important; height:auto!important; }
.activity_content .swiper-container img[width='100%'] { width:100%!important; height:auto!important; }
.activity_content .swiper-container img[style='width: 100%;'] { width:100%!important; height:auto!important; }
.activity_content .swiper-container { width:100%!important; }
}
/* card bg */
/*.cow_bg_box { position:relative; }
.cow_bg_box.left { padding-left:25%; }
.cow_bg_box.right { padding-right:25%; }
.cow_bg_box.left:after { content: ""; display: inline-block; position: absolute; left:3%; top: -30px; height:calc(100% + 60px); width:25%; z-index: 100; background-size:contain; background-repeat: no-repeat; background-position: right top; }
.cow_bg_box.right:after { content: ""; display: inline-block; position: absolute; right:5%; top: -30px; height:calc(100% + 60px); width:25%; z-index: 100; background-size:contain; background-repeat: no-repeat; background-position: right top; }
.cow_with_box:after { background-image: url(../../app-assets/images/cow/COWEY_04.png); }
.cow_with_flower:after { background-image: url(../../app-assets/images/cow/COWEY_26.png); }
.cow_with_telescope:after { background-image: url(../../app-assets/images/cow/COWEY_139.png); }
.cow_with_note:after { background-image: url(../../app-assets/images/cow/COWEY_56.png); }
.cow_bg_box.left.cow_with_box:after { transform: scale(-1,1); }
.cow_bg_box.left.cow_with_flower:after { transform: scale(-1,1); }
.cow_bg_box.left.cow_with_telescope:after { transform: scale(-1,1); }
.cow_bg_box.left.cow_with_note:after { transform: scale(-1,1); }*/
/* list base setting */
.activity_content ul.custom_style { list-style:none; padding-left:0px; }
.activity_content ul.custom_style > li { counter-increment: list_counter; }
.activity_content ol.custom_style { list-style: none; padding-left:0px; }
.activity_content ol.custom_style > li { counter-increment: list_counter; }
/* list objects */
.activity_content ul.pencil { counter-reset: list_counter; }
.activity_content ul.pencil > li { margin-left:40px; position:relative; padding-top:5px; padding-bottom:13px; }
.activity_content ul.pencil > li::before { content:""; display: inline-block; height: 30px; width:30px; position: absolute; top:2px; left:-40px; background-image: url(../../app-assets/images/activities/list_style_pencil.png); background-size: 30px 30px; background-repeat: no-repeat; }
.activity_content ul.apple { counter-reset: list_counter; }
.activity_content ul.apple > li { margin-left:40px; position:relative; padding-top:5px; padding-bottom:13px; }
.activity_content ul.apple > li::before { content:""; display: inline-block; height: 30px; width:30px; position: absolute; top:2px; left:-40px; background-image: url(../../app-assets/images/activities/list_style_apple.png); background-size: 30px 30px; background-repeat: no-repeat; }
.activity_content ul.bulb { counter-reset: list_counter; }
.activity_content ul.bulb > li { margin-left:40px; position:relative; padding-top:5px; padding-bottom:13px; }
.activity_content ul.bulb > li::before { content:""; display: inline-block; height: 34px; width:34px; position: absolute; top:0px; left:-40px; background-image: url(../../app-assets/images/activities/list_style_bulb.png); background-size: 34px 34px; background-repeat: no-repeat; }
.activity_content ul.book { counter-reset: list_counter; }
.activity_content ul.book > li { margin-left:40px; position:relative; padding-top:5px; padding-bottom:13px; }
.activity_content ul.book > li::before { content:""; display: inline-block; height: 30px; width:30px; position: absolute; top:5px; left:-40px; background-image: url(../../app-assets/images/activities/list_style_book.png); background-size: 30px 30px; background-repeat: no-repeat; }
/* list shape */
.activity_content ul.gear { counter-reset: list_counter; }
.activity_content ul.gear > li { margin-left:40px; position:relative; padding-top:3px; padding-bottom:11px; }
.activity_content ul.gear > li::before { content:""; display: inline-block; height: 30px; width:30px; position: absolute; top:3px; left:-40px; background-size: 30px 30px; background-repeat: no-repeat; }
.activity_content ul.gear.blue > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_blue.png); }
.activity_content ul.gear.red > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_red.png); }
.activity_content ul.gear.yellow > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_yellow.png); }
.activity_content ul.gear.green > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_green.png); }
.activity_content ul.puzzle { counter-reset: list_counter; }
.activity_content ul.puzzle > li { margin-left:40px; position:relative; padding-top:3px; padding-bottom:11px; }
.activity_content ul.puzzle > li::before { content:""; display: inline-block; height:26px; width:26px; position: absolute; top:4px; left:-40px; background-size: 26px 26px; background-repeat: no-repeat; }
.activity_content ul.puzzle.blue > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_blue.png); }
.activity_content ul.puzzle.red > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_red.png); }
.activity_content ul.puzzle.yellow > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_yellow.png); }
.activity_content ul.puzzle.green > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_green.png); }
/* number list */
.activity_content ol.steps { counter-reset: list_counter; }
.activity_content ol.steps > li { margin-left:45px; position:relative; padding-top:4px; padding-bottom:12px; }
.activity_content ol.steps > li::before { content:counter(list_counter); display: inline-block; height:34px; width:34px; line-height:34px; position: absolute; top:2px; left:-45px; color:#ffffff; font-size:20px; font-weight:700; border-radius:50px; text-align:center; }
.activity_content ol.steps.blue > li::before { background-color:#2ec5f3; }
.activity_content ol.steps.red > li::before { background-color:#ef3d36; }
.activity_content ol.steps.yellow > li::before { background-color:#f3bb45; }
.activity_content ol.steps.green > li::before { background-color:#4bb955; }
/* number list shape */
.activity_content ol.puzzle { counter-reset: list_counter;}
.activity_content ol.puzzle > li { margin-left:60px; position:relative; padding-top:10px; padding-bottom:20px; }
.activity_content ol.puzzle > li::before { content:counter(list_counter); display: inline-block; height: 50px; width: 50px; position: absolute; top:0px; left:-60px; margin-right:10px; color:#ffffff; font-size:20px; font-weight:700; text-align:center; line-height:48px; background-size: 50px auto; background-repeat: no-repeat;}
.activity_content ol.puzzle.blue > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_blue.png); }
.activity_content ol.puzzle.red > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_red.png); }
.activity_content ol.puzzle.yellow > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_yellow.png); }
.activity_content ol.puzzle.green > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_green.png); }
.activity_content ol.gear { counter-reset: list_counter;}
.activity_content ol.gear > li { margin-left:60px; position:relative; padding-top:10px; padding-bottom:20px; }
.activity_content ol.gear > li::before { content:counter(list_counter); display: inline-block; height: 50px; width: 50px; position: absolute; top:0px; left:-60px; margin-right:10px; color:#ffffff; font-size:20px; font-weight:700; text-align:center; line-height:50px; background-size: 50px auto; background-repeat: no-repeat;}
.activity_content ol.gear.blue > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_blue_num.png); }
.activity_content ol.gear.red > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_red_num.png); }
.activity_content ol.gear.yellow > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_yellow_num.png); }
.activity_content ol.gear.green > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_green_num.png); }
/* style for editor */
/* font size */
.activity_summernote .note-editable, .activity_summernote .note-editable p, .activity_summernote .note-editable div, .activity_summernote .note-editable span, .activity_summernote .note-editable li { font-size: 18px; line-height:32px; color:#5e5873; font-family: 'Montserrat', '\5FAE\8EDF\6B63\9ED1\9AD4', 'Microsoft JhengHei', Helvetica, Arial, sans-serif; } /* 20240902 change this style */
.activity_summernote .note-editor h1, #modal_preview h1 { font-size:18px; font-weight:normal; margin-top:4px; margin-bottom: 6px; color:#5e5873; line-height: 1.2; }
.activity_summernote .note-editor h2, #modal_preview h2 { font-size:18px; font-weight:normal; margin-top:4px; margin-bottom: 6px; color:#5e5873; line-height: 1.2; }
.activity_summernote .note-editor h3, #modal_preview h3 { font-size:18px; font-weight:normal; margin-top:4px; margin-bottom: 6px; color:#5e5873; line-height: 1.2; }
.activity_summernote .note-editor h4, #modal_preview h4 { font-size:18px; font-weight:normal; margin-top:4px; margin-bottom: 6px; color:#5e5873; line-height: 1.2; }
.activity_summernote .note-editor h5, #modal_preview h5 { font-size:18px; font-weight:normal; margin-top:4px; margin-bottom: 6px; color:#5e5873; line-height: 1.2; }
.activity_summernote .note-editor h6, #modal_preview h6 { font-size:18px; font-weight:normal; margin-top:4px; margin-bottom: 6px; color:#5e5873; line-height: 1.2; }
.note-editor h1, .note-editor h2, .note-editor h3, .note-editor h4, .note-editor h5, .note-editor h6, .note-editor .h1, .note-editor .h2, .note-editor .h3, .note-editor .h4, .note-editor .h5, .note-editor .h6, #modal_preview h1, #modal_preview h2, #modal_preview h3, #modal_preview h4, #modal_preview h5, #modal_preview h6{ font-weight:normal; margin-top:4px; margin-bottom: 6px; line-height: 1.2; color:#5e5873; font-family: 'Montserrat', '\5FAE\8EDF\6B63\9ED1\9AD4', 'Microsoft JhengHei', Helvetica, Arial, sans-serif; }
.note-editor h1, .note-editor .h1, #modal_preview h1 { font-size:18px !important; }
.note-editor h2, .note-editor .h2, #modal_preview h2 { font-size:18px !important; }
.note-editor h3, .note-editor .h3, #modal_preview h3 { font-size:18px !important; }
.note-editor h4, .note-editor .h4, #modal_preview h4 { font-size:18px !important; }
.note-editor h5, .note-editor .h5, #modal_preview h5 { font-size:18px !important; }
.note-editor h6, .note-editor .h6, #modal_preview h6 { font-size:18px !important; }
.activity_summernote hr { margin-top: 2rem; margin-bottom: 2rem; }
/* card and header */
/*
.activity_summernote .note-editable { padding:10px 70px 20px 70px!important; }
@media (max-width:1440px) {
.activity_summernote .note-editable { padding:1.4vw 5vw!important; }
}
*/
.activity_summernote .note-editable img[width='100%'] { width:70%!important; height:auto!important; }
.activity_summernote .note-editable img[style*='100%'] { width:70%!important; height:auto!important; }
.activity_summernote .note-editable .swiper-container img[width='100%'] { width:100%!important; height:auto!important; }
.activity_summernote .note-editable .swiper-container img[style='width: 100%;'] { width:100%!important; height:auto!important; }
.activity_summernote .note-editable .swiper-container { width:70%!important; margin-left:0px; margin-right:inherit; }
@media (max-width:1200px) {
.activity_summernote .note-editable img[width='100%'] { width:80%!important; height:auto!important; }
.activity_summernote .note-editable img[style*='100%'] { width:80%!important; height:auto!important; }
.activity_summernote .note-editable .swiper-container img[width='100%'] { width:100%!important; height:auto!important; }
.activity_summernote .note-editable .swiper-container img[style='width: 100%;'] { width:100%!important; height:auto!important; }
.activity_summernote .note-editable .swiper-container { width:80%!important; }
}
@media (max-width:1000px) {
.activity_summernote .note-editable img[width='100%'] { width:100%!important; height:auto!important; }
.activity_summernote .note-editable img[style*='100%'] { width:100%!important; height:auto!important; }
.activity_summernote .note-editable .swiper-container img[width='100%'] { width:100%!important; height:auto!important; }
.activity_summernote .note-editable .swiper-container img[style='width: 100%;'] { width:100%!important; height:auto!important; }
.activity_summernote .note-editable .swiper-container { width:100%!important; }
}
/* list base setting */
.activity_summernote .note-editable ul.custom_style { list-style:none; padding-left:0px; }
.activity_summernote .note-editable ul.custom_style > li { counter-increment: list_counter; }
.activity_summernote .note-editable ol.custom_style { list-style: none; padding-left:0px; }
.activity_summernote .note-editable ol.custom_style > li { counter-increment: list_counter; }
/* list objects */
.activity_summernote .note-editable ul.pencil { counter-reset: list_counter; }
.activity_summernote .note-editable ul.pencil > li { margin-left:40px; position:relative; padding-top:5px; padding-bottom:13px; }
.activity_summernote .note-editable ul.pencil > li::before { content:""; display: inline-block; height: 30px; width:30px; position: absolute; top:2px; left:-40px; background-image: url(../../app-assets/images/activities/list_style_pencil.png); background-size: 30px 30px; background-repeat: no-repeat; }
.activity_summernote .note-editable ul.apple { counter-reset: list_counter; }
.activity_summernote .note-editable ul.apple > li { margin-left:40px; position:relative; padding-top:5px; padding-bottom:13px; }
.activity_summernote .note-editable ul.apple > li::before { content:""; display: inline-block; height: 30px; width:30px; position: absolute; top:2px; left:-40px; background-image: url(../../app-assets/images/activities/list_style_apple.png); background-size: 30px 30px; background-repeat: no-repeat; }
.activity_summernote .note-editable ul.bulb { counter-reset: list_counter; }
.activity_summernote .note-editable ul.bulb > li { margin-left:40px; position:relative; padding-top:5px; padding-bottom:13px; }
.activity_summernote .note-editable ul.bulb > li::before { content:""; display: inline-block; height: 34px; width:34px; position: absolute; top:0px; left:-40px; background-image: url(../../app-assets/images/activities/list_style_bulb.png); background-size: 34px 34px; background-repeat: no-repeat; }
.activity_summernote .note-editable ul.book { counter-reset: list_counter; }
.activity_summernote .note-editable ul.book > li { margin-left:40px; position:relative; padding-top:5px; padding-bottom:13px; }
.activity_summernote .note-editable ul.book > li::before { content:""; display: inline-block; height: 30px; width:30px; position: absolute; top:5px; left:-40px; background-image: url(../../app-assets/images/activities/list_style_book.png); background-size: 30px 30px; background-repeat: no-repeat; }
/* list shape */
.activity_summernote .note-editable ul.gear { counter-reset: list_counter; }
.activity_summernote .note-editable ul.gear > li { margin-left:40px; position:relative; padding-top:3px; padding-bottom:11px; }
.activity_summernote .note-editable ul.gear > li::before { content:""; display: inline-block; height: 30px; width:30px; position: absolute; top:3px; left:-40px; background-size: 30px 30px; background-repeat: no-repeat; }
.activity_summernote .note-editable ul.gear.blue > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_blue.png); }
.activity_summernote .note-editable ul.gear.red > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_red.png); }
.activity_summernote .note-editable ul.gear.yellow > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_yellow.png); }
.activity_summernote .note-editable ul.gear.green > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_green.png); }
.activity_summernote .note-editable ul.puzzle { counter-reset: list_counter; }
.activity_summernote .note-editable ul.puzzle > li { margin-left:40px; position:relative; padding-top:3px; padding-bottom:11px; }
.activity_summernote .note-editable ul.puzzle > li::before { content:""; display: inline-block; height:26px; width:26px; position: absolute; top:4px; left:-40px; background-size: 26px 26px; background-repeat: no-repeat; }
.activity_summernote .note-editable ul.puzzle.blue > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_blue.png); }
.activity_summernote .note-editable ul.puzzle.red > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_red.png); }
.activity_summernote .note-editable ul.puzzle.yellow > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_yellow.png); }
.activity_summernote .note-editable ul.puzzle.green > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_green.png); }
/* number list */
.activity_summernote .note-editable ol.steps { counter-reset: list_counter; }
.activity_summernote .note-editable ol.steps > li { margin-left:45px; position:relative; padding-top:4px; padding-bottom:12px; }
.activity_summernote .note-editable ol.steps > li::before { content:counter(list_counter); display: inline-block; height:34px; width:34px; line-height:34px; position: absolute; top:2px; left:-45px; color:#ffffff; font-size:20px; font-weight:700; border-radius:50px; text-align:center; }
.activity_summernote .note-editable ol.steps.blue > li::before { background-color:#2ec5f3; }
.activity_summernote .note-editable ol.steps.red > li::before { background-color:#ef3d36; }
.activity_summernote .note-editable ol.steps.yellow > li::before { background-color:#f3bb45; }
.activity_summernote .note-editable ol.steps.green > li::before { background-color:#4bb955; }
/* number list shape */
.activity_summernote .note-editable ol.puzzle { counter-reset: list_counter;}
.activity_summernote .note-editable ol.puzzle > li { margin-left:60px; position:relative; padding-top:10px; padding-bottom:20px; }
.activity_summernote .note-editable ol.puzzle > li::before { content:counter(list_counter); display: inline-block; height: 50px; width: 50px; position: absolute; top:0px; left:-60px; margin-right:10px; color:#ffffff; font-size:20px; font-weight:700; text-align:center; line-height:48px; background-size: 50px auto; background-repeat: no-repeat;}
.activity_summernote .note-editable ol.puzzle.blue > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_blue.png); }
.activity_summernote .note-editable ol.puzzle.red > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_red.png); }
.activity_summernote .note-editable ol.puzzle.yellow > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_yellow.png); }
.activity_summernote .note-editable ol.puzzle.green > li::before { background-image: url(../../app-assets/images/activities/list_style_puzzle_green.png); }
.activity_summernote .note-editable ol.gear { counter-reset: list_counter;}
.activity_summernote .note-editable ol.gear > li { margin-left:60px; position:relative; padding-top:10px; padding-bottom:20px; }
.activity_summernote .note-editable ol.gear > li::before { content:counter(list_counter); display: inline-block; height: 50px; width: 50px; position: absolute; top:0px; left:-60px; margin-right:10px; color:#ffffff; font-size:20px; font-weight:700; text-align:center; line-height:50px; background-size: 50px auto; background-repeat: no-repeat;}
.activity_summernote .note-editable ol.gear.blue > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_blue_num.png); }
.activity_summernote .note-editable ol.gear.red > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_red_num.png); }
.activity_summernote .note-editable ol.gear.yellow > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_yellow_num.png); }
.activity_summernote .note-editable ol.gear.green > li::before { background-image: url(../../app-assets/images/activities/list_style_gear_green_num.png); }
/* template form */
/* ticket radio */
.ticket_radio { display:inline; }
.ticket_radio label { display:inline-block; font-size: 1rem; font-weight: 400; line-height:20px; position:relative; cursor:pointer; padding-left:32px; margin-right:10px; min-height: 24px; margin-bottom: 0px; margin-top: 10px; }
.ticket_radio input[type="radio"] { position:absolute; left:-9999px; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; padding: 0px 30px 0px 0px; border-radius:0px; text-align: center; margin:0px; position: absolute; left: 0px; }
.ticket_radio input[type="radio"]:before { content:" "; display:block; border:1px solid #cccccc; width:24px; height:24px; position:absolute; top:0px; left:0px; border-radius:100%; cursor:pointer; }
.ticket_radio input[type="radio"]:after { content:" "; display:block; width:16px; height:16px; position:absolute; top:4px; left:4px; display:inline-block; background-image:none; background-size:100% auto; filter: invert(61%) sepia(12%) saturate(2237%) hue-rotate(77deg) brightness(92%) contrast(87%); cursor:pointer; }
.ticket_radio input[type="radio"]:checked:after { background-image: url("data:image/svg+xml,"); }
.ticket_radio span {line-height:1.2;}
/* ticket checkbox */
.ticket_checkbox { display:inline; }
.ticket_checkbox label { display:inline-block; font-size: 1rem; font-weight: 400; line-height:20px; position:relative; cursor:pointer; padding-left:32px; margin-right:10px; min-height: 24px; margin-bottom: 0px; margin-top: 10px; }
.ticket_checkbox input[type="checkbox"] { position:absolute; left:-9999px; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; padding: 0px 30px 0px 0px; border-radius:0px; text-align: center; margin:0px; position: absolute; left: 0px; }
.ticket_checkbox input[type="checkbox"]:before { content:" "; display:block; border:1px solid #cccccc; width:24px; height:24px; position:absolute; top:0px; left:0px; border-radius:0px; cursor:pointer; }
.ticket_checkbox input[type="checkbox"]:after { content:" "; display:block; width:16px; height:16px; position:absolute; top:4px; left:4px; display:inline-block; background-image:none; background-size:100% auto; filter: invert(61%) sepia(12%) saturate(2237%) hue-rotate(77deg) brightness(92%) contrast(87%); cursor:pointer; }
.ticket_checkbox input[type="checkbox"]:checked:after { background-image: url("data:image/svg+xml,"); }
.ticket_checkbox span {line-height:1.2;}
/* radio buttons */
#attendee_form .form-group .controls > div { display:flex; }
.radio_btn label { padding:0px; /*padding-right:8px;*/ width:100%; display:flex; height:50px; margin:0px; }
.radio_btn label input[type="radio"] { position:absolute; left:-9999px; }
.radio_btn label span { display: flex; align-items: center; font-size: 1rem; font-weight: 400; line-height: 1.45; height:100%; width:100%; padding: 0.7rem 0.7rem; border:1px solid #cccccc; color: #333; background-color: #fff; border-radius:0px; -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
.radio_btn label span:hover { background-color: #e6e6e6; /*border-color: #adadad;*/ }
.radio_btn label input[type="radio"]:checked ~ span { color: #fff; background-color:#2f286d; border-color:#2f286d; }
.radio_btn label input[type="radio"]:checked:focus ~ span { color: #fff; background-color:#2f286d; border-color:#2f286d; }
.radio_btn label .input-group-prepend { height:50px; }
.radio_btn label .input-group-prepend span { border-top-right-radius: 0px; border-bottom-right-radius: 0px; }
/*.radio_btn label span:hover { border-color: #EA5455; }
.radio_btn label span { border-color: #EA5455; }*/
/* checkbox buttons */
#attendee_form .form-group .controls > div { display:flex; }
.radio_btn label { padding:0px; /*padding-right:8px;*/ width:100%; display:flex; height:50px; margin:0px; }
.radio_btn label input[type="checkbox"] { position:absolute; left:-9999px; }
.radio_btn label span { display: flex; align-items: center; font-size: 1rem; font-weight: 400; line-height: 1.45; height:100%; width:100%; padding: 0.7rem 0.7rem; border:1px solid #cccccc; color: #333; background-color: #fff; border-radius:0px; -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
.radio_btn label span:hover { background-color: #e6e6e6; /*border-color: #adadad;*/ }
.radio_btn label input[type="checkbox"]:checked ~ span { color: #fff; background-color:#2f286d; border-color:#2f286d; }
.radio_btn label input[type="checkbox"]:checked:focus ~ span { color: #fff; background-color:#2f286d; border-color:#2f286d; }
.radio_btn label .input-group-prepend { height:50px; }
.radio_btn label .input-group-prepend span { border-top-right-radius: 0px; border-bottom-right-radius: 0px; }
/*.radio_btn label span:hover { border-color: #EA5455; }
.radio_btn label span { border-color: #EA5455; }*/
/* sub-color */
.text-primary { color: #2f286d!important; }
.subcolor_magenta { color: #ed217c!important; } /* magenta */
.subcolor_red { color: #dd4d66!important; } /* red */
.subcolor_pink { color: #f27fb2!important; } /* pink */
.subcolor_orange { color: #ef3d36!important; } /* orange */
.subcolor_peach { color: #dc4e65!important; } /* peach */
.subcolor_yellow { color: #f3bb45!important; } /* yellow */
.subcolor_green_light { color: #b1c947!important; } /* brighter green */
.subcolor_green { color: #4bb955!important; } /* green */
.subcolor_green_dark { color: #009390!important; } /* lake green */
.subcolor_blue_light { color: #2ec5f3!important; } /* lighter blue */
.subcolor_blue { color: #00aeef!important; } /* sky blue */
.subcolor_magenta_fill { color: #ed217c!important; fill: #ed217c!important; } /* magenta */
.subcolor_red_fill { color: #dd4d66!important; fill: #dd4d66!important; } /* red */
.subcolor_pink_fill { color: #f27fb2!important; fill: #f27fb2!important; } /* pink */
.subcolor_orange_fill { color: #ef3d36!important; fill: #ef3d36!important; } /* orange */
.subcolor_peach_fill { color: #dc4e65!important; fill: #dc4e65!important; } /* peach */
.subcolor_yellow_fill { color: #f3bb45!important; fill: #f3bb45!important; } /* yellow */
.subcolor_green_light_fill { color: #b1c947!important; fill: #b1c947!important; } /* brighter green */
.subcolor_green_fill { color: #4bb955!important; fill: #4bb955!important; } /* green */
.subcolor_green_dark_fill { color: #009390!important; fill: #009390!important; } /* lake green */
.subcolor_blue_light_fill { color: #2ec5f3!important; fill: #2ec5f3!important; } /* lighter blue */
.subcolor_blue_fill { color: #00aeef!important; fill: #00aeef!important; } /* sky blue */
.bg-primary { background-color: #2f286d!important; }
.bg-subcolor_magenta { background-color: #ed217c!important; } /* magenta */
.bg-subcolor_red { background-color: #dd4d66!important; } /* red */
.bg-subcolor_pink { background-color: #f27fb2!important; } /* pink */
.bg-subcolor_orange { background-color: #ef3d36!important; } /* orange */
.bg-subcolor_peach { background-color: #dc4e65!important; } /* peach */
.bg-subcolor_yellow { background-color: #f3bb45!important; } /* yellow */
.bg-subcolor_green_light { background-color: #b1c947!important; } /* brighter green */
.bg-subcolor_green { background-color: #4bb955!important; } /* green */
.bg-subcolor_green_dark { background-color: #009390!important; } /* lake green */
.bg-subcolor_blue_light { background-color: #2ec5f3!important; } /* lighter blue */
.bg-subcolor_blue { background-color: #00aeef!important; } /* sky blue */
.bg-grey { background-color: #cccccc; }
#modal_slider .note-group-image-url { display:none; }
/* img swiper */
.imgslider.swiper-container { padding-top:5px; padding-bottom:10px; }
.imgslider.swiper-container .imgslider_pagination { position:static; bottom:0px; margin:0px; }
.imgslider .swiper-pagination-bullet { width: 16px; height: 16px; margin:0px 5px; }
.imgslider_swiper_control { margin-top:5px; height:50px; }
.imgslider_prev { position:static; top:0px; bottom:0px; margin:0px; }
.imgslider_prev:after { color:#2f286d; content: "\e843"; font-family: feather!important; background-image:none; font-size:40px; }
.imgslider_next { position:static; top:0px; bottom:0px; margin:0px; }
.imgslider_next:after { color:#2f286d; content: "\e844"; font-family: feather!important; background-image:none; font-size:40px; }
/* preview swiper */
.previewslider.swiper-container { padding-top:5px; padding-bottom:10px; }
.previewslider.swiper-container .previewslider_pagination { position:static; bottom:0px; margin:0px; }
.previewslider .swiper-pagination-bullet { width: 16px; height: 16px; margin:0px 5px; }
.previewslider_swiper_control { margin-top:5px; height:50px; }
.previewslider_prev { position:static; top:0px; bottom:0px; margin:0px; }
.previewslider_prev:after { color:#2f286d; content: "\e843"; font-family: feather!important; background-image:none; font-size:40px; }
.previewslider_next { position:static; top:0px; bottom:0px; margin:0px; }
.previewslider_next:after { color:#2f286d; content: "\e844"; font-family: feather!important; background-image:none; font-size:40px; }
.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
background-color: #2f286d;
}
@media only screen and (max-width: 768px) {
.swiper-button-prev:after { height:inherit; width:inherit; }
}
/* no crop dropzone */
.no_crop .dz-message { height:402px; }
.no_crop.dropzone.single_image .dz-processing { min-height:402px!important; }
.no_crop.dropzone.single_image .dz-success { min-height:inherit!important; }
.no_crop.dropzone.single_image .dz-complete { min-height:inherit!important; }
@media (max-width: 575.9px) {
.no_crop .dz-message { height:inherit; }
.no_crop.dropzone.single_image .dz-processing { min-height:inherit!important; }
}
.no_crop.dropzone.single_image .dropzone-choose { left: calc(50% - 70px)!important; }
.no_crop.dropzone.single_image .dropzone-crop { display:none!important; }
.no_crop.dropzone.single_image .dz-remove { left: calc(50% + 10px)!important; }
/* rating and comments */
/* font size */
.rating_content, .rating_content p, .rating_content div, .rating_content span, .rating_content li, .rating_content textarea { font-size:16px; line-height:28px; font-family: 'Montserrat', '\5FAE\8EDF\6B63\9ED1\9AD4', 'Microsoft JhengHei', Helvetica, Arial, sans-serif !important; }
.rating_content .rating_stars span { line-height:1.5; }
/* card and header */
.rating_content .card-body { padding:10px 70px 20px 70px!important; }
@media (max-width:1440px) {
.rating_content .card-body { padding:1.4vw 5vw!important; }
}
.rating_content .card .heading-elements a[data-action='collapse'].rotate i, .card .card-header .heading-elements a[data-action='collapse'].rotate svg { position: relative; top: 3px; left: 5px; }
.rating_content section.card { border-bottom: 1px solid #eeeeee; border-radius: 20px 20px 0px 0px; }
.rating_content section.card:last-child { border-bottom:0px; }
/* 20231207 upload file basic */
.custom-image { position: relative; display: inline-block; width: 100%; min-height:50px; margin-bottom: 0; }
/*.custom-image-input { position: relative; z-index: 2; width: 100%; height: 50px; margin: 0; overflow: hidden; opacity: 0; }
.custom-image-input:lang(en) ~ .custom-file-label::after { content:"Add image"; }*/
.custom-image-label { position:static; top:0; right:0; bottom:0; z-index:3; line-height:32px; padding:0.6rem 1rem; color:#6e6b7b; content:"Browse"; background-color:white; border-radius:0px; margin:0px; border-left:1px solid #d8d6de; cursor:pointer; text-wrap:nowrap; display:flex; order:2; }
.form-group label.custom-image-label { margin-bottom:0px; }
.custom-image-input_multiple { position:absolute; z-index:-1; }
.custom-image-box { position:static; top:0; right:0; left:0; z-index:1; min-height:50px!important; max-height:auto!important; height:auto!important; padding:0px; overflow: hidden; font-weight: 400; line-height:32px; color: #6e6b7b; background-color:#fff; border:1px solid #d8d6de; border-radius:0px; display:flex; flex-wrap:nowrap; justify-content:space-between; order:1; flex: 1 1 100%; }
.custom-image-preview { padding:6px 4px 4px 6px; display:flex; flex-wrap:wrap; }
.custom-image-preview .photo_item { position:relative; overflow:hidden; margin-right:2px; margin-bottom:2px; cursor:pointer; }
.custom-image-preview .photo_item:before { display:block; content:""; position:absolute; width:100%; height:100%; background-color:rgba(0, 0, 0, 0); -webkit-transition:background-color 0.15s ease 0s; -o-transition:background-color 0.15s ease 0s; transition:background-color 0.15s ease 0s; z-index:10; }
.custom-image-preview .photo_item:after { font-family:feather; font-size:24px; color:#ffffff; content:"\e8bd"; width:24px; height:24px; line-height:24px; position:absolute; margin-left:-12px; margin-top:-12px; left:50%; top:50%; opacity:0; -webkit-transition:opacity 0.3s ease 0s; -o-transition:opacity 0.3s ease 0s; transition:opacity 0.3s ease 0s; z-index:200; }
.custom-image-preview .photo_item.action_view { cursor:pointer; }
.custom-image-preview .photo_item.action_delete { cursor:pointer; }
.custom-image-preview .photo_item.action_delete:after { font-family:feather; content: "\e8db"; }
.custom-image-preview .photo_item:hover img { -webkit-transform:scale3d(1.1, 1.1, 1.1); transform:scale3d(1.1, 1.1, 1.1); }
.custom-image-preview .photo_item:hover:before { background-color:rgba(0, 0, 0, 0.4); }
.custom-image-preview .photo_item:hover:after { opacity:1; }
.custom-image-preview img { height:100px; width:auto; cursor:pointer; }
/*
.custom-image-preview img:before { content:"1"; text-indent:-9999px; display:inline-block; width:40px; height:40px; position: absolute; margin-top: -20px; top: 50%; left: 50%; margin-left: -20px; background-image: url("data:image/svg+xml,"); background-size:100% auto; filter: invert(100%) sepia(100%) saturate(1%) hue-rotate( 46deg) brightness(105%) contrast(101%); opacity:0.7; -webkit-transition:opacity 0.4s ease-in; -moz-transition:opacity 0.4s ease-in; -ms-transition:opacity 0.4s ease-in; -o-transition:opacity 0.4s ease-in; transition:opacity 0.4s ease-in; }
.custom-image-preview img:hover:before { opacity:1; }
.custom-image-preview img:after { content: ""; display:none; }
*/
/* check box and radio button */
.image-wrap { position:relative; }
.image-wrap .myCheck { position:absolute; top:10px; left:10px; font-weight:normal; cursor:pointer; z-index:1; }
.image-wrap .myCheck input { display:none; }
.image-wrap .myCheck span.details_input:before { color:#76ce76; font:normal 24px/1 FontAwesome; content:"\f10C"; width:24px; height:24px; line-height:24px; position:relative; top:3px; }
.image-wrap .myCheck input:checked + span.details_input:before { content:"\f058"; }
.image-wrap .myCheck_x input:checked + span.details_input:before { content:"\f057"; }
.image-wrap .myCheck.minus span.details_input:before { content:"\f056"; }
.image-wrap .myCheck input:disabled ~ span:before { color:#cccccc; cursor:default; }
.image-wrap input { opacity:0; position:absolute; height:24px; width:24px; top:10px; left:10px; cursor:pointer; z-index:2; }
.image-wrap span.details_input { position:absolute; top:10px; left:10px; cursor:pointer; width:24px; height:24px; z-index:1; }
.image-wrap span.details_input:before { color:#76ce76; font:normal 24px/1 FontAwesome; content:"\f10C"; width:24px; height:24px; line-height:24px; }
.image-wrap input:checked + span.details_input:before { content:"\f057"; }
/*.image-wrap span.details_input:before { position:absolute; top:0px; left:0px; background-color: #ffffff; border-radius: 100%; width: 25px; height: 25px; }*/