/* BASICS */
* {
	margin: 0px;
	padding: 0px;
	box-sizing: border-box;
}





input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
select:focus,
textarea {
  font-size: 16px;
}

h2 {
	margin-bottom: 10px;
}

.margin-top-10{
	margin-top: 10px;
}

.text-width {
	max-width: 800px;
	margin: auto;
}

.centre {
	text-align: center;
}



.image-family-support {
	max-width: 300px;
	margin: 40px auto 0px auto;
	display:block
}

.image-cafe {
	max-width: 800px;
	margin: 40px auto 0px auto;
	display:block;
	width: 100%;
}


.header-text-container-cool {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 5;
	/* color: black; */
}


.button-height {
	width: 160px;
	height: 60px;
}

.banner-kabin-image {
	max-width: 500px;
	min-width: 300px;
	width: 100%;
}


#gradient-canvas {
	position: absolute;
	width: 100%;
	height: 100%;

--gradient-color-1: #ca93fe;
--gradient-color-2: #feab3e;
--gradient-color-3: #ff3f32;
--gradient-color-4: #ed4c97;

	/* transform: skewY(-11deg); */
	z-index: 1;
	}

	#gradient-canvas2 {
		position: absolute;
		width: 100%;
		height: 100%;
	
	--gradient-color-1: #000000;
	--gradient-color-2: #000000;
	--gradient-color-3: #000000;
	--gradient-color-4: #ff4c06;
	
		/* transform: skewY(-11deg); */
		z-index: 1;
		}

	#gradient-canvas3 {
		width: 100%;
		height: 250px;
		margin-top: 50px;
		/* --gradient-color-1: #f4ffee;
    --gradient-color-2: #3fba7d;
    --gradient-color-3: #a8fff4;
    --gradient-color-4: #a9f536; */
		--gradient-color-1: #bc0000;
		--gradient-color-2: #c82424;
		--gradient-color-3: #f64343;
		--gradient-color-4: #f53636;
		}


		#gradient-canvas4 {

width: 100%;

margin-top: 50px;

height: 250px;

--gradient-color-1: #eefffe;

--gradient-color-2: #a93fba;

--gradient-color-3: #a8daff;

--gradient-color-4: #4436f5;

/* filter: invert(1); */

}

#gradient-canvas5 {
	width: 100%;
	height: 250px;
	margin-top: 50px;
	
	--gradient-color-1: #f4ffee;
--gradient-color-2: #3fba7d;
--gradient-color-3: #a8fff4;
--gradient-color-4: #a9f536;

	
	/* --gradient-color-1: #f4ffee;
	--gradient-color-2: #3fba7d;
	--gradient-color-3: #a8fff4;
	--gradient-color-4: #a9f536; */
	}



  .c-results-box {
	  padding: 10px;
	  background: linear-gradient(180deg, rgb(204, 204, 204) 0%, rgb(230, 230, 230) 100%);
	  max-width: 360px;
	  margin: 30px auto;
	  border-radius: 5px;
  }

  .c-results-box__title{
	  font-size: 22px;
	  font-weight: 600;
	  margin-bottom: 5px;
  }

  .c-results-box__inner {
	  max-width: 290px;
	  text-align: center;
	  margin: auto;
	 }








	 .promo-banner--easter2 {
		height: 100px;
		width: 100%;
		background-color: #f0fdc1;
		display: flex;
		justify-content: center;
	}

	.promo-banner__sub--easter2 {
		/* height: 100px; */
		/* width: 100%; */
		/* background-color: rgb(198 255 217); */
		/* display: flex; */
		/* justify-content: center; */
		color: #cfaff5;
	}


	


.promo-banner {
	height: 100px;
	width: 100%;
	background-color: #1E1C1A;
	display: flex;
	justify-content: center;
}

.promo-banner--easter {
	height: 100px;
	width: 100%;
	background-color: #FFFBD1;
	display: flex;
	justify-content: center;
}

.promo-banner--kabin {
	height: 100px;
	width: 100%;
	background-color: #1b1b1b;
	display: flex;
	justify-content: center;
}

.promo-banner__inner--kabin {
	width: 100%;
	max-width: 1200px;
	display: flex;
	padding-left: 20px;
	padding-right: 20px;
	justify-content: space-between;
	/* background-color: goldenrod; */
}

.promo-banner__inner {
	width: 100%;
	max-width: 1200px;
	display: flex;
}

.promo-banner__image {
	width: 0%;
	height: 100%;
	margin: auto;
	object-fit: fill;
	display: block;
}

.promo-banner__image--kabin {
	width: 50%;
	height: 70%;
	margin: auto 0;
	object-fit: contain;
	display: block;
}

.promo-banner__text {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: row;
	margin-left: 20px;
	padding-right: 15px;
}

.promo-banner__sub {
	color: #B6B6A4;
}

.promo-banner__sub--easter {
	color: #cfaff5;
}

.promo-banner__text__wrap {
	display: flex;
	justify-content: center;
	flex-direction: column;
}

.promo-banner__title {
	font-size: 24px;
	color: #ffffff;
	font-family: 'Creepster', cursive;
	letter-spacing: 2px;
}

.promo-banner__title--easter {
	font-size: 30px;
	font-family: ganache, sans-serif;
   	font-weight: 400;
	font-style: normal;
	color: #F09194;
	letter-spacing: 2px;
}

.promo-banner__text {
	color: white;
	font-size: 18px;
}

.promo-banner__button {
	background-color: orangered;
	border: none;
	border-radius: 5px;
	color: white;
	font-size: 16px;
	cursor: pointer;
	width: 150px;
	height: 40px;
	bottom: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: auto;
}

.promo-banner__button--easter {
	background-color: #F09194;
	border: none;
	border-radius: 5px;
	color: white;
	font-size: 16px;
	cursor: pointer;
	width: 150px;
	height: 40px;
	bottom: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: auto;
	/* float: right; */
	/* position: relative; */
	/* right: 0px; */
}

.promo-banner__button--kabin {
	background-color: #FD6510;
	border: none;
	border-radius: 5px;
	color: white;
	font-size: 16px;
	cursor: pointer;
	width: 130px;
	height: 40px;
	bottom: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: auto 0;
	/* float: right; */
	/* float: right; */
	/* position: relative; */
	/* right: 0px; */
}


.promo-banner__button:hover {
	background-color: rgb(255, 103, 47);
}

.promo-banner__button--easter:hover {
	background-color: #ffc8ca;
}






















.party-card-container--room {
	margin: 0px 0px 0px 0px;
	padding: 0px 20px 20px 20px;
	color: white;
}

.party-card-container--room--diagonal {
	margin: 80px 0px 0px 0px;
	padding: 100px 20px 20px 20px;
	background-color: var(--brunswick-red);
	background: linear-gradient(180deg, var(--brunswick-red) 0%, rgba(242,127,109,1) 100%);
	color: white;

	clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}



.calander-disable {
	pointer-events:none;
}

#catering-container {
	display: none;
}

.center {
	text-align: center;
}

:root {
	/* e10000 amazing red */
	--brunswick-red: #e51819;
	--pannel: #EBE9E9;
	--background: #FFF9F9;
	--input-grey: #EBEBEB;
	--hover-nav: #ffc8c8;
	--page-background: rgb(255, 249, 249);
	--shadow: 0px 4px 6px rgb(0 0 0 / 10%), 0px 5px 15px rgba(0, 0, 0, 5%);
}

body {
	font-family: 'bio-sans', sans-serif;
	background-color: var(--background);
}

header {
	height: 150px;
	width: 100%;
	background-color: var(--brunswick-red);
	margin-bottom: 0px;
	overflow: hidden;
	position: relative;
}

nav {
	height: 50px;
	background-color: white;
	z-index: 15;
	position: relative;
}

ul {
	list-style-type: none;
}

li {
	margin-bottom: 5px;
}

.page-content {
	max-width: 1200px;
	margin: auto;
	padding: 20px 15px 40px 15px;
}


.nav-donate-container {
	padding: 0px;
	padding-right: 15px;
}

/* NAV BAR */

h1 {
	font-size: 60px;
	text-align: center;
	color: #FFF;
}	

h3 {
	font-size: 30px;
	line-height: 34px;
	text-align: center;
	color: #FFF;
}

h3 a {
	color: #FFF;
}

a {
	color: #FFF;
}

p a {
	color: rgb(12 12 12);
	text-decoration: underline;
	position: 10px;
	/* top:  100px; */
	/* margin: 100px; */
}

h1 {
	margin-top: 100px;
	text-align:center;
	font-size:60px;
	line-height: 70px;
	font-family: 'Bree Serif', 'serif';
}

#container {
	margin: 0 auto;
	max-width: 890px;
}

p {
	font-size: 20px;
	color: black;
	line-height: 31px;
	font-weight: 200;
}





.toggle,
[id^=drop] {
	display: none;
}

/* Giving a background-color to the nav container. */
nav {
	margin: 0;
	padding: 0;
	background-color: white;
	height: 60px;
	color: black;
	z-index: 15;
	position: relative;
}

#logo {
	display: block;
	padding: 0 10px;
	float: left;
	font-size:20px;
	line-height: 60px;
	font-weight: 600;
}

#logo:hover {
	background-color: white;
}

/* Since we'll have the "ul li" "float:left"
* we need to add a clear after the container. */

nav:after {
	content:"";
	display:table;
	clear:both;
}

/* Removing padding, margin and "list-style" from the "ul",
* and adding "position:reltive" */
nav ul {
	float: right;
	padding:0;
	margin:0;
	list-style: none;
	position: relative;
}

/* Positioning the navigation items inline */
nav ul li {
	margin: 0px;
	display:inline-block;
	float: left;
	background-color: white;

}

/* Styling the links */
nav a {
	display:flex;
	align-items: center;
	padding:14px 20px;	
	color: black;
	font-size:17px;
	text-decoration:none;
	width: 100%;
	height: 60px;
	transition: 0.3s;
}

.nav-donate {
	background-color: var(--brunswick-red);
	border-radius: 20px;
	height: 40px;
	margin-top: 10px;
	color: white;
}



nav ul li ul li:hover { background-color: var(--hover-nav); }

/* Background color change on Hover */
nav a:hover { 
	background-color: var(--hover-nav)

}

nav .nav-donate:hover  { 
	background-color: rgb(250, 114, 114);

}

/* Hide Dropdowns by Default
* and giving it a position of absolute */

/* CHANGE TO NONE TODO */
nav ul ul {
	display: none;
	position: absolute; 
	/* has to be the same number as the "line-height" of "nav a" */
	top: 60px; 
}

/* Display Dropdowns on Hover */
nav ul li:hover > ul {
	display:inherit;
}

/* DROP DOWN WIDTH */
/* Fisrt Tier Dropdown */
nav ul ul li {
	width: 100%;
	float: none;
	display: list-item;
	position: relative;
}

/* Second, Third and more Tiers	
* We move the 2nd and 3rd etc tier dropdowns to the left
* by the amount of the width of the first tier.
*/
nav ul ul ul li {
	position: relative;
	top:-60px;
	/* has to be the same number as the "width" of "nav ul ul li" */ 
	left:170px; 
}


/* Change ' +' in order to change the Dropdown symbol */
li > a:after { content:  ''; }
li > a:only-child:after { content: ''; }


.menu-drop {
	width: 100%;
	height: 200px;
	display: none;
	/* background-color: aquamarine; */
}

.menu {
	display: block;
	position: absolute;
	top: 0;
	right: 0px;
}

.farright-pos-dropdown {
	position: absolute;
	/* left: 251px; */
	width: 216px;
}

.nav-cont {
	position: relative;
	margin: auto;
	max-width: 1200px;
}

.nav-logo-icon {
	width: 40px;
	height: 40px;
	margin-left: 15px;
}

.logo-and-text {
    display: flex;
    align-items: center;
}





.svg-football {
	fill: grey;
	height: 40px;
	transition: 0.3s;
}

.icon-name {
	display: flex;
	align-items: center;	
	padding-left: 10px;
	transition: 0.3s;
}

.icon-name:hover {
	background-color: var(--hover-nav);
}

.icon-name:hover .svg-football {
	fill: var(--brunswick-red);	
}

.nav-cont {
	display: flex;
	justify-content: space-between;
	width: 100%;
}


.hitCounter .badge-done0 {
	opacity: 10%;
}












/* santa */

#issMap {
    height: 360px;
    z-index: 1;
}

.santa-page {
	background-color: #e9f1ce;
}

.santa-above-map {
	margin-top: 20px;
	margin-bottom: 10px;
	/* color: #c02025; */
}



.santa-above-map h2 {
	font-size: 42px;
	color: #c02025;
	text-align: center;
	font-family: 'Mountains of Christmas', cursive;
}

.santa-above-map p {
	text-align: center;
	color: #3b2424;
	margin-bottom: -10px;
}

.santa-donate-container {
	/* background-color: blue; */
	height: 200px;
	width: 100%;
	padding: 10px 0px;
	display: flex;
	justify-content: center;
}

.santa-donate {
	border-radius: 15px;
    display: flex;
    height: 60px;
    /* padding: 10px 20px; */
    /* margin-top: 20px; */
    justify-content: space-around;
    align-items: center;
    width: 80px;
    color: white;
    width: 220px;
    text-align: center;
    font-size: 20px;
    background-color: var(--brunswick-red);
}

.candy-cane {
	width: 50px;
	height: 50px;
}

.candy-cane--flip {
	transform: scaleX(-1);
}

.santa-banner {
	max-width: 100%;
	display: flex;
	height: 60px;
	background-size: 120px;
	background-position: center; 
	background-image: url("/images/santa-drive/banner1.png");
	background-repeat: repeat-x;
	/* background-color: brown; */
}

.santa-banner-image {
	width: 50%;
	height: 100%;
	max-width: 200px;
	max-height: 100px;
}


.santa-banner--home {	
	height: 140px;
	background-position: top; 
	justify-content: center;
	align-items: center;
	text-align: center;



}

.santa-banner--home h2 {
	margin-top: 40px;	
	color: #3b2424;
	margin-bottom: -10px;	
	font-size: 32px;
	color: #c02025;
	font-family: 'Mountains of Christmas', cursive;
}

.santa-banner--home p {	
	color: #3b2424;
	margin-bottom: -10px;
}

a.santa-donate {}


.santa-pop-up-modal {
	z-index: 10;
	/* height: 200px; */
	width: 95%;
	max-width: 500px;
	background-color: white;
	position: absolute;
	top: 80px;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	text-align: center;
	border-radius: 10px;
	padding: 20px;
	box-shadow: var(--shadow);
}

.santa-pop-up-modal h2 {
	margin-top: 30px;
}

.santa-pop-up-modal__input {
	width: 50%;
	min-width: 230px;
    padding-left: 10px;
    border-radius: 5px;
	background-color: var(--input-grey);
}

input[type=email] {
    padding-top: 12px;
    padding-bottom: 12px;
    margin-top: 8px;
    margin-bottom: 8px;
    box-sizing: border-box;
    border: none;
}

.santa-pop-up-modal__button {
	border-radius: 5px;
    height: 50px;
    width: 80px;
    color: white;
    width: 150px;
    text-align: center;
    font-size: 20px;
	background-color: var(--brunswick-red);
	border: none;
	margin-top: 10px;
	margin-bottom: 10px;
}

.santa-pop-up-modal__cancel {
	background-color: white;
	width: 30px;
	height: 30px;
	padding-bottom: 5px;
	padding-left: 1px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	float: right;
	box-shadow: var(--shadow);
	position: relative;
	top: -10px;
	right: -10px;
}

.santa-overlay {
	background-color: rgba(0, 0, 0, 0.432);
	height: 100%;
	width: 100%;
	position: absolute;
	z-index: 8;
}

.santa-pop-up-modal p {
 line-height: 150%;
 max-width: 300px;
 margin: 10px auto;
}



/* 
html,
body {
  height: 100%;
  padding: 0;
  margin: 0;
} */

.snowflake {
  position: absolute;
  transform: translate(-50%, -50%);
  opacity: 1;
  color: snow;
  font-family: "Georgia", serif;
  line-height: 0;
  animation: spin 20s linear infinite, glow 2s linear infinite, drop 10s cubic-bezier(0, 0, 0.92, -0.125);
  user-select: none;
}

@keyframes spin {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(1turn);
  }
}
@keyframes glow {
  50% {
    text-shadow: 0 0 3rem rgba(255, 255, 255, 0.2);
  }
}
@keyframes drop {
  from {
    top: 0;
  }
  to {
    top: 1500px;
  }
}
.snowflake s {
  display: inline-block;
  position: absolute;
  z-index: 2;
  left: 0;
  bottom: 0;
  transform-origin: center top;
  font-family: monospace;
  width: 50px;
  height: 25px;
  font-size: 50px;
  text-decoration: none;
  letter-spacing: -0.5rem;
}

.snowflake s:nth-child(2) {
  transform: rotate(0.2turn);
}

.snowflake s:nth-child(3) {
  transform: rotate(0.4turn);
}

.snowflake s:nth-child(4) {
  transform: rotate(0.6turn);
}

.snowflake s:nth-child(5) {
  transform: rotate(0.8turn);
}

#container {
  width: 100%;
  height: 100%;
  background: radial-gradient(ellipse at top, #1b2735 0%, #090a0f 100%);
  overflow: hidden;
  filter: drop-shadow(0 0 10px white);
}

span {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  color: #fff;
  font-size: 5vh;
}

