@charset "utf-8";
/* CSS Document */

/* RESET */

html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, address, img, ul, li, form, label, caption, article, aside, canvas, details, embed, figure, figcaption, footer, header, nav, section, summary, time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}                  
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display:block;
}
body { 
  font:.8em sans-serif; 
  *font-size:small;
  color:#fff; 
}
a { 
  margin:0; 
  padding:0; 
  font-size:100%; 
  vertical-align:baseline; 
  background:transparent;
  text-decoration:none;
  outline:none;
}
h1, h2, h3, h4, h5, h6 { 
  font-weight:bold;
}
ul {
  list-style:none;
  width:100%;
}

/* END RESET */

/* Common Styles */

.bold {
  font-weight:bold;
}
.italic {
  font-style:italic;
} 
.underline {
	text-decoration:underline;
}
.uppercase {
  text-transform:uppercase;
}
.left {
  float:left;
}
.right {
  float:right;
}
.clear {
  clear:both;
}
.alignleft {
	text-align:left;
}
.center {
	text-align:center;
}
.inline li {
  display:inline;
}
.overflow {
  overflow:hidden;
}
.relative {
  position:relative;
}
.absolute {
  position:absolute;
}
p {
	margin-bottom:15px;
}

/* Fonts */

@font-face {
  font-family:'merriweather'; 
  src:local('?'), url('../fonts/merriweather.ttf') format("truetype");
}

/* Unique styles */
* {
	z-index:2;
}
img {
	width:100%;
}
.fullHeight {
	position:relative;
	height:100vh;
}
.signup {
	background:#ff0000;
	padding:50px 50px 40px 50px;
	color:#fff;
	text-align:center;
}
.red {
	padding:25px;
	font-size:2em;
	line-height:1.5;
	background-color:#6b1005;
}
.row {
	position:relative;
	top:25px;
	width:100%;
  display:-webkit-box;
  display:-ms-flexbox;
  display:-webkit-flexbox;
  display:flex;
  flex-wrap:wrap;
}
.textSide {
	width:40%;
} 
.imageSide {
	width:50%;
} 
.grayBG {
	background-color:#f3f3f2;
}
#logo {
	width:15%;
	margin:auto;
}
#logo img {
	position:absolute;
	top:25px;
	left:25px;
	width:100px;
}
#intro {
	position:relative;
	overflow:hidden;
	background:url('../videos/coverBackup.jpg');
	background-size:100% auto;
}
#intro video {
	width:100%;
}
#videoCover {
	position:absolute;
	top:0;
	left:0;
}
#blackBG {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.4);
}
#intro h2 {
	position:absolute;
	right:25px;
	bottom:25px;
	font-size:2rem;
}
#mainContent {
	background:#fff;
	color:#000;
}
#mainContent section {
	position:relative;
	padding:5% 15%;
}
#mainContent section div {
	display:table-cell;
	vertical-align:middle;
}
#retreat h2, #camaraderie h2, #community h2 {
	margin-bottom:25px;
}
#retreat {
	padding:75px 20% 0 20%;
	font-size:1.6rem;
}
#retreat h1, #retreat h2 {
	text-align:center;
}
#retreat h1 {
	color:#6b1005;
	font-weight:100;
	font-size:1.5em;
	padding-bottom:20px;
}
#retreat h2 {
	font-weight:bold;
}
#retreat p {
	font-size:0.7em;
}
#camaraderie h2, #community h2, #sponsors h2 {
	font-size:1.3em;
}
#camaraderie .textSide {
	padding-left:5%
}
#community .textSide {
	padding-right:9%;
}
#community {
	background:#fff;
}
#parallaxContainer {
	background-image:url(../images/banner.jpg);
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
	background-attachment:fixed;
}
.collapsible {
  background-color:#eee;
  color:#000;
  cursor:pointer;
  padding:18px;
  width:100%;
  border:none;
  text-align:left;
  outline:none;
  font-size:15px;
}
.collapsibleActive, .collapsible:hover {
  background-color:#ccc;
}
.collapsible:after {
	position:relative;
  content:'\002B'; /* Unicode character for "plus" sign (+) */
  font-size:21px;
  color:#000;
  float:right;
  margin-top:-7px;
  top:3px;
  margin-left:5px;
}
.collapsibleActive:after {
  content:"\2212"; /* Unicode character for "minus" sign (-) */
}
#mainContent section div.collapsibleContent {
  display:block;
  padding:0 15%;
  overflow:hidden;
  background-color:#fff;
  max-height:0;
  transition:max-height 0.2s ease-out;
}
.collapsibleContent p:first-child {
	padding-top:30px;
}
.collapsibleContent hr {
	margin:60px 0 30px 0;
}
#sponsors h2 {
	padding-bottom:30px;
}
#sponsors div {
	padding-right:30px;
}
footer {
	width:100%;
	min-height:50px;
	background:#000;
	color:#fff;
	text-align:center;
	padding:25px 0 15px 0;
	font-size:1em;
	line-height:0;
}
footer a, footer a:hover {
	color:#fff;
}
footer div {
	position:relative;
	top:-15px;
	display:inline-block;
	margin-right:5%;
	width:15%;
}
footer img {
	position:relative;
	max-width:60px;
	top:18px;
}
#social img, .site-menu__footer img {
	width:30px;
}
.facebook {
	top:8px;
	padding-right:10px;
}
.instagram {
	top:10px;
}
footer div:nth-child(2), footer div:nth-child(3) {
	width:auto;
}
#mainContent section div.mobileShow {
	display:none;
}

