body {
	height: 100%;
    align-items: center;
    background-color: #f7f7f7;
    color: #2d333f;
}
body, #outer_wrapper {
	font-family:arial,sans-serif;padding:0px;margin:0;color:#525252;
	width: 100%;
    display: flex;
    flex-direction: column;
}
#outer_wrapper { max-width: 100rem;margin-bottom:30px; }
#top-header {
	display:flex;
	padding:8px; 
	justify-content: space-between;
}
.home-image img { width:160px; }
#content-inner { padding:20px; }
#inner_content {
	display: flex;
    flex-direction: column;
    width: 100%;
}
#header-divide {border-top: 1px solid #b1b1b1;margin-bottom: 15px;}
#header { 
	display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    background-size: cover;
    background-position: 50%;
    min-height: 26rem;
    position: relative;
}
#header_inner {
	top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-image: linear-gradient(231deg,rgb(161 159 159 / 0%),rgb(0 0 0 / 60%)),url(/images/court1a.jpg);
    background-position: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 1;
    display: flex;
    justify-content: center;
    flex-direction: column;
	min-height:26rem;
	width:100%;
	padding:10px 0;
}
#header_inner.image2 {
	background-image: linear-gradient(90deg,rgb(161 159 159 / 31%),rgb(0 0 0 / 20%)),url(/images/court2a.jpg);}
#header_content {
    z-index: 1;
    padding: 0 8px;
}
#main { max-width:800px;margin:auto auto;color:#fff;}
	.input-group-append button { background-color:#fff!important;}
	.form-group { margin-right:8px;}
	.align-btn {
	margin-top: 32px;
    min-width: 80px;
}
#loc_msg {
	padding: 10px;
    color: #ffd400;
}
.club .clubAddress { vertical-align:middle;margin-right:0;min-width:200px;}
.clubAddress p { margin:0;padding:0;font-size: 14px;min-width:200px;line-height: 1.3;}
.club { border:1px solid grey;padding:10px;display:flex;max-width: 400px;margin-top: 10px; }
.club:hover { cursor:pointer; }
.club-selected { background-color:#147f0b;color:#fff;box-shadow: 0 0 10px 5px #abaaaa;}
.club div { display:inline-block;margin-right:8px;}
.club div img { max-width:100%;height:auto;}
.clubCheck { z-index: -1; }
.small { margin: 0;font-size: 12px;}
#clubs { flex-wrap:wrap;justify-content: space-evenly;}
.resultBanner {    
	font-size: 18px;
	padding-top: 20px;
    text-align: center;
    padding-bottom: 10px;
}
#searchResults button { display:block;margin:10px auto;}
#footer { 
    color: 4c4c4c;
    font-size: 11px;
	width: 100%;
    text-align: center;
	padding:5px;
}
#footer::before {content: "Find a Court \00a9  2024";}
#map {
	margin:20px auto 0 auto;
	min-height:410px;
	min-width:320px;
	width:100%;
}
.checkbox-club { height:100%;}

/* Specific to Results Page */

.clubTab { padding:10px;display:none;padding:12px;
    -webkit-animation: fadeEffect 1s;
    animation: fadeEffect 1s; /* Fading effect takes 1 second */
}
@-webkit-keyframes fadeEffect {from {opacity: 0;} to {opacity: 1;}}
@keyframes fadeEffect { from {opacity: 0;}to {opacity: 1;}}