.snow {
  position: absolute;
  width: 10px;
  height: 10px;
  background: white;
  border-radius: 50%;
}
.snow:nth-child(1) {
  opacity: 0.12;
  transform: translate(94.4548vw, -10px) scale(0.2777);
  animation: fall-1 22s -28s linear infinite;
}
@keyframes fall-1 {
  71.479% {
    transform: translate(88.9728vw, 71.479vh) scale(0.2777);
  }
  to {
    transform: translate(91.7138vw, 100vh) scale(0.2777);
  }
}
.snow:nth-child(2) {
  opacity: 0.4919;
  transform: translate(75.9402vw, -10px) scale(0.8885);
  animation: fall-2 20s -26s linear infinite;
}
@keyframes fall-2 {
  35.116% {
    transform: translate(70.8935vw, 35.116vh) scale(0.8885);
  }
  to {
    transform: translate(73.41685vw, 100vh) scale(0.8885);
  }
}
.snow:nth-child(3) {
  opacity: 0.7373;
  transform: translate(59.6477vw, -10px) scale(0.8819);
  animation: fall-3 27s -23s linear infinite;
}
@keyframes fall-3 {
  68.079% {
    transform: translate(52.9993vw, 68.079vh) scale(0.8819);
  }
  to {
    transform: translate(56.3235vw, 100vh) scale(0.8819);
  }
}
.snow:nth-child(4) {
  opacity: 0.8635;
  transform: translate(46.2169vw, -10px) scale(0.3037);
  animation: fall-4 19s -1s linear infinite;
}
@keyframes fall-4 {
  47.278% {
    transform: translate(37.9374vw, 47.278vh) scale(0.3037);
  }
  to {
    transform: translate(42.07715vw, 100vh) scale(0.3037);
  }
}
.snow:nth-child(5) {
  opacity: 0.5281;
  transform: translate(18.2073vw, -10px) scale(0.028);
  animation: fall-5 27s -10s linear infinite;
}
@keyframes fall-5 {
  78.977% {
    transform: translate(26.0371vw, 78.977vh) scale(0.028);
  }
  to {
    transform: translate(22.1222vw, 100vh) scale(0.028);
  }
}
.snow:nth-child(6) {
  opacity: 0.8599;
  transform: translate(34.3954vw, -10px) scale(0.0184);
  animation: fall-6 30s -5s linear infinite;
}
@keyframes fall-6 {
  39.579% {
    transform: translate(26.9582vw, 39.579vh) scale(0.0184);
  }
  to {
    transform: translate(30.6768vw, 100vh) scale(0.0184);
  }
}
.snow:nth-child(7) {
  opacity: 0.9001;
  transform: translate(21.8343vw, -10px) scale(0.0407);
  animation: fall-7 12s -14s linear infinite;
}
@keyframes fall-7 {
  75.326% {
    transform: translate(15.5911vw, 75.326vh) scale(0.0407);
  }
  to {
    transform: translate(18.7127vw, 100vh) scale(0.0407);
  }
}
.snow:nth-child(8) {
  opacity: 0.6132;
  transform: translate(84.5241vw, -10px) scale(0.7967);
  animation: fall-8 17s -18s linear infinite;
}
@keyframes fall-8 {
  35.603% {
    transform: translate(75.7259vw, 35.603vh) scale(0.7967);
  }
  to {
    transform: translate(80.125vw, 100vh) scale(0.7967);
  }
}
.snow:nth-child(9) {
  opacity: 0.0195;
  transform: translate(52.1252vw, -10px) scale(0.1132);
  animation: fall-9 22s -30s linear infinite;
}
@keyframes fall-9 {
  57.051% {
    transform: translate(45.6216vw, 57.051vh) scale(0.1132);
  }
  to {
    transform: translate(48.8734vw, 100vh) scale(0.1132);
  }
}
.snow:nth-child(10) {
  opacity: 0.1811;
  transform: translate(16.3709vw, -10px) scale(0.7331);
  animation: fall-10 29s -30s linear infinite;
}
@keyframes fall-10 {
  46.015% {
    transform: translate(12.4313vw, 46.015vh) scale(0.7331);
  }
  to {
    transform: translate(14.4011vw, 100vh) scale(0.7331);
  }
}
.snow:nth-child(11) {
  opacity: 0.3106;
  transform: translate(70.885vw, -10px) scale(0.9826);
  animation: fall-11 30s -10s linear infinite;
}
@keyframes fall-11 {
  46.994% {
    transform: translate(75.5002vw, 46.994vh) scale(0.9826);
  }
  to {
    transform: translate(73.1926vw, 100vh) scale(0.9826);
  }
}
.snow:nth-child(12) {
  opacity: 0.7835;
  transform: translate(80.1617vw, -10px) scale(0.7681);
  animation: fall-12 22s -2s linear infinite;
}
@keyframes fall-12 {
  38.254% {
    transform: translate(85.3311vw, 38.254vh) scale(0.7681);
  }
  to {
    transform: translate(82.7464vw, 100vh) scale(0.7681);
  }
}
.snow:nth-child(13) {
  opacity: 0.5778;
  transform: translate(26.629vw, -10px) scale(0.7562);
  animation: fall-13 28s -7s linear infinite;
}
@keyframes fall-13 {
  55.938% {
    transform: translate(24.0193vw, 55.938vh) scale(0.7562);
  }
  to {
    transform: translate(25.32415vw, 100vh) scale(0.7562);
  }
}
.snow:nth-child(14) {
  opacity: 0.0859;
  transform: translate(41.4949vw, -10px) scale(0.9176);
  animation: fall-14 26s -14s linear infinite;
}
@keyframes fall-14 {
  43.201% {
    transform: translate(38.1503vw, 43.201vh) scale(0.9176);
  }
  to {
    transform: translate(39.8226vw, 100vh) scale(0.9176);
  }
}
.snow:nth-child(15) {
  opacity: 0.9705;
  transform: translate(26.0186vw, -10px) scale(0.0657);
  animation: fall-15 16s -12s linear infinite;
}
@keyframes fall-15 {
  46.505% {
    transform: translate(25.7294vw, 46.505vh) scale(0.0657);
  }
  to {
    transform: translate(25.874vw, 100vh) scale(0.0657);
  }
}
.snow:nth-child(16) {
  opacity: 0.8764;
  transform: translate(42.0131vw, -10px) scale(0.1831);
  animation: fall-16 14s -27s linear infinite;
}
@keyframes fall-16 {
  67.979% {
    transform: translate(35.8923vw, 67.979vh) scale(0.1831);
  }
  to {
    transform: translate(38.9527vw, 100vh) scale(0.1831);
  }
}
.snow:nth-child(17) {
  opacity: 0.2041;
  transform: translate(37.4234vw, -10px) scale(0.1978);
  animation: fall-17 10s -21s linear infinite;
}
@keyframes fall-17 {
  45.399% {
    transform: translate(35.3257vw, 45.399vh) scale(0.1978);
  }
  to {
    transform: translate(36.37455vw, 100vh) scale(0.1978);
  }
}
.snow:nth-child(18) {
  opacity: 0.3583;
  transform: translate(74.0955vw, -10px) scale(0.6326);
  animation: fall-18 21s -12s linear infinite;
}
@keyframes fall-18 {
  79.232% {
    transform: translate(82.4255vw, 79.232vh) scale(0.6326);
  }
  to {
    transform: translate(78.2605vw, 100vh) scale(0.6326);
  }
}
.snow:nth-child(19) {
  opacity: 0.2338;
  transform: translate(39.4284vw, -10px) scale(0.452);
  animation: fall-19 22s -11s linear infinite;
}
@keyframes fall-19 {
  51.813% {
    transform: translate(29.688vw, 51.813vh) scale(0.452);
  }
  to {
    transform: translate(34.5582vw, 100vh) scale(0.452);
  }
}
.snow:nth-child(20) {
  opacity: 0.1763;
  transform: translate(50.332vw, -10px) scale(0.1268);
  animation: fall-20 21s -22s linear infinite;
}
@keyframes fall-20 {
  69.994% {
    transform: translate(54.1916vw, 69.994vh) scale(0.1268);
  }
  to {
    transform: translate(52.2618vw, 100vh) scale(0.1268);
  }
}
.snow:nth-child(21) {
  opacity: 0.7302;
  transform: translate(95.9103vw, -10px) scale(0.072);
  animation: fall-21 15s -16s linear infinite;
}
@keyframes fall-21 {
  56.465% {
    transform: translate(93.0139vw, 56.465vh) scale(0.072);
  }
  to {
    transform: translate(94.4621vw, 100vh) scale(0.072);
  }
}
.snow:nth-child(22) {
  opacity: 0.8369;
  transform: translate(94.0834vw, -10px) scale(0.5899);
  animation: fall-22 14s -7s linear infinite;
}
@keyframes fall-22 {
  51.367% {
    transform: translate(85.4096vw, 51.367vh) scale(0.5899);
  }
  to {
    transform: translate(89.7465vw, 100vh) scale(0.5899);
  }
}
.snow:nth-child(23) {
  opacity: 0.5888;
  transform: translate(37.3334vw, -10px) scale(0.1311);
  animation: fall-23 28s -12s linear infinite;
}
@keyframes fall-23 {
  57.214% {
    transform: translate(42.1293vw, 57.214vh) scale(0.1311);
  }
  to {
    transform: translate(39.73135vw, 100vh) scale(0.1311);
  }
}
.snow:nth-child(24) {
  opacity: 0.4489;
  transform: translate(86.8159vw, -10px) scale(0.4848);
  animation: fall-24 15s -22s linear infinite;
}
@keyframes fall-24 {
  36.572% {
    transform: translate(82.7696vw, 36.572vh) scale(0.4848);
  }
  to {
    transform: translate(84.79275vw, 100vh) scale(0.4848);
  }
}
.snow:nth-child(25) {
  opacity: 0.8271;
  transform: translate(13.5435vw, -10px) scale(0.6742);
  animation: fall-25 12s -12s linear infinite;
}
@keyframes fall-25 {
  38.368% {
    transform: translate(21.749vw, 38.368vh) scale(0.6742);
  }
  to {
    transform: translate(17.64625vw, 100vh) scale(0.6742);
  }
}
.snow:nth-child(26) {
  opacity: 0.796;
  transform: translate(63.0068vw, -10px) scale(0.4697);
  animation: fall-26 19s -7s linear infinite;
}
@keyframes fall-26 {
  65.102% {
    transform: translate(63.2114vw, 65.102vh) scale(0.4697);
  }
  to {
    transform: translate(63.1091vw, 100vh) scale(0.4697);
  }
}
.snow:nth-child(27) {
  opacity: 0.2029;
  transform: translate(36.9956vw, -10px) scale(0.8798);
  animation: fall-27 28s -16s linear infinite;
}
@keyframes fall-27 {
  49.801% {
    transform: translate(37.1367vw, 49.801vh) scale(0.8798);
  }
  to {
    transform: translate(37.06615vw, 100vh) scale(0.8798);
  }
}
.snow:nth-child(28) {
  opacity: 0.8164;
  transform: translate(1.2896vw, -10px) scale(0.7882);
  animation: fall-28 25s -2s linear infinite;
}
@keyframes fall-28 {
  64.643% {
    transform: translate(4.8009vw, 64.643vh) scale(0.7882);
  }
  to {
    transform: translate(3.04525vw, 100vh) scale(0.7882);
  }
}
.snow:nth-child(29) {
  opacity: 0.261;
  transform: translate(80.8949vw, -10px) scale(0.4756);
  animation: fall-29 10s -25s linear infinite;
}
@keyframes fall-29 {
  35.638% {
    transform: translate(76.7283vw, 35.638vh) scale(0.4756);
  }
  to {
    transform: translate(78.8116vw, 100vh) scale(0.4756);
  }
}
.snow:nth-child(30) {
  opacity: 0.9261;
  transform: translate(37.3925vw, -10px) scale(0.7906);
  animation: fall-30 25s -17s linear infinite;
}
@keyframes fall-30 {
  49.535% {
    transform: translate(42.6879vw, 49.535vh) scale(0.7906);
  }
  to {
    transform: translate(40.0402vw, 100vh) scale(0.7906);
  }
}
.snow:nth-child(31) {
  opacity: 0.6092;
  transform: translate(5.7069vw, -10px) scale(0.4545);
  animation: fall-31 17s -7s linear infinite;
}
@keyframes fall-31 {
  40.382% {
    transform: translate(1.0399vw, 40.382vh) scale(0.4545);
  }
  to {
    transform: translate(3.3734vw, 100vh) scale(0.4545);
  }
}
.snow:nth-child(32) {
  opacity: 0.3579;
  transform: translate(31.7291vw, -10px) scale(0.5486);
  animation: fall-32 11s -13s linear infinite;
}
@keyframes fall-32 {
  79.922% {
    transform: translate(26.3781vw, 79.922vh) scale(0.5486);
  }
  to {
    transform: translate(29.0536vw, 100vh) scale(0.5486);
  }
}
.snow:nth-child(33) {
  opacity: 0.3408;
  transform: translate(58.7567vw, -10px) scale(0.5407);
  animation: fall-33 24s -10s linear infinite;
}
@keyframes fall-33 {
  59.818% {
    transform: translate(54.8965vw, 59.818vh) scale(0.5407);
  }
  to {
    transform: translate(56.8266vw, 100vh) scale(0.5407);
  }
}
.snow:nth-child(34) {
  opacity: 0.4543;
  transform: translate(87.4561vw, -10px) scale(0.6242);
  animation: fall-34 23s -18s linear infinite;
}
@keyframes fall-34 {
  64.967% {
    transform: translate(85.3056vw, 64.967vh) scale(0.6242);
  }
  to {
    transform: translate(86.38085vw, 100vh) scale(0.6242);
  }
}
.snow:nth-child(35) {
  opacity: 0.2112;
  transform: translate(33.662vw, -10px) scale(0.0671);
  animation: fall-35 24s -13s linear infinite;
}
@keyframes fall-35 {
  42.873% {
    transform: translate(27.0598vw, 42.873vh) scale(0.0671);
  }
  to {
    transform: translate(30.3609vw, 100vh) scale(0.0671);
  }
}
.snow:nth-child(36) {
  opacity: 0.8721;
  transform: translate(91.9594vw, -10px) scale(0.2287);
  animation: fall-36 14s -29s linear infinite;
}
@keyframes fall-36 {
  38.31% {
    transform: translate(82.7871vw, 38.31vh) scale(0.2287);
  }
  to {
    transform: translate(87.37325vw, 100vh) scale(0.2287);
  }
}
.snow:nth-child(37) {
  opacity: 0.4466;
  transform: translate(91.014vw, -10px) scale(0.0364);
  animation: fall-37 12s -1s linear infinite;
}
@keyframes fall-37 {
  33.214% {
    transform: translate(91.4815vw, 33.214vh) scale(0.0364);
  }
  to {
    transform: translate(91.24775vw, 100vh) scale(0.0364);
  }
}
.snow:nth-child(38) {
  opacity: 0.9642;
  transform: translate(19.7175vw, -10px) scale(0.7387);
  animation: fall-38 20s -15s linear infinite;
}
@keyframes fall-38 {
  43.502% {
    transform: translate(12.2746vw, 43.502vh) scale(0.7387);
  }
  to {
    transform: translate(15.99605vw, 100vh) scale(0.7387);
  }
}
.snow:nth-child(39) {
  opacity: 0.5981;
  transform: translate(26.6723vw, -10px) scale(0.5051);
  animation: fall-39 26s -3s linear infinite;
}
@keyframes fall-39 {
  79.371% {
    transform: translate(17.735vw, 79.371vh) scale(0.5051);
  }
  to {
    transform: translate(22.20365vw, 100vh) scale(0.5051);
  }
}
.snow:nth-child(40) {
  opacity: 0.8338;
  transform: translate(50.7147vw, -10px) scale(0.1046);
  animation: fall-40 20s -10s linear infinite;
}
@keyframes fall-40 {
  49.082% {
    transform: translate(48.108vw, 49.082vh) scale(0.1046);
  }
  to {
    transform: translate(49.41135vw, 100vh) scale(0.1046);
  }
}
.snow:nth-child(41) {
  opacity: 0.6943;
  transform: translate(28.2091vw, -10px) scale(0.4617);
  animation: fall-41 28s -21s linear infinite;
}
@keyframes fall-41 {
  30.236% {
    transform: translate(27.0488vw, 30.236vh) scale(0.4617);
  }
  to {
    transform: translate(27.62895vw, 100vh) scale(0.4617);
  }
}
.snow:nth-child(42) {
  opacity: 0.7103;
  transform: translate(30.3915vw, -10px) scale(0.1343);
  animation: fall-42 26s -12s linear infinite;
}
@keyframes fall-42 {
  34.616% {
    transform: translate(28.218vw, 34.616vh) scale(0.1343);
  }
  to {
    transform: translate(29.30475vw, 100vh) scale(0.1343);
  }
}
.snow:nth-child(43) {
  opacity: 0.526;
  transform: translate(73.1546vw, -10px) scale(0.9603);
  animation: fall-43 16s -29s linear infinite;
}
@keyframes fall-43 {
  70.672% {
    transform: translate(72.8269vw, 70.672vh) scale(0.9603);
  }
  to {
    transform: translate(72.99075vw, 100vh) scale(0.9603);
  }
}
.snow:nth-child(44) {
  opacity: 0.5949;
  transform: translate(74.4004vw, -10px) scale(0.2952);
  animation: fall-44 10s -26s linear infinite;
}
@keyframes fall-44 {
  32.799% {
    transform: translate(81.9634vw, 32.799vh) scale(0.2952);
  }
  to {
    transform: translate(78.1819vw, 100vh) scale(0.2952);
  }
}
.snow:nth-child(45) {
  opacity: 0.2617;
  transform: translate(6.548vw, -10px) scale(0.9548);
  animation: fall-45 16s -2s linear infinite;
}
@keyframes fall-45 {
  35.308% {
    transform: translate(8.0755vw, 35.308vh) scale(0.9548);
  }
  to {
    transform: translate(7.31175vw, 100vh) scale(0.9548);
  }
}
.snow:nth-child(46) {
  opacity: 0.8945;
  transform: translate(6.0728vw, -10px) scale(0.3654);
  animation: fall-46 19s -11s linear infinite;
}
@keyframes fall-46 {
  67.797% {
    transform: translate(4.9634vw, 67.797vh) scale(0.3654);
  }
  to {
    transform: translate(5.5181vw, 100vh) scale(0.3654);
  }
}
.snow:nth-child(47) {
  opacity: 0.2645;
  transform: translate(47.225vw, -10px) scale(0.7237);
  animation: fall-47 12s -27s linear infinite;
}
@keyframes fall-47 {
  79.63% {
    transform: translate(56.4438vw, 79.63vh) scale(0.7237);
  }
  to {
    transform: translate(51.8344vw, 100vh) scale(0.7237);
  }
}
.snow:nth-child(48) {
  opacity: 0.5789;
  transform: translate(14.6059vw, -10px) scale(0.9301);
  animation: fall-48 23s -11s linear infinite;
}
@keyframes fall-48 {
  42.566% {
    transform: translate(15.0354vw, 42.566vh) scale(0.9301);
  }
  to {
    transform: translate(14.82065vw, 100vh) scale(0.9301);
  }
}
.snow:nth-child(49) {
  opacity: 0.5002;
  transform: translate(0.2897vw, -10px) scale(0.7474);
  animation: fall-49 17s -21s linear infinite;
}
@keyframes fall-49 {
  79.432% {
    transform: translate(-6.3098vw, 79.432vh) scale(0.7474);
  }
  to {
    transform: translate(-3.01005vw, 100vh) scale(0.7474);
  }
}
.snow:nth-child(50) {
  opacity: 0.721;
  transform: translate(90.028vw, -10px) scale(0.3326);
  animation: fall-50 10s -17s linear infinite;
}
@keyframes fall-50 {
  56.286% {
    transform: translate(93.0039vw, 56.286vh) scale(0.3326);
  }
  to {
    transform: translate(91.51595vw, 100vh) scale(0.3326);
  }
}
.snow:nth-child(51) {
  opacity: 0.4278;
  transform: translate(49.2951vw, -10px) scale(0.1592);
  animation: fall-51 13s -9s linear infinite;
}
@keyframes fall-51 {
  40.663% {
    transform: translate(55.8043vw, 40.663vh) scale(0.1592);
  }
  to {
    transform: translate(52.5497vw, 100vh) scale(0.1592);
  }
}
.snow:nth-child(52) {
  opacity: 0.43;
  transform: translate(8.1513vw, -10px) scale(0.2476);
  animation: fall-52 25s -12s linear infinite;
}
@keyframes fall-52 {
  54.16% {
    transform: translate(4.9837vw, 54.16vh) scale(0.2476);
  }
  to {
    transform: translate(6.5675vw, 100vh) scale(0.2476);
  }
}
.snow:nth-child(53) {
  opacity: 0.9693;
  transform: translate(34.7397vw, -10px) scale(0.7939);
  animation: fall-53 14s -10s linear infinite;
}
@keyframes fall-53 {
  62.062% {
    transform: translate(26.813vw, 62.062vh) scale(0.7939);
  }
  to {
    transform: translate(30.77635vw, 100vh) scale(0.7939);
  }
}
.snow:nth-child(54) {
  opacity: 0.4424;
  transform: translate(72.5107vw, -10px) scale(0.5314);
  animation: fall-54 13s -19s linear infinite;
}
@keyframes fall-54 {
  37.634% {
    transform: translate(81.6616vw, 37.634vh) scale(0.5314);
  }
  to {
    transform: translate(77.08615vw, 100vh) scale(0.5314);
  }
}
.snow:nth-child(55) {
  opacity: 0.437;
  transform: translate(90.0266vw, -10px) scale(0.5701);
  animation: fall-55 26s -8s linear infinite;
}
@keyframes fall-55 {
  38.791% {
    transform: translate(94.9255vw, 38.791vh) scale(0.5701);
  }
  to {
    transform: translate(92.47605vw, 100vh) scale(0.5701);
  }
}
.snow:nth-child(56) {
  opacity: 0.4666;
  transform: translate(4.3634vw, -10px) scale(0.1466);
  animation: fall-56 14s -20s linear infinite;
}
@keyframes fall-56 {
  52.583% {
    transform: translate(2.138vw, 52.583vh) scale(0.1466);
  }
  to {
    transform: translate(3.2507vw, 100vh) scale(0.1466);
  }
}
.snow:nth-child(57) {
  opacity: 0.3741;
  transform: translate(50.2878vw, -10px) scale(0.4285);
  animation: fall-57 19s -26s linear infinite;
}
@keyframes fall-57 {
  46.746% {
    transform: translate(45.4932vw, 46.746vh) scale(0.4285);
  }
  to {
    transform: translate(47.8905vw, 100vh) scale(0.4285);
  }
}
.snow:nth-child(58) {
  opacity: 0.3139;
  transform: translate(18.7513vw, -10px) scale(0.4556);
  animation: fall-58 25s -11s linear infinite;
}
@keyframes fall-58 {
  54.209% {
    transform: translate(19.4444vw, 54.209vh) scale(0.4556);
  }
  to {
    transform: translate(19.09785vw, 100vh) scale(0.4556);
  }
}
.snow:nth-child(59) {
  opacity: 0.8021;
  transform: translate(80.8533vw, -10px) scale(0.5243);
  animation: fall-59 23s -22s linear infinite;
}
@keyframes fall-59 {
  43.198% {
    transform: translate(79.5454vw, 43.198vh) scale(0.5243);
  }
  to {
    transform: translate(80.19935vw, 100vh) scale(0.5243);
  }
}
.snow:nth-child(60) {
  opacity: 0.9209;
  transform: translate(12.6129vw, -10px) scale(0.4803);
  animation: fall-60 29s -8s linear infinite;
}
@keyframes fall-60 {
  70.267% {
    transform: translate(12.838vw, 70.267vh) scale(0.4803);
  }
  to {
    transform: translate(12.72545vw, 100vh) scale(0.4803);
  }
}
.snow:nth-child(61) {
  opacity: 0.0231;
  transform: translate(20.3054vw, -10px) scale(0.3707);
  animation: fall-61 16s -20s linear infinite;
}
@keyframes fall-61 {
  37.917% {
    transform: translate(17.9408vw, 37.917vh) scale(0.3707);
  }
  to {
    transform: translate(19.1231vw, 100vh) scale(0.3707);
  }
}
.snow:nth-child(62) {
  opacity: 0.3837;
  transform: translate(61.7242vw, -10px) scale(0.1526);
  animation: fall-62 12s -4s linear infinite;
}
@keyframes fall-62 {
  55.217% {
    transform: translate(58.7554vw, 55.217vh) scale(0.1526);
  }
  to {
    transform: translate(60.2398vw, 100vh) scale(0.1526);
  }
}
.snow:nth-child(63) {
  opacity: 0.5014;
  transform: translate(93.1141vw, -10px) scale(0.7413);
  animation: fall-63 28s -24s linear infinite;
}
@keyframes fall-63 {
  39.672% {
    transform: translate(100.5557vw, 39.672vh) scale(0.7413);
  }
  to {
    transform: translate(96.8349vw, 100vh) scale(0.7413);
  }
}
.snow:nth-child(64) {
  opacity: 0.3097;
  transform: translate(93.8214vw, -10px) scale(0.8021);
  animation: fall-64 27s -3s linear infinite;
}
@keyframes fall-64 {
  36.197% {
    transform: translate(103.2517vw, 36.197vh) scale(0.8021);
  }
  to {
    transform: translate(98.53655vw, 100vh) scale(0.8021);
  }
}
.snow:nth-child(65) {
  opacity: 0.3312;
  transform: translate(97.5715vw, -10px) scale(0.066);
  animation: fall-65 20s -3s linear infinite;
}
@keyframes fall-65 {
  39.735% {
    transform: translate(100.3903vw, 39.735vh) scale(0.066);
  }
  to {
    transform: translate(98.9809vw, 100vh) scale(0.066);
  }
}
.snow:nth-child(66) {
  opacity: 0.067;
  transform: translate(18.3695vw, -10px) scale(0.5203);
  animation: fall-66 22s -29s linear infinite;
}
@keyframes fall-66 {
  39.627% {
    transform: translate(23.382vw, 39.627vh) scale(0.5203);
  }
  to {
    transform: translate(20.87575vw, 100vh) scale(0.5203);
  }
}
.snow:nth-child(67) {
  opacity: 0.408;
  transform: translate(64.279vw, -10px) scale(0.0819);
  animation: fall-67 29s -2s linear infinite;
}
@keyframes fall-67 {
  43.701% {
    transform: translate(71.8265vw, 43.701vh) scale(0.0819);
  }
  to {
    transform: translate(68.05275vw, 100vh) scale(0.0819);
  }
}
.snow:nth-child(68) {
  opacity: 0.8508;
  transform: translate(27.8823vw, -10px) scale(0.707);
  animation: fall-68 16s -26s linear infinite;
}
@keyframes fall-68 {
  36.661% {
    transform: translate(31.0144vw, 36.661vh) scale(0.707);
  }
  to {
    transform: translate(29.44835vw, 100vh) scale(0.707);
  }
}
.snow:nth-child(69) {
  opacity: 0.6501;
  transform: translate(87.5636vw, -10px) scale(0.2376);
  animation: fall-69 26s -7s linear infinite;
}
@keyframes fall-69 {
  68.629% {
    transform: translate(79.5591vw, 68.629vh) scale(0.2376);
  }
  to {
    transform: translate(83.56135vw, 100vh) scale(0.2376);
  }
}
.snow:nth-child(70) {
  opacity: 0.8362;
  transform: translate(96.1843vw, -10px) scale(0.7332);
  animation: fall-70 19s -25s linear infinite;
}
@keyframes fall-70 {
  60.516% {
    transform: translate(87.7158vw, 60.516vh) scale(0.7332);
  }
  to {
    transform: translate(91.95005vw, 100vh) scale(0.7332);
  }
}
.snow:nth-child(71) {
  opacity: 0.8924;
  transform: translate(23.0895vw, -10px) scale(0.877);
  animation: fall-71 26s -16s linear infinite;
}
@keyframes fall-71 {
  35.284% {
    transform: translate(25.008vw, 35.284vh) scale(0.877);
  }
  to {
    transform: translate(24.04875vw, 100vh) scale(0.877);
  }
}
.snow:nth-child(72) {
  opacity: 0.7602;
  transform: translate(60.4942vw, -10px) scale(0.4655);
  animation: fall-72 26s -19s linear infinite;
}
@keyframes fall-72 {
  39.576% {
    transform: translate(52.3705vw, 39.576vh) scale(0.4655);
  }
  to {
    transform: translate(56.43235vw, 100vh) scale(0.4655);
  }
}
.snow:nth-child(73) {
  opacity: 0.2847;
  transform: translate(75.6756vw, -10px) scale(0.058);
  animation: fall-73 14s -29s linear infinite;
}
@keyframes fall-73 {
  46.464% {
    transform: translate(74.0782vw, 46.464vh) scale(0.058);
  }
  to {
    transform: translate(74.8769vw, 100vh) scale(0.058);
  }
}
.snow:nth-child(74) {
  opacity: 0.4794;
  transform: translate(15.5791vw, -10px) scale(0.297);
  animation: fall-74 22s -12s linear infinite;
}
@keyframes fall-74 {
  36.133% {
    transform: translate(11.5993vw, 36.133vh) scale(0.297);
  }
  to {
    transform: translate(13.5892vw, 100vh) scale(0.297);
  }
}
.snow:nth-child(75) {
  opacity: 0.3705;
  transform: translate(98.0923vw, -10px) scale(0.397);
  animation: fall-75 28s -5s linear infinite;
}
@keyframes fall-75 {
  45.818% {
    transform: translate(94.7527vw, 45.818vh) scale(0.397);
  }
  to {
    transform: translate(96.4225vw, 100vh) scale(0.397);
  }
}
.snow:nth-child(76) {
  opacity: 0.2485;
  transform: translate(9.7649vw, -10px) scale(0.4408);
  animation: fall-76 14s -20s linear infinite;
}
@keyframes fall-76 {
  73.239% {
    transform: translate(19.2403vw, 73.239vh) scale(0.4408);
  }
  to {
    transform: translate(14.5026vw, 100vh) scale(0.4408);
  }
}
.snow:nth-child(77) {
  opacity: 0.7541;
  transform: translate(6.8377vw, -10px) scale(0.6036);
  animation: fall-77 12s -24s linear infinite;
}
@keyframes fall-77 {
  48.821% {
    transform: translate(5.5292vw, 48.821vh) scale(0.6036);
  }
  to {
    transform: translate(6.18345vw, 100vh) scale(0.6036);
  }
}
.snow:nth-child(78) {
  opacity: 0.7385;
  transform: translate(0.4223vw, -10px) scale(0.2269);
  animation: fall-78 11s -7s linear infinite;
}
@keyframes fall-78 {
  30.732% {
    transform: translate(0.5149vw, 30.732vh) scale(0.2269);
  }
  to {
    transform: translate(0.4686vw, 100vh) scale(0.2269);
  }
}
.snow:nth-child(79) {
  opacity: 0.4818;
  transform: translate(19.3388vw, -10px) scale(0.1766);
  animation: fall-79 24s -27s linear infinite;
}
@keyframes fall-79 {
  34.017% {
    transform: translate(29.0641vw, 34.017vh) scale(0.1766);
  }
  to {
    transform: translate(24.20145vw, 100vh) scale(0.1766);
  }
}
.snow:nth-child(80) {
  opacity: 0.0349;
  transform: translate(64.3364vw, -10px) scale(0.6201);
  animation: fall-80 12s -20s linear infinite;
}
@keyframes fall-80 {
  38.942% {
    transform: translate(66.7vw, 38.942vh) scale(0.6201);
  }
  to {
    transform: translate(65.5182vw, 100vh) scale(0.6201);
  }
}
.snow:nth-child(81) {
  opacity: 0.3932;
  transform: translate(13.0655vw, -10px) scale(0.6938);
  animation: fall-81 10s -14s linear infinite;
}
@keyframes fall-81 {
  65.739% {
    transform: translate(19.555vw, 65.739vh) scale(0.6938);
  }
  to {
    transform: translate(16.31025vw, 100vh) scale(0.6938);
  }
}
.snow:nth-child(82) {
  opacity: 0.8121;
  transform: translate(94.2208vw, -10px) scale(0.505);
  animation: fall-82 22s -20s linear infinite;
}
@keyframes fall-82 {
  43.687% {
    transform: translate(104.0835vw, 43.687vh) scale(0.505);
  }
  to {
    transform: translate(99.15215vw, 100vh) scale(0.505);
  }
}
.snow:nth-child(83) {
  opacity: 0.9359;
  transform: translate(88.3931vw, -10px) scale(0.3938);
  animation: fall-83 20s -3s linear infinite;
}
@keyframes fall-83 {
  44.003% {
    transform: translate(94.6172vw, 44.003vh) scale(0.3938);
  }
  to {
    transform: translate(91.50515vw, 100vh) scale(0.3938);
  }
}
.snow:nth-child(84) {
  opacity: 0.3662;
  transform: translate(2.6651vw, -10px) scale(0.0279);
  animation: fall-84 26s -15s linear infinite;
}
@keyframes fall-84 {
  33.585% {
    transform: translate(9.3478vw, 33.585vh) scale(0.0279);
  }
  to {
    transform: translate(6.00645vw, 100vh) scale(0.0279);
  }
}
.snow:nth-child(85) {
  opacity: 0.798;
  transform: translate(42.4959vw, -10px) scale(0.6282);
  animation: fall-85 12s -30s linear infinite;
}
@keyframes fall-85 {
  54.927% {
    transform: translate(41.6325vw, 54.927vh) scale(0.6282);
  }
  to {
    transform: translate(42.0642vw, 100vh) scale(0.6282);
  }
}
.snow:nth-child(86) {
  opacity: 0.8363;
  transform: translate(43.788vw, -10px) scale(0.1191);
  animation: fall-86 21s -24s linear infinite;
}
@keyframes fall-86 {
  41.149% {
    transform: translate(38.7386vw, 41.149vh) scale(0.1191);
  }
  to {
    transform: translate(41.2633vw, 100vh) scale(0.1191);
  }
}
.snow:nth-child(87) {
  opacity: 0.9193;
  transform: translate(84.9385vw, -10px) scale(0.4389);
  animation: fall-87 30s -6s linear infinite;
}
@keyframes fall-87 {
  62.806% {
    transform: translate(89.2932vw, 62.806vh) scale(0.4389);
  }
  to {
    transform: translate(87.11585vw, 100vh) scale(0.4389);
  }
}
.snow:nth-child(88) {
  opacity: 0.9248;
  transform: translate(38.9662vw, -10px) scale(0.4718);
  animation: fall-88 15s -26s linear infinite;
}
@keyframes fall-88 {
  53.184% {
    transform: translate(33.5262vw, 53.184vh) scale(0.4718);
  }
  to {
    transform: translate(36.2462vw, 100vh) scale(0.4718);
  }
}
.snow:nth-child(89) {
  opacity: 0.2997;
  transform: translate(43.5984vw, -10px) scale(0.7757);
  animation: fall-89 20s -2s linear infinite;
}
@keyframes fall-89 {
  48.15% {
    transform: translate(38.2621vw, 48.15vh) scale(0.7757);
  }
  to {
    transform: translate(40.93025vw, 100vh) scale(0.7757);
  }
}
.snow:nth-child(90) {
  opacity: 0.6222;
  transform: translate(99.3803vw, -10px) scale(0.0154);
  animation: fall-90 11s -26s linear infinite;
}
@keyframes fall-90 {
  59.2% {
    transform: translate(90.4296vw, 59.2vh) scale(0.0154);
  }
  to {
    transform: translate(94.90495vw, 100vh) scale(0.0154);
  }
}
.snow:nth-child(91) {
  opacity: 0.7576;
  transform: translate(17.0084vw, -10px) scale(0.7748);
  animation: fall-91 10s -20s linear infinite;
}
@keyframes fall-91 {
  55.535% {
    transform: translate(21.9925vw, 55.535vh) scale(0.7748);
  }
  to {
    transform: translate(19.50045vw, 100vh) scale(0.7748);
  }
}
.snow:nth-child(92) {
  opacity: 0.7373;
  transform: translate(31.7582vw, -10px) scale(0.2002);
  animation: fall-92 14s -7s linear infinite;
}
@keyframes fall-92 {
  79.198% {
    transform: translate(41.3458vw, 79.198vh) scale(0.2002);
  }
  to {
    transform: translate(36.552vw, 100vh) scale(0.2002);
  }
}
.snow:nth-child(93) {
  opacity: 0.5685;
  transform: translate(17.6912vw, -10px) scale(0.1966);
  animation: fall-93 20s -9s linear infinite;
}
@keyframes fall-93 {
  76.967% {
    transform: translate(12.7881vw, 76.967vh) scale(0.1966);
  }
  to {
    transform: translate(15.23965vw, 100vh) scale(0.1966);
  }
}
.snow:nth-child(94) {
  opacity: 0.3671;
  transform: translate(87.4427vw, -10px) scale(0.7229);
  animation: fall-94 27s -21s linear infinite;
}
@keyframes fall-94 {
  54.552% {
    transform: translate(87.431vw, 54.552vh) scale(0.7229);
  }
  to {
    transform: translate(87.43685vw, 100vh) scale(0.7229);
  }
}
.snow:nth-child(95) {
  opacity: 0.7166;
  transform: translate(70.5715vw, -10px) scale(0.2269);
  animation: fall-95 12s -29s linear infinite;
}
@keyframes fall-95 {
  37.17% {
    transform: translate(70.8929vw, 37.17vh) scale(0.2269);
  }
  to {
    transform: translate(70.7322vw, 100vh) scale(0.2269);
  }
}
.snow:nth-child(96) {
  opacity: 0.5119;
  transform: translate(33.106vw, -10px) scale(0.0791);
  animation: fall-96 26s -30s linear infinite;
}
@keyframes fall-96 {
  54.923% {
    transform: translate(24.3539vw, 54.923vh) scale(0.0791);
  }
  to {
    transform: translate(28.72995vw, 100vh) scale(0.0791);
  }
}
.snow:nth-child(97) {
  opacity: 0.6424;
  transform: translate(65.8768vw, -10px) scale(0.3462);
  animation: fall-97 30s -6s linear infinite;
}
@keyframes fall-97 {
  34.091% {
    transform: translate(61.2889vw, 34.091vh) scale(0.3462);
  }
  to {
    transform: translate(63.58285vw, 100vh) scale(0.3462);
  }
}
.snow:nth-child(98) {
  opacity: 0.1512;
  transform: translate(53.6066vw, -10px) scale(0.9667);
  animation: fall-98 26s -24s linear infinite;
}
@keyframes fall-98 {
  36.231% {
    transform: translate(56.6477vw, 36.231vh) scale(0.9667);
  }
  to {
    transform: translate(55.12715vw, 100vh) scale(0.9667);
  }
}
.snow:nth-child(99) {
  opacity: 0.4098;
  transform: translate(81.9104vw, -10px) scale(0.8602);
  animation: fall-99 15s -21s linear infinite;
}
@keyframes fall-99 {
  45.541% {
    transform: translate(87.2654vw, 45.541vh) scale(0.8602);
  }
  to {
    transform: translate(84.5879vw, 100vh) scale(0.8602);
  }
}
.snow:nth-child(100) {
  opacity: 0.5693;
  transform: translate(82.1029vw, -10px) scale(0.3125);
  animation: fall-100 11s -1s linear infinite;
}
@keyframes fall-100 {
  32.038% {
    transform: translate(82.7511vw, 32.038vh) scale(0.3125);
  }
  to {
    transform: translate(82.427vw, 100vh) scale(0.3125);
  }
}
.snow:nth-child(101) {
  opacity: 0.5313;
  transform: translate(63.335vw, -10px) scale(0.7334);
  animation: fall-101 28s -20s linear infinite;
}
@keyframes fall-101 {
  75.143% {
    transform: translate(68.3522vw, 75.143vh) scale(0.7334);
  }
  to {
    transform: translate(65.8436vw, 100vh) scale(0.7334);
  }
}
.snow:nth-child(102) {
  opacity: 0.7286;
  transform: translate(30.6124vw, -10px) scale(0.721);
  animation: fall-102 23s -8s linear infinite;
}
@keyframes fall-102 {
  35.079% {
    transform: translate(28.3566vw, 35.079vh) scale(0.721);
  }
  to {
    transform: translate(29.4845vw, 100vh) scale(0.721);
  }
}
.snow:nth-child(103) {
  opacity: 0.2809;
  transform: translate(78.5405vw, -10px) scale(0.7427);
  animation: fall-103 27s -24s linear infinite;
}
@keyframes fall-103 {
  37.222% {
    transform: translate(87.6971vw, 37.222vh) scale(0.7427);
  }
  to {
    transform: translate(83.1188vw, 100vh) scale(0.7427);
  }
}
.snow:nth-child(104) {
  opacity: 0.1168;
  transform: translate(80.3496vw, -10px) scale(0.0639);
  animation: fall-104 16s -2s linear infinite;
}
@keyframes fall-104 {
  40.266% {
    transform: translate(76.774vw, 40.266vh) scale(0.0639);
  }
  to {
    transform: translate(78.5618vw, 100vh) scale(0.0639);
  }
}
.snow:nth-child(105) {
  opacity: 0.4482;
  transform: translate(36.0376vw, -10px) scale(0.1314);
  animation: fall-105 27s -6s linear infinite;
}
@keyframes fall-105 {
  66.822% {
    transform: translate(32.1302vw, 66.822vh) scale(0.1314);
  }
  to {
    transform: translate(34.0839vw, 100vh) scale(0.1314);
  }
}
.snow:nth-child(106) {
  opacity: 0.2426;
  transform: translate(61.4748vw, -10px) scale(0.4697);
  animation: fall-106 28s -18s linear infinite;
}
@keyframes fall-106 {
  32.973% {
    transform: translate(53.0462vw, 32.973vh) scale(0.4697);
  }
  to {
    transform: translate(57.2605vw, 100vh) scale(0.4697);
  }
}
.snow:nth-child(107) {
  opacity: 0.3281;
  transform: translate(26.485vw, -10px) scale(0.0104);
  animation: fall-107 28s -10s linear infinite;
}
@keyframes fall-107 {
  46.118% {
    transform: translate(26.1888vw, 46.118vh) scale(0.0104);
  }
  to {
    transform: translate(26.3369vw, 100vh) scale(0.0104);
  }
}
.snow:nth-child(108) {
  opacity: 0.8204;
  transform: translate(13.5219vw, -10px) scale(0.3943);
  animation: fall-108 27s -19s linear infinite;
}
@keyframes fall-108 {
  30.364% {
    transform: translate(18.8276vw, 30.364vh) scale(0.3943);
  }
  to {
    transform: translate(16.17475vw, 100vh) scale(0.3943);
  }
}
.snow:nth-child(109) {
  opacity: 0.1694;
  transform: translate(41.1324vw, -10px) scale(0.6733);
  animation: fall-109 11s -5s linear infinite;
}
@keyframes fall-109 {
  37.086% {
    transform: translate(33.4758vw, 37.086vh) scale(0.6733);
  }
  to {
    transform: translate(37.3041vw, 100vh) scale(0.6733);
  }
}
.snow:nth-child(110) {
  opacity: 0.6581;
  transform: translate(98.7361vw, -10px) scale(0.1224);
  animation: fall-110 24s -22s linear infinite;
}
@keyframes fall-110 {
  55.475% {
    transform: translate(98.4773vw, 55.475vh) scale(0.1224);
  }
  to {
    transform: translate(98.6067vw, 100vh) scale(0.1224);
  }
}
.snow:nth-child(111) {
  opacity: 0.1494;
  transform: translate(80.0682vw, -10px) scale(0.2691);
  animation: fall-111 10s -30s linear infinite;
}
@keyframes fall-111 {
  41.564% {
    transform: translate(83.383vw, 41.564vh) scale(0.2691);
  }
  to {
    transform: translate(81.7256vw, 100vh) scale(0.2691);
  }
}
.snow:nth-child(112) {
  opacity: 0.7045;
  transform: translate(90.3205vw, -10px) scale(0.5927);
  animation: fall-112 28s -1s linear infinite;
}
@keyframes fall-112 {
  56.128% {
    transform: translate(83.7007vw, 56.128vh) scale(0.5927);
  }
  to {
    transform: translate(87.0106vw, 100vh) scale(0.5927);
  }
}
.snow:nth-child(113) {
  opacity: 0.7526;
  transform: translate(17.5475vw, -10px) scale(0.8686);
  animation: fall-113 12s -8s linear infinite;
}
@keyframes fall-113 {
  55.637% {
    transform: translate(17.1092vw, 55.637vh) scale(0.8686);
  }
  to {
    transform: translate(17.32835vw, 100vh) scale(0.8686);
  }
}
.snow:nth-child(114) {
  opacity: 0.1499;
  transform: translate(41.7314vw, -10px) scale(0.4646);
  animation: fall-114 22s -18s linear infinite;
}
@keyframes fall-114 {
  69.363% {
    transform: translate(33.5993vw, 69.363vh) scale(0.4646);
  }
  to {
    transform: translate(37.66535vw, 100vh) scale(0.4646);
  }
}
.snow:nth-child(115) {
  opacity: 0.5862;
  transform: translate(31.8283vw, -10px) scale(0.5207);
  animation: fall-115 30s -5s linear infinite;
}
@keyframes fall-115 {
  55.639% {
    transform: translate(26.295vw, 55.639vh) scale(0.5207);
  }
  to {
    transform: translate(29.06165vw, 100vh) scale(0.5207);
  }
}
.snow:nth-child(116) {
  opacity: 0.7071;
  transform: translate(47.9041vw, -10px) scale(0.5827);
  animation: fall-116 26s -7s linear infinite;
}
@keyframes fall-116 {
  32.277% {
    transform: translate(50.9807vw, 32.277vh) scale(0.5827);
  }
  to {
    transform: translate(49.4424vw, 100vh) scale(0.5827);
  }
}
.snow:nth-child(117) {
  opacity: 0.9702;
  transform: translate(74.2618vw, -10px) scale(0.6172);
  animation: fall-117 25s -18s linear infinite;
}
@keyframes fall-117 {
  66.722% {
    transform: translate(78.9934vw, 66.722vh) scale(0.6172);
  }
  to {
    transform: translate(76.6276vw, 100vh) scale(0.6172);
  }
}
.snow:nth-child(118) {
  opacity: 0.7965;
  transform: translate(62.8616vw, -10px) scale(0.9278);
  animation: fall-118 29s -9s linear infinite;
}
@keyframes fall-118 {
  51.219% {
    transform: translate(57.0203vw, 51.219vh) scale(0.9278);
  }
  to {
    transform: translate(59.94095vw, 100vh) scale(0.9278);
  }
}
.snow:nth-child(119) {
  opacity: 0.2489;
  transform: translate(17.4204vw, -10px) scale(0.5362);
  animation: fall-119 11s -16s linear infinite;
}
@keyframes fall-119 {
  47.186% {
    transform: translate(13.4873vw, 47.186vh) scale(0.5362);
  }
  to {
    transform: translate(15.45385vw, 100vh) scale(0.5362);
  }
}
.snow:nth-child(120) {
  opacity: 0.9943;
  transform: translate(86.4735vw, -10px) scale(0.5801);
  animation: fall-120 15s -24s linear infinite;
}
@keyframes fall-120 {
  68.277% {
    transform: translate(94.2154vw, 68.277vh) scale(0.5801);
  }
  to {
    transform: translate(90.34445vw, 100vh) scale(0.5801);
  }
}
.snow:nth-child(121) {
  opacity: 0.8126;
  transform: translate(59.2942vw, -10px) scale(0.1735);
  animation: fall-121 13s -5s linear infinite;
}
@keyframes fall-121 {
  47.898% {
    transform: translate(65.3693vw, 47.898vh) scale(0.1735);
  }
  to {
    transform: translate(62.33175vw, 100vh) scale(0.1735);
  }
}
.snow:nth-child(122) {
  opacity: 0.6714;
  transform: translate(61.1888vw, -10px) scale(0.0688);
  animation: fall-122 15s -16s linear infinite;
}
@keyframes fall-122 {
  49.486% {
    transform: translate(56.3458vw, 49.486vh) scale(0.0688);
  }
  to {
    transform: translate(58.7673vw, 100vh) scale(0.0688);
  }
}
.snow:nth-child(123) {
  opacity: 0.7091;
  transform: translate(25.9044vw, -10px) scale(0.2406);
  animation: fall-123 25s -11s linear infinite;
}
@keyframes fall-123 {
  31.09% {
    transform: translate(35.255vw, 31.09vh) scale(0.2406);
  }
  to {
    transform: translate(30.5797vw, 100vh) scale(0.2406);
  }
}
.snow:nth-child(124) {
  opacity: 0.9021;
  transform: translate(35.9773vw, -10px) scale(0.5311);
  animation: fall-124 21s -14s linear infinite;
}
@keyframes fall-124 {
  55.476% {
    transform: translate(35.8379vw, 55.476vh) scale(0.5311);
  }
  to {
    transform: translate(35.9076vw, 100vh) scale(0.5311);
  }
}
.snow:nth-child(125) {
  opacity: 0.3273;
  transform: translate(73.6481vw, -10px) scale(0.3557);
  animation: fall-125 17s -18s linear infinite;
}
@keyframes fall-125 {
  33.426% {
    transform: translate(79.8477vw, 33.426vh) scale(0.3557);
  }
  to {
    transform: translate(76.7479vw, 100vh) scale(0.3557);
  }
}
.snow:nth-child(126) {
  opacity: 0.3734;
  transform: translate(29.3983vw, -10px) scale(0.185);
  animation: fall-126 22s -6s linear infinite;
}
@keyframes fall-126 {
  53.83% {
    transform: translate(21.1608vw, 53.83vh) scale(0.185);
  }
  to {
    transform: translate(25.27955vw, 100vh) scale(0.185);
  }
}
.snow:nth-child(127) {
  opacity: 0.4544;
  transform: translate(46.2747vw, -10px) scale(0.424);
  animation: fall-127 14s -20s linear infinite;
}
@keyframes fall-127 {
  67.673% {
    transform: translate(45.3195vw, 67.673vh) scale(0.424);
  }
  to {
    transform: translate(45.7971vw, 100vh) scale(0.424);
  }
}
.snow:nth-child(128) {
  opacity: 0.4391;
  transform: translate(33.6288vw, -10px) scale(0.2898);
  animation: fall-128 24s -8s linear infinite;
}
@keyframes fall-128 {
  62.784% {
    transform: translate(39.471vw, 62.784vh) scale(0.2898);
  }
  to {
    transform: translate(36.5499vw, 100vh) scale(0.2898);
  }
}
.snow:nth-child(129) {
  opacity: 0.8498;
  transform: translate(66.9577vw, -10px) scale(0.9851);
  animation: fall-129 12s -16s linear infinite;
}
@keyframes fall-129 {
  44.808% {
    transform: translate(75.2062vw, 44.808vh) scale(0.9851);
  }
  to {
    transform: translate(71.08195vw, 100vh) scale(0.9851);
  }
}
.snow:nth-child(130) {
  opacity: 0.2337;
  transform: translate(15.2045vw, -10px) scale(0.419);
  animation: fall-130 26s -25s linear infinite;
}
@keyframes fall-130 {
  44.487% {
    transform: translate(19.9815vw, 44.487vh) scale(0.419);
  }
  to {
    transform: translate(17.593vw, 100vh) scale(0.419);
  }
}
.snow:nth-child(131) {
  opacity: 0.885;
  transform: translate(74.2776vw, -10px) scale(0.5646);
  animation: fall-131 21s -12s linear infinite;
}
@keyframes fall-131 {
  42.448% {
    transform: translate(68.1411vw, 42.448vh) scale(0.5646);
  }
  to {
    transform: translate(71.20935vw, 100vh) scale(0.5646);
  }
}
.snow:nth-child(132) {
  opacity: 0.7347;
  transform: translate(73.3038vw, -10px) scale(0.218);
  animation: fall-132 15s -5s linear infinite;
}
@keyframes fall-132 {
  35.055% {
    transform: translate(71.3829vw, 35.055vh) scale(0.218);
  }
  to {
    transform: translate(72.34335vw, 100vh) scale(0.218);
  }
}
.snow:nth-child(133) {
  opacity: 0.7168;
  transform: translate(47.3821vw, -10px) scale(0.2803);
  animation: fall-133 29s -9s linear infinite;
}
@keyframes fall-133 {
  68.842% {
    transform: translate(46.7053vw, 68.842vh) scale(0.2803);
  }
  to {
    transform: translate(47.0437vw, 100vh) scale(0.2803);
  }
}
.snow:nth-child(134) {
  opacity: 0.1345;
  transform: translate(80.3746vw, -10px) scale(0.1671);
  animation: fall-134 29s -21s linear infinite;
}
@keyframes fall-134 {
  77.36% {
    transform: translate(81.9636vw, 77.36vh) scale(0.1671);
  }
  to {
    transform: translate(81.1691vw, 100vh) scale(0.1671);
  }
}
.snow:nth-child(135) {
  opacity: 0.0101;
  transform: translate(83.437vw, -10px) scale(0.6709);
  animation: fall-135 28s -10s linear infinite;
}
@keyframes fall-135 {
  60.105% {
    transform: translate(79.4251vw, 60.105vh) scale(0.6709);
  }
  to {
    transform: translate(81.43105vw, 100vh) scale(0.6709);
  }
}
.snow:nth-child(136) {
  opacity: 0.5361;
  transform: translate(17.77vw, -10px) scale(0.664);
  animation: fall-136 29s -29s linear infinite;
}
@keyframes fall-136 {
  72.002% {
    transform: translate(10.2013vw, 72.002vh) scale(0.664);
  }
  to {
    transform: translate(13.98565vw, 100vh) scale(0.664);
  }
}
.snow:nth-child(137) {
  opacity: 0.1137;
  transform: translate(29.247vw, -10px) scale(0.0328);
  animation: fall-137 15s -3s linear infinite;
}
@keyframes fall-137 {
  78.446% {
    transform: translate(32.7519vw, 78.446vh) scale(0.0328);
  }
  to {
    transform: translate(30.99945vw, 100vh) scale(0.0328);
  }
}
.snow:nth-child(138) {
  opacity: 0.474;
  transform: translate(53.137vw, -10px) scale(0.6371);
  animation: fall-138 11s -4s linear infinite;
}
@keyframes fall-138 {
  31.776% {
    transform: translate(54.2169vw, 31.776vh) scale(0.6371);
  }
  to {
    transform: translate(53.67695vw, 100vh) scale(0.6371);
  }
}
.snow:nth-child(139) {
  opacity: 0.9422;
  transform: translate(21.9756vw, -10px) scale(0.5784);
  animation: fall-139 30s -25s linear infinite;
}
@keyframes fall-139 {
  77.494% {
    transform: translate(13.0729vw, 77.494vh) scale(0.5784);
  }
  to {
    transform: translate(17.52425vw, 100vh) scale(0.5784);
  }
}
.snow:nth-child(140) {
  opacity: 0.3839;
  transform: translate(39.7795vw, -10px) scale(0.6588);
  animation: fall-140 10s -24s linear infinite;
}
@keyframes fall-140 {
  38.893% {
    transform: translate(49.2749vw, 38.893vh) scale(0.6588);
  }
  to {
    transform: translate(44.5272vw, 100vh) scale(0.6588);
  }
}
.snow:nth-child(141) {
  opacity: 0.4892;
  transform: translate(68.435vw, -10px) scale(0.3429);
  animation: fall-141 27s -17s linear infinite;
}
@keyframes fall-141 {
  32.034% {
    transform: translate(76.862vw, 32.034vh) scale(0.3429);
  }
  to {
    transform: translate(72.6485vw, 100vh) scale(0.3429);
  }
}
.snow:nth-child(142) {
  opacity: 0.6756;
  transform: translate(4.4649vw, -10px) scale(0.1092);
  animation: fall-142 29s -15s linear infinite;
}
@keyframes fall-142 {
  63.198% {
    transform: translate(0.5074vw, 63.198vh) scale(0.1092);
  }
  to {
    transform: translate(2.48615vw, 100vh) scale(0.1092);
  }
}
.snow:nth-child(143) {
  opacity: 0.6116;
  transform: translate(41.8788vw, -10px) scale(0.6695);
  animation: fall-143 23s -18s linear infinite;
}
@keyframes fall-143 {
  53.956% {
    transform: translate(49.1092vw, 53.956vh) scale(0.6695);
  }
  to {
    transform: translate(45.494vw, 100vh) scale(0.6695);
  }
}
.snow:nth-child(144) {
  opacity: 0.2671;
  transform: translate(38.7299vw, -10px) scale(0.1971);
  animation: fall-144 14s -9s linear infinite;
}
@keyframes fall-144 {
  67.773% {
    transform: translate(34.8216vw, 67.773vh) scale(0.1971);
  }
  to {
    transform: translate(36.77575vw, 100vh) scale(0.1971);
  }
}
.snow:nth-child(145) {
  opacity: 0.0482;
  transform: translate(34.0143vw, -10px) scale(0.7675);
  animation: fall-145 20s -12s linear infinite;
}
@keyframes fall-145 {
  59.522% {
    transform: translate(42.3835vw, 59.522vh) scale(0.7675);
  }
  to {
    transform: translate(38.1989vw, 100vh) scale(0.7675);
  }
}
.snow:nth-child(146) {
  opacity: 0.2624;
  transform: translate(70.8139vw, -10px) scale(0.647);
  animation: fall-146 17s -2s linear infinite;
}
@keyframes fall-146 {
  56.924% {
    transform: translate(73.9317vw, 56.924vh) scale(0.647);
  }
  to {
    transform: translate(72.3728vw, 100vh) scale(0.647);
  }
}
.snow:nth-child(147) {
  opacity: 0.6303;
  transform: translate(67.3469vw, -10px) scale(0.1533);
  animation: fall-147 28s -19s linear infinite;
}
@keyframes fall-147 {
  35.74% {
    transform: translate(63.0053vw, 35.74vh) scale(0.1533);
  }
  to {
    transform: translate(65.1761vw, 100vh) scale(0.1533);
  }
}
.snow:nth-child(148) {
  opacity: 0.3556;
  transform: translate(19.9894vw, -10px) scale(0.1281);
  animation: fall-148 22s -27s linear infinite;
}
@keyframes fall-148 {
  67.798% {
    transform: translate(17.8449vw, 67.798vh) scale(0.1281);
  }
  to {
    transform: translate(18.91715vw, 100vh) scale(0.1281);
  }
}
.snow:nth-child(149) {
  opacity: 0.3306;
  transform: translate(49.7374vw, -10px) scale(0.4335);
  animation: fall-149 29s -25s linear infinite;
}
@keyframes fall-149 {
  53.319% {
    transform: translate(53.3907vw, 53.319vh) scale(0.4335);
  }
  to {
    transform: translate(51.56405vw, 100vh) scale(0.4335);
  }
}
.snow:nth-child(150) {
  opacity: 0.9037;
  transform: translate(6.0284vw, -10px) scale(0.8328);
  animation: fall-150 24s -25s linear infinite;
}
@keyframes fall-150 {
  64.413% {
    transform: translate(6.0059vw, 64.413vh) scale(0.8328);
  }
  to {
    transform: translate(6.01715vw, 100vh) scale(0.8328);
  }
}
.snow:nth-child(151) {
  opacity: 0.5611;
  transform: translate(82.7464vw, -10px) scale(0.0691);
  animation: fall-151 21s -8s linear infinite;
}
@keyframes fall-151 {
  73.558% {
    transform: translate(90.3092vw, 73.558vh) scale(0.0691);
  }
  to {
    transform: translate(86.5278vw, 100vh) scale(0.0691);
  }
}
.snow:nth-child(152) {
  opacity: 0.3011;
  transform: translate(1.6843vw, -10px) scale(0.6877);
  animation: fall-152 12s -26s linear infinite;
}
@keyframes fall-152 {
  61.429% {
    transform: translate(1.9391vw, 61.429vh) scale(0.6877);
  }
  to {
    transform: translate(1.8117vw, 100vh) scale(0.6877);
  }
}
.snow:nth-child(153) {
  opacity: 0.4176;
  transform: translate(29.3071vw, -10px) scale(0.6267);
  animation: fall-153 26s -29s linear infinite;
}
@keyframes fall-153 {
  45.413% {
    transform: translate(26.2747vw, 45.413vh) scale(0.6267);
  }
  to {
    transform: translate(27.7909vw, 100vh) scale(0.6267);
  }
}
.snow:nth-child(154) {
  opacity: 0.2259;
  transform: translate(52.1768vw, -10px) scale(0.7451);
  animation: fall-154 27s -2s linear infinite;
}
@keyframes fall-154 {
  73.262% {
    transform: translate(53.0912vw, 73.262vh) scale(0.7451);
  }
  to {
    transform: translate(52.634vw, 100vh) scale(0.7451);
  }
}
.snow:nth-child(155) {
  opacity: 0.1237;
  transform: translate(33.18vw, -10px) scale(0.16);
  animation: fall-155 20s -26s linear infinite;
}
@keyframes fall-155 {
  71.503% {
    transform: translate(30.647vw, 71.503vh) scale(0.16);
  }
  to {
    transform: translate(31.9135vw, 100vh) scale(0.16);
  }
}
.snow:nth-child(156) {
  opacity: 0.0099;
  transform: translate(27.8784vw, -10px) scale(0.0362);
  animation: fall-156 15s -1s linear infinite;
}
@keyframes fall-156 {
  70.217% {
    transform: translate(37.5812vw, 70.217vh) scale(0.0362);
  }
  to {
    transform: translate(32.7298vw, 100vh) scale(0.0362);
  }
}
.snow:nth-child(157) {
  opacity: 0.84;
  transform: translate(58.8322vw, -10px) scale(0.3766);
  animation: fall-157 10s -10s linear infinite;
}
@keyframes fall-157 {
  38.467% {
    transform: translate(50.8041vw, 38.467vh) scale(0.3766);
  }
  to {
    transform: translate(54.81815vw, 100vh) scale(0.3766);
  }
}
.snow:nth-child(158) {
  opacity: 0.7396;
  transform: translate(97.1865vw, -10px) scale(0.9155);
  animation: fall-158 27s -30s linear infinite;
}
@keyframes fall-158 {
  74.583% {
    transform: translate(98.6163vw, 74.583vh) scale(0.9155);
  }
  to {
    transform: translate(97.9014vw, 100vh) scale(0.9155);
  }
}
.snow:nth-child(159) {
  opacity: 0.7133;
  transform: translate(61.6443vw, -10px) scale(0.4743);
  animation: fall-159 18s -29s linear infinite;
}
@keyframes fall-159 {
  47.795% {
    transform: translate(66.3551vw, 47.795vh) scale(0.4743);
  }
  to {
    transform: translate(63.9997vw, 100vh) scale(0.4743);
  }
}
.snow:nth-child(160) {
  opacity: 0.4683;
  transform: translate(86.2571vw, -10px) scale(0.928);
  animation: fall-160 25s -20s linear infinite;
}
@keyframes fall-160 {
  53.012% {
    transform: translate(94.6437vw, 53.012vh) scale(0.928);
  }
  to {
    transform: translate(90.4504vw, 100vh) scale(0.928);
  }
}
.snow:nth-child(161) {
  opacity: 0.1022;
  transform: translate(85.809vw, -10px) scale(0.4415);
  animation: fall-161 17s -26s linear infinite;
}
@keyframes fall-161 {
  53.445% {
    transform: translate(87.7713vw, 53.445vh) scale(0.4415);
  }
  to {
    transform: translate(86.79015vw, 100vh) scale(0.4415);
  }
}
.snow:nth-child(162) {
  opacity: 0.9855;
  transform: translate(45.6787vw, -10px) scale(0.3628);
  animation: fall-162 12s -20s linear infinite;
}
@keyframes fall-162 {
  51.652% {
    transform: translate(42.0382vw, 51.652vh) scale(0.3628);
  }
  to {
    transform: translate(43.85845vw, 100vh) scale(0.3628);
  }
}
.snow:nth-child(163) {
  opacity: 0.6801;
  transform: translate(54.5262vw, -10px) scale(0.1817);
  animation: fall-163 27s -18s linear infinite;
}
@keyframes fall-163 {
  45.686% {
    transform: translate(62.3169vw, 45.686vh) scale(0.1817);
  }
  to {
    transform: translate(58.42155vw, 100vh) scale(0.1817);
  }
}
.snow:nth-child(164) {
  opacity: 0.002;
  transform: translate(80.743vw, -10px) scale(0.1169);
  animation: fall-164 28s -14s linear infinite;
}
@keyframes fall-164 {
  54.353% {
    transform: translate(71.4335vw, 54.353vh) scale(0.1169);
  }
  to {
    transform: translate(76.08825vw, 100vh) scale(0.1169);
  }
}
.snow:nth-child(165) {
  opacity: 0.2774;
  transform: translate(61.6603vw, -10px) scale(0.2998);
  animation: fall-165 10s -27s linear infinite;
}
@keyframes fall-165 {
  47.261% {
    transform: translate(62.5595vw, 47.261vh) scale(0.2998);
  }
  to {
    transform: translate(62.1099vw, 100vh) scale(0.2998);
  }
}
.snow:nth-child(166) {
  opacity: 0.8748;
  transform: translate(95.0491vw, -10px) scale(0.1551);
  animation: fall-166 28s -6s linear infinite;
}
@keyframes fall-166 {
  65.314% {
    transform: translate(102.0584vw, 65.314vh) scale(0.1551);
  }
  to {
    transform: translate(98.55375vw, 100vh) scale(0.1551);
  }
}
.snow:nth-child(167) {
  opacity: 0.0284;
  transform: translate(48.8044vw, -10px) scale(0.3539);
  animation: fall-167 29s -19s linear infinite;
}
@keyframes fall-167 {
  78.342% {
    transform: translate(54.0435vw, 78.342vh) scale(0.3539);
  }
  to {
    transform: translate(51.42395vw, 100vh) scale(0.3539);
  }
}
.snow:nth-child(168) {
  opacity: 0.8893;
  transform: translate(15.5328vw, -10px) scale(0.0132);
  animation: fall-168 14s -15s linear infinite;
}
@keyframes fall-168 {
  63.981% {
    transform: translate(11.916vw, 63.981vh) scale(0.0132);
  }
  to {
    transform: translate(13.7244vw, 100vh) scale(0.0132);
  }
}
.snow:nth-child(169) {
  opacity: 0.0517;
  transform: translate(77.205vw, -10px) scale(0.8427);
  animation: fall-169 14s -25s linear infinite;
}
@keyframes fall-169 {
  76.836% {
    transform: translate(85.0767vw, 76.836vh) scale(0.8427);
  }
  to {
    transform: translate(81.14085vw, 100vh) scale(0.8427);
  }
}
.snow:nth-child(170) {
  opacity: 0.7786;
  transform: translate(21.9696vw, -10px) scale(0.5319);
  animation: fall-170 10s -3s linear infinite;
}
@keyframes fall-170 {
  45.518% {
    transform: translate(26.3572vw, 45.518vh) scale(0.5319);
  }
  to {
    transform: translate(24.1634vw, 100vh) scale(0.5319);
  }
}
.snow:nth-child(171) {
  opacity: 0.9322;
  transform: translate(34.7484vw, -10px) scale(0.6953);
  animation: fall-171 10s -18s linear infinite;
}
@keyframes fall-171 {
  75.618% {
    transform: translate(42.6063vw, 75.618vh) scale(0.6953);
  }
  to {
    transform: translate(38.67735vw, 100vh) scale(0.6953);
  }
}
.snow:nth-child(172) {
  opacity: 0.6246;
  transform: translate(86.8898vw, -10px) scale(0.5904);
  animation: fall-172 13s -6s linear infinite;
}
@keyframes fall-172 {
  65.247% {
    transform: translate(80.8453vw, 65.247vh) scale(0.5904);
  }
  to {
    transform: translate(83.86755vw, 100vh) scale(0.5904);
  }
}
.snow:nth-child(173) {
  opacity: 0.3494;
  transform: translate(89.7673vw, -10px) scale(0.4889);
  animation: fall-173 20s -30s linear infinite;
}
@keyframes fall-173 {
  64.833% {
    transform: translate(90.5979vw, 64.833vh) scale(0.4889);
  }
  to {
    transform: translate(90.1826vw, 100vh) scale(0.4889);
  }
}
.snow:nth-child(174) {
  opacity: 0.8005;
  transform: translate(88.9858vw, -10px) scale(0.2308);
  animation: fall-174 25s -23s linear infinite;
}
@keyframes fall-174 {
  39.497% {
    transform: translate(98.6256vw, 39.497vh) scale(0.2308);
  }
  to {
    transform: translate(93.8057vw, 100vh) scale(0.2308);
  }
}
.snow:nth-child(175) {
  opacity: 0.6799;
  transform: translate(26.3586vw, -10px) scale(0.5363);
  animation: fall-175 15s -25s linear infinite;
}
@keyframes fall-175 {
  39.979% {
    transform: translate(25.8215vw, 39.979vh) scale(0.5363);
  }
  to {
    transform: translate(26.09005vw, 100vh) scale(0.5363);
  }
}
.snow:nth-child(176) {
  opacity: 0.8802;
  transform: translate(57.8977vw, -10px) scale(0.7951);
  animation: fall-176 11s -19s linear infinite;
}
@keyframes fall-176 {
  58.104% {
    transform: translate(49.2851vw, 58.104vh) scale(0.7951);
  }
  to {
    transform: translate(53.5914vw, 100vh) scale(0.7951);
  }
}
.snow:nth-child(177) {
  opacity: 0.9288;
  transform: translate(56.783vw, -10px) scale(0.7229);
  animation: fall-177 17s -2s linear infinite;
}
@keyframes fall-177 {
  61.382% {
    transform: translate(59.5833vw, 61.382vh) scale(0.7229);
  }
  to {
    transform: translate(58.18315vw, 100vh) scale(0.7229);
  }
}
.snow:nth-child(178) {
  opacity: 0.7307;
  transform: translate(62.1686vw, -10px) scale(0.9547);
  animation: fall-178 16s -1s linear infinite;
}
@keyframes fall-178 {
  32.621% {
    transform: translate(64.9753vw, 32.621vh) scale(0.9547);
  }
  to {
    transform: translate(63.57195vw, 100vh) scale(0.9547);
  }
}
.snow:nth-child(179) {
  opacity: 0.1022;
  transform: translate(56.9322vw, -10px) scale(0.6162);
  animation: fall-179 29s -6s linear infinite;
}
@keyframes fall-179 {
  34.148% {
    transform: translate(52.3374vw, 34.148vh) scale(0.6162);
  }
  to {
    transform: translate(54.6348vw, 100vh) scale(0.6162);
  }
}
.snow:nth-child(180) {
  opacity: 0.7193;
  transform: translate(21.036vw, -10px) scale(0.8183);
  animation: fall-180 20s -9s linear infinite;
}
@keyframes fall-180 {
  65.104% {
    transform: translate(30.0502vw, 65.104vh) scale(0.8183);
  }
  to {
    transform: translate(25.5431vw, 100vh) scale(0.8183);
  }
}
.snow:nth-child(181) {
  opacity: 0.4759;
  transform: translate(64.9496vw, -10px) scale(0.5029);
  animation: fall-181 14s -26s linear infinite;
}
@keyframes fall-181 {
  38.294% {
    transform: translate(64.4831vw, 38.294vh) scale(0.5029);
  }
  to {
    transform: translate(64.71635vw, 100vh) scale(0.5029);
  }
}
.snow:nth-child(182) {
  opacity: 0.0777;
  transform: translate(77.3645vw, -10px) scale(0.9588);
  animation: fall-182 30s -10s linear infinite;
}
@keyframes fall-182 {
  58.74% {
    transform: translate(68.8806vw, 58.74vh) scale(0.9588);
  }
  to {
    transform: translate(73.12255vw, 100vh) scale(0.9588);
  }
}
.snow:nth-child(183) {
  opacity: 0.1465;
  transform: translate(39.6486vw, -10px) scale(0.8621);
  animation: fall-183 20s -24s linear infinite;
}
@keyframes fall-183 {
  43.045% {
    transform: translate(31.2666vw, 43.045vh) scale(0.8621);
  }
  to {
    transform: translate(35.4576vw, 100vh) scale(0.8621);
  }
}
.snow:nth-child(184) {
  opacity: 0.067;
  transform: translate(97.506vw, -10px) scale(0.3629);
  animation: fall-184 29s -14s linear infinite;
}
@keyframes fall-184 {
  36.807% {
    transform: translate(91.2367vw, 36.807vh) scale(0.3629);
  }
  to {
    transform: translate(94.37135vw, 100vh) scale(0.3629);
  }
}
.snow:nth-child(185) {
  opacity: 0.8839;
  transform: translate(40.0479vw, -10px) scale(0.9762);
  animation: fall-185 29s -18s linear infinite;
}
@keyframes fall-185 {
  41.571% {
    transform: translate(45.3696vw, 41.571vh) scale(0.9762);
  }
  to {
    transform: translate(42.70875vw, 100vh) scale(0.9762);
  }
}
.snow:nth-child(186) {
  opacity: 0.6804;
  transform: translate(93.5674vw, -10px) scale(0.4628);
  animation: fall-186 11s -26s linear infinite;
}
@keyframes fall-186 {
  58.205% {
    transform: translate(86.0891vw, 58.205vh) scale(0.4628);
  }
  to {
    transform: translate(89.82825vw, 100vh) scale(0.4628);
  }
}
.snow:nth-child(187) {
  opacity: 0.4475;
  transform: translate(8.4401vw, -10px) scale(0.2098);
  animation: fall-187 26s -13s linear infinite;
}
@keyframes fall-187 {
  64.814% {
    transform: translate(-0.9917vw, 64.814vh) scale(0.2098);
  }
  to {
    transform: translate(3.7242vw, 100vh) scale(0.2098);
  }
}
.snow:nth-child(188) {
  opacity: 0.5913;
  transform: translate(82.6064vw, -10px) scale(0.0404);
  animation: fall-188 14s -6s linear infinite;
}
@keyframes fall-188 {
  60.175% {
    transform: translate(83.8708vw, 60.175vh) scale(0.0404);
  }
  to {
    transform: translate(83.2386vw, 100vh) scale(0.0404);
  }
}
.snow:nth-child(189) {
  opacity: 0.7871;
  transform: translate(62.8224vw, -10px) scale(0.3709);
  animation: fall-189 20s -2s linear infinite;
}
@keyframes fall-189 {
  64.414% {
    transform: translate(68.8504vw, 64.414vh) scale(0.3709);
  }
  to {
    transform: translate(65.8364vw, 100vh) scale(0.3709);
  }
}
.snow:nth-child(190) {
  opacity: 0.6199;
  transform: translate(83.0621vw, -10px) scale(0.8311);
  animation: fall-190 15s -1s linear infinite;
}
@keyframes fall-190 {
  30.108% {
    transform: translate(86.9492vw, 30.108vh) scale(0.8311);
  }
  to {
    transform: translate(85.00565vw, 100vh) scale(0.8311);
  }
}
.snow:nth-child(191) {
  opacity: 0.1823;
  transform: translate(83.6362vw, -10px) scale(0.2352);
  animation: fall-191 19s -14s linear infinite;
}
@keyframes fall-191 {
  64.343% {
    transform: translate(93.3087vw, 64.343vh) scale(0.2352);
  }
  to {
    transform: translate(88.47245vw, 100vh) scale(0.2352);
  }
}
.snow:nth-child(192) {
  opacity: 0.7098;
  transform: translate(70.3172vw, -10px) scale(0.1356);
  animation: fall-192 13s -2s linear infinite;
}
@keyframes fall-192 {
  57.167% {
    transform: translate(74.7115vw, 57.167vh) scale(0.1356);
  }
  to {
    transform: translate(72.51435vw, 100vh) scale(0.1356);
  }
}
.snow:nth-child(193) {
  opacity: 0.4946;
  transform: translate(96.6343vw, -10px) scale(0.7568);
  animation: fall-193 27s -2s linear infinite;
}
@keyframes fall-193 {
  63.519% {
    transform: translate(95.9835vw, 63.519vh) scale(0.7568);
  }
  to {
    transform: translate(96.3089vw, 100vh) scale(0.7568);
  }
}
.snow:nth-child(194) {
  opacity: 0.367;
  transform: translate(1.3808vw, -10px) scale(0.1588);
  animation: fall-194 29s -13s linear infinite;
}
@keyframes fall-194 {
  31.081% {
    transform: translate(10.3875vw, 31.081vh) scale(0.1588);
  }
  to {
    transform: translate(5.88415vw, 100vh) scale(0.1588);
  }
}
.snow:nth-child(195) {
  opacity: 0.1724;
  transform: translate(33.9325vw, -10px) scale(0.7004);
  animation: fall-195 28s -5s linear infinite;
}
@keyframes fall-195 {
  60.941% {
    transform: translate(42.418vw, 60.941vh) scale(0.7004);
  }
  to {
    transform: translate(38.17525vw, 100vh) scale(0.7004);
  }
}
.snow:nth-child(196) {
  opacity: 0.9735;
  transform: translate(93.2266vw, -10px) scale(0.2458);
  animation: fall-196 24s -17s linear infinite;
}
@keyframes fall-196 {
  61.717% {
    transform: translate(86.7648vw, 61.717vh) scale(0.2458);
  }
  to {
    transform: translate(89.9957vw, 100vh) scale(0.2458);
  }
}
.snow:nth-child(197) {
  opacity: 0.2894;
  transform: translate(68.5328vw, -10px) scale(0.6472);
  animation: fall-197 22s -16s linear infinite;
}
@keyframes fall-197 {
  57.501% {
    transform: translate(77.725vw, 57.501vh) scale(0.6472);
  }
  to {
    transform: translate(73.1289vw, 100vh) scale(0.6472);
  }
}
.snow:nth-child(198) {
  opacity: 0.0714;
  transform: translate(6.7246vw, -10px) scale(0.4376);
  animation: fall-198 30s -8s linear infinite;
}
@keyframes fall-198 {
  42.915% {
    transform: translate(7.5788vw, 42.915vh) scale(0.4376);
  }
  to {
    transform: translate(7.1517vw, 100vh) scale(0.4376);
  }
}
.snow:nth-child(199) {
  opacity: 0.2376;
  transform: translate(69.5445vw, -10px) scale(0.2642);
  animation: fall-199 22s -30s linear infinite;
}
@keyframes fall-199 {
  79.051% {
    transform: translate(69.2549vw, 79.051vh) scale(0.2642);
  }
  to {
    transform: translate(69.3997vw, 100vh) scale(0.2642);
  }
}
.snow:nth-child(200) {
  opacity: 0.4397;
  transform: translate(96.9502vw, -10px) scale(0.3305);
  animation: fall-200 24s -22s linear infinite;
}
@keyframes fall-200 {
  53.565% {
    transform: translate(93.717vw, 53.565vh) scale(0.3305);
  }
  to {
    transform: translate(95.3336vw, 100vh) scale(0.3305);
  }
}


































