body {
  color: #424242; 
  background-color: #FFFFFF; 
  font-family: Calibri, Arial, "Microsoft Yahei", sans-serif; 
  line-height: 1.4em; 
  }

html, body {width:100%; padding:0; margin:0;}


.page-title { padding-top:30px; color:#0080FF; font-size: 1.5rem; }

/* -- a:link, a:visited, a:active {color: #0080FF; text-decoration: none; } -- */
a:hover {color: #F75000; text-decoration: none;}

/* -- General table - normal font size and padding -- */
.table td{font-size:1rem; color: #333; }
.table td a {color: #0080FF; }
.table td a:hover { color: #F75000; }


.home-banner-text1 {
  bottom: 18%;
  text-align: center;
}

.home-banner-btn a {
  font-size: 1.1rem;
  padding: .7em 1em;
  border: 1px solid white;
  color: white;
  opacity: 0.95;
  background-color: #9F35FF;
  border-radius: 3px;
}

.home-banner-btn a:hover {
  background-color: #F75000;
  text-decoration: none
}


.txt-main {
  color: #424242;
}

.txt-main2 {
  color: #977C00;
}

.txt-title {
  color: #0080FF;
}
/* .txt-title {
  color: #ffc107;
} */

.txt-act {
  color: #784949;
}

.txt-abs {
  color: #9A0007;
}

.txt-gal {
  color: #1A237E;
}

.txt-nav {
  color: #616161;
}

.txt-apply {
  color: #EC0000;
}

/* .bg-topbar {
  background-color: #efebe9;
} */



.bg-topbar {
  /* background-color: #ffb300; */
  background-color: #FFEEDD;
}



.bg-apply {
  background-color: #AAAAFF;
}

.bg-about {
  background-color: #f5f5f5;
}

.bg-main {
  background-color: #FFC107;
}

.bg-abs {
  background-color: #1976d2;
}

.bg-abs-cards {
  background-color: #FFF8E1;
}

.bg-gallery {
  background-color: #FFEEDD;
}

.bg-contact {
  background-color: white;
}

.bg-footer {
  background-color: #ECEFF1;
}

.bg-disclaim {
  background-color: #546E7A;
}

.btn-act {
  background-color: #6A1B9A;
}


/* Header & Navbar */
@media (max-width: 1199.98px) { .navbar-nav .nav-link {padding: 12px 8px; font-weight: 400; font-size: 13px;}}


.dropdown-menu {
    background-color: #ECFFFF;
}

.dropdown-menu > li > a:hover {
    background-color: #FBFFFD;
}


#topBar a, #topBar {
  color: #757575;
}

#topBar a:hover {
  color: #F75000;
}

#topBar {
  position: relative;
}

#topFollowContainer {
  position: absolute;
  z-index: 1000;
  right: 0;
  background: white;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.16);
}

.top-follow-option {
  padding: 0.5rem 1.5rem;
  margin: 0.5rem 0;
}

.top-follow-option:hover {
  background-color: #e8eaf6;
}

.top-follow-option a {
  color: #5f4339;
}

.top-nav {
  z-index: 999;
  background-color: white;
  font-size: 1rem;
}

.nav-logo-shrink {
  height: 35px;
}

.nav-title-txt1 {
  font-size: 14px;
}

.nav-title-txt2 {
  font-size: 18px;
}

.nav-title-txt3 {
  font-size: 26px;
}


@media only screen and (max-width: 768px) {
  .nav-logo {
    height: 35px;
  }
  .nav-title-txt4 {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.1em;
  }
  .content-title {
  font-weight: 400;
  color: navy;
  }  
}

.top-lang-toggler {
  color: black;
  line-height: 0;
}

.scroll-nav {
  top: -500px;
  position: fixed;
  width: 100%;
  transition: top 0.3s;
}

#topNavContent .nav-item a:hover, #topLang .nav-item a:hover, #topShare .nav-item a:hover {
  color: #F75000;
}

.top-nav-apply {
  color: #0080FF !important;
}

.top-nav-apply-expired {
  color: lightgray !important;
  cursor: default;
}

.top-nav-apply:hover {
  color: #ffab91 !important;
}

/* Banner */
#home-slide-banner .carousel-inner .carousel-item .view img {
  min-height: 300px;
  max-height: 575px;
  object-fit: cover;
}

/* Apply */
.apply-title {
  font-size: 1.1rem;
  font-weight: bold;
}

.apply-btn {
  color: white;
  border: 2px solid white;
  padding: .5rem 1rem;
}