.tabSelected { display:block;}
.policy {font-size: 12px;background: #e4e4e3;border: 1px solid #b1b1b1;padding: 8px;margin-bottom: 10px;white-space: normal;color: #333}
.policy p { margin-bottom:0;}
.court {flex: 0 0 auto;border:1px solid #8e8e8e;margin-right:10px;min-width:150px;vertical-align:top;flex-grow:1.0;max-width:350px;}
.courtHead { color:#fff;background-color:#28a745;text-align:center;padding:5px}
.slot {display: flex;justify-content: center;color:#696868;border-bottom: 1px solid #bfbfbf;font-size:14px;padding:20px 5px;background:#fff;}
.slot:hover { background-color:#3e3e3e;color:#fff;cursor:pointer;}
.slot.slotSelected {background-color:#9e9e9e;color:#fff;}
ul.tab {list-style-type: none;padding: 0;overflow: hidden;border: 1px solid #ccc;background-color: #f1f1f1;display: flex;flex-wrap: wrap;align-items: center;margin: 0 8px;}
ul.tab li {text-align: center;padding: 10px;text-decoration: none;transition: 0.3s;font-size: 0.9rem;}
ul.tab li:hover {background-color: #2f2f2f;color:#fff;}
ul.tab li:focus, .active {background-color: #4e4e4e;color:#fff;cursor:pointer;}
.tab>* { flex: 1 1 200px;}
.scrolling-wrapper {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.scrolling-wrapper::before, .scrolling-wrapper::after {
  content: '';
  margin: auto;
}
#msgHeader { font-size: 0.9rem;padding-right: 8px;margin:14px 0;}
#signUp { font-size: 0.9rem; }
.dropdown-toggle.pub { padding: 5px 10px;color:#fff!important;background-color:#444444!important;border:none!important;border-radius:unset!important;}
.dropdown-item.pub { padding:12px;font-size:0.9rem;border-top:1px solid #b5b5b5;}
.dropdown-item.pub:hover { background-color:#2b2b2b;color:#fff;}
.dropdown-toggle::after { margin-left:85px;}
.preBook { display:flex;}
.preBook p { display:inline-block;min-width:120px;}
input::placeholder { color:#c7c7c7!important}
.heading-text { font-size:1.2rem;}

.header_title { margin: auto auto;}
.header_title img { height:3.5rem; }
@media (max-width:900px) { .header_title { display:none;}}
#footer_div { color: #4c4c4c;background-color: #dddddd;;margin-top:30px;border-top: 1px solid #a3a3a3;width:100%;}
#footer-inner { max-width:800px;margin:0 auto;padding:8px;}
.footer-item {min-width:150px;font-size:0.9rem;padding:2px;}
.footer-item a { color:#4c4c4c;}

/* spinner/processing state, errors */
.spinner,
.spinner:before,
.spinner:after {
  border-radius: 50%;
}
.spinner {
  color: #ffffff;
  font-size: 22px;
  text-indent: -99999px;
  margin: 0px auto;
  position: relative;
  width: 20px;
  height: 20px;
  box-shadow: inset 0 0 0 2px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
.spinner:before,
.spinner:after {
  position: absolute;
  content: "";
}
.spinner:before {
  width: 10.4px;
  height: 20.4px;
  background: #c9010c;
  border-radius: 20.4px 0 0 20.4px;
  top: -0.2px;
  left: -0.2px;
  -webkit-transform-origin: 10.4px 10.2px;
  transform-origin: 10.4px 10.2px;
  -webkit-animation: loading 2s infinite ease 1.5s;
  animation: loading 2s infinite ease 1.5s;
}
.spinner:after {
  width: 10.4px;
  height: 10.2px;
  background: #c9010c;
  border-radius: 0 10.2px 10.2px 0;
  top: -0.1px;
  left: 10.2px;
  -webkit-transform-origin: 0px 10.2px;
  transform-origin: 0px 10.2px;
  -webkit-animation: loading 2s infinite ease;
  animation: loading 2s infinite ease;
}

@-webkit-keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.payNow {
    background-color: #dc3545;
    color: #ffffff;
    border-radius: 4px;
    border: 0;
    padding: 12px 16px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    display: block;
    transition: all 0.2s ease;
    box-shadow: 0px 4px 5.5px 0px rgba(0, 0, 0, 0.07);
    width: 100%;
}
.payNow:hover {
    background-color: #c82333;
    border-color: #bd2130;
}
#payment-message {
    padding-top: 10px;
    color: #dc3545;
	display:none;
}
.custom-map-control-button {padding:8px; color:#fff;background-color:#27a746;border:none;font-size:0.8rem;border-radius:5px}
.policy_booking { max-width:600px;margin:10px 0;padding:10px;background-color:#e6e6e6; }
.btn:disabled { opacity:0.5;pointer:none; }
.sub-header {margin-bottom:12px;padding:10px;background-color:#e1e1e1;text-align:center;font-size:0.9rem;}
.center-wrapper { max-width:800px;width:100%;min-height:550px;font-size:0.9rem;margin:0 auto;background-color: #f1f1f1;border-bottom: 1px solid #a4a4a4; }
.flex-grow1 { flex:1 1 0px;}
.flex-grow2 { flex:2 1 0px;}
.flex-grow3 { flex:3 1 0px;}
.flex-grow0-5 { flex:0.6 1 0px;}
.flex-grow0-5 div { align-self:center;}
.paymentDate { background-color: #bbbaba;color:#282828;font-weight: 600;padding:6px;}
.status-green, .status-grey, .status-red { background-color:#27a746;display:inline; color:#fff;padding:6px;border-radius:7px;font-size:0.8rem;min-width:76px;}
.status-green { background-color:#27a746;}
.status-grey { background-color:#7d7d7d;}
.status-red { background-color:#a72745;}
.fac-green { color:#27a746;}
.fac-red { color:#a72745; }
.b-1-sgrey { border-bottom:1px solid #d2d2d2; }
.b-1-sgrey:hover { cursor:pointer; background-color:#e4e4e4;}
.next,.prev { text-align:center;color:#27a746;font-weight:600;padding:10px;cursor:pointer}
.small_bold { font-size:0.7rem;font-weight:600;display:block;}
.threeDots { display:inline;margin-left:6px;padding:4px;background-color:#c7c7c7;border-radius:5px;font-weight:600;height:100%;align-self:end;}
.threeDots::before { content:"...";}
.my-modal-label { font-weight:600;width:94px;}
.fac-textarea { border: 1px solid #e0e0e0;border-radius: 5px;height: 150px;width:100%;}
.moreNext { justify-content:space-evenly; display:flex;padding:10px 0;}
.gg-menu {
    transform: scale(var(--ggs,1))
}
.gg-menu,
.gg-menu::after,
.gg-menu::before {
    box-sizing: border-box;
    position: relative;
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 3px;
    background: currentColor;
	margin-left:auto;
}
.gg-menu::after,
.gg-menu::before {
    content: "";
    position: absolute;
    top: -6px
}
.gg-menu::after {
    top: 6px
}
#err, #message { font-size:1.0rem;padding:10px;margin-top:20px;background-color:#ffd7de;color:#c60000}
#err { background-color:#ffd7de;color:#c60000}
#message { background-color:#d8ffe5a1;color:#00a62d}
.std-content { padding:2.0rem;}
.std-content h1 { color:#00a62d;font-size:1.5rem}
.std-content p {margin:0;line-height:1.7;font-size:0.9rem}
.line-divider { border-bottom:2px solid #c6c6c6;margin-top:10px; }
.select2-container {display:block!important; }
.select2-selection__rendered { line-height: 38px !important;}
.select2-container .select2-selection--single {height: 38px !important;}
.select2-selection__arrow { height: 38px !important;}

#fac-large-green-btn {background-color:#28a745;color:#fff;margin:0 auto 10px auto;display:block;}