/* bunny */

#issMap {
    height: 360px;
    z-index: 1;
}

.bunny-page {
	background-color: #FFFBD1;
}

.bunny-above-map {
	/* margin-top: 20px; */
	margin-bottom: 10px;
	/* color: #c02025; */
}



.bunny-above-map h2 {
	font-size: 52px;
	text-align: center;
	font-family: ganache, sans-serif;
	font-weight: 400;
	font-style: normal;
	color: #F09194;
	letter-spacing: 0px;
	margin-bottom: 0px;
	height: 90px;
}

.bunny-above-map p {
	text-align: center;
	color: #f09194;
	margin-bottom: -10px;
}

.bunny-donate-container {
	/* background-color: blue; */
	height: 200px;
	width: 100%;
	padding: 10px 0px;
	display: flex;
	justify-content: center;
}

.bunny-donate {
	border-radius: 15px;
	display: flex;
	height: 60px;
	/* padding: 10px 20px; */
	/* margin-top: 20px; */
	justify-content: space-around;
	align-items: center;
	width: 80px;
	color: white;
	width: 220px;
	text-align: center;
	font-size: 20px;
	background-color: #ff4950;
}

.bunny-cane {
	width: 50px;
	height: 50px;
	transform: rotate(40deg);
}

.bunny-cane--flip {
	transform: rotate(320deg);
}