@media screen and (width:800px) {
	#intro video {
		width:auto;
		height:100%;
	}
}
@media screen and (width:1024px) {
	#intro video {
		width:auto;
		height:100%;
	}
}
@media screen and (width:1280px) {
	#intro video {
		width:auto;
		height:100%;
	}
}
@media screen and (min-width:768px) {
	#parallaxContainer {
		height:265.5px;
	}
}
@media screen and (min-width:1200px) {
	#parallaxContainer {
		height:427.5px;
	}
}
@media screen and (max-width:799px) {
	html, body {
		overflow-x:hidden;
	}
	.fullHeight {
		height:auto;
		min-height:100vh;
	}
	.center p {
		text-align:left;
	}
	#mainContent section div.mobileShow {
		display:block;
	}
	#mainContent section div.mobileHide {
		display:none;
	}
	#logo {
		width:40%;
	}
	#logo img {
		top:5px;
		left:5px;
		width:60px;
	}
	#logo h1 {
		display:none;
	}
	#intro, #mission, #camaraderie {
		background-size:auto 100%;
	}
	#intro video {
    position:absolute;
    top:0;
    left:-100%;
    width:200%;
    height:100%;
    box-sizing:border-box;
    object-fit:cover;
    object-position:left;
	}
	#intro h2 {
		right:10px;
		bottom:10px;
		font-size:0.9rem;
	}
	#mainContent section {
		padding:5%;
	}
	#mainContent section div {
		display:block;
	}
	.left, .right, .imageSide, .textSide {
		position:relative;
		width:100% !important;
	}
	.imageSide {
		display:none;
	}
	.left, .right {
		float:none;
	}
	.right p, .textSide p {
		width:96%;
		padding-left:2%;
	}
	#retreat {
		margin-bottom:0;
	}
	#retreat .right {
		padding-right:0;
	}
	#camaraderie .textSide {
		padding-left:0;
	}
	.collapsibleContent hr {
		margin:30px 0;
	}
	#sponsors div {
		padding-right:0;
	}
	#sponsors img {
		width:50%;
		margin-bottom:30px;
	}
	#sponsors img.imgAdjust {
		width:70%;
	}
	footer {
		line-height:4;
	}
	footer div {
		width:100% !important;
	}
	footer img {
		top:7px;
	}
}

@media screen and (min-width:800px) and (max-width:1919px) {
	#testimonials {
		margin-top:10%;
	}
	#intro, #mission, #camaraderie {
		background-size:100% auto;
	}
	#activities {
		width:400px;
		margin:auto;
	}
	#testimonials div:nth-child(3) {
    bottom:10%;
	}
	#retreat h2, #mission h2, #camaraderie h2 {
		font-size:1.9rem;
	}
	.red {
		font-size:1.6em;
	}
	footer {
		font-size:1.1em;
	}
}