.apply-btn:hover {
  color: #c62828;
  background-color: white;
}

.apply-btn-expired {
  color: white;
  border: 2px solid white;
  padding: .5rem 1rem;
  background-color: rgba(255, 255, 255, 0.4); 
}

.apply-btn-expired:hover {
  cursor: default;
}

.text-compress-expand {
  color: #5c6bc0!important;
}

.text-compress-expand:hover {
  text-decoration: underline!important;
}


/* About */
.about-text {
  font-size: 1rem;
}

.about-parallax {
  background-image: url("/20220831101956oe_/https://www.cuecu.hk/images/home1.JPG");
  height: 300px;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.about-parallax2 {
  background-image: url("/20220831101956oe_/https://www.cuecu.hk/images/home2.JPG");
  height: 300px;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media only screen and (max-device-width: 1024px) {
  .about-parallax, .about-parallax2 {
    background-attachment: scroll;
  }
}

/* Gallery */
.btn-gallery-carousel {
  padding: 12px 0;
}


/* Contact Us */
.contact-txt {
  font-size: 1.1rem;
  font-weight: bold;
}

.contact-hour-table {
  margin-bottom: 0!important;
}

.contact-hour-table td {
  font-size: 1rem;
  padding: .2rem .1rem .1rem 0!important;
}

.contact-icon:hover {
  cursor: default;
}

/* Organizer */
.org-names {
  font-size: .9rem;
  line-height: 1.5rem;
}

/* To-Top Button */
.totop-btn {
  position: fixed;
  bottom: 40px;
  right: 40px;
  opacity: 0.8;
}


/* Footer */
.footer-logo img {
  height: 80px;
}

@media only screen and (max-width: 992px) {
  .footer-logo img {
  height: 60px;
}
}

.disclm-text {
  font-size: .9rem;
  color: #FFF;
}




/******************* Crop Image ********************/

.crop1
{
    width: 100%;
    height: 180px;
    overflow: hidden;
    position: relative;
}
.crop1 img {
    position: absolute;  
    margin: auto; 
    min-height: 100%;
    min-width: 100%;
	object-fit: cover;

    /* For the following settings we set 100%, but it can be higher if needed 
    See the answer's update */
    left: -100%;
    right: -100%;
    top: -50%;
    bottom: -50%;
}

/* ---Booking Form--- */
.custom-select2 {border-top-color:#FFF; border-left-color:#FFF; border-right-color:#FFF; border-bottom: 1px solid #CCCCCC; width:100%; height:40px; background-color:#FFF; }
.custom-select2.is-invalid,.was-validated .custom-select2:invalid{
	border-bottom: 1px solid #dc3545;
	padding-right:calc((1em + .75rem) * 3 / 4 + 1.75rem);
	background:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23dc3545' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23dc3545' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E") #fff no-repeat center right 1.75rem/calc(.75em + .375rem) calc(.75em + .375rem)
	}
.custom-select2.is-invalid~.invalid-feedback,.was-validated .custom-select2:invalid~.invalid-feedback{display:block}

.formname {font-size: 0.8em; color:#9D9D9D; padding:0px;}
.ui-widget-content {width:230px!important}
.md-form {margin:5px!important}

.testerror {
 padding-right:calc(1.5em + .75rem);
 background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
 background-repeat:no-repeat;
 background-position:center right calc(.375em + .1875rem);
 background-size:calc(.75em + .375rem) calc(.75em + .375rem)
}

/* ---News Date--- */
#rcorners1 {
    border-radius: 5px;
	border: 1px solid #CCCCCC;
    background: #FFFBE8;
    width: 70px;
    height: 75px; 
  -moz-box-shadow: 1px 2px 2px rgba(204,204,204,0.6);
  -webkit-box-shadow: 1px 2px 2px rgba(204,204,204,0.6);
  box-shadow: 1px 2px 2px rgba(204,204,204,0.6);

}

.news-month{
    border-radius: 5px 5px 0px 0px;
    background: #FD9F1B;
    display: block;
    font-size: 12px;
    text-align: center;
    font-weight: bold;
	padding:2px;
    color: #fff;
    text-transform: uppercase;
}
.news-date{
    display: block;
	color: #000000;
 	padding-top:3px ;
    font-weight: bold;
    font-size: 22px;
    text-align: center;
}
.news-year{
    border-radius: 0px 0px 5px 5px;
    display: block;
	color: #FD9F1B;
	padding-bottom:2px;
    font-weight: bold;
    font-size: 12px;
    text-align: center;
}