.bunny-text {
	color: cornflowerblue;
}

.bunny-banner {
	max-width: 100%;
	display: flex;
	height: 100px;
	background-size: 100px;
	background-position: center; 
	background-image: url("/images/santa-drive/carrots.png");
	background-repeat: repeat-x;
	/* background-color: brown; */
}

.bunny-banner-image {
	width: 50%;
	height: 100%;
	max-width: 200px;
	max-height: 100px;
}


.bunny-banner--home {	
	height: 140px;
	background-position: top; 
	justify-content: center;
	align-items: center;
	text-align: center;



}

.bunny-banner--home h2 {
	margin-top: 40px;	
	color: #3b2424;
	margin-bottom: -10px;	
	font-size: 32px;
	color: #c02025;
	font-family: 'Mountains of Christmas', cursive;
}

.bunny-banner--home p {	
	color: #3b2424;
	margin-bottom: -10px;
}

a.bunny-donate {}


.bunny-pop-up-modal {
	z-index: 10;
	/* height: 200px; */
	width: 95%;
	max-width: 500px;
	background-color: white;
	position: absolute;
	top: 80px;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	text-align: center;
	border-radius: 10px;
	padding: 20px;
	box-shadow: var(--shadow);
}

.bunny-pop-up-modal h2 {
	margin-top: 30px;
}

.bunny-pop-up-modal__input {
	width: 50%;
	min-width: 230px;
    padding-left: 10px;
    border-radius: 5px;
	background-color: var(--input-grey);
}

input[type=email] {
    padding-top: 12px;
    padding-bottom: 12px;
    margin-top: 8px;
    margin-bottom: 8px;
    box-sizing: border-box;
    border: none;
}

.bunny-pop-up-modal__button {
	border-radius: 5px;
    height: 50px;
    width: 80px;
    color: white;
    width: 150px;
    text-align: center;
    font-size: 20px;
	background-color: var(--brunswick-red);
	border: none;
	margin-top: 10px;
	margin-bottom: 10px;
}

