html{}
	
body{
	display: flex;
	flex-direction: column;
	font-size: 14px;}
	
:focus-visible {
	  outline: none;
		box-shadow: 1px 1px 5px rgba(1, 1, 0, .0);
	}
	  
	/* Focusing the button with a mouse, touch, or stylus will show a subtle drop shadow. */
	:focus:not(:focus-visible) {
	  outline: none;
	  box-shadow: 1px 1px 5px rgba(1, 1, 0, .0);
	}

.col-logo{
	-ms-flex: 0 0 54px;
	flex: 0 0 54px;
	max-width: 54px;}
	
.container-lg{
	width: 1800px;
	max-width: 100%;}
	
.container-fluid{	
	flex: 1 0 auto;}
.container-fullwidth{
	padding-left: 0;
	padding-right: 0;
	width: 100%;}


.loadingDiv {
	position: fixed;
	width:100%;
	height: 100%;
	background-color: rgba(0,0,0,0.8);
	z-index: 10000;
	color: #fff;}
.loadingDiv p{
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	margin-bottom: 0;
	}
.p-relative{
	position: relative;}
.lh-sm{
	line-height: 1.15!important;}

.lh-md{
	line-height: 2rem!important;}
		
.btn-link{
	padding: 0;
	border: 0;}

.border-reset {
	border-color: inherit !important;}
	
.jumbotron-start-line{
	background: #ccc; 
	margin-bottom: 0;
	color: #f1f1f1;
	border-radius: 0;
	text-align: center;
	padding: 1rem 0 0 0;}
.jumbotron-start-line h1{
	font-size: 3rem;}
.jumbotron-start-line .logo{
	max-width: 10rem;
	margin-top: 2rem;
	margin-bottom: 0rem;}
.jumbotron-overlay{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#cccccc+1,666666+100 */
background: rgb(204,204,204); /* Old browsers */
background: -moz-linear-gradient(top, rgba(204,204,204,.5) 1%, rgba(102,102,102,.5) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(204,204,204,.5) 1%,rgba(102,102,102,.5) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(204,204,204,.5) 1%,rgba(102,102,102,.5) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#666666',GradientType=0 ); /* IE6-9 */
	box-shadow: 0 1px 1px rgba(0, 0, 0, .5);
	padding: 0.7rem 2rem 2rem 2rem;}

.jumbotron-data-protection{
	background: #ffc107;
	color: #000;
}

.footerpadding{
	height: 120px;}

.modal-dialog-bottom {
	  position: fixed !important;
	  bottom: 0 !important;
	  left: 0% !important;
	  right: 0% !important;}
	  
	.bg-cloud{
		background-color: #f1c537 !important;}
	  
form{
}
#primary{
	margin-top: -1rem;
	background: #e84b3c;
	overflow: hidden;
	position: relative;
	width: 100%;}
#primary a{
	color:#ffc107;
	text-decoration: underline;}

.section:before{
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 10rem;
	height: 40rem;
	background: #e14031;
	transform: skew(0, -12deg);}
	
.fs-tiny{
	font-size: .75em !important;}
.fs-counter{
	font-size: 10px !important;}

.table-responsive-lg {
	display: block;
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	-ms-overflow-style: -ms-autohiding-scrollbar;}
	
.terms{
	font-size: 0.8rem;
	max-height: 280px;
	overflow-y: scroll;}
.terms-agree{
	background: #888;
	color: #fff;
	padding: 1rem;
	border-radius: 0 0 3px 3px;
}

.table-membership td{
	vertical-align: middle;
}

.calc-card, .calc-card .card-footer{
	background: transparent;
}
.calc-card .card-header{
	color: #373a3c;
	background: white;
}

.calc-card .table td, .table th{
	border-top: 1px solid rgba(255,255,255,0.05);}

.btn-relative{
	position: relative;} 
	
.custom-file-control{
	text-align: left;}
.text-center{
	text-align: center;}
.text-shadow{
	text-shadow: 0px 0px 15px rgba(0,0,0,.3);
}
form .yesnoswitch{
	margin-top: 2px;}
.card-header legend{
	margin-bottom: 0;}

.mh-100{
	min-height: 100vh;}
	
/*	MODULES */
.fullwidth-hero{
	height: 300px;
	width: 100%;}
	
.img-fit {
	height: 100%;
	width: 100%;
	-o-object-fit: cover!important;
	object-fit: cover!important;
	object-position: center center;}
.chat-img{
	height: 100vh;
	object-position: center center;}
.nowrap{
	white-space: nowrap;}


/* event bar base */
.event-bar {
	border-radius: .25rem;
	font-size: .85rem;
	pointer-events: auto;
	margin: .5rem 0;}
.event-logo {
	width: 34px!important;
	height: 34px!important;}

.message-bubble:before{
	content: '';
	position: absolute;
	left: 8px;
	bottom: 6px;
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-right-color: #cccdce;
	border-left: 0;
	margin-top: 13px;
	margin-left: -20px;}

.message-bubble-me{
	background-color: #2394fc !important;
	color: #fff !important;}


.message-bubble-me:before{
	content: '';
	position: absolute;
	right: 8px;
	bottom: 4px;
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-left-color: #3b78c9;
	border-right: 0;
	margin-top: 13px;
	margin-right: -20px;}
.message-bubble-me a{
	color: #fff;}
	
.message-bubble .reaction-count{
	bottom:-22px!important;
	right:4%!important;}

.message-bubble-me .reaction-count{
	bottom:-22px!important;
	left:4%!important;}
.message-bubble-me .btn-outline-secondary:not(:hover):not(:focus){
	border-color: #fff!important;
	color: #fff!important;}

.message-seen {}

.message-not-seen {
	border-color: #c93b70!important;}
	.message-not-seen:before{
	border-right-color: #c93b70;}
	
.offcanvas-notice{
	padding-left: 0%;
	padding-right: 0%;
}	

.auto-saved{
	background-color: rgba(25, 135, 84, 0.75) !important;
	border-color: #198754 !important;
	opacity: 75%;
	color: #fff !important;}
		
/* On/Off Switch		 */
	.onoffswitch {
		position: relative; width: 90px;
		-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;}
	.onoffswitch-checkbox {
		display: none;}
	.onoffswitch-label {
		display: block; overflow: hidden; cursor: pointer;
		border: 1px solid #ccc; border-radius: 5px;}
	.onoffswitch-inner {
		width: 200%; margin-left: -100%;
		-moz-transition: margin 0.15s ease-in 0s; -webkit-transition: margin 0.15s ease-in 0s;
		-o-transition: margin 0.15s ease-in 0s; transition: margin 0.15s ease-in 0s;}
	.onoffswitch-inner:before, .onoffswitch-inner:after {
		float: left; width: 50%; height: 36px; padding: 0; line-height: 36px;
		font-size: 16px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
	.onoffswitch-inner:before {
		content: "ON";
		padding-left: 15px;
		padding-top: 1px;
		background-color: #5CB85C; color: #FFFFFF;}
	.onoffswitch-inner:after {
		content: "OFF";
		padding-right: 10px;
		padding-top: 1px;
		background-color: #F8F8F8; color: #666666;
		text-align: right;}
	.onoffswitch-switch {
		width: 35px; margin: 0px;
		background: #FFFFFF;
		border: 1px solid #ccc; border-radius: 5px;
		position: absolute; top: 0; bottom: 0; right: 55px;
		-moz-transition: all 0.15s ease-in 0s; -webkit-transition: all 0.15s ease-in 0s;
		-o-transition: all 0.15s ease-in 0s; transition: all 0.15s ease-in 0s; 
		background-image: -moz-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: -webkit-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: -o-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);}
	.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
		margin-left: 0;}
	.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
		right: 0px;}

/* Live/Draft Switch		 */
	.livedraftswitch {
		position: relative; width: 110px;
		-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;}
	.livedraftswitch-checkbox {
		display: none;}
	.livedraftswitch-label {
		display: block; overflow: hidden; cursor: pointer;
		border: 1px solid #ccc; border-radius: 5px;}
	.livedraftswitch-inner {
		width: 200%; margin-left: -100%;
		-moz-transition: margin 0.15s ease-in 0s; -webkit-transition: margin 0.15s ease-in 0s;
		-o-transition: margin 0.15s ease-in 0s; transition: margin 0.15s ease-in 0s;}
	.livedraftswitch-inner:before, .livedraftswitch-inner:after {
		float: left; width: 50%; height: 36px; padding: 0; line-height: 36px;
		font-size: 16px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
	.livedraftswitch-inner:before {
		content: "LIVE";
		padding-left: 20px;
		padding-top: 1px;
		background-color: #5CB85C; color: #FFFFFF;}
	.livedraftswitch-inner:after {
		content: "DRAFT";
		padding-right: 10px;
		padding-top: 1px;
		background-color: #F8F8F8; color: #666666;
		text-align: right;}
	.livedraftswitch-switch {
		width: 35px; margin: 0px;
		background: #FFFFFF;
		border: 1px solid #ccc; border-radius: 5px;
		position: absolute; top: 0; bottom: 0; right: 75px;
		-moz-transition: all 0.15s ease-in 0s; -webkit-transition: all 0.15s ease-in 0s;
		-o-transition: all 0.15s ease-in 0s; transition: all 0.15s ease-in 0s; 
		background-image: -moz-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: -webkit-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: -o-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);}
	.livedraftswitch-checkbox:checked + .livedraftswitch-label .livedraftswitch-inner {
		margin-left: 0;}
	.livedraftswitch-checkbox:checked + .livedraftswitch-label .livedraftswitch-switch {
		right: 0px;}
		
		
/* Yes/No Switch		 */
	.yesnoswitch {
		position: relative; width: 90px;
		-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;}
	.yesnoswitch-checkbox {
		display: none;}
	.yesnoswitch-label {
		display: block; overflow: hidden; cursor: pointer;
		border: 1px solid #ccc; border-radius: 5px;}
	.yesnoswitch-inner {
		width: 200%; margin-left: -100%;
		-moz-transition: margin 0.15s ease-in 0s; -webkit-transition: margin 0.15s ease-in 0s;
		-o-transition: margin 0.15s ease-in 0s; transition: margin 0.15s ease-in 0s;}
	.yesnoswitch-inner:before, .yesnoswitch-inner:after {
		float: left; width: 50%; height: 36px; padding: 0; line-height: 36px;
		font-size: 16px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
	.yesnoswitch-inner:before {
		content: "YES";
		padding-left: 10px;
		padding-top: 1px;
		background-color: #5CB85C; color: #FFFFFF;}
	.yesnoswitch-inner:after {
		content: "NO";
		padding-right: 15px;
		padding-top: 1px;
		background-color: #F8F8F8; color: #666666;
		text-align: right;}
	.yesnoswitch-switch {
		width: 35px; margin: 0px;
		background: #FFFFFF;
		border: 1px solid #ccc; border-radius: 5px;
		position: absolute; top: 0; bottom: 0; right: 55px;
		-moz-transition: all 0.15s ease-in 0s; -webkit-transition: all 0.15s ease-in 0s;
		-o-transition: all 0.15s ease-in 0s; transition: all 0.15s ease-in 0s; 
		background-image: -moz-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: -webkit-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: -o-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);}
	.yesnoswitch-checkbox:checked + .yesnoswitch-label .yesnoswitch-inner {
		margin-left: 0;}
	.yesnoswitch-checkbox:checked + .yesnoswitch-label .yesnoswitch-switch {
		right: 0px;}
	.embed-responsive-scroll{
		position: relative;
		display: block;
		height: 0;
		padding: 0;
		overflow-y: scroll;}
		
	/* Yes/No Circular Switch		 */
	.yesnoswitch-circle {
		position: relative; width: 40px;
		-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
		margin: 0.5rem;}
	.yesnoswitch-circle-checkbox {
		display: none;}
	.yesnoswitch-circle-label {
		display: block; overflow: hidden; cursor: pointer;
		border: 1px solid rgb(0,56,67); border-radius: 20px; height:20px;}
	.yesnoswitch-circle-inner {
		width: 200%; margin-left: -100%;
		-moz-transition: margin 0.15s ease-in 0s; -webkit-transition: margin 0.15s ease-in 0s;
		-o-transition: margin 0.15s ease-in 0s; transition: margin 0.15s ease-in 0s;}
	.yesnoswitch-circle-inner:before, .yesnoswitch-circle-inner:after {
		float: left; width: 50%; height: 28px; padding: 0; line-height: 28px;
		font-size: 16px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
	.yesnoswitch-circle-inner:before {
		content: "";
		padding-left: 10px;
		padding-top: 1px;
		background-color: rgb(0,56,67); color: #FFFFFF;}
	.yesnoswitch-circle-inner:after {
		content: "";
		padding-right: 15px;
		padding-top: 1px;
		background-color: transparent; color: #fff;
		text-align: right;}
	.yesnoswitch-circle-switch {
		width: 20px; margin: 0px;
		background: #FFFFFF;
		border: 1px solid rgb(0,56,67); border-radius: 20px;
		position: absolute; top: 0; bottom: 0; right: 20px;
		-moz-transition: all 0.15s ease-in 0s; -webkit-transition: all 0.15s ease-in 0s;
		-o-transition: all 0.15s ease-in 0s; transition: all 0.15s ease-in 0s; 
		background-image: -moz-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: -webkit-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: -o-linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);
		background-image: linear-gradient(center top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%);}
	.yesnoswitch-circle-checkbox:checked + .yesnoswitch-circle-label .yesnoswitch-circle-inner {
		margin-left: 0;}
	.yesnoswitch-circle-checkbox:checked + .yesnoswitch-circle-label .yesnoswitch-circle-switch {
		right: 0px;}
	
	.video-wrapper video {
	  max-width: 100%;
	  max-height: 80vh;
	}
	
	.refine{
		color:rgb(0,56,67);
		font-size: .8rem;
		text-align: left;
		background: transparent;
		padding: 0.2rem 0 0.2rem 1rem;
		margin-bottom: 0;}
	.refine label{
		margin-top: 0.1rem;}
	
		
	.scrolling{
		font-size: 80%;
		border: 1px #ccc solid;
		padding: 1rem;
		overflow-y: scroll;
		max-height: 200px;
	}
	
	.member-awards{
		line-height: 10px;}
		
/* 	Footer */

	.footer {
		flex-shrink: 0;
		padding: 20px;
		background: #f9f9f9;}
  
	.embed-responsive-16by9-sm-4{
		padding-bottom: 70%;
		border:1px solid #f1f1f1;}
	p.event-title{
		margin-bottom: 0.4rem;}
	.racecartdata{
		font-size: .8rem;
	}	
	.card-stripe{
		background: #f1f1f1;
		color: #5cb85c;
		border-color: #5cb85c;
	}
	.bg-stripe{
		background: #533AFD;
		border-color: #533AFD;
	}
	.basket-divider{
		border-right: 1px solid #b3b3b3;
		display: flex;
		margin-top: 8px;
		margin-bottom: 8px;
	}
		
	.StripeElement {
	  background-color: white;
	  padding: 8px 12px;
	  border-radius: 4px;
	  border: 1px solid #5cb85c;
	  box-shadow: 0 1px 3px 0 #e6ebf1;
	  -webkit-transition: box-shadow 150ms ease;
	  transition: box-shadow 150ms ease;
	  font-size: 3rem;
	  width: 100%;
	}
	
	.StripeElement--focus {
	  box-shadow: 0 1px 3px 0 #cfd7df;
	}
	
	.StripeElement--invalid {
	  border-color: #cb2706;
	  color: #cb2706;
	}
	
	.StripeElement--webkit-autofill {
	  background-color: #e1f5e1 !important;
	}
	.paymentprocessing{
		display: none;
		height: 100%;
		background: rgba(92, 184, 92, 0.9);
		color: #fff;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 20;
		align-items: center;
		justify-content: center;}
	.paymentprocessing.visible{
		display: flex;}
	
	.btn-sq{
		border-radius: 0;
		border: none;
	} 
	.badge-danger{
		color: #fff;
		background: #d9534f;}
	.bg-cloud-primary{
		background: #E24A3B !important;}
	.bg-events{
	background: #1FA971 !important;}
	.bg-shop{
	background: #2B80FF !important;}
		
	.alert a{
		color: inherit;
		text-decoration: underline;
		font-weight: bold;}
	#cal{
		position: relative;
		display: block;
		text-align: center;}
	
.inline{
	display: inline;
}

input.btn-warning::-webkit-input-placeholder, input.btn-warning::-moz-placeholder, input.btn-warning:-ms-input-placeholder, input.btn-warning:-moz-placeholder{
	color: #fff;
}
.input-group-addon-dark{
	color: #e9ecef;
	background-color: #495057;}

.code{
	font-family: "Courier New", Courier, "Lucida Sans Typewriter", "Lucida Typewriter", monospace;
	font-size: 1.2rem;
	line-height: 0.9em;
	margin-top: 0.18rem;
}
.img-circle{
	border-radius: 50%;
	border: 2px solid #fff;}
	
#googlemap{
	padding-bottom: 60%;}
	
.dtpicker-content {
	touch-action: manipulation;}
	
.logo-small{
	width: 40px;}

.table-number-input{width:30%;}

.trim-xs{
	font-size: 0.7rem;}

.input-group-nowrap {
	-ms-flex-wrap: inherit;
	flex-wrap: inherit;}
	
.flex-shrink-1.input-group-text{
	white-space: normal;
}




/* Timeline  */


#cd-timeline {
  position: relative;
  padding: 2em 0;
}
#cd-timeline::before {
  /* this is the vertical line */
  content: '';
  position: absolute;
  top: 0;
  left: 18px;
  height: 100%;
  width: 4px;
  background: #f9f9f9;
}

.cd-timeline-block {
  position: relative;
  margin: 2em 0;
}
.cd-timeline-block a{
	display: block;
	color: #333;
}
.cd-timeline-block a:hover{
	text-decoration: none;
}

.cd-timeline-block:after {
  content: "";
  display: table;
  clear: both;
}
.cd-timeline-block:first-child {
  margin-top: 0;
}
.cd-timeline-block:last-child {
  margin-bottom: 0;
}

.cd-timeline-img {
  position: absolute;
  top: 16px;
  left: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  box-shadow: 0 0 0 4px white, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05);
}
.cd-timeline-img img {
  display: block;
  width: 24px;
  height: 24px;
  position: relative;
  left: 50%;
  top: 50%;
  margin-left: -12px;
  margin-top: -12px;
}
.cd-timeline-img.cd-picture {
  background: #ffc107;
}

.cd-timeline-content {
  position: relative;
  margin-left: 60px;
  background: #ffc107;
  border-radius: 0.25em;
  padding: 1em;
  box-shadow: 0 3px 0 #ffc107;
}
.cd-timeline-content:after {
  content: "";
  display: table;
  clear: both;
}
.cd-timeline-content h3 {
	margin-top: 0px;
	color: #333;}
.cd-timeline-content h4 {
	color: #D58B71}
	
.cd-timeline-content .cd-date {
  float: left;
  padding: .8em 0;
  opacity: .7;
}
.cd-timeline-content::before {
  content: '';
  position: absolute;
  top: 12px;
  right: 100%;
  height: 0;
  width: 0;
  border: 20px solid transparent;
  border-right: 20px solid #ffc107;
}

.binbag-icon, .person-icon{
	width: 100%;}

.binbag-icon, .ig-binbag-icon{
	fill: #9DD3A7;}
.person-icon, .ig-person-icon{
	fill: #009d91;}
	
.ig-binbag-icon{
	width: 17px;
	height: 25px;}
.ig-binbag-text{
	color: #9DD3A7;
	font-size: 30px;}

.ig-person-icon{
	width: 8px;
	height: 25px;}
.ig-person-text{
	font-family: "FatFrank Heavy",Helvetica,Arial,sans-serif;
	color: #009d91;
	font-size: 30px;}

.ig-binbags-total{
	position: relative;
	width: 100%;}
	
.ig-totalcount{
	font-family: "FatFrank Heavy",Helvetica,Arial,sans-serif;
	position: absolute;
	color: #fff;
	font-size: 50px;
	text-align: center;
	width: 100%;
	line-height: 1em;
	padding-top: 80%;}
	.ig-totalcount small{
		font-size: 13px;
		line-height: 18px;
		display: block;
		padding: 10% 20% 0 20%;}

ig-volunteers{
	position: relative;
}		


.nav-link .spinner, .nav-item .spinner, .btn .spinner {
	display: none;
}

/* When loading, hide text and show spinner */
.nav-link.loading .btn-text, .nav-item.loading .btn-text, .btn.loading .btn-text {
	display: none;
	opacity: 0;
}
.nav-link.loading .spinner, .nav-item.loading .spinner, .btn.loading .spinner {
	display: inline-block;
}

.group-spacer {
}



a.member-item{
	color: #000;
}
a.member-item:hover{
	border-color: #666;
	text-decoration: none;}
a.member-item:active{
	color: #fff;
	background: #666;}

/* BootStrap Extenders */
.start-safari{
	left: 70%!important;}
.start-chrome{
	left: 36%!important;}
.start-android{
	right: 4%!important;}
.end-5{
	right: 4%!important;}

#preview-holder .preview-image{
	max-width: 50%;}

/* DAY VIEW (inside modal) */
	.dayview{
	  display:grid;
	  grid-template-columns: 34px 1fr; /* time labels | track */
	  gap: .75rem;
	}
	
	/* left column: time labels */
	.dayview-times{
	  display:grid;
	  grid-template-rows: repeat(24, var(--hour-h, 56px));
	}
	.dayview-times .time{
	  display:flex;
	  align-items:center;      /* vertical middle */
	  justify-content:flex-end;/* keep it right-aligned */
	  font-size:.75rem;
	  color:rgba(0,0,0,.55);
	  padding-right:.25rem;
	  line-height:1;
	}
	
	/* right side: a single continuous track */
	.dayview-track{
	  position: relative;
	  height: calc((24 * var(--hour-h, 56px)) + (var(--hour-h, 56px) / 2)); /* +30 mins */
	  border-left: 1px solid rgba(0,0,0,.08);
	}
	
	/* hour lines layer */
	.dayview-hours{
	  position:absolute;
	  inset:0;
	  display:grid;
	  grid-template-rows: repeat(24, var(--hour-h, 56px));
	  pointer-events:none;
	  padding-bottom: calc(var(--hour-h, 56px) / 2); /* matches the extra 30 mins */
	  box-sizing: border-box;
	}
	.dayview-hours .hour{
	  position:relative;
	  border-top:0;
	}
	
	.dayview-hours .hour::before{
	  content:"";
	  position:absolute;
	  left:0;
	  right:0;
	  top:50%;
	  border-top:1px solid rgba(0,0,0,.08);
	}
	
	/* events layer */
	.dayview-events{
	  position:absolute;
	  inset:0;
	}
	
	/* event block: minute-accurate positioning */
	.day-event{
	  position:absolute;
	  left: 0;
	  right: 0;
	  top: calc(((var(--start) + 30) * 1px) * var(--px-per-min, 0.9333));
	  height: calc((var(--dur) * 1px) * var(--px-per-min, 0.9333));
	  border-radius: .5rem;
	  padding: .4rem .5rem;
	  overflow:hidden;
	  text-decoration:none;
	  pointer-events:auto;
	  box-shadow: 0 1px 3px rgba(0,0,0,.08);
	}
	
	/* horizontal stacking (lanes) */
	.day-event{
	  width: calc((100% - .5rem) / var(--lanes));
	  left: calc((100% / var(--lanes)) * var(--lane));
	  margin-left: .25rem;
	  margin-right: .25rem;
	}
	
	/* event text */
	.day-event .title{
	  font-weight: 600;
	  font-size: .85rem;
	  white-space: nowrap;
	  overflow:hidden;
	  text-overflow: ellipsis;
	}
	.day-event .meta{
	  font-size: .75rem;
	  opacity: .8;
	}
	
	
	/* set pixels-per-minute based on hour height:
	   if hour height is 56px: 56/60 = 0.9333px per min */
	.dayview{
	  --hour-h: 56px;
	  --px-per-min: 0.9333;
	}
	
	.day-event.continues-out{
	  border-bottom-left-radius: 0;
	  border-bottom-right-radius: 0;
	}
	.day-event.continues-in{
	  border-top-left-radius: 0;
	  border-top-right-radius: 0;
	}
	
	/* optional subtle indicators */
	.day-event.continues-out::after{
	  content:"";
	  position:absolute;
	  left:.5rem; right:.5rem; bottom:.2rem;
	  border-top:1px dashed rgba(255,255,255,.5);
	  opacity:.7;
	}
	.day-event.continues-in::before{
	  content:"";
	  position:absolute;
	  left:.5rem; right:.5rem; top:.2rem;
	  border-top:1px dashed rgba(255,255,255,.5);
	  opacity:.7;
	}
	.dayview-wrap{
	  display:flex;
	  flex-direction:column;
	  gap:.5rem;
	}
	
	/* all-day bar */
	.allday{
	  display:grid;
	  grid-template-columns: 34px 1fr; /* same as dayview */
	  gap:.75rem;
	  align-items:start;
	}
	
	.allday-label{
	  font-size:.75rem;
	  color: rgba(0,0,0,.55);
	  text-align:right;
	  padding-right:.25rem;
	  padding-top:.25rem;
	}
	
	.allday-lane{
	  display:flex;
	  flex-wrap:wrap;     /* if many all-day events, wrap to next line */
	  gap:.5rem;
	  padding:.25rem;
	  border-left: 1px solid rgba(0,0,0,.08);
	}
	
	.allday-event{
	  display:inline-block;
	  padding:.25rem .5rem;
	  border-radius:.5rem;
	  text-decoration:none;
	  font-size:.85rem;
	  white-space:nowrap;
	  max-width:100%;
	  overflow:hidden;
	  text-overflow:ellipsis;
	}

	:root{
		--hour-h: 60px;              /* height per hour row */
		--time-w: 50px;              /* left time column width */
		--day-min: 190px;            /* min width per day (for horizontal scroll) */
		--header-h: 48px;            /* sticky header height */
		--allday-h: 120px;           /* all-day strip height */
		--minute: calc(var(--hour-h) / 60);
	  }
	
	  .weekview-wrapper{
		overflow: hidden;
		border: 1px solid rgba(0,0,0,.06);
	  }
	  
	  /* Make the *entire* week view have one consistent minimum width */
	  .weekview-head,
	  .weekview-allday,
	  .weekview-body{
		min-width: calc(var(--time-w) + (var(--day-min) * 7));
	  }
	
	  /* ==================== HEADERS (sticky) ==================== */
	  .weekview-head{
		display:grid;
		grid-template-columns: var(--time-w) repeat(7, minmax(var(--day-min), 1fr));
		height: var(--header-h);
		position: sticky;
		top: 0;
		z-index: 30;
	  }
	
	  .weekview-corner{
		position: sticky;
		left: 0;
		z-index: 40;
	  }
	
	  .weekview-dayhead{
		display:flex;
		align-items:center;
		justify-content:center;
		text-align:center;
		background:#f8f9fa;
		line-height: 1.05;
		margin: 5px 2.5px 5px 2.5px;
	  }
	
	  /* ==================== ALL-DAY STRIP (sticky under headers) ==================== */
	  .weekview-allday{
		display:grid;
		grid-template-columns: var(--time-w) 1fr;
		height: var(--allday-h);
		position: sticky;
		top: var(--header-h);
		z-index: 25;
	  }
	
	  .weekview-corner--allday{
		display:flex;
		align-items:center;
		justify-content:center;
	  }
	
	  .weekview-corner--allday .label{
		font-size: .7rem;
		color:#6c757d;
		opacity:.9;
	  }
	
	  .weekview-allday-gridwrap{
		position: relative;
		min-width: calc(var(--day-min) * 7);
	  }
	
	  .weekview-allday-grid{
		height: 100%;
		background:
		  repeating-linear-gradient(
			to right,
			rgba(0,0,0,.06) 0,
			rgba(0,0,0,.06) 1px,
			transparent 1px,
			transparent calc(100% / 7)
		  );
	  }
	
	  .weekview-allday-overlay{
		position:absolute;
		inset: 8px 8px 10px 8px;
		display:grid;
		grid-template-columns: repeat(7, 1fr);
		grid-template-rows: repeat(3, 1fr); /* allow stacking */
		gap: 6px;
		pointer-events:none;
	  }
	
	  .allday-bar{
		pointer-events:auto;
		display:flex;
		align-items:center;
		padding: .35rem .5rem;
		border-radius: 10px;
		text-decoration:none;
		box-shadow: 0 1px 0 rgba(0,0,0,.08);
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;
		font-size: .78rem;
	  }
	  .allday-bar{ grid-column: var(--col) / span var(--span); grid-row: var(--row); }
	
	  /* ==================== BODY SCROLL AREA ==================== */
	  .weekview-body{
		display:grid;
		grid-template-columns: var(--time-w) 1fr;
		background-color: #fff;
	  }
	
	  /* sticky times col */
	  .weekview-times{
		display:grid;
		grid-template-rows: repeat(24, var(--hour-h));
		background:#fff;
		border-right: 1px solid rgba(0,0,0,.08);
		position: sticky;
		left: 0;
		z-index: 20;
	  }
	
	  /* label aligned to vertical middle of hour */
	  .weekview-times .time{
		font-size: .75rem;
		padding-left: .5rem;
		color:#6c757d;
		opacity:.85;
	  }
	
	  .weekview-gridwrap{
		position: relative;
		min-width: calc(var(--day-min) * 7);
	  }
	
	  /* base grid lines */
	  .weekview-grid{
		height: calc(var(--hour-h) * 24);
		background:
		  /* vertical day dividers */
		  repeating-linear-gradient(
			to right,
			rgba(0,0,0,.06) 0,
			rgba(0,0,0,.06) 1px,
			transparent 1px,
			transparent calc(100% / 7)
		  ),
		  /* hour lines */
		  repeating-linear-gradient(
			to bottom,
			rgba(0,0,0,.08) 0,
			rgba(0,0,0,.08) 1px,
			transparent 1px,
			transparent var(--hour-h)
		  );
	  }
	
	  /* overlay grid (minutes) */
	  .weekview-overlay{
		position:absolute;
		inset: 0;
		display:grid;
		grid-template-columns: repeat(7, 1fr);
		grid-template-rows: repeat(1440, var(--minute));
		pointer-events:none; /* allow scroll */
	  }
	
	  .week-event{
		pointer-events:auto;
		border-radius: 10px;
		padding: .4rem .5rem;
		overflow:hidden;
		text-decoration:none;
		box-shadow: 0 1px 0 rgba(0,0,0,.08);
		font-size: .75rem;
		line-height: 1.15;
		display:block;
		margin: 3px;
		position: relative;
		box-sizing: border-box;
		--lanes: 1;
		--lane: 0;
		--lane-gap: 0px;
		width: calc((100% - (var(--lane-gap) * (var(--lanes) - 1))) / var(--lanes));
		left: calc((100% / var(--lanes)) * var(--lane));
		margin-left: calc(var(--lane-gap) * var(--lane));
		grid-column: var(--day);
		grid-row: calc(var(--start) + 1) / span var(--dur);
	  }
	
	  .week-event .title{
		font-weight:700;
		white-space:nowrap;
		overflow:hidden;
		text-overflow:ellipsis;
	  }
	
	  .week-event .meta{
		opacity:.75;
		margin-top:.15rem;
		white-space:nowrap;
		overflow:hidden;
		text-overflow:ellipsis;
	  }



@media (max-width: 450px) {
	.table-sm{
		font-size: 0.7rem;
	}
}

@media (min-width: 576px) {
	html{font-size: 13px;}
	.yesnoswitch-inner:before, .yesnoswitch-inner:after, .livedraftswitch-inner:before, .livedraftswitch-inner:after, .onoffswitch-inner:before, .onoffswitch-inner:after {
	height: 29px; line-height: 29px;}
	#preview-holder .preview-image{
	max-width: 25%;}
	
	/* Events Calendar */
	
	.calendar-wrapper {
		background: #e6e9eb;
		position: relative;
	}
	
	/* day grid – base (mobile = 1 column) */
	.month-grid {
		display: grid;
		grid-template-columns: 1fr;          /* one long column on mobile */
		grid-auto-rows: 150px;               /* each “slot” 150px high */
		gap: 2px;
		font-weight: 600;
	}
	
	.day-header {
		background: #f8f9fa;
		text-align: center;
		font-weight: 600;
		padding: .5rem;
		border: 1px solid #e6e9eb;
	}
	
	.month-grid,
	.month-grid .day-cell {
		border: 1px solid #e6e9eb;
		min-height: 150px;
		padding: .5rem;
	}
	
	.day-cell {
		background: #fff;
	}
	
	.day-number {
		font-weight: 700;
	}
	
	.day-blank {
		background: #f1f1f1 !important;
	}
	
	/* overlay base */
	.event-overlay {
		position: absolute;
		inset: 0;
		display: grid;
		gap: 2px;
		pointer-events: none;
		padding: 0.5rem;
	}
	
	/* spans (desktop) */
	.col-span-2 { grid-column-end: span 2 !important; }
	.col-span-3 { grid-column-end: span 3 !important; }
	.col-span-4 { grid-column-end: span 4 !important; }
	.col-span-5 { grid-column-end: span 5 !important; }
	.col-span-6 { grid-column-end: span 6 !important; }
	.col-span-7 { grid-column-end: span 7 !important; }
	
	.month-grid {
		grid-template-columns: repeat(7, 1fr);
		grid-template-rows: 38px repeat(5, 150px); /* header + 5 weeks */
	}
	
	.event-overlay {
		grid-template-columns: repeat(7, 1fr);
		grid-template-rows: 38px repeat(5, 150px);
	}
	
	/* Week 1 (grid-row: 2 because row 1 is the weekday header) */
	.w1-d1-start { grid-column: 1; grid-row: 2; }
	.w1-d2-start { grid-column: 2; grid-row: 2; }
	.w1-d3-start { grid-column: 3; grid-row: 2; }
	.w1-d4-start { grid-column: 4; grid-row: 2; }
	.w1-d5-start { grid-column: 5; grid-row: 2; }
	.w1-d6-start { grid-column: 6; grid-row: 2; }
	.w1-d7-start { grid-column: 7; grid-row: 2; }
	
	/* Week 2 (row 3), etc. */
	.w2-d1-start { grid-column: 1; grid-row: 3; }
	.w2-d2-start { grid-column: 2; grid-row: 3; }
	.w2-d3-start { grid-column: 3; grid-row: 3; }
	.w2-d4-start { grid-column: 4; grid-row: 3; }
	.w2-d5-start { grid-column: 5; grid-row: 3; }
	.w2-d6-start { grid-column: 6; grid-row: 3; }
	.w2-d7-start { grid-column: 7; grid-row: 3; }
	
	/* Week 3 (row 3), etc. */
	.w3-d1-start { grid-column: 1; grid-row: 4; }
	.w3-d2-start { grid-column: 2; grid-row: 4; }
	.w3-d3-start { grid-column: 3; grid-row: 4; }
	.w3-d4-start { grid-column: 4; grid-row: 4; }
	.w3-d5-start { grid-column: 5; grid-row: 4; }
	.w3-d6-start { grid-column: 6; grid-row: 4; }
	.w3-d7-start { grid-column: 7; grid-row: 4; }
	
	/* Week 4 (row 3), etc. */
	.w4-d1-start { grid-column: 1; grid-row: 5; }
	.w4-d2-start { grid-column: 2; grid-row: 5; }
	.w4-d3-start { grid-column: 3; grid-row: 5; }
	.w4-d4-start { grid-column: 4; grid-row: 5; }
	.w4-d5-start { grid-column: 5; grid-row: 5; }
	.w4-d6-start { grid-column: 6; grid-row: 5; }
	.w4-d7-start { grid-column: 7; grid-row: 5; }

	/* ... */
	.w5-d1-start { grid-column: 1; grid-row: 6; }
	.w5-d2-start { grid-column: 2; grid-row: 6; }
	.w5-d3-start { grid-column: 3; grid-row: 6; }
	.w5-d4-start { grid-column: 4; grid-row: 6; }
	.w5-d5-start { grid-column: 5; grid-row: 6; }
	.w5-d6-start { grid-column: 6; grid-row: 6; }
	.w5-d7-start { grid-column: 7; grid-row: 6; }

	/* ... */
	.w6-d1-start { grid-column: 1; grid-row: 7; }
	.w6-d2-start { grid-column: 2; grid-row: 7; }
	.w6-d3-start { grid-column: 3; grid-row: 7; }
	.w6-d4-start { grid-column: 4; grid-row: 7; }
	.w6-d5-start { grid-column: 5; grid-row: 7; }
	.w6-d6-start { grid-column: 6; grid-row: 7; }
	.w6-d7-start { grid-column: 7; grid-row: 7; }
	
	
	.event-bar {
		margin: .1rem .5rem;
		margin-top: calc(var(--ev-i, 0) * 1.65rem);
		height: 21px;
		z-index: 2;}
	.event-details{
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.event-logo {
	width: 14px!important;
	height: 14px!important;}
}

@media (max-width:767px) {
	.weekview-xscroll{
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
	  }
}

@media (min-width: 768px) {
	html{font-size: 14px;}
	.table-responsive{
		display: table;}
	.container-lg{
		padding-left: 30px;
		padding-right: 30px;}
	.table-number-input{width:inherit;}
  #cd-timeline::before {
	left: 50%;
	margin-left: -2px;}
	.fullwidth-hero{height: 400px;}

  .cd-timeline-img {
	top:30px;
	width: 30px;
	height: 30px;
	left: 50%;
	margin-left: -15px;
	/* Force Hardware Acceleration in WebKit */
	-webkit-transform: translateZ(0);
	-webkit-backface-visibility: hidden;
  }


  .cd-timeline-content {
	margin-left: 0;
	padding: 1.6em;
	width: 45%;
  }
  .cd-timeline-content::before {
	top: 24px;
	left: 100%;
	border-color: transparent;
	border-left-color: #ffc107;
  }
  .cd-timeline-content .cd-read-more {
	float: left;
  }
  .cd-timeline-content .cd-date {
	position: absolute;
	width: 100%;
	left: 122%;
	top: 22px;
	font-size: 16px;
	font-weight: bold;
	color: #aaa;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content {
	float: right;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content::before {
	top: 24px;
	left: auto;
	right: 100%;
	border-color: transparent;
	border-right-color: #ffc107;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more {
	float: right;
  }
  .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date {
	left: auto;
	right: 122%;
	text-align: right;
  }
  .yesnoswitch-inner:before, .yesnoswitch-inner:after, .livedraftswitch-inner:before, .livedraftswitch-inner:after, .onoffswitch-inner:before, .onoffswitch-inner:after {
	height: 32px; line-height: 32px;}
	
	.offcanvas-notice{
		padding-left: 12%;
		padding-right: 12%;
	}
	
	:root{ --day-min: 1px; }
	.weekview-allday-gridwrap,
	.weekview-gridwrap{ min-width: 0; }
	
}


@media (min-width: 992px) {
	html{font-size: 15px;}
	.btn-sq{
		padding-top: 2rem;
		padding-bottom: 2rem;}
	.jumbotron-start-line .logo{
		max-width: 18rem;}
	.fullwidth-hero{height: 500px;}
	.yesnoswitch-inner:before, .yesnoswitch-inner:after, .livedraftswitch-inner:before, .livedraftswitch-inner:after, .onoffswitch-inner:before, .onoffswitch-inner:after {
	height: 34px; line-height: 34px;}
	
	#nav-wrap{
		flex-wrap: wrap;}
	.offcanvas-notice{
		padding-left: 25%;
		padding-right: 25%;
	}
}

@media (max-width: 1400px) {
	#primary-nav, #secondary-nav {
		transition: opacity 0.2s ease-in-out;
	}
	#primary-nav.sticky-top, #secondary-nav.sticky-top {
		opacity: 1;
	}
	#primary-nav.nav-hidden, #secondary-nav.nav-hidden {
		opacity: 0;
	}
}

@media (min-width: 1400px) {
	html{font-size: 15px;}
	.fullwidth-hero{height: 550px;}
	#main-content, .main-footer{
		margin-right:19%;}
	#main-content #chat-edit{
			margin-right:19%;}
	#navigationFullMenu{
		position: fixed;
		right:0!important;
		top:0!important;
		height: 100vh;
		width:19vw;
		border-left:0;}
}

@media (min-width: 1705px) {
	#main-content, .main-footer{
		margin-right:15%;}
	#main-content #chat-edit{
			margin-right:15%;}
	#navigationFullMenu{
		position: fixed;
		right:0!important;
		top:0!important;
		height: 100vh;
		width:15vw;
		border-left:0;}
}