@media screen and (min-width:800px) and (max-width:1280px) {
	#retreat h2, #mission h2, #camaraderie h2 {
		font-size:1.8rem;
	}
	.red {
		font-size:1.5em;
	}
	footer {
		font-size:1em;
	}
}

@media screen and (min-width:800px) and (max-width:1024px) {
	#testimonials {
		margin:5% 0 10% 0;
	}
	#intro h2 {
		font-size:2rem;
	}
	#retreat {
		margin-bottom:10px;
	}
	#testimonials div:nth-child(3) {
    bottom:5%;
	}
	#retreat h2, #mission h2, #camaraderie h2 {
		font-size:1.8rem;
	}
	.red {
		font-size:1.5em;
	}
	footer {
		font-size:1em;
	}
}

@media screen and (width:800px) {
	#mainContent .fullHeight {
		height:90vh;
	}
	#testimonials {
		margin:10% 0 53% 0;
	}
	#activities {
		width:400px;
		margin:auto;
	}
	#testimonials div:nth-child(3) {
    bottom:-45%;
	}
	#retreat {
		font-size:1.2rem;
	}
	#retreat, 
	#retreat h2, #mission h2, #camaraderie h2 {
		font-size:1.1rem;
	}
	.red {
		font-size:1em;
	}
	.copyBreak h1 {
		font-size:1.4em;
	}
	footer {
		font-size:1em;
	}
	footer div {
		width:25%;
	}
}


@media screen and (-webkit-min-device-pixel-ratio:0) { 
  ::i-block-chrome,.iframeWrapper {
		position:relative;
		width:98%;
		height:0;
		margin:auto;
		padding-bottom:48.25%;
		box-shadow:0 0 40px 20px #b51700;
	}
	::i-block-chrome,iframe {
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
	}
}


#photos {
  width:90%;
  flex-direction:column;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:5% 0 5% 0;
	box-shadow:0 0 40px 20px #b51700;
	margin:0 auto 0 auto;
}
.gallery {
  display:grid;
  width:90%;
  grid-template-columns:repeat(4, 1fr);
  grid-gap:10px;
}
.gallery__item {
  cursor:pointer;
  overflow:hidden;
  border-radius:4px;
}
.gallery__item img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:0.3s ease-in-out;
}
.gallery__item img:hover {
    transform:scale(1.1);
}
@media (max-width:950px) {
  .gallery {
      grid-template-columns:repeat(2, 1fr);
  }
}
@media (max-width:550px) {
  .gallery {
      grid-template-columns:repeat(1, 1fr);
  }
}
.modal {
  width:100%;
  height:101%;
  position:fixed;
  top:0;
  display:flex;
  justify-content:center;
  align-items:center;
  background-color:rgba(0, 0, 0, 1);
  margin-top:-1px;
  animation:zoom 0.3s ease-in-out;
  z-index:999;
}
@keyframes zoom {
  from {
      transform:scale(0);
  }
  to {
      transform:scale(1);
  }
}
.modal img {
  width:50%;
  object-fit:cover;
}
.closeBtn {
  color:rgba(255, 255, 255, 0.87);
  font-size:25px;
  position:absolute;
  top:0;
  right:0;
  margin:20px;
  cursor:pointer;
  transition:0.2s ease-in-out;
}
.closeBtn:hover {
  color:rgb(255, 255, 255);
}
.nextBtn, .prevBtn {
	position:absolute;
	color:rgba(255, 255, 255, 0.87);
	font-size:25px;
}
.nextBtn:hover, .prevBtn:hover {
	color:rgb(255, 255, 255);
}
.nextBtn {
	right:15%;
}
.prevBtn {
	left:15%;
}

@media screen and (max-width:799px) {
	#photos {
		margin:0 auto 50px auto;
	}
	.modal img {
	  width:75%;
	  object-fit:cover;
	}
	#testimonials.fullHeight {
		height:auto;
	}
}