.bunny-pop-up-modal__cancel {
	background-color: white;
	width: 30px;
	height: 30px;
	padding-bottom: 5px;
	padding-left: 1px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	float: right;
	box-shadow: var(--shadow);
	position: relative;
	top: -10px;
	right: -10px;
}

.bunny-overlay {
	background-color: rgba(0, 0, 0, 0.432);
	height: 100%;
	width: 100%;
	position: absolute;
	z-index: 8;
}

.bunny-pop-up-modal p {
 line-height: 150%;
 max-width: 300px;
 margin: 10px auto;
}













































/* home page top banner */
.home-page-top-banner {
	height: 110px;
	text-align: center;
	/* padding: 20px; */
	color: rgb(0, 0, 0);
	border: 3px solid var(--brunswick-red);
}

.home-page-top-banner h2 {
	margin-bottom: 0px;
	font-size: 30px;
	font-family: 'Mountains of Christmas', cursive;
	font-weight: 700;
}

.home-page-top-banner a{
	/* color: white; */
}

.pattern {
  width: 100%;
  height: 100px;
  padding: 15px;
  flex: 0 0 auto;
}

.polka {
    background: radial-gradient(#ff9292 2px, transparent 3px),
        radial-gradient(#ff9797 2px, transparent 3px),
        rgb(255 255 255);
    background-position: 0 0, 20px 20px;
    background-size: 40px 40px;
}









/*  home page banner */
.home-titles--banner {
	font-size: 26px;
	text-align: center;
	margin-bottom: 30px;
	font-weight: 700;
}

.home-page-banner-behind--banner {
	background-color: var(--brunswick-red);
	height: 100%;
	width: 100%;
	left: 0;
	position: absolute;
}

.home-page-banner-behind-2--banner {
	background: rgba(159,6,7,1);
    height: 100%;
    width: 50%;
    right: 0;
    position: absolute;
    z-index: -10;
}

.text-5-lines--banner {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 5; /* number of lines to show */
	-webkit-box-orient: vertical;
 }
 

 
 .home-hero__iamge--banner {
 
 }
 
 .home-hero__image--banner {
	width: 552px;
	position: relative;
	left: 0px;
	z-index: 1;
	/* bottom: -30px; */
	}
 
 .home-hero__lion--banner {
	 /*	background-color: antiquewhite;*/
	 width: 450px;
	 display: none;
 }
 
 .home-hero--banner {
	 display: flex;
	 justify-content: space-between;
	 height: 100%;
	 padding-left: 15px;
	 padding-right: 0px;
	 padding-top: 100px;
	 overflow: hidden;
 }

 .home-hero__image__background--banner {
	height: 800px;
    /* width: 800px; */
    position: relative;
    top: -650px;
    left: -130px;
	z-index: 0;
	
	background: rgb(159,6,7);
	background: linear-gradient(270deg, rgba(159,6,7,1) 0%, rgba(229,24,25,1) 100%);
}
 
 
 
 .page-container--banner {
	 /* height: 1000px; */
	 max-width: 1200px;
	 margin: auto;
 }
 
 .home-hero__text--banner {
	color: white;
	width: 450px;
	position: relative;
	z-index: 6;
	top: 30px;
	padding-right: 15px;
	/* margin: auto; */
	}

 .home-hero__sub--banner {
	line-height: 150%;
	color: white;
	font-size: 17px;
 }
 
 .home-hero__title--banner {
	 font-size: 30px;
	 font-weight: 700;
	 margin-bottom: 10px;
	 line-height: 120%;
	 color: white;
 }
 
 .home-hero__banner--banner {
	 display: flex;
 
	 /*	background-color: chocolate;*/
	 min-height: 240px;
	 max-height: 300px;
	 width: 100%;
	 position: absolute;
	 top: 320px;
	 z-index: 5;
	 
 }

 .home-hero__banner__inner--banner {
	background-color: darkorchid;
    /* width: 1400px; */
    display: flex;
    justify-content: flex-end;
    /* margin-left: 100px; */
	box-shadow: var(--shadow);
 }







/* home page */


.home-titles {
	font-size: 26px;
	text-align: center;
	margin-bottom: 40px;
	font-weight: 700;
}

.home-page-banner-behind {
	background-color: var(--brunswick-red);
	height: 400px;
	width: 50%;
	left: 0;
	position: absolute;
}

.home-page-banner-behind-2 {
	background-color: #B21516;
	height: 400px;
	width: 50%;
	right: 0;
	position: absolute;
}

.text-5-lines {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 5; /* number of lines to show */
	-webkit-box-orient: vertical;
 }
 

 
 .home-hero__iamge {
 
 }
 
 .home-hero__image {
	 height: 260px;
	 width: 380px;
	 position: relative;
	 left: 120px;
	 z-index: 1;
 }
 
 .home-hero__lion {
	 /*	background-color: antiquewhite;*/
	 width: 450px;
 }
 
 .home-hero {
	 display: flex;
	 justify-content: space-between;
	 height: 400px;
	 background-color: #D42A2A;
	 padding-left: 100px;
	 padding-right: 100px;
	 padding-top: 60px;
	 overflow: hidden;
 }
 
 
 
 .page-container {
	 /* height: 1000px; */
	 max-width: 1200px;
	 margin: auto;
 }
 
 .home-hero__text {
	 color: white;
	 width: 450px;
	 z-index: 6;
 }

 .home-hero__sub {
	line-height: 140%;
	color: white;
	font-size: 17px;
 }
 
 .home-hero__title {
	 font-size: 30px;
	 font-weight: 700;
	 margin-bottom: 10px;
	 line-height: 120%;
	 color: white;
 }
 
 .home-hero__banner {
	 display: flex;
 
	 /*	background-color: chocolate;*/
	 min-height: 240px;
	 max-height: 300px;
	 width: 100%;
	 position: absolute;
	 top: 320px;
	 z-index: 5;
	 
 }

 .home-hero__banner__inner {
	background-color: darkorchid;
    /* width: 1400px; */
    display: flex;
    justify-content: flex-end;
    /* margin-left: 100px; */
	box-shadow: var(--shadow);
 }
 
 
 
 
 
 .home-hero__container {
	 position: relative;
	 margin-bottom: 240px;
 }
 
 /* .home-hero__item__button {
	 display: flex;
	 justify-content: center;
	 align-items: center;
	 min-height: 40px;
	 width: 100px;
	 background-color: firebrick;
	 color: white;
 } */

 .home-hero__item__button {
	background-color: var(--brunswick-red);
	border: none;
	border-radius: 5px;
	color: white;
	max-width: 150px;
	padding: 10px 10px;
	font-size: 18px;
	cursor: pointer;
	text-align: center;
}
 
 .home-hero__item {
	 display: flex;
	 /*	justify-content: space-between;*/
	 width: 50%;
	 background-color: white;
	 padding: 25px;
	 position: relative;
 }

 .home-hero__item a {
	 position: absolute;
	 bottom: 20px;
 }
 
 .home-hero__item:nth-child(1) {
	 /* margin-left: 100px; */
	 padding-right: 10px;
 }
 
 .home-hero__item:nth-child(2) {	
	 padding-left: 10px;
 }
 
 .home-hero__item__image {
	 height: 100%;
	 background-color: cadetblue;
	 object-fit: fill;
	 width: 100%;
 }
 
 .home-hero__item__title {
	 color: var(--brunswick-red);
	 font-size: 20px;
	 margin-bottom: 15px;
 }
 
 .home-hero__item__right {
	 /*	max-height: 180px;*/
	 width: 100%;
	 background-color: antiquewhite;
 }
 
 
 .home-hero__item__body {
	 margin-bottom: 20px;	
 
 }
 
 .home-hero__item__image__container {
	 height: 100%;
	 width: 180px;
	 background-color: darkgreen;
 }
 
 .home-hero__image__background {
	 height: 800px;
	 width: 1000px;
	 position: relative;
	 top: -560px;
	 left: -0px;
	 z-index: 0;
 }
 

 .home-services-container {
	max-width: 1200px;
	margin: 30px auto;
	width: 100%; 
	display: grid;
	/* Define Auto Row size */
	grid-auto-rows: auto; 
	/*Define our columns */
	grid-template-columns: repeat(2, minmax(300px, 1fr)); 
	grid-gap: 1.5em;
	padding: 0px 20px 0px 20px;
  }
 
 

 
 
 
 
 
 
 
 .home-hero__item__left {
	 display: flex;
	 flex-direction: column;
	 padding-right: 10px;
 }
 
 
 
 
 

 
 .home-services__item {
	 display: flex;
	 flex-direction: column;
   padding: 30px;
   color: #fff;
   background-color: white;
	 text-align: center;
	 color: black;
	 box-shadow: var(--shadow);
	 border-radius: 5px;
	 	 /* margin-left: 20px;
	 margin-right: 20px; */
 }
 

 
 .homw-services__item__title {
	 margin-bottom: 10px;
 }
 
 .homw-services__item__button {
	 height: 40px;
	 width: 100px;
	 background-color: indianred;
	 display: flex;
	 justify-content: center;
	 align-items: center;
	 margin: auto;
 }
 
 .homw-services__item__body {
	 flex-grow: 1
 }
 
 .homw-services-container {
	 display: flex;
	 flex-wrap: wrap;
	 margin-top: 250px;
 }
 
 .home-services__item__title {
	 margin-bottom: 10px;
	 font-size: 20px;
	 font-weight: 700;
 }
 
 .home-services__item__button {
	background-color: var(--brunswick-red);
	border: none;
	border-radius: 5px;
	color: white;
	max-width: 150px;
	padding: 10px 10px;
	font-size: 18px;
	cursor: pointer;
	text-align: center;
	margin: auto;
 }
 
 .home-services__item__body {
	 max-width: 400px;
	 flex-grow: 1;
	 margin: auto;
	 margin-bottom: 20px;
 }


 /* home - services new */
 .home-grid {
	max-width: 1000px;
	/* background-color:hsla(1, 0%, 50%, .2); */
	line-height: 1.5;
	padding: 0px 10px;
	margin: 1em auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
	/*grid-auto-columns: 4fr;*/
	grid-gap: 2em;
  }
  /* The above is just for codepen, to give a better idea of how it would look in a site*/
  
  
  .home-grid-item {
  border-radius: 5px;
  overflow: hidden;
  transition: 0.3s;
  box-shadow: 0px 6px 8px 2px rgb(0 0 0 / 11%);
  padding: 10px;
  background-color: white;
  }
  
  /*article:first-child {
	grid-column: 1/3;
	grid-row: 1/3;
	font-size: 1.2em;
  }
  */
  figcaption {
	font-size: 0.7em;
	  background-color: white;
  }
  
  section img {
	  height: 220px;
	  width: 100%;
	  object-fit: cover;
	  /*	mix-blend-mode: multiply;*/
	  border-radius: 5px;
	 }
  
  .item__text {
	  background-color: white;
	  text-align: center;
	  padding-top: 20px;
	    
	  
	display: -webkit-box;
	-webkit-box-orient: vertical;
  
	overflow: hidden;
	-webkit-line-clamp: 4;
	max-height: 135px; 
	/* background-color: rgb(45, 109, 182); */
  }
  
  .item__text__body {
	  margin-bottom: 20px;
	  font-size: 16px;
	  line-height: 1.5;
  }
  
  .item__text-container {
	  background-color: white;
	  height: 160px;
	  padding: 0px 15px;
  }
  
  
  figure {
	  background-color: white;
	  height: 220px;
	  width: 100%;
	  position: relative;
	 }
  
  
  .item__text__title {
	  font-weight: 600;
	  margin-bottom: 10px;
  }
  
  .bottom-red {
	  width: 100%;
	  height: 6px;
	  background-color: var(--brunswick-red);
	  position: relative;
	  border-radius: 10px;
	 }
  
  .home-grid-item__button {
	  height: 40px;
	  width: 100px;
	  background-color: white;
	  color: black;
	  border-radius: 5px;
	  position: relative;
	  
		  box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.45);
	  
	  left:50%;
	  margin-left:-50px;
	  top: -50%;
	  margin-top:-15px;
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  opacity: 0%;
	  transition: 0.3s;
  }
  
  
  .home-grid-item img {
	  transition: 0.3s;
  }
  
  .home-grid-item:hover .tint:before {
	background: rgba(0, 0, 0, 0.5); 
  } 
  
  .home-grid-item:hover .home-grid-item__button {
	  display: flex;
	  opacity: 100%;
	  transform: translateY(-5px);
  }
  
  
  
  
  
  .tint {
	position: relative;
	cursor: pointer;
	/* padding: 10px; */
	}
  
  .tint:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(255, 0, 0, 0.10);
	border-radius: 5px;
	transition: all 0.3s linear;
	}
  
  
  
  
  
  @media all and (max-width : 610px) {
	  
	  
  .home-grid-item {
	font-size: 16px;
	background-color: white;
	display: grid;
	max-width: 340px;
	margin: auto;
	padding: 10px;
	}
  
  }






  .test-hover {
	background-color: green;
	/* transition: 0.6s; */
  }

  .test-hover:hover {
	  background-color: hotpink;
  }


























.pop-up-booking {
	background-color: rgb(255, 154, 154);
	height: 50px;
	width: 100%;
	display: flex;	
	align-items: center;
	padding: 10px;
	border-radius: 10px;
}

.pop-up-booking-green {
	background-color: rgb(186, 255, 154);
	height: 50px;
	width: 100%;
	display: flex;	
	align-items: center;
	padding: 10px;
	border-radius: 10px;
}

.removeDisplay {
	display: none;
}



.booking-section__box {
	background-color: var(--pannel);
	padding: 15px;	
	margin-top: 10px;
	padding-top: 0px;
}

.booking-section {
	/*	margin-bottom: 40px;	*/
	width: 100%;

}

.header-text-container {
	position: relative;
	max-width: 1200px;
	margin: auto;
	/* background-color: aqua; */
}

.header-text {
	font-size: 32px;
	font-weight: 700;
	/* color: #ffffff; */
	display: flex;
flex-direction: column;
	justify-content: center;
	align-items: center;
	align-content: center;
	height: 100%;
	filter: saturate();
	text-align: center;
	/* opacity: .5; */
	filter: invert(1);
}

.header-text-behind {
	position: absolute;
	left: 5px;
	top: -145px;
	font-size: 90px;
	font-weight: 700;
	color: white;
	opacity: 0.05;
	z-index: 0;
}

.text24 {
	font-size: 24px;	
}

.weight-sb {
	font-weight: 600;	
}



.booking-section__input-cont {
	display: flex;
	align-items: center;
	position: relative;
}

.booking-section__input {
	width: 100%;
	padding-left: 80px;
	border-radius: 5px;
	background-color: var(--input-grey);
}

input[type=text] {
	padding-top: 12px;
	padding-bottom: 12px;
	margin-top: 8px;
	margin-bottom: 8px;
	box-sizing: border-box;
	border: none;
}

input[type=number] {
	padding-top: 12px;
	padding-bottom: 12px;
	margin-top: 8px;
	margin-bottom: 8px;
	box-sizing: border-box;
	border: none;
	max-width: 250px;
	/* height: 60px; */
}

.booking-section__name {
	position: absolute;
	left: 10px;
}

.booking-section__box--white {
	background-color: var(--background);
}

.margin-left-15-mobile {
	margin-left: 0px;
}

.button {
	background-color: var(--brunswick-red);
	border: none;
	border-radius: 5px;
	color: white;
	padding: 12px 10px;
	font-size: 18px;
	cursor: pointer;
	height: 50px;
}

.button--centre {
	display: flex;
	justify-content: center;
	margin: auto;	
}

.button--offline {
	background-color: gray;
}

.button:hover {
	background-color: #d83f3f;
}

.button--small {
	width: 200px;
	text-align: center;
	margin: auto;
}

.button--white {
	background-color: white;
	color: black;
	box-shadow: var(--shadow);
}

.button--white:hover {
	background-color: gainsboro;
}

.booking-section__pay-text {
	/* width: 280px; */
	/* margin: auto; */
	text-align: center;
	padding-top: 20px;
	font-size: 20px;
}

.booking-section__box--pay {
	display: flex;
	justify-content: center;
	align-items: center;
}

.booking-section__timer-text {
	font-size: 12px;
	line-height: 14px;

	max-width: 390px;
	margin: 10px auto   0px auto;
}





/* Radio Selector */
.radioContainer{
	position: relative;
	cursor: pointer;
	font-family: sans-serif;
	font-size: 18px;
	user-select: none;    
	justify-content: space-between;
	display: flex;
	align-items: center;
	width: 270px;
	height: 25px;
	margin-bottom: 5px;
}
.radioContainer input {
	display:none;

}
.radioContainer .circle{
	display: inline-block;
	width: 20px;
	height: 20px;
	background-color: white;
	border: 1px solid grey;
	position: relative;
	border-radius: 50%;
	
	/* margin-left: 25px; */
}

.radioContainer:hover .circle{
	background-color: #ccc;
}
.radioContainer input:checked + .circle{
	background-color: var(--brunswick-red);
}
.radioContainer input:checked + .circle:after{
	content: "";
	width: 5px;
	height: 5px;
	background-color: white;
	position: absolute;
	border-radius: 50%;
	left:50%;
	top:50%; 
	transform: translate(-50%,-50%);
}

/* Checkbox */
/* The container */
.checkboxContainer {
	display: block;
	position: relative;
	width: 265px;
	margin-bottom: 5px;
	cursor: pointer;
	font-size: 18px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/* Hide the browser's default checkbox */
.checkboxContainer input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}

/* Create a custom checkbox */
.checkmark {	
	position: absolute;
	top: 0;
	right: 0;
	height: 25px;
	width: 25px;
	background-color: white;
	border: 1px solid grey;
}

/* On mouse-over, add a grey background color */
.checkboxContainer:hover input ~ .checkmark {
	background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.checkboxContainer input:checked ~ .checkmark {
	background-color: var(--brunswick-red);
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
	content: "";
	position: absolute;
	display: none;
}

/* Show the checkmark when checked */
.checkboxContainer input:checked ~ .checkmark:after {
	display: block;
}

/* Style the checkmark/indicator */
.checkboxContainer .checkmark:after {
	left: 8px;
	top: 3px;
	width: 5px;
	height: 10px;
	border: solid white;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}


.text-to-swap:after {
	content: "Select Date";
}

.text-to-hide {
	opacity: 1;
}


.text20 {
	font-size: 20px;	
}

.options-title {
	margin-bottom: 10px;
	margin-top: 20px;

}

.options-title-small {
	font-size: 14px;
}

.padding-top-20 {
	padding-top: 20px;
}

.margin-top-20 {
	margin-top: 20px;
}

.weight-bold {
	font-weight: 700;
}

.margin-bottom-10 {
	margin-bottom: 10px;
}


.booking-box-title {
	margin-bottom: 10px;
	margin-top: 20px;
}

.booking-section__box--payment {
	border-radius: 10px;
	padding: 0px 15px 20px 15px;
}

.booking-section__box--details {
	padding-top: 14px;
	border-radius: 10px;
	padding: 0px 0px 0px 0px;
}

.booking-section__box--date {
	border-radius: 10px 0px 0px 10px;
	padding: 0px 0px 0px 0px;
}

.booking-section__box--time {
	border-radius: 0px 10px 10px 0px;
	padding: 5px 0px 0px 0px;
}

.booking-section__box--package {
	border-radius: 10px;
}





/* fmaily support  */ 
.family-section {margin: 0px auto 0px auto;background: linear-gradient(0deg, #ffeed9 0%, rgb(244 177 90) 100%);padding: 20px;border-radius: 5px;}

.family-section__title {
margin-bottom: 20px;
text-align: center;
font-size: 22px;
color: rgb(27, 0, 0);

}

.family-section__image--left {
 width: 100%;
 max-width: 250px;
 display: block;
 margin: auto;
 margin-bottom: 20px;
 border-radius: 6px;
}

.family-support-programs-title {
margin-bottom: 20px;
margin-top: 40px;
text-align: center;

}

.family-section__times__title {
	font-weight: 700;
}

.family-section__times {
	margin-top: 10px;
	margin-bottom: 20px;
	text-align: center;
}

.family-section__times p {
	line-height: 150%;	
}


.family-section__left-right {

}

.family-section__image--left {

}

.family-section-text {
	
}

.family-section-text--right {

}





/* Youth Work */
.youth-section {	
	width: 100%;
	margin-bottom: 40px;
	box-shadow: var(--shadow);
}

.youth-section__header {
	background-color: var(--brunswick-red);
	height: 150px;
	width: 100%;
	padding: 15px;
	color: white;
}

.youth-section__title {
	font-size: 26px;
	font-weight: 600;
	margin-bottom: 15px;
}

.youth-section__ages {
	font-size: 22px;
	margin-bottom: 5px;
}

.youth-section__times {
	font-size: 20px;
}

.youth-section__main {
	font-size: 18px;
	color: black;
	text-align: left;
	padding: 15px;
}

.youth-section__activities__title {
	color: var(--brunswick-red);
	font-weight: 700;
	font-size: 20px;
	margin-bottom: 10px;
}

.youth-section__activities {
	margin-top: 20px;
}

.youth-section-testimonials {
	background-color: #E9E4E4;
	color: black;
	padding: 60px 15px 60px 15px;
	width: 100%;
}

.youth-section-testimonials__body {
	margin-bottom: 15px;
}

.youth-section-testimonials__name {
	font-weight: 700;
	font-size: 20px;
	margin-bottom: 5px;

}

.youth-section-testimonials__title {
	font-weight: 700;
	font-size: 24px;
	margin-bottom: 20px;
}

.red {
	color: var(--brunswick-red);
}

.youth-section-testimonials__section:nth-child(2) {
	margin-top: 40px;
}

.margin-right-20 {
	margin-right: 20px;
}

.youth-section-container {
	display:  block;
}


.youth-section-testimonials__container {
	display: block;
	justify-content: space-between;
}

.youth-section-testimonial__container {
	width: 100%;
}



.youth-section-membership {
	color: white;
	padding: 50px 15px 50px 15px;
	width: 100%;
	background: linear-gradient(180deg, var(--brunswick-red) 0%, var(--page-background) 100%);
}

.margin-bottom-25 {
	margin-bottom: 25px;
}






/* image grid  All hidden on mobile */
.youth-section-image {
	background-color: var(--brunswick-red);
	color: white;
	height: 200px;
	border: 2px solid var(--brunswick-red);
}

.youth-section-image-conatiner {
	max-width: 1200px;
	margin: 0px auto 60px auto;
	display: none;
	grid-gap: 1rem;
}



/* Brunswick Quiz */

body, html {
    background: var(--page-background);
    min-height: 100%;
    margin: 0;
	padding: 0;
}

.quiz-banner--home {	
	height: 300px;
	/* background-position: top; 
	justify-content: center;
	align-items: center;
	text-align: center; */
	background: rgb(9,9,121);
background: radial-gradient(circle, rgba(9,9,121,1) 0%, rgba(2,0,33,1) 59%, rgba(1,0,11,1) 100%);
}

.quiz-banner {
		/* max-width: 100%;
		display: flex; */
		/* height: 60px; */
		/* background-size: 120px; */
		/* background-position: center; */
		/* background-image: url("/images/santa-drive/banner1.png"); */
		/* background-repeat: repeat-x; */
		/* background-color: brown; */
	}

	.quiz-banner--home h2 {
		/* margin-top: 40px;	 */
		color: #3b2424;
		margin-bottom: -10px;	
		font-size: 32px;
		color: #c02025;
		font-family: 'Mountains of Christmas', cursive;
	}
	
	.quiz-banner--home p {
		color: #ffffff;
		margin-bottom: -10px;
	}

	.quiz-banner-container {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}

 .quiz-banner-container p a {
	 color: white;
	 /* margin-top: 100px; */
	 /* padding: 100px; */
	 position: relative;
	 top: 55px;
	}

.quiz-overlay {
	background-color: rgba(0, 0, 0, 0.904);
	height: 100%;
	width: 100%;
	position: absolute;
	z-index: 8;
	position: fixed;
}

.quiz-pop-up-modal__input {
	width: 50%;
	min-width: 230px;
    padding-left: 10px;
    border-radius: 5px;
	background-color: var(--input-grey);
}

.quiz-page {
	/* background-color: #00127d; */
	background: rgb(9,9,121);
	background: radial-gradient(circle, rgba(9,9,121,1) 0%, rgba(2,0,33,1) 59%, rgba(1,0,11,1) 100%);
	height: 100;
	/* height: calc(100% + 1200px); */
}

.quiz-title {
	margin-top: 40px;
	margin-bottom: 30px;
	font-size: 32px;
	text-align: center;
}


.quiz-card {
	max-width: 500px;
	background-color: white;
	/* margin-bottom: 20px; */
	padding: 25px;
	text-align: center;
	/* margin: 30px auto; */
	border-radius: 2px;
	/* box-shadow: var(--shadow); */
}

.quiz-card--neon {
	max-width: 500px;
	background-color: white;
	margin-bottom: 20px;
	padding: 25px;
	text-align: center;
	margin: 30px auto;
	border-radius: 2px;
	/* box-shadow: var(--shadow); */

	border: 5px #fff solid;
	box-shadow: 0 0 10px #61ff18, 0 0 10px #4eff18 inset, 0 0 30px #59ff18, 0 0 30px #46ff18 inset;
}

.neon-border-quiz {
	max-width: 500px;
	/* background-color: rgb(255, 56, 56); */
	margin-bottom: 20px;
	/* padding: 25px; */
	text-align: center;
	margin: 40px auto;
	/* border-radius: 2px; */
	position: relative;
	border: 5px #fff solid;
	box-shadow: 0 0 10px #187bff, 0 0 10px #186aff inset, 0 0 30px #187bff, 0 0 30px #18e8ff inset;
}

.quiz-card__title {
	font-size: 22px;
	font-weight: 700;
	margin-bottom: 15px;
}

.quiz-card__sub-title {
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 15px;
	margin-top: 15px;
}

.quiz-card__body {

}

.quiz-card__bottom {
	height: 90px;
	width: calc(100% + 50px);
	background-color: rgb(221, 217, 217);
	position: relative;
	bottom: -25px;
	left: -25px;
	font-size: 14px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 12px;
	border-radius: 0px 0px 2px 2px;
	color: rgb(49, 49, 49);
}

.quiz-card__code-container {
	margin-bottom: 10px;
}

.quiz-card__code-container__box {
	background-color: rgb(255, 180, 180);
	padding: 5px 15px 5px 15px;
}

.center-ol {
	text-align: center;
	list-style-position: inside;
}


.cr-neon-text {
    user-select: none;
    font-size: 2.5rem;
    font-family: "Metrophobic", sans-serif;
    color: rgba(255, 255, 255, 0.75);
    text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
    animation: 12s cr-neon-pink;
    position: relative;
    padding: 0;
    margin: 70px;
	line-height: 110%;
}

.zoom-link a {color: var(--brunswick-red);}


.the-neon-sign {
	border: 5px #fff solid;
	border-radius: 7px;
	box-shadow: 0 0 10px #ff18a7, 0 0 10px #ff18a7 inset, 0 0 30px #ff18a7, 0 0 30px #ff18a7 inset;
	margin-top: 3rem;
	position: relative;
	width: 230px;
	height: 130px;
	}
  
  .cr-neon {
	user-select: none;
	font-size: 4rem;
	font-family: "Metrophobic", sans-serif;
	color: rgba(255, 255, 255, 0.75);
	text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
	animation: 12s cr-neon-pink;
	position: relative;
	padding: 0;
	margin: 0;
	line-height: 110%;
	/*
	 *	Do we like this? No.. is it for the better good?
	 *	yes.
	 */
	}
  .cr-neon .cr-neon-sub  {
	color: rgba(255, 255, 255, 0.6);
	text-shadow: -2px 2px 0px #94f701, -2px -2px 0px #94f701, 2px 2px 0px #94f701, 2px -2px 0px #94f701, 0px 0px 5px #94f701, 0px 0px 20px #94f701, 0px 0px 30px #94f701, 0px 0px 120px #94f701, 0px 0px 130px #94f701;
	position: absolute;
	top: 50px;
	left: 100px;
	transform: rotate(-10deg);
	font-size: 3rem;
	animation: 10s cr-neon-green;
	line-height: 110%;
	}

	.cr-neon .cr-neon-sub-lockdown  {
		color: rgba(255, 255, 255, 0.6);
		text-shadow: -2px 2px 0px #f0ff24, -2px -2px 0px #f0ff24, 2px 2px 0px #f0ff24, 2px -2px 0px #f0ff24, 0px 0px 5px #f0ff24, 0px 0px 20px #f0ff24, 0px 0px 30px #f0ff24, 0px 0px 120px #f0ff24, 0px 0px 130px #f0ff24;
		position: absolute;
		top: 50px;
		left: -150px;
		transform: rotate(-0deg);
		font-size: 3rem;
		font-size: 45px;
		animation: 10s cr-neon-yellow;
		line-height: 110%;
		}

  .cr-neon.codepen-mid {
	position: absolute;
	top: 35%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 200px;
	font-size: 60px;
	}
  
  .the-neon-wrapper {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
  }
  
  @keyframes cr-neon-green {
	0% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	2% {
	  text-shadow: -2px 2px 0px #94f701, -2px -2px 0px #94f701, 2px 2px 0px #94f701, 2px -2px 0px #94f701, 0px 0px 5px #94f701, 0px 0px 20px #94f701, 0px 0px 30px #94f701, 0px 0px 120px #94f701, 0px 0px 130px #94f701;
	}
	2.5% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	3% {
	  text-shadow: -2px 2px 0px #94f701, -2px -2px 0px #94f701, 2px 2px 0px #94f701, 2px -2px 0px #94f701, 0px 0px 5px #94f701, 0px 0px 20px #94f701, 0px 0px 30px #94f701, 0px 0px 120px #94f701, 0px 0px 130px #94f701;
	}
	4% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	4.5% {
	  text-shadow: -2px 2px 0px #94f701, -2px -2px 0px #94f701, 2px 2px 0px #94f701, 2px -2px 0px #94f701, 0px 0px 5px #94f701, 0px 0px 20px #94f701, 0px 0px 30px #94f701, 0px 0px 120px #94f701, 0px 0px 130px #94f701;
	}
	10% {
	  text-shadow: -2px 2px 0px #94f701, -2px -2px 0px #94f701, 2px 2px 0px #94f701, 2px -2px 0px #94f701, 0px 0px 5px #94f701, 0px 0px 20px #94f701, 0px 0px 30px #94f701, 0px 0px 120px #94f701, 0px 0px 130px #94f701;
	}
	10.5% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	11% {
	  text-shadow: -2px 2px 0px #94f701, -2px -2px 0px #94f701, 2px 2px 0px #94f701, 2px -2px 0px #94f701, 0px 0px 5px #94f701, 0px 0px 20px #94f701, 0px 0px 30px #94f701, 0px 0px 120px #94f701, 0px 0px 130px #94f701;
	}
	51% {
	  text-shadow: -2px 2px 0px #94f701, -2px -2px 0px #94f701, 2px 2px 0px #94f701, 2px -2px 0px #94f701, 0px 0px 5px #94f701, 0px 0px 20px #94f701, 0px 0px 30px #94f701, 0px 0px 120px #94f701, 0px 0px 130px #94f701;
	}
	52% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	55% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	55.5% {
	  text-shadow: -2px 2px 0px #94f701, -2px -2px 0px #94f701, 2px 2px 0px #94f701, 2px -2px 0px #94f701, 0px 0px 5px #94f701, 0px 0px 20px #94f701, 0px 0px 30px #94f701, 0px 0px 120px #94f701, 0px 0px 130px #94f701;
	}
	85% {
	  text-shadow: -2px 2px 0px #94f701, -2px -2px 0px #94f701, 2px 2px 0px #94f701, 2px -2px 0px #94f701, 0px 0px 5px #94f701, 0px 0px 20px #94f701, 0px 0px 30px #94f701, 0px 0px 120px #94f701, 0px 0px 130px #94f701;
	}
	85.5% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	86% {
	  text-shadow: -2px 2px 0px #94f701, -2px -2px 0px #94f701, 2px 2px 0px #94f701, 2px -2px 0px #94f701, 0px 0px 5px #94f701, 0px 0px 20px #94f701, 0px 0px 30px #94f701, 0px 0px 120px #94f701, 0px 0px 130px #94f701;
	}
  }
  @keyframes cr-neon-yellow {
	0% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	2% {
	  text-shadow: -2px 2px 0px #f0ff24, -2px -2px 0px #f0ff24, 2px 2px 0px #f0ff24, 2px -2px 0px #f0ff24, 0px 0px 5px #f0ff24, 0px 0px 20px #f0ff24, 0px 0px 30px #f0ff24, 0px 0px 120px #f0ff24, 0px 0px 130px #f0ff24;
	}
	2.5% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	3% {
	  text-shadow: -2px 2px 0px #f0ff24, -2px -2px 0px #f0ff24, 2px 2px 0px #f0ff24, 2px -2px 0px #f0ff24, 0px 0px 5px #f0ff24, 0px 0px 20px #f0ff24, 0px 0px 30px #f0ff24, 0px 0px 120px #f0ff24, 0px 0px 130px #f0ff24;
	}
	4% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	4.5% {
	  text-shadow: -2px 2px 0px #f0ff24, -2px -2px 0px #f0ff24, 2px 2px 0px #f0ff24, 2px -2px 0px #f0ff24, 0px 0px 5px #f0ff24, 0px 0px 20px #f0ff24, 0px 0px 30px #f0ff24, 0px 0px 120px #f0ff24, 0px 0px 130px #f0ff24;
	}
	10% {
	  text-shadow: -2px 2px 0px #f0ff24, -2px -2px 0px #f0ff24, 2px 2px 0px #f0ff24, 2px -2px 0px #f0ff24, 0px 0px 5px #f0ff24, 0px 0px 20px #f0ff24, 0px 0px 30px #f0ff24, 0px 0px 120px #f0ff24, 0px 0px 130px #f0ff24;
	}
	10.5% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	11% {
	  text-shadow: -2px 2px 0px #f0ff24, -2px -2px 0px #f0ff24, 2px 2px 0px #f0ff24, 2px -2px 0px #f0ff24, 0px 0px 5px #f0ff24, 0px 0px 20px #f0ff24, 0px 0px 30px #f0ff24, 0px 0px 120px #f0ff24, 0px 0px 130px #f0ff24;
	}
	51% {
	  text-shadow: -2px 2px 0px #f0ff24, -2px -2px 0px #f0ff24, 2px 2px 0px #f0ff24, 2px -2px 0px #f0ff24, 0px 0px 5px #f0ff24, 0px 0px 20px #f0ff24, 0px 0px 30px #f0ff24, 0px 0px 120px #f0ff24, 0px 0px 130px #f0ff24;
	}
	52% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	55% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	55.5% {
	  text-shadow: -2px 2px 0px #f0ff24, -2px -2px 0px #f0ff24, 2px 2px 0px #f0ff24, 2px -2px 0px #94f701, 0px 0px 5px #f0ff24, 0px 0px 20px #f0ff24, 0px 0px 30px #f0ff24, 0px 0px 120px #f0ff24, 0px 0px 130px #f0ff24;
	}
	85% {
	  text-shadow: -2px 2px 0px #f0ff24, -2px -2px 0px #f0ff24, 2px 2px 0px #f0ff24, 2px -2px 0px #94f701, 0px 0px 5px #f0ff24, 0px 0px 20px #f0ff24, 0px 0px 30px #f0ff24, 0px 0px 120px #f0ff24, 0px 0px 130px #f0ff24;
	}
	85.5% {
	  text-shadow: -2px 2px 0px #021c07, -2px -2px 0px #021c07, 2px 2px 0px #021c07, 2px -2px 0px #021c07, 0px 0px 5px #021c07, 0px 0px 20px #021c07, 0px 0px 30px #021c07, 0px 0px 120px #021c07, 0px 0px 130px #021c07;
	}
	86% {
	  text-shadow: -2px 2px 0px #f0ff24, -2px -2px 0px #f0ff24, 2px 2px 0px #f0ff24, 2px -2px 0px #f0ff24, 0px 0px 5px #f0ff24, 0px 0px 20px #f0ff24, 0px 0px 30px #f0ff24, 0px 0px 120px #f0ff24, 0px 0px 130px #f0ff24;
	}
  }
  @keyframes cr-neon-pink {
	0% {
	  text-shadow: -2px 2px 0px #1f021a, -2px -2px 0px #1f021a, 2px 2px 0px #1f021a, 2px -2px 0px #1f021a, 0px 0px 5px #1f021a, 0px 0px 20px #1f021a, 0px 0px 30px #1f021a, 0px 0px 120px #1f021a, 0px 0px 130px #1f021a;
	}
	1% {
	  text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
	}
	3% {
	  text-shadow: -2px 2px 0px #1f021a, -2px -2px 0px #1f021a, 2px 2px 0px #1f021a, 2px -2px 0px #1f021a, 0px 0px 5px #1f021a, 0px 0px 20px #1f021a, 0px 0px 30px #1f021a, 0px 0px 120px #1f021a, 0px 0px 130px #1f021a;
	}
	3.5% {
	  text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
	}
	4.5% {
	  text-shadow: -2px 2px 0px #1f021a, -2px -2px 0px #1f021a, 2px 2px 0px #1f021a, 2px -2px 0px #1f021a, 0px 0px 5px #1f021a, 0px 0px 20px #1f021a, 0px 0px 30px #1f021a, 0px 0px 120px #1f021a, 0px 0px 130px #1f021a;
	}
	5% {
	  text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
	}
	20% {
	  text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
	}
	20.5% {
	  text-shadow: -2px 2px 0px #1f021a, -2px -2px 0px #1f021a, 2px 2px 0px #1f021a, 2px -2px 0px #1f021a, 0px 0px 5px #1f021a, 0px 0px 20px #1f021a, 0px 0px 30px #1f021a, 0px 0px 120px #1f021a, 0px 0px 130px #1f021a;
	}
	21% {
	  text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
	}
	31% {
	  text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
	}
	32% {
	  text-shadow: -2px 2px 0px #1f021a, -2px -2px 0px #1f021a, 2px 2px 0px #1f021a, 2px -2px 0px #1f021a, 0px 0px 5px #1f021a, 0px 0px 20px #1f021a, 0px 0px 30px #1f021a, 0px 0px 120px #1f021a, 0px 0px 130px #1f021a;
	}
	45% {
	  text-shadow: -2px 2px 0px #1f021a, -2px -2px 0px #1f021a, 2px 2px 0px #1f021a, 2px -2px 0px #1f021a, 0px 0px 5px #1f021a, 0px 0px 20px #1f021a, 0px 0px 30px #1f021a, 0px 0px 120px #1f021a, 0px 0px 130px #1f021a;
	}
	45.5% {
	  text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
	}
	65% {
	  text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
	}
	65.5% {
	  text-shadow: -2px 2px 0px #1f021a, -2px -2px 0px #1f021a, 2px 2px 0px #1f021a, 2px -2px 0px #1f021a, 0px 0px 5px #1f021a, 0px 0px 20px #1f021a, 0px 0px 30px #1f021a, 0px 0px 120px #1f021a, 0px 0px 130px #1f021a;
	}
	66% {
	  text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
	}
  }

  .update-code-page {
		display: flex;
		justify-content: center;
  }

  /* body,
  html {
	background: var(--page-background);
	min-height: 100%;
	margin: 0;
	padding: 0;
	} */

















































/* Screen larger than 600px? 2 column */
@media (min-width: 600px) {
	.youth-section-image-conatiner { grid-template-columns: repeat(2, 1fr); }
}

/* Screen larger than 900px? 3 columns */
@media (min-width: 900px) {
	.youth-section-image-conatiner { grid-template-columns: repeat(3, 1fr); }
}





/* Footer */
footer {
	min-height: 300px;
	background-color: gainsboro;
	width: 100%;
/*	color: #8B8B8B;*/
	color: black;
}

.footer-container {
	margin: auto;
	max-width: 1200px;
	display: flex;
	flex-direction: column;
	padding: 40px 15px;
	/*	padding: 20px 60px;*/
}

.map {
	background-color: gainsboro;
	height: 255px;
	width: 100%;
	/*	margin-left: 40px;*/
	border-radius: 3px;
    overflow: hidden;
}

.footer-title {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 10px;
}

.social-container {
	display: flex;
	align-items: center;
	max-width: 160px;
	justify-content: space-between;
	margin-bottom: 30px;
	margin-top: 15px;
}

.footer-icon {
	fill: #262626;
	width: 40px;
	height: 40px;
	cursor: pointer;
	transition: 0.3s;
}

.footer-icon:hover {
	fill: var(--brunswick-red);
	width: 40px;
	height: 40px;
}

.footer-text {
	font-size: 16px;
	margin-bottom: 5px;
}

.footer-col1 {
	max-width: 350px;
	margin-bottom: 30px;
}

.footer-col3 {
	/* background-color: aqua; */
}

.footer-col2 {
	margin-bottom: 20px;
}


/* Footer Dark */
.footer--dark {
	min-height: 300px;
	background-color: #171717;
	width: 100%;
/*	color: #8B8B8B;*/
	color: rgb(209, 209, 209);
}

.footer-container--dark {
	margin: auto;
	max-width: 1200px;
	display: flex;
	flex-direction: column;
	padding: 40px 15px;
	/*	padding: 20px 60px;*/
}

.map--dark {
	background-color: gainsboro;
	height: 255px;
	width: 100%;
	/*	margin-left: 40px;*/
}

.footer-title--dark {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 10px;
	color: white;
}

.social-container--dark {
	display: flex;
	align-items: center;
	max-width: 160px;
	justify-content: space-between;
	margin-bottom: 30px;
	margin-top: 15px;
}

.footer-icon--dark {
	fill: #ffffff;
	width: 40px;
	height: 40px;
	cursor: pointer;
	transition: 0.3s;
}

.footer-icon--dark:hover {
	fill: var(--brunswick-red);
	width: 40px;
	height: 40px;
}

.footer-text--dark {
	font-size: 16px;
	margin-bottom: 5px;
}

.footer-col1--dark {
	max-width: 350px;
	margin-bottom: 30px;
}

.footer-col3--dark {
	/* background-color: aqua; */
}

.footer-col2--dark {
	margin-bottom: 20px;
}





.mapouter {
	position:relative;
	text-align:right;
	height:100%;
	width:100%;
}

.gmap_canvas {
	overflow:hidden;
	height:260px;

}












/* MEET THE TEAM  */

/* the board */

/* .meet-the-team-image-conatiner--board {
	grid-template-columns: repeat(1, 1fr);
    max-width: 600px;
		margin: 0 auto;
	display: grid;
	grid-gap: 2rem;
	background-color: aquamarine; 
	margin-bottom: 40px;
} */

/* .meet-the-team-image-conatiner--vol{
	grid-template-columns: repeat(4, 1fr);
	max-width: 1200px;
		margin: 0 auto;
	display: grid;
	grid-gap: 2rem;
	background-color: aquamarine; 
	margin-bottom: 40px;
} */

.meet-the-team-card__nameplate--vol {
	height: 100%;
	width: 120px;
	border-radius: 5px;
	/* margin: auto; */
	box-shadow: var(--shadow);
	border-bottom: 5px solid var(--brunswick-red);
} 

.meet-the-team-card__nameplate--single {
	background-color: var(--brunswick-red);
	height: 98px;
	width: 220px;
	border-radius: 5px;
	margin: auto;
	box-shadow: var(--shadow);
} 





.meet-the-team-container {
	padding: 0px;
}


.meet-the-team-photo {
	width: 100%;
	height: 100%;	
	object-fit: contain;
}

.meet-the-team-card {
	width: 230px;
	height: 290px;
	background-color: #82999f;
		border: 5px solid var(--brunswick-red);
	border-radius: 5px;
	position: relative;
	margin-bottom: 80px;
}

.meet-the-team-card__nameplate {
	background-color: var(--brunswick-red);
	height: 98px;
	width: 220px;
	border-radius: 5px;
	position: absolute;
	bottom: -40px;
	right: -40px;
	box-shadow: var(--shadow);
}

.meet-the-team-card__name {
	height: 35px;
	background-color: white;
	border-radius: 5px 5px 0px 0px;
	display: flex;
	align-items: center;
	padding-left: 15px;
	font-size: 20px;
	font-weight: 600;
	color: black;
}

.meet-the-team-card__title {
	height: 40px;
	border-radius: 0px 0px 5px 5px;	
	padding-left: 15px;
	padding-top: 5px;
	color: white;
	font-size: 18px;
}







.meet-the-team-image {
	/* background-color: dodgerblue; */
	color: white;
	height: 330px;
	width: 265px;
	margin-bottom: 40px;
	margin: auto;
}

.meet-the-team-image-conatiner {
	max-width: 1200px;
	/*	margin: 0 auto;*/
	display: grid;
	grid-gap: 2rem;
	/* background-color: aquamarine; */
	margin-bottom: 40px;
}

/* Screen larger than 600px? 2 column */
@media (min-width: 400px) {
	body {
	}
	.meet-the-team-image-conatiner { 
		grid-template-columns: repeat(1, 1fr); 

	}

	

	.meet-the-team-image {
		/* background-color: dodgerblue; */
		color: white;
		height: 330px;
		width: 265px;
		margin: 0 auto 0px auto;
	}

	.meet-the-team-card {
		width: 215px;
    height: 290px;
    
		border: 5px solid var(--brunswick-red);
		border-radius: 5px;
		position: relative;
		margin-bottom: 80px;
	}

}

/* Screen larger than 600px? 2 column */
@media (min-width: 620px) {
	body {
	}
	.meet-the-team-image-conatiner {
		grid-template-columns: repeat(2, 1fr);
		margin-bottom: 90px;
		width: 100px;
	}

	.meet-the-team-image {
		/* background-color: dodgerblue; */
		color: white;
		height: 330px;
		width: 265px;
		/*		margin-bottom: 40px;*/
		margin: 0 0 0px 0;
	}
}

/* Screen larger than 600px? 2 column */
@media (min-width: 905px) {
	body {
	}
	.meet-the-team-image-conatiner { 
		grid-template-columns: repeat(3, 1fr); 
		width: 600px;
	}

	.meet-the-team-image {
		/* background-color: dodgerblue; */
		color: white;
		height: 330px;
		width: 265px;
		margin-bottom: 0px;
		margin: 0px 0px;
	}
}

/* Screen larger than 900px? 3 columns */
@media (min-width: 1230px) {
	body {
	}
	.meet-the-team-image-conatiner { grid-template-columns: repeat(4, 1fr); 
		margin-bottom: 40px;
	}

	.meet-the-team-image {
		/* background-color: dodgerblue; */
		color: white;
		height: 330px;
		width: 265px;
		margin-bottom: 0px;
	}
}











.meet-the-team-title {
	font-size: 26px;
	font-weight: 700;
	margin-bottom: 15px;
}



/* DEFAULT CONTAINER */

.default-container {
	display: block;
	padding: 0px;
	justify-content: center;
	margin: auto;
}

.iframe__membershipform {
	width: 100%;
	height: 500px;
}

.iframe__membershipform--easter {
	width: 100%;
	height: 670px;
}






/*	Vol */

.volunteer-main {
	width: 100%;
	padding: 0px;
	margin-bottom: 20px;
	flex: 2; 
}

.volunteer-container {
	display: block;
	padding: 0px;
}

.volunteer-side-container {
	/* background-color: yellow; */
	height: 340px;
}

.volunteer-side {
	width: 100%;
	height: 100%;
	background-color: white;
	box-shadow: var(--shadow);
	border-radius: 5px;
	flex: 1; 
	max-width: 330px;
	margin: auto;
}

.volunteer-side_image-flex {
	display: flex;
	flex-direction: row;
	}

.volunteer-side__image {
	display: block;
	width: 40%;
	margin: 50px auto;
}

#nhs-logo {
	height: 60px;
    margin: auto;
}

.volunteer-side__top {
	background-color: var(--brunswick-red);
	height: 60px;
	color: white;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 26px;
	border-radius: 5px 5px 0px 0px;
}

.volunteer-side__main {
	padding: 10px;
	text-align: center;
	
}





.margin-right-60 {
	margin-right: 60px;
}

.youth-section-test {
	max-width: 1160px;
	margin: auto;
}

.margin-bottom-10 {
	margin-bottom: 10px;
}

.volunteer-side--donate {
	/* height: 190px; */
}

.volunteer-side--mental {
	height: 160px;
}



/* New stuff Hsitory*/

.history-top-section {	
	padding: 0px 20px;
	margin-bottom: 40px;
}

.history-top-section__element {
	margin-bottom: 20px;
}

.history-title {
	font-size: 24px;
	font-weight: 700;
	margin-bottom: 15px;
}

.history-bottom-section {
	padding: 40px 15px;
	background-color: #F5F0F0;
	margin: auto;
}

.history-header {
	font-size: 30px;
	font-weight: 700;
	text-align: center;
	margin-bottom: 40px;
}

.history-bottom-section__element {
	margin-bottom: 40px;
}

.page-content--history {
	background-color: #F5F0F0;
}

.page-content--20padding {
	padding: 30px 0px 20px 0px;
}

.history-image {
	width: 100%;
	max-height: 500px;
	background-color: #ffffff;
	overflow: hidden;
	object-fit: cover;
	object-position: 0  0;
}

.history-image-container {
	width: 100%;
}

.history-video {
margin: 20px auto 20px auto;		
}



/* party cards */

.party-banner {
	background-image: url(/images/partybanner-mobile.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	height: 200px;
	object-fit: contain;
}

.party-card {
	margin: auto;
	max-width: 400px;
	min-height: 300px;
padding-bottom: 80px;
	background-color: white;
	margin-bottom: 50px;
	position: relative;
	border-radius: 5px;
	box-shadow: var(--shadow);
}

.party-card-container {

}

.party-card__top {
	padding: 15px;
	background-color: sandybrown;
	height: 60px;
	font-weight: 700;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	border-radius: 5px 5px 0px 0px;
}

.party-card__main__title {
	font-weight: 600;
	font-size: 18px;
	text-align: center;
	margin-bottom: 10px;
}

.party-card__main {	
	padding: 0px 10px;

}

.party-card__main__body {
	text-align: center;
}

.button-text-center {
	text-align: center;
}

.button-book {
	border-radius: 0px;
	text-align: center;
	border-radius: 0px 0px 5px 5px;
}

.party-card__button {
	position: absolute;
	bottom: 0px;
	width: 100%;
}

a {
  text-decoration: none; /* no underline */
}

.width-170 {
	width: 170px;
}

.party-card__top--bronze {
	background: rgb(219,201,189);
background: linear-gradient(290deg, rgba(219,201,189,1) 0%, rgba(157,138,125,1) 100%);
}

.party-card__top-silver {
	background: rgb(201,214,217);
background: linear-gradient(290deg, rgba(201,214,217,1) 0%, rgba(135,153,158,1) 100%);
}

.party-card__top-gold {
	background: rgb(235,209,152);
background: linear-gradient(290deg, rgba(235,209,152,1) 0%, rgba(180,136,17,1) 100%);
}

.party-card__top-13 {
	background: rgb(235,209,152);
background: linear-gradient(290deg, rgb(224, 147, 255) 0%, rgb(88, 136, 238) 100%);
}


.party-card__top p {
	line-height: 120%;
}

.party-card__top p:first-child {
	line-height: 120%;
	margin-right: 10px;
}

.button--party-pay {
padding: 16px 24px;
min-width: 170px;
}


/* room cards */

.room-image {
	width: 100%;
	height: 180px;
	object-fit: cover;
	margin-bottom: 10px;
}

.party-card--room {
	margin: auto;
	max-width: 400px;
	min-height: 300px;
	padding-bottom: 80px;
	background-color: white;
	margin-bottom: 30px;
	position: relative;
	border-radius: 5px;
	box-shadow: var(--shadow);
}

.party-card__top--room {
	padding: 15px;
	background: rgb(238,238,238);
	background: linear-gradient(290deg, rgba(238,238,238,1) 0%, rgba(162,162,162,1) 100%);
	height: 60px;
	font-weight: 700;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-radius: 5px 5px 0px 0px;
}

/* .party-card__top--room--pitch {
	background: linear-gradient(290deg, rgb(226, 255, 192) 0%, rgb(153, 221, 75) 100%);
} */

.party-card__main-room {
	padding: 0px 10px;
}

.party-card__button--room {
	position: absolute;
	bottom: 0px;
	width: 100%;
}

.button-book--room {
	border-radius: 0px;
	text-align: center;
	border-radius: 0px 0px 5px 5px;
}

.party-card__top--room--right {
	float: none;
}

.party-card__main-room--right {
	position: inherit;
	right: 0;
	top: 0px;
}

.room-image--right {
	left: 0;
}

.party-card__button--room--right {
	right: 0;
}


/*	home */	
.home-video {
	display: flex;
justify-content: center;
/*	background-color: grey;*/
width: 100%;
max-width: 400px;
height: 300px;
margin: auto auto 30px auto;

}

.home-intro {
margin-bottom: 40px;
}

.home-intro__title {
text-align: center;
font-size: 22px;
font-weight: 600;
margin-bottom: 15px;
}

.home-intro__body {
text-align: center;
font-size: 18px;	
}

.page-content--home {
margin-left: 0px;
margin-right: 0px;
}

.home-facilities__title {
text-align: center;
font-size: 22px;
font-weight: 600;
margin-bottom: 15px;
}

.button--home {

background-color: var(--brunswick-red);
border: none;
border-radius: 5px;
color: white;
padding: 16px 36px;
font-size: 18px;
text-align: center;
width: 200px;
margin: auto;

}

.home-facilities__card {
background-color: #E9E4E4;
padding: 20px;
height: 150px;
max-width: 450px;
margin: auto;
margin-bottom: 30px;
box-shadow: var(--shadow);
}

.home-facilities__card__title {
text-align: center;
font-size: 18px;
font-weight: 600;
margin-bottom: 30px;	
}

.home-funders {
height: 200px;

background-color: #E9E4E4;
color: black;
padding: 30px 15px 15px 15px;
width: 100%;
margin-bottom: 0px;

}

.home-funders__title {
text-align: center;
font-size: 22px;
font-weight: 600;
margin-bottom: 15px;
}

.home-donate {
text-align: center;
margin-bottom: 60px;
}

.home-donate__title {
text-align: center;
font-size: 22px;
font-weight: 600;
margin-bottom: 15px;
}

.glider-item {
background-color: white;
height: 50px;
width: 100px;
margin: 10px;
}

#fiddle-wrapper {
padding: 1em;
margin: 1em;

width: 400px;
height: 400px;
outline: 1px dashed red;
}

.placeholder {
width: 60px;
height: 200px;
/*  border: 4px solid blue;*/
text-align: center;
/*	padding: 1em*/
display: flex;

}
.home-logo {
height: 70px;
width: 100px;
object-fit: contain;
margin: 5px;
}

.home-facilities__card__container {
display: block;
}

video {
	width: 100%;
	height: 100%;
	max-width: 800px;
}

/* school serive */

.schoolservice-container {

}


.ss-image-row {
	display: -ms-flexbox; /* IE10 */
	display: flex;
	-ms-flex-wrap: wrap; /* IE10 */
	flex-wrap: wrap;
	/* padding: 0 8px; */
	margin-top: 30px
  }
  
  /* Create four equal columns that sits next to each other */
  .ss-image-column {
	-ms-flex: 25%; /* IE10 */
	flex: 25%;
	max-width: 25%;
	padding: 0 8px;
  }
  
  .ss-image-column img {
	margin-top: 16px;
	vertical-align: middle;
	width: 100%;
  }


  /* success modal */
  .success-modal {
	width: 90%;
    max-width: 800px;
	height: 500px;		
	background: linear-gradient(180deg, var(--brunswick-red) 0%, rgba(242,127,109,1) 100%);
	color: white;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 10px;
	position: absolute;
    top: 90px;
}

.success-modal__text {
	text-align: center;
	position: relative;
	top: -40px;
}

.page-container-success {
	display: flex;
	justify-content: center;
	align-items: center;
	max-height: 100vh;
	height: 100vh;
	margin: auto;
}

.success-modal__title {
	font-size: 28px;
	margin-bottom: 10px;
	font-weight: 700;
	color: white;
}

.success-modal__sub {
	font-size: 18px;
	margin-bottom: 2px;
	color: white;
	line-height: 140%;
}







  
  /* Responsive layout - makes a two column-layout instead of four columns */
  @media screen and (max-width: 800px) {
	.ss-image-column {
	  -ms-flex: 50%;
	  flex: 50%;
	  max-width: 50%;
	}
  }
  
  /* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
	.ss-image-column {
	  -ms-flex: 100%;
	  flex: 100%;
	  max-width: 100%;
	  padding: 0 0px;
	}
  }









  
/* CMS */

.cms {
	/* width: 700px; */
	margin: auto;
}

.side-nav {
	width: 210px;
	height: 100%;
	background-color: #f2f2f2;
	position: fixed;
	z-index: 1;
	top: 0;
	left: 0;
	overflow-x: hidden;
	padding-top: 20px;
	color: black;
}

.side-nav__title {
	text-align: center;
	font-weight: 400;
	color: var(--red);
	margin-bottom: 20px;

}

.side-nav__title--cms {
	font-weight: 100;
}

.side-nav a {
	padding: 6px 8px 6px 16px;
	text-decoration: none;
	font-size: 20px;
	color: var(--black-1);
	display: block;
}

.main {
	margin-left: 210px; 
	padding: 0px 10px;
	background-color: white;
	height: 100vh;
}


.cms-header-main h2 {   
	padding: 12px 12px 12px 0px;
	color: var(--black-1);
	font-size: 24px;
	font-weight: 400;
}

.cms-header h2 {   
	padding: 12px 12px 12px 0px;
	color: var(--black-1);
	font-size: 24px;
	font-weight: 400;
}


.cms-header {
	background-color: var(--white);
	color: var(--black-1);    

	margin: auto;    
	max-width: 500px;
	min-width: 300px;
}


/*table*/
#customers {
  /* font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; */
  border-collapse: collapse;
  width: 100%;
}

#customers td, #customers th {
  border: 1px solid #ddd;
  padding: 8px;
}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: var(--brunswick-red);
  color: white;
}


/*tool tip*/
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted rgb(211, 211, 211);
	background-color: rgb(211, 211, 211);
	width: 20px;
	height: 20px;
	border-radius: 50%;
	padding-left: 7.5px;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: rgb(211, 211, 211);
  color: black;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  top: 150%;
  left: 50%;
  margin-left: -60px;
  box-shadow: 0px 5px 7px 0px #00000047;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent rgb(211, 211, 211) transparent;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}
.tooltiptext__title {
	font-size: 18px;
	margin-top: 5px;
}

.tooltip__ul {
	margin-top: 10px;
}

.cms-label {
	height: 30px;
	width: 50%;
	padding: 10px;
	background-color: grey;
	color: black;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 30px;
}

.cms-label--deposit {
	background-color: #FFEBAA;
	color: #392B00;
}

.cms-label--payed {
	background-color: #bbffb6;
	color: #033728;
}






.covid-section__image-container1 {
	border: 2px solid var(--brunswick-red);
	display: grid;
	grid-gap: 10px 5%;
	grid-template-columns: repeat(4, 1fr);
	list-style-type: none;
	padding: 0;
	margin: 0;
  }
  
  .covid-section__image1 {
	background-color: rgb(45, 109, 182);
	padding-top: 100%;
	width: 100%;
  }





/* covid  */
.covid-intro {
	padding: 50px 20px 50px 20px;
	margin: auto;
	background-color: rgb(255, 247, 247);
	text-align: center;
}

.covid-intro h2 {
	margin-bottom: 20px;
}

.covid-intro p {

}

.covid-section-text p {
	margin-bottom: 15px;
}

.covid-section-text p:nth-last-child(1) {
	margin-bottom: 0px;
}

.covid-section {
	margin: auto;
	text-align: center;
	/*	background-color: darksalmon;*/
	padding: 100px 20px 100px 20px;
}

.covid-section--nopad {
	padding: 0px 20px 0px 20px;
}

.covid-section__title {
	margin-bottom: 20px;
	color: var(--brunswick-red);
	font-family: 'Bitter', serif;
	font-weight: 700;
}

.covid-section__date {
	margin-bottom: 10px;
	font-family: 'Bitter', serif;
	font-weight: 600;
	font-size: 18px;
}

.covid-section__image {
	width: 100%;
	height: 200px;
	background-color: mediumseagreen;
	/* margin-bottom: 10px; */
	border: 2px solid var(--brunswick-red);
	object-fit: cover;
}

.covid-section__image-container {
	padding-top: 20px;
	margin: auto;
	max-width: 600px;
	display: grid; 
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: repeat(2, 1fr);
	gap: 10px;
}

.covid-section--dark {
	background-color: #EBEBEB;
}

.covid-section__image--left {
/*	margin-right: 20px;*/
	/* margin: auto; */
	width: 100%;
	/* background-color: red; */
	margin-bottom: 20px;
	max-height: 210px;
	/* max-width: 320px; */
	object-fit: contain;
}

.covid-section__image--left--video {
	min-width: 100px;
	width: 200px ;
	height: 350px;
	max-height: 350px;
	margin: auto;
	margin-bottom: 20px;
}

.covid-section__left-right {
	display: flex;
	flex-direction: column;
	max-width: 800px;
	margin: auto;	
/*	background-color: coral;*/
}

.covid-section--black {
	background-color: #171717;
	color: white;
}

.covid-text-2 {

	font-size: 18px;
	margin-bottom: 20px;
}








/* covid grid */

.covid-section__image-container1 {
	border: 2px solid var(--brunswick-red);
	display: grid;
	grid-gap: 10px 5%;
	grid-template-columns: repeat(4, 1fr);
	list-style-type: none;
	padding: 0;
	margin: 0;
  }
  
  .covid-section__image1 {
	background-color: rgb(45, 109, 182);
	padding-top: 100%;
	width: 100%;
  }






div.game {
	display: grid; 
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: repeat(2, 1fr);
	gap: 10px;
}

.game-cell {
    width: 100%;
    /* height: 130px; */
    /* border: 1px solid; */
    box-sizing: border-box;
    color: white;
    background-color: #D42A2A;
    /* display: flex; */
    justify-content: center;
    flex-direction: column;
	padding: 15px 5px;
	border-radius: 5px;
}

.left-half{
	display: flex;
	align-items: center;
	justify-content: center;
	align-content: stretch;
}

.game-cell__title {
	font-size: 24px;
	font-weight: 700;
}

.covid-section__title--white {
	color: white;
}


.covid-section__text--right {
}

.covid-section-text {
	text-align: left;
	margin: auto;
	max-width: 800px;	
}

.covid-section-text--right {
	height: auto;
}



.volunteer-names-container {
	background-color: #171717;
	width: 100%;	
	padding: 20px;
	text-align: center;
}

.volunteer-names-container__title {
	font-size: 24px;
	color: white;
	margin-bottom: 12px;
}


.volunteer-names-grid {
	max-width: 600px;
	margin: 30px auto;
	width: 100%;
	display: grid;
	grid-auto-rows: auto;
	grid-template-columns: repeat(2, minmax(100px, 1fr));
	grid-gap: 10px;
	color: rgb(201, 201, 201);
}

.donation-cont {
		
}

.donation-input {	
	text-align: center;
	background-color: gainsboro;
	height: 60px;
	border-radius: 5px;
	font-size: 20px;
	width: 100%;	
}


/* Slider Cinema Fundraise */
.cinema-wrapper {
	position: absolute;
	top: 100%;
	left: 50%;
	width: 400px;
	margin-left: -200px;
	font: 300 30px/1 'Open Sans Condensed', sans-serif;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	animation: 15s credits linear infinite;
}

.cinema-name {
	margin-bottom: 20px;
	font-size: 18px;
}


.swiper-container--fundraiser {
		max-width: 1200px;
		height: 500px;
		background-color: rgb(10, 10, 10); 
		position: relative;
		overflow: hidden;
		margin: 15px auto  10px auto;} 

  
.curtains {
	height: 100%;
	width: 100%;
	  background: transparent;
	  position: absolute;
	  top: 0px;
	  left: 0px;
	  z-index: 10;
}
  

.cinema-disclamer {
	color: gray;
	font-size: 14px;	
}

@keyframes credits {
    0% { top:  100%; }
  100% { top: -330%; }
}







/*  Altha swiper and image bellow history  */

:root {
	--swiper-theme-color: #ffffff40 !important;
}


.swiper-slide--history-images {

}

.image-history-slider {
	width: 100%;
	height: 100%;
	object-fit: cover;
}


.swiper-slide {
	font-size: 18px;
/*      background: black;*/
	  color: white;
	  
  }

  .swiper-slide-container {
	max-width: 1200px;
	margin: auto;
  }


.swiper-slide--home1 {
		  background-image: linear-gradient( rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8) ), url("/images/banner/bannercovid.jpg");
  background-size: cover;
	  background-repeat: no-repeat;
}

.swiper-slide--home2 {
		  background-image: linear-gradient( rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8) ), url("/images/banner/trees.jpg");
  			background-size: cover;
	  		background-repeat: no-repeat;
			
}

.swiper-slide--home3 {
		    background-image: linear-gradient( rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) ), url("/images/history/a-tree.jpg");
  			background-size: cover;
	  		background-repeat: no-repeat;
}


.swiper-slide img {/* filter: brightness(50%); */}

.swiper-container {
	width: 100%;
	height: 500px;
	/* background-color: white; */
	position: relative;
	margin-bottom: 60px;
}
	
	   .swiper-container--history {
		width: 100%;
		height: 500px;
		/* background-color: white; */
		position: relative;
		margin-bottom: 60px;		
  }
	

	
	.curtains {
  height: 100%;
  width: 100%;
		background: transparent;
		position: absolute;
		top: 0px;
		z-index: 10;
}



/* .home-hero__text--banner {
	color: white;
    width: 450px;
    position: relative;
    z-index: 6;
    top: 50px;
 } */






.swiper-slide .title {
	font-size: 30px;
	font-weight: 700;
	margin-bottom: 10px;
	line-height: 120%;
	color: white;
}
.swiper-slide .subtitle {
	line-height: 150%;
	color: white;
	font-size: 17px;
}
.swiper-slide .text {
	line-height: 150%;
	color: white;
	font-size: 17px;
	max-width: 450px;
	margin-bottom: 10px;
	padding-right: 15px;
}

.swiper-slide__text-container p {
	line-height: 150%;
	color: white;
	font-size: 17px;
	max-width: 450px;
	background-color: blue;
}

.swiper-slide p {
	color: white;
	}

.swiper-slide__text-container {
  display: flex;
  flex-direction: column;
  margin: 100px auto 100px auto;
  max-width: 1200px;
  padding-top: 30px;
  padding-left: 15px;
  float: left;
}


.swiper-slide__inner-container {
	/* background-color: chartreuse; */
	padding-top: 30px;
	height: 50px;
	width: 100%;
	padding-left: 50px;
	padding-right: 50px;
	}

.swiper-slide__video-container {
	/* background-color: brown; */
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
}

.swiper-slide__video-container__title {margin-bottom: 35px; font-size: 30px;font-weight: 700;text-align: center;/* height: 100px; */}

.swiper-slide__video {
	width: 100%;
	height: 380px;
}







/*  HISTORY IMAGES DISPLAY */

.swiper-container--history {
	margin-bottom: 40px;
}

.history-images-section {
	max-width: 1000px;
	margin: auto;
	padding-top: 40px;
	padding-left: 20px;
	padding-right: 20px;
}

.image-container {
/*		display: block;*/
  display: block;
}

.images-container {
	padding: 40px 15px;
}

.images-container h2 {
	margin-top: 20px;
	margin-bottom: 10px;
}

.images-container .history-title {
 margin-top: 30px;

}

.image-container img {
  width: 100%;
  object-fit: cover;
  height: 400px;
}

.image-container__column {
	margin: 3px 10px;
  background-color: hsl(0, 0%, 95%);
  width: 100%;
  object-fit: contain;
  position: relative;
}

  .image-text {
	  position: absolute;
	  top: 0px;
	  padding: 10px;
	  background-color: hsl(225,6%,13%, 0.5);
	  border-radius: 0px 0px 10px 0px;
	  color: white;
  }

.col-left {
  margin-left: 0px;
}

.col-right {
  margin-right: 0px;
  margin-left: 0px;
}

.images-container {
  max-width: 1200px;
  margin: auto;
}




















































































@media all and (max-width : 1000px) {
	/* Meet the team	*/

	/* the board */
	.meet-the-team-image-conatiner--board {
		grid-template-columns: repeat(3, 1fr);
		max-width: 1200px;
			margin: 0 auto;
		display: grid;
		grid-gap: 2rem;
		/* background-color: aquamarine; */
		margin-bottom: 40px;
	}

	.meet-the-team-image-conatiner--vol{
		grid-template-columns: repeat(4, 1fr);
		max-width: 1200px;
			margin: 0 auto;
		display: grid;
		grid-gap: 2rem;
		/* background-color: aquamarine; */
		margin-bottom: 40px;
	}
	
	.meet-the-team-card__nameplate--single {
		background-color: var(--brunswick-red);
		height: 98px;
		width: 220px;
		border-radius: 5px;
		margin: 0;
		box-shadow: var(--shadow);
	}
}





/* Media Queries
--------------------------------------------- */

@media all and (max-width : 768px) {




	.swiper-slide__video-container {
		background-color: #ffffff;
		display: flex;
		flex-direction: column;
		/* justify-content: flex-end; */
		align-items: center;
		width: 100%;
		padding-top: 56.25%;
		height: 0px;
		position: relative;
	}
	
	.swiper-slide__video-container__title {
	margin-top: 15px;
	font-size: 30px;
	font-weight: 700;
	text-align: center;
	/* height: 10px; */
	}
	
	.swiper-slide__video {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		background-color: #000000;
	}
	
	.swiper-slide__inner-container {
		/* background-color: chartreuse; */
		/* height: 200px; */
		width: 100%;
		padding-left: 10px;
		padding-right: 10px;
		margin-bottom: 10px;
		}






	/*  */
	.swiper-container--history {
		width: 100%;
		height: 350px;
		/* background-color: white; */
		position: relative;
  }












	.party-card-container--room {
	}

	/* .home-hero__container {
		margin-bottom: 290px;
	} */


	.home-hero__lion {
		/* background-color: antiquewhite; */
		width: 350px;
		display: none;
	}

	.home-hero__text {
		color: white;
		width: 450px;
		z-index: 6;
		margin: auto;
		margin-top: 0px;
	}

	.home-hero {
		display: flex;
		justify-content: space-between;
		height: 350px;
		background-color: #D42A2A;
		padding-left: 25px;
		padding-right: 25px;
		padding-top: 0px;
	}

	.home-hero__banner {
		display: flex;
		background-color: chocolate;
		min-height: 240px;
		max-height: 300px;
		width: 100%;
		position: absolute;
		top: 350px;
		/* bottom: -150px; */
	}



	.farright-pos-dropdown {
		position: inherit;
		right: auto;
		top: auto;
	}

	.menu {
		position: absolute;
		top: 60px;
		right: 0;
		padding: 0px;
		z-index: 100;
	}

	.menu-drop {
		width: 100%;
		height: 200px;
		display: block;
		/* background-color: aquamarine; */
	}


	#logo {
		display: block;
		width: 100%;
		text-align: left;
		float: none;
	}

	nav {
		margin: 0;
		display: flex;
	}

	/* Hide the navigation menu by default */
	/* Also hide the  */
	.toggle + a,
	.menu {
		display: none;
	}

	/* Stylinf the toggle lable */
	.toggle {
		display: flex;
		align-items: center;
		position: relative;
		/*		background-color: blue;*/
		padding:14px 20px;	
		color:gre;
		font-size:17px;
		text-decoration:none;
		border:none;
		right: 0;
		color: black;		
	}

	.toggle:hover {
		background-color: var(--hover-nav);
	}

	/* Display Dropdown when clicked on Parent Lable */
	[id^=drop]:checked + ul {
		display: block;
		/*		position: relative;*/
		top: 60px;
		width: 100%;
		z-index: 100;
	}

	[id^=newdro]:checked + ul {
		display: block;
		position: relative;
		top: 0px;
		width: 100%;
	}



	/* Change menu item's width to 100% */
	nav ul li {
		display: block;
		width: 100%;
	}

	nav ul ul .toggle,
	nav ul ul a {
		padding: 0 40px;
	}

	nav ul ul ul a {
		padding: 0 80px;
	}

	nav a:hover,
	nav ul ul ul a {
		background-color: var(--hover-nav);
	}

	nav ul li ul li .toggle,
	nav ul ul a,
	nav ul ul ul a{
		padding:14px 20px;	
		color: black;
		font-size:17px; 
	}


	nav ul li ul li .toggle,
	nav ul ul a {
		/*		background-color: #212121; */
	}

	/* Hide Dropdowns by Default */
	nav ul ul {
		float: none;
		position:static;
		color: black;
		/* has to be the same number as the "line-height" of "nav a" */
	}

	/* Hide menus on hover */
	nav ul ul li:hover > ul,
	nav ul li:hover > ul {
		display: none;
	}

	/* Fisrt Tier Dropdown */
	nav ul ul li {
		display: block;
		width: 100%;
	}

	nav ul ul ul li {
		position: static;
		/* has to be the same number as the "width" of "nav ul ul li" */ 

	}






	







}





@media all and (max-width : 968px) {

/*  Promo Desktop */
	




	body {
		/* background-color: royalblue; */
	}

	.home-hero {
		display: flex;
		justify-content: space-between;
		height: 350px;
		background-color: var(--brunswick-red);
		padding-left: 25px;
		padding-right: 25px;
		padding-top: 50px;
	}

	.home-hero__item:nth-child(1) {
		margin-left: 0px;
	}

	.home-hero__item__image {
		height: 100%;
		background-color: gold;

	}


	.home-hero__item__right {
		max-height: 150px;
	}

	.home-hero__item__body {
		margin-bottom: 25px;
		font-size: 15px;
	}


	.home-hero__item__image__container {	
		max-height: 200px;
		width: 150px;
		background-color: darkgreen;
	}

	
	
	.home-hero__banner {
		display: flex; 
		min-height: 240px;
		max-height: 300px;
		width: 100%;
		position: absolute;
/*		bottom: -150px;*/
	}

	.home-hero__banner__inner {
	   background-color: darkorchid;
	   /* width: 1400px; */
	   display: flex;
	   justify-content: flex-end;
	   margin-left: 0px;
	   box-shadow: var(--shadow);
	}

	.home-hero__lion {
		/* background-color: antiquewhite; */
		width: 350px;
	}

	.home-hero__image {
		height: 260px;
		width: 380px;
		position: relative;
		left: -30px;
		z-index: 1;
		bottom: -10px;
	}

	.home-hero__image__background {
		height: 800px;
		width: 1000px;
		position: relative;
		top: -560px;
		left: -100px;
		z-index: 0;
	}

	
	.home-hero__container {
	position: relative;
	margin-bottom: 250px;

}

.home-logo {
	margin: 0px 10px;
}

.text-5-lines {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 4; /* number of lines to show */
	-webkit-box-orient: vertical;
 }



}

/* Mobile  */
@media all and (max-width : 768px) {
	body {
		/* background-color: darkviolet; */
	}

	.nav-donate-container {
		padding: 10px;
		padding-right: 0px;
	}

	.nav-donate {
		border-radius: 20px;
		/* height: 40px; */
		margin-top: 10px;
		margin-bottom: 10px;
		color: white;
		width: 100px;
		margin: auto;
		/* height: 40px; */
	}



	.home-hero__container {
		position: relative;
		margin-bottom: 280px;
	}

	.home-hero__banner {
	   display: flex; 
		   background-color: chocolate;
	   min-height: 240px;
	   max-height: 300px;
	   width: 100%;
	   position: absolute;
/*		bottom: -150px;*/
   }

   .home-hero__banner__inner {
	  /* background-color: darkorchid; */
	  /* width: 1400px; */
	  display: flex;
	  justify-content: flex-end;
	  margin-left: 0px;
	  box-shadow: var(--shadow);
   }

   .home-hero__item {
	   display: flex;
	   /* justify-content: space-between; */
	   width: 50%;
	   background-color: white;
	   padding: 25px;
   }

   .home-hero__item__right {
	   display: none;
   }


   .home-services-container {
	   max-width: 1200px;
	   margin: 30px auto;
	   width: 100%;
	   display: grid;
	   grid-auto-rows: auto;
	   grid-template-columns: repeat(1, minmax(200px, 1fr));
	   grid-gap: 1em;
   }

   .home-hero__item__left {
	display: flex;
	flex-direction: column;
	padding-right: 0px;
}








   
}

@media all and (max-width : 420px) {
	.home-hero {
		padding-top: 30px;
	}

	.header-text-behind {
		display: none;
	}

	.covid-section__image {
		width: 100%;
		height: 150px;
		background-color: mediumseagreen;
		border: 2px solid var(--brunswick-red);
	}

	.home-logo {
		width: 60px;
	}



	.quiz-card__bottom {
		height: 120px;
	}

	.the-neon-sign {
		border: 5px #fff solid;
		border-radius: 7px;
		box-shadow: 0 0 10px #ff18a7, 0 0 10px #ff18a7 inset, 0 0 30px #ff18a7, 0 0 30px #ff18a7 inset;
		margin-top: 3rem;
		position: relative;
		width: 220px;
		height: 130px;
		}
	  
	  .cr-neon {
		user-select: none;
		font-size: 4rem;
		font-family: "Metrophobic", sans-serif;
		color: rgba(255, 255, 255, 0.75);
		text-shadow: -2px 2px 0px #ff18a7, -2px -2px 0px #ff18a7, 2px 2px 0px #ff18a7, 2px -2px 0px #ff18a7, 0px 0px 5px #ff18a7, 0px 0px 20px #ff18a7, 0px 0px 30px #ff18a7, 0px 0px 120px #ff18a7, 0px 0px 130px #ff18a7;
		animation: 12s cr-neon-pink;
		position: relative;
		padding: 0;
		margin: 0;
		line-height: 110%;
		/*
		 *	Do we like this? No.. is it for the better good?
		 *	yes.
		 */
	  }
	  .cr-neon .cr-neon-sub {
		color: rgba(255, 255, 255, 0.6);
		text-shadow: -2px 2px 0px #94f701, -2px -2px 0px #94f701, 2px 2px 0px #94f701, 2px -2px 0px #94f701, 0px 0px 5px #94f701, 0px 0px 20px #94f701, 0px 0px 30px #94f701, 0px 0px 120px #94f701, 0px 0px 130px #94f701;
		position: absolute;
		top: 110px;
		left: 0px;
		transform: rotate(-10deg);
		font-size: 3rem;
		animation: 10s cr-neon-green;
		line-height: 110%;
		font-size: 40px;
		}
	  .cr-neon.codepen-mid {
		position: absolute;
		top: 35%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 200px;
		font-size: 45px;
		}

		.cr-neon .cr-neon-sub-lockdown  {
			color: rgba(255, 255, 255, 0.6);
			text-shadow: -2px 2px 0px #f0ff24, -2px -2px 0px #f0ff24, 2px 2px 0px #f0ff24, 2px -2px 0px #f0ff24, 0px 0px 5px #f0ff24, 0px 0px 20px #f0ff24, 0px 0px 30px #f0ff24, 0px 0px 120px #f0ff24, 0px 0px 130px #f0ff24;
			position: absolute;
			top: 50px;
			left: -0px;
			transform: rotate(-0deg);
			font-size: 3rem;
			font-size: 45px;
			animation: 10s cr-neon-yellow;
			line-height: 110%;
			}
	  
	  .the-neon-wrapper {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	  }










	}


@media all and (max-width : 363px) {
	.home-hero__container {
		margin-bottom: 320px;
	}
	
	.home-hero__banner {
		height: 270px;
	}

	.home-hero {
		padding-top: 30px;
	}

	}



/* DESKTOP */
@media only screen and (min-width: 800px) {	

	.party-card-container--room--diagonal {
		margin: 80px 0px 0px 0px;
		padding: 100px 20px 20px 20px;
		background-color: var(--brunswick-red);
		background: linear-gradient(180deg, var(--brunswick-red) 0%, rgba(242,127,109,1) 100%);
		color: white;
		clip-path: polygon(0 80px, 100% 0, 100% 100%, 0% 100%);
	}



	/* fmaily support  */ 
.family-section {
	max-width: 800px;
	/* margin: 40px auto 0px auto; */
	}
	
	.family-section__title {
	margin-bottom: 20px;	
	text-align: left;
	}
	
	.family-section__image--left {
	 width: 100%;
	 max-width: 250px;
	 display: block;
	 margin: auto;
	 margin-bottom: 20px;
	}
	


	.family-section__left-right {
	display: flex;
	}
	
	.family-section__image--left {
	margin-right: 20px;
	}
	
	.family-section-text {
		
	}
	
	.family-section-text--right {
	
	}






/* DEFAULT CONTAINER */
.default-container {
	display: flex;
	padding: 0px;
	margin-bottom: 30px;
	justify-content: center;
}













/*  HISTORY IMAGES DISPLAY */
.image-container {
	/*		display: block;*/
	  display: flex;
	}


	.promo-banner {
		height: 100px;
		width: 100%;
		background-color: #1E1C1A;
		display: flex;
		justify-content: center;
	}
	
	.promo-banner__inner {
		width: 100%;
		max-width: 1200px;
		display: flex;
	}
	
	.promo-banner__image--kabin {
		width: 50%;
		height: 70%;
		/* margin: auto; */
		object-fit: contain;
		display: block;
		/* padding-left: 10px; */
	}

	.promo-banner__button--kabin {
		background-color: #FD6510;
		border: none;
		border-radius: 5px;
		color: white;
		font-size: 16px;
		cursor: pointer;
		width: 130px;
		height: 40px;
		bottom: 10px;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: auto;
		/* float: right; */
		/* float: right; */
		/* position: relative; */
		/* right: 0px; */
	}

	.promo-banner__image {
		width: 50%;
		height: 100%;
		margin: auto;
		object-fit: fill;
		display: block;
	}
	
	.promo-banner__text {
		width: 50%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-content: center;
		flex-direction: row;
		margin-left: 20px;
		padding-right: 15px;
	}
	
	.promo-banner__sub {
		color: #B6B6A4;
		font-size: 18px;
	}
	
	.promo-banner__text__wrap {
		display: flex;
		justify-content: center;
		flex-direction: column;
	}
	
	.promo-banner__title {
		font-size: 24px;
		color: white;
	}
	
	.promo-banner__text {
		color: white;
		font-size: 18px;
	}
	
	.promo-banner__button {
		background-color: orangered;
		border: none;
		border-radius: 5px;
		color: white;
		font-size: 16px;
		cursor: pointer;
		width: 150px;
		height: 40px;
		bottom: 10px;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: auto;
	}






	body {
				background-color: var(--page-background);
	}	

	header {
		height: 200px;
		width: 100%;
		background-color: var(--brunswick-red);
/*		margin-bottom: 30px;*/

	}

	.header-text-behind {
		position: absolute;
		left: 0px;
		top: -220px;
		font-size: 160px;
		font-weight: 700;
		color: white;
		opacity: 0.05;
	}


	.page-content {
		max-width: 1200px;
		margin: auto;
		padding: 60px 20px 20px 20px;
	}

	/*	BOOKING PAGE PARTYS */
	.booking-mid-block {
		display: flex;		
	}

	.margin-left-15-mobile {
		margin-left: 0px;
	}

	.booking-section__box {
		background-color: var(--pannel);
		padding: 15px;	
		margin-top: 10px;
		padding-top: 0px;
		height: 100%;
	}

	.booking-bottom-block {
		display: flex;
	}

	.margin-right-5 {
		margin-right: 5px;
	}

	.margin-left-5 {
		margin-left: 5px;
	}

	.booking-section__input {
		background-color: white;
	}

	.booking-section__pay-text {
		padding-top: 0px;
	}


	.booking-section__box--payment {
		border-radius: 10px;
		padding: 20px 15px 0px 15px;
		margin-bottom: 20px;
		height: 300px;
	}

	.booking-section__box--details {
		padding-top: 14px;
		border-radius: 10px;
		padding: 12px 15px 0px 15px;
		height: 300px;
	}

	.booking-section__box--date {
		border-radius: 10px 0px 0px 10px;
		padding: 20px 15px 0px 15px;
		height: 375px;
	}

	.booking-section__box--time {
		border-radius: 0px 10px 10px 0px;
		padding: 20px 15px 0px 15px;
		height: 375px;
	}

	.booking-section__box--package {
		border-radius: 10px;
	}

	.text-to-swap:after {
		content: "Select Date & Time";
	}

	.text-to-hide {
		opacity: 0;
	}

	.booking-options-extras {
		display: flex;		
	}






	/* home  */

	 .home-hero__lion--banner {
		 /*	background-color: antiquewhite;*/
		 width: 450px;
		 display: block;
		 position: relative;
		 left: -100px;
	 }

	 .home-page-banner-behind--banner {
		background-color: var(--brunswick-red);
		height: 100%;
		width: 50%;
		left: 0;
		position: absolute;
	}






	/*	Youth Work */

	.youth-section {	
		width: 49%;
		margin-bottom: 60px;
		box-shadow: var(--shadow);
		background-color: white;
	}

	.youth-section-container {
		display:  flex;
		justify-content: space-between;
	}

	.youth-section-testimonials__container {
		display: flex;
		justify-content: space-between;
	}


	.youth-section-testimonial__container {
		width: 30%;
	}

	.youth-section__main {
		padding: 20px;
	}

	.youth-section__header {
		height: 160px;
		padding: 20px;

	}

	/* image grid */
	.youth-section-image {
		background-color: var(--brunswick-red);
		color: white;
		height: 200px;
		border: 2px solid var(--brunswick-red);
	}

	.youth-section-image-conatiner {
		max-width: 1200px;
		margin: 0px auto 60px auto;
		display: grid;
		grid-gap: 1rem;
	}

	.grid-image {
		object-fit: cover;
		width: 100%;
		height: 100%;
	}






	/*	footer */
	footer {
		min-height: 300px;
		width: 100%;	

	}

	.footer-container {
		margin: auto;
		max-width: 1200px;
		display: flex;
		flex-direction: row;		
		/*	padding: 20px 60px;*/
	}


	.footer-title {
		font-size: 18px;
		font-weight: 600;
		margin-bottom: 10px;
		
	}

	.social-container {
		display: flex;
		align-items: center;
		width: 160px;
		justify-content: space-between;
		margin-bottom: 30px;
		margin-top: 15px;
	}

	.footer-icon {
		
	}

	.footer-text {
		font-size: 16px;
		margin-bottom: 5px;
	}

	.footer-col1 {
		width: 550px;
		margin-bottom: 30px;
		margin-right: 30px;
	}

	.footer-col3 {
		height: 100%;
		width: 100%;		
	}

	.footer-col2 {
		margin-bottom: 20px;
		margin-right: 20px;
		min-width: 160px;
	}


		/*	footer dark */
		.footer--dark {
			min-height: 300px;
			width: 100%;	
	
		}
	
		.footer-container--dark {
			margin: auto;
			max-width: 1200px;
			display: flex;
			flex-direction: row;		
			/*	padding: 20px 60px;*/
		}
	
		.map--dark {
	
		}
	
		.footer-title--dark {
			font-size: 18px;
			font-weight: 600;
			margin-bottom: 10px;
			
		}
	
		.social-container--dark {
			display: flex;
			align-items: center;
			width: 160px;
			justify-content: space-between;
			margin-bottom: 30px;
			margin-top: 15px;
		}
	
		.footer-icon--dark {
			
		}
	
		.footer-text--dark {
			font-size: 16px;
			margin-bottom: 5px;
		}
	
		.footer-col1--dark {
			width: 550px;
			margin-bottom: 30px;
			margin-right: 30px;
		}
	
		.footer-col3--dark {
			height: 100%;
			width: 100%;		
		}
	
		.footer-col2--dark {
			margin-bottom: 20px;
			margin-right: 20px;
			min-width: 160px;
		}




	/* Meet the team	*/

	/* the board */
	.meet-the-team-image-conatiner--board {
		grid-template-columns: repeat(4, 1fr);
		max-width: 1200px;
			margin: 0 auto;
		display: grid;
		grid-gap: 2rem;
		/* background-color: aquamarine; */
		margin-bottom: 40px;
	}

	.meet-the-team-image-conatiner--vol{
		grid-template-columns: repeat(5, 1fr);
		max-width: 1200px;
		margin: 0 auto;
		display: grid;
		grid-gap: 2rem;
		/* background-color: aquamarine; */
		margin-bottom: 40px;
	}
	
	.meet-the-team-card__nameplate--single {
		background-color: var(--brunswick-red);
		height: 98px;
		width: 220px;
		border-radius: 5px;
		margin: 0;
		box-shadow: var(--shadow);
	}



	.meet-the-team-container {
		padding: 0px;
	}





	/*	Vol */
	.volunteer-side {
		width: 350px;
		height: 100%;
		background-color: white;
		box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, .2);
		min-width: 330px;
		margin: unset;
	}

	.volunteer-side__top {
		background-color: var(--brunswick-red);
		height: 60px;
		color: white;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 24px;
		font-weight: 600;
		
	}

	.volunteer-side_image-flex {
		display: flex;
		flex-direction: column;
		/* height: 100px; */
	}

	.volunteer-side__image {
		display: block;
		width: 50%;
		margin: 30px auto;
	}

	#nhs-logo {
		height: 80px;
		margin: 30px auto 10px auto;
	}


	.volunteer-side__main {
		padding: 10px;
		text-align: center;
	}

	.volunteer-side--mental {
		height: 150px;
	}


	.volunteer-container {
		display: flex;
		padding: 0px;
		margin-bottom: 30px;
	}


	.volunteer-main--noside {
		width: 100%;
		padding: 0px;
		margin-bottom: 0px auto 20px auto;
	}

	.volunteer-main {
		width: 100%;
		padding: 0px;
		margin-bottom: 20px;
		margin-right: 40px;
	}



		/* history */
		.history-top-section {	
			padding: 0px 0px;
			margin-bottom: 0px;
			display: flex;
			justify-content: space-between;	
		}
	
		.history-top-section__element {
			margin-bottom: 30px;		
			width: 50%;
		}
	
		.history-top-section__element:nth-child(1) {
			padding-right: 20px;
		}
	
		.history-top-section__element:nth-child(2) {
			padding-left: 20px;
		}
	
		.history-title {
			font-size: 24px;
			font-weight: 700;
			margin-bottom: 15px;
		}
	
		.history-bottom-section {
			width: 800px;
		}
	
		.history-header {
			font-size: 30px;
			font-weight: 700;
			text-align: center;
			margin-bottom: 40px;
		}
	
		.history-bottom-section__element {
			/* margin-bottom: 40px; */
		}

		.page-content--history {
			background-color: #F5F0F0;
		}
		
		.page-content--20padding {
			padding: 30px 15px 20px 15px;
		}

		.history-video {
			display: flex;
		justify-content: center;
		/*	background-color: grey;*/
		width: 100%;
		max-width: 800px;
		height: 100%;
		margin: 20px auto 20px auto;		
		}



		/* party card*/



.party-banner {
	background-image: url(/images/partybanner.png);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	height: 300px;
}

	.party-card {

		width: 350px;
			height: 350px;
			margin-left: 10px;
			margin-right: 10px;		 
	}
	
	.party-card-container {
	display: flex;
	}



		/* room cards */

		.room-image {
			width: 50%;
			height: 100%;
			object-fit: cover;
			margin-bottom: 10px;
			position: absolute;
			right: 0;
			top:0;
		}

		.party-card--room {
			margin: auto;
			width: 100%;
			max-width: 1000px;
			min-height: 300px;
			padding-bottom: 80px;
			background-color: white;
			margin-bottom: 30px;
			position: relative;
			border-radius: 5px;
			box-shadow: 0px 2px 8px 1px rgba(0, 0, 0, .2);
			overflow: hidden;
		}
	
		.party-card__top--room {
			width: 50%;
			padding: 15px;
			height: 60px;
			font-weight: 700;
			display: flex;
			justify-content: space-between;
			align-items: center;
			border-radius: 5px 0px 0px 0px;
		}
	
		.party-card__main-room {
			padding: 10px 20px;
			width: 50%;
		}
	
		.party-card__button--room {
			position: absolute;
			bottom: 25px;
			width: 50%;
		}
	
		.button-book--room {
			border-radius: 0px;
			text-align: center;
			border-radius: 5px;
			width: 200px;
			margin: auto;
		}
	
	
	
		.party-card__top--room--right {
			float: right;
			border-radius: 0px 5px 5px 0px;
		}
	
		.party-card__main-room--right {
			position: absolute;
			right: 0;
			top: 60px;
		}
	
		.room-image--right {
			left: 0;
		}
	
		.party-card__button--room--right {
			right: 0;
		}



			/*	home */

	.home-video {
		display: flex;
		justify-content: center;
/*		background-color: grey;*/
		width: 400px;
		height: 300px;
		margin-bottom: 30px;
	}

	.home-intro {
		margin-bottom: 40px;
	}

	.home-intro__title {
		text-align: center;
		font-size: 22px;
		font-weight: 600;
		margin-bottom: 15px;
	}

	.home-intro__body {
		text-align: center;
		font-size: 18px;	
		max-width: 870px;
		margin: auto;
	}

	.page-content--home {
		margin-left: 15px;
		margin-right: 15px;
	}

	.home-facilities__title {
		text-align: center;
		font-size: 22px;
		font-weight: 600;
		margin-bottom: 15px;
	}

	.button--home {

		background-color: var(--brunswick-red);
		border: none;
		border-radius: 5px;
		color: white;
		padding: 12px 36px;
		font-size: 18px;
		text-align: center;
		width: 170px;
		margin: auto;

	}

	.home-facilities__card {
		padding: 20px;
    height: 170px;
    max-width: 600px;
    width: 250px;
    flex-shrink: 1;
    margin: auto;
    margin-bottom: 30px;
	box-shadow: var(--shadow);
	display: flex;
	flex-direction: column;
    justify-content: space-between;

	}

	.home-facilities__card__title {
		text-align: center;
		font-size: 18px;
		font-weight: 600;
		margin-bottom: 30px;	
	}

	.home-funders {
		height: 250px;

		background-color: #E9E4E4;
		color: black;
		padding: 30px 15px 15px 15px;
		width: 100%;
		margin-bottom: 0px;

	}

	.home-funders__title {
		text-align: center;
		font-size: 22px;
		font-weight: 600;
		margin-bottom: 15px;
	}

	.home-donate {
		text-align: center;
	}

	.home-donate__title {
		text-align: center;
		font-size: 22px;
		font-weight: 600;
		margin-bottom: 15px;
	}

	.glider-item {
		background-color: white;
		height: 50px;
		width: 100px;
		margin: 10px;
	}



	#fiddle-wrapper {
		padding: 1em;
		margin: 1em;

		width: 400px;
		height: 400px;
		outline: 1px dashed red;
	}

	.placeholder {
		width: 60px;
		height: 200px;
		/*  border: 4px solid blue;*/
		text-align: center;
/*		padding: 1em;*/
		display: flex;

	}
	.home-logo {
		height: 120px;
		width: 150px;
		object-fit: contain;
		margin: 0px 25px;
	}

.home-facilities__card__container {
	display: grid;
	justify-content: space-between;
	max-width: 800px;
	margin: auto;

	gap: 20px 20px;
	grid-template-columns: repeat(3, 1fr);
	/* this is the same as grid-template-rows: 300px 300px; */
	grid-template-rows: repeat(2, 170px);
}


.flex {
	display: flex;
    width: 400px;
    margin: auto;
    flex-direction: row;
    height: 60px;
    flex-grow: 0;
}

.flex .button {
	height: 60px;
	width: 300px;
	margin-left: 5px;
	margin-right: 5px;
}

.button--centre {
	display: flex;
	justify-content: center;
	margin: auto;	
}


/* covid */
.covid-section__image-container {
	margin: auto;
	max-width: 800px;
	display: grid; 
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: repeat(1, 1fr);
	gap: 10px;
}

.covid-section__image {
	width: 100%;
	height: 200px;
	background-color: mediumseagreen;
	margin-bottom: 10px;
	object-fit: cover;
}

.covid-section-text--right {
	/* height: 200px; */
	margin-left: 20px;
	width: 70%;
}

.covid-section__left-right {
	display: flex;
	flex-direction: row;
	max-width: 800px;
	margin: auto;	
	/* background-color: coral; */
}

.covid-section__image--left {
	margin-right: 20px;
	width: 45%;
	min-width: 220px;
	/* background-color: darkorange; */
	height: 310px;
	margin-bottom: 0px;
	margin: auto;
	height: 220px;
	
}

.covid-section__image--left--video {
	min-width: 100px;
	width: 200px ;
	height: 350px;
}


.volunteer-names-grid {
	max-width: 600px;
	margin: 30px auto;
	width: 100%;
	display: grid;
	grid-auto-rows: auto;
	grid-template-columns: repeat(4, minmax(100px, 1fr));
	grid-gap: 10px;
	color: white;
}




}

@media all and (max-width : 435px) {
	div.game {
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: repeat(2, 1fr);
		gap: 10px;
	}
}	

@media all and (max-width : 485px) {
	.home-logo {
		margin: 0px 5px;
	}



	.promo-banner {
		height: 100px;
		width: 100%;
		background-color: #1E1C1A;
		display: flex;
		justify-content: center;
	}
	
	.promo-banner__inner {
		width: 100%;
		max-width: 1200px;
		display: flex;
	}
	
	.promo-banner__image {
		
	}

	.promo-banner__image--kabin {
		
	}
	
	.promo-banner__text {
		
	}
	
	.promo-banner__sub {
		color: #B6B6A4;
		font-size: 16px;
    line-height: 120%;
    margin-top: 5px;
	}
	
	.promo-banner__text__wrap {
		display: flex;
		justify-content: center;
		flex-direction: column;
	}
	
	.promo-banner__title {
		font-size: 18px;
		line-height: 120%;
	}
	
	.promo-banner__text {
		color: white;
		font-size: 18px;
	}
	
	.promo-banner__button {
		background-color: orangered;
		border: none;
		border-radius: 5px;
		color: white;
		font-size: 16px;
		cursor: pointer;
		width: 150px;
		height: 40px;
		bottom: 10px;
		display: flex;
		justify-content: center;
		align-items: center;
		margin: auto;
		padding: 0px;
	}



}





@media all and (max-width : 1000px) {
	/* Meet the team	*/

	/* the board */
	.meet-the-team-image-conatiner--board {
		grid-template-columns: repeat(3, 1fr);
		margin: 0 auto 90px auto;
	}

	.meet-the-team-image-conatiner--vol {
		/* grid-template-columns: repeat(3, 1fr); */
		margin: 0 auto 90px auto;
	}
	
}

@media all and (max-width : 745px) {
	/* Meet the team	*/

	/* the board */
	.meet-the-team-image-conatiner--board {
		grid-template-columns: repeat(2, 1fr);
			margin: 0 auto;
	}

	.meet-the-team-image-conatiner--vol {
		grid-template-columns: repeat(3, 1fr);
		margin: 0 auto 90px auto;
	}
	
}

@media all and (max-width : 490px) {
	/* Meet the team	*/

	/* the board */
	.meet-the-team-image-conatiner--board {
		grid-template-columns: repeat(1, 1fr);
	}

	.meet-the-team-image-conatiner--vol {
		grid-template-columns: repeat(2, 1fr);
		margin: 0 auto 90px auto;
	}

	.meet-the-team-card__nameplate--single {
		background-color: var(--brunswick-red);
		height: 98px;
		width: 220px;
		border-radius: 5px;
		margin: auto;
		box-shadow: var(--shadow);
	}
	
}