header#site-header{
	background:transparent
}
#hero{
	color:white;
	height:568px;
	display:flex;
	flex-direction:column;
	justify-content:flex-end;
	margin-top:-190px;
	overflow:hidden;
	padding:0 2rem 5rem;
	position:relative
}
@media screen and (min-width: 766px) and (min-height: 700px){
	#hero{
		padding:0 5rem 9rem
}
}
@media screen and (min-width: 766px) and (min-height: 700px){
	#hero{
		height:920px
}
}
@media screen and (min-width: 766px) and (min-height: 920px){
	#hero{
		height:100vh
}
}
#hero .bg{
	background-position:center;
	background-repeat:no-repeat;
	background-size:cover;
	display:flex;
	flex-direction:column;
	justify-content:flex-end;
	padding:0 2rem 9rem;
	position:absolute;
	width:100%;
	height:100%;
	z-index:0;
	left:0;
	top:0
}
@media screen and (min-width: 766px) and (min-height: 700px){
	#hero .bg{
		padding:0 2rem 18rem
}
}
@media screen and (min-width: 1022px) and (min-height: 700px){
	#hero .bg{
		padding:0 7rem 18rem
}
}
.horseman {
    	background: url(/uploads/horseBannerTop.jpg);
        background-size: cover !important;
        background-position: center;
        background-repeat: no-repeat !important;
        padding: 0px !important;
    }
	#horseDonateLink {
    	text-decoration: none;
        color: #fff;
        transition: .2s;
    }
    #horseDonateLink:hover {
    	cursor: pointer;
        transform: scale(1.05);
        transition: .2s;
    }
    #horseFooter {
    	display: block;
        margin-left: auto;
        margin-right: 0px;
        width: 50%;
        height: auto;
    }
    #horseOverlay {
    	box-sizing: border-box;
    	display: flex;
        align-items: center;
        justify-content: center;
    	background: rgba(20, 132,209,.8);
        width: fit-content;
        height: 130%;
        margin: 0px;
        margin-left: auto;
        margin-right: 0px;
        padding: 25px;
        color: #fff;
        font-weight: 300;
    }
    #horsedonateText {
    	font-size: 50%;
        font-weight: 900;
    }
    @media only screen and (max-width: 765px) {
    	#horseOverlay {
        	height: fit-content;
            width: 100%;
            margin-left: 0px;
            margin-right: 0px;
            margin-top: auto;
            margin-bottom: 0px;
            font-size: 50%;
            line-height: 1;
        }
        #horseOverlay br {
        	display: none;
        }
    }	
	.syvel {
    	background: url("/img/home_feels_like_home.jpg");
        background-size: contain !important;
        background-position: center;
        background-repeat: no-repeat !important;
        padding: 0px !important;
	background-color: #385163;
    }
	#syvelDonateLink {
    	text-decoration: none;
        color: #fff;
        transition: .2s;
    }
    #syvelDonateLink:hover {
    	cursor: pointer;
        transform: scale(1.05);
        transition: .2s;
    }
    #syvelFooter {
    	display: block;
        margin-left: auto;
        margin-right: 0px;
        width: 50%;
        height: auto;
    }
    #syvelOverlay {
    	box-sizing: border-box;
    	display: flex;
        align-items: center;
        justify-content: center;
    	background: rgba(20, 132,209,.8);
        width: fit-content;
        height: 130%;
        margin: 0px;
        margin-left: auto;
        margin-right: 0px;
        padding: 25px;
        color: #fff;
        font-weight: 300;
    }
    #syveldonateText {
    	font-size: 50%;
        font-weight: 900;
    }
    @media only screen and (max-width: 765px) {
    	#syvelOverlay {
        	height: fit-content;
            width: 100%;
            margin-left: 0px;
            margin-right: 0px;
            margin-top: auto;
            margin-bottom: 0px;
            font-size: 50%;
            line-height: 1;
        }
        #syvelOverlay br {
        	display: none;
        }
    }	
#hero .bg.swim{
	background-image:url("/img/home_swimming.jpg");
	z-index:1
}
#hero .bg.climb{
	background-image:url("/img/home_climbing.jpg");
	z-index:1
}
#hero .bg.sing{
	background-image:url("/img/home_singing.jpg");
	z-index:1
}
#hero .bg.raft{
	background-image:url("/img/home_rafting.jpg");
	z-index:1
}
#hero h1,#hero h2{
	z-index:100
}
@media screen and (min-width: 1420px) and (min-height: 700px){
	#hero h1,#hero h2{
		width:1280px;
		margin-left:auto;
		margin-right:auto
}
}
#hero h1#tagline em,#hero h1#tagline i,#hero h1#tagline strong{
	font-family:poppins,sans-serif;
	font-weight:700;
	font-style:normal;
	display:block
}
#hero h1#tagline{
	font-size:3rem;
	line-height:4rem;
	margin-bottom:3rem
}
@media screen and (min-width: 1022px) and (max-height: 700px){
	#hero h1#tagline{
		margin-left:5rem
}
}
@media screen and (min-width: 1420px) and (max-height: 700px){
	#hero h1#tagline{
		margin-left:auto;
		margin-right:auto;
		width:1280px
}
}
#hero h1#tagline em i{
	font-size:3rem;
	line-height:4rem
}
#hero h1#tagline strong{
	font-size:4rem;
	line-height:5rem;
	margin-left:0;
	margin-top:2rem
}
@media screen and (min-width: 694px) and (min-height: 700px){
	#hero{
		font-size:5.6rem;
		line-height:6rem
}
}
@media screen and (min-width: 766px) and (min-height: 700px){
	#hero h1#tagline em,#hero h1#tagline strong{
		font-size:8rem;
		line-height:9.6rem
}
	#hero h1#tagline em i{
		font-size:7.5rem;
		line-height:9rem
}
	#hero h1#tagline strong{
		margin-left:4rem;
		margin-top:5rem
}
	#hero h1#tagline strong i{
		font-size:9.5rem;
		line-height:11.4rem
}
}
@media screen and (min-width: 1022px) and (min-height: 700px){
	#hero h1#tagline strong{
		margin-left:8rem
}
}
#hero #video-trigger{
	font-family:poppins,sans-serif;
	font-weight:600;
	font-style:normal;
	background:transparent;
	border:none;
	color:white;
	font-size:2rem;
	line-height:2.5rem;
	margin-left:0;
	margin-top:0;
	min-width:100%;
	padding:0;
	text-align:left;
	text-decoration:none;
	z-index:100
}
#hero #video-trigger:hover{
	cursor:pointer
}
#hero #video-trigger:focus{
	outline:none
}
#hero #video-trigger::before{
	background-image:url("/img/icon_play.svg");
	background-position:center;
	background-repeat:no-repeat;
	background-size:2rem 2rem;
	display:inline-block;
	height:2rem;
	width:2rem;
	content:"";
	padding-right:1rem;
	position:relative;
	top:0.3rem
}
@media screen and (min-width: 766px) and (min-height: 700px){
	#hero #video-trigger{
		font-size:3.5rem;
		line-height:4rem;
		margin-left:4rem;
		margin-top:3rem
}
	#hero #video-trigger::before{
		background-size:6rem 6rem;
		height:6rem;
		padding-right:2rem;
		top:1.8rem;
		width:6rem
}
}
@media screen and (min-width: 1022px) and (max-height: 700px){
	#hero #video-trigger{
		margin-left:5rem
}
}
@media screen and (min-width: 1022px) and (min-height: 700px){
	#hero #video-trigger{
		margin-left:11rem
}
}
@media screen and (min-width: 1420px){
	#hero #video-trigger{
		display:block;
		min-width:auto;
		width:1280px;
		margin-left:auto;
		margin-right:auto
}
}
#featured-about h1{
	font-family:poppins,sans-serif;
	font-weight:400;
	font-style:normal;
	font-size:3rem;
	letter-spacing:.225rem;
	line-height:3rem;
	text-transform:uppercase
}
#featured-about h1 strong{
	font-family:poppins,sans-serif;
	font-weight:700;
	font-style:normal;
	display:block;
	font-size:6.2rem;
	line-height:6.2rem;
	margin:1.6rem 0
}
@media screen and (min-width: 1022px) and (max-width: 1150px){
	#featured-about .text{
		padding:1rem
}
	#featured-about .text h1 strong{
		margin:0
}
}
#featured.col-3{
	margin-top:7rem
}
#featured.col-3 .btn{
	padding:1rem 0.5rem;
	min-width:15rem
}
#featured.col-3 .featured-callout{
	font-size:1.8rem;
	letter-spacing:.135rem;
	line-height:1.8rem;
	text-transform:uppercase;
	background:url("/img/arr_up.svg") no-repeat top center;
	margin:3rem 0;
	padding-top:30px;
	width:100%
}
#featured.col-3 .featured-callout i{
	display:block;
	padding-bottom:1rem
}
#featured.col-3 .featured-callout span{
	display:block;
	margin:0 auto;
	text-align:left;
	text-indent:-9999px;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center
}
@media screen and (min-width: 766px) and (max-width: 1420px){
	#featured.col-3{
		grid-template-columns:1fr
}
	#featured.col-3 .col-1{
		grid-template-columns:4fr 6fr
}
	#featured.col-3 .col-1.even{
		grid-template-columns:5fr 4fr
}
	#featured.col-3 .col-1.even .bg-img{
		grid-column-start:2;
		grid-row-start:1
}
	#featured.col-3 .featured-callout{
		background:none;
		margin-top:0;
		padding-top:0
}
}
@media screen and (min-width: 1022px){
	#featured.col-3 .text,#featured.col-3 .bg-img{
		height:calc((1022px - 4rem ) * .4)
}
}
@media screen and (min-width: 1280px){
	#featured.col-3 .text,#featured.col-3 .bg-img{
		height:calc((1022px - 4rem ) / 2)
}
}
@media screen and (min-width: 1420px){
	#featured.col-3 .text,#featured.col-3 .bg-img{
		height:calc((1280px - 14rem) / 2.5)
}
}
@media screen and (min-width: 1421px){
	.cssgrid #featured.col-3 .text{
		padding-top:1rem
}
	.cssgrid #featured.col-3 .even .text{
		padding-bottom:0;
		padding-top:4rem
}
	.cssgrid #featured.col-3 .even .featured-callout{
		background-image:url("/img/arr_dn.svg");
		background-position:center bottom;
		background-repeat:no-repeat;
		padding-bottom:30px;
		margin-top:0
}
	.cssgrid #featured.col-3 .even .text{
		flex-flow:column-reverse
}
}
#featured-about .btn{
	padding:1rem 0.5rem
}
#featured-program .featured-callout span{
	width:136px;
	height:58px;
	background-image:url("/img/featured_program.svg")
}
#featured-camp .featured-callout span{
	width:120px;
	height:55px;
	background-image:url("/img/featured_camp.svg")
}
#featured-event .featured-callout span{
	width:112px;
	height:52px;
	background-image:url("/img/featured_event.svg")
}
#calendar{
	margin-top:7rem
}
#calendar .btn{
	padding:1rem 0.5rem
}
#calendar .bg-img{
	grid-column-start:2;
	grid-column-end:3;
	grid-row-start:1;
	grid-row-end:2
}
#calendar .text{
	grid-column-start:1;
	grid-column-end:2;
	grid-row-start:1;
	grid-row-end:2
}
#calendar #icon-calendar{
	width:110px;
	height:90px;
	margin-bottom:2.4rem
}
@media screen and (min-width: 1280px){
	#calendar #icon-calendar{
		width:185px;
		height:171px
}
}
#get-involved{
	color:white;
	margin-top:7rem
}
#get-involved .btn{
	padding:1rem 0.5rem
}
#get-involved section{
	padding:4rem
}
#get-involved h1{
	font-size:1.8rem;
	letter-spacing:.135rem;
	line-height:1.8rem;
	text-transform:uppercase;
	margin-bottom:1.4rem
}
#get-involved h1 strong{
	font-family:poppins,sans-serif;
	font-weight:700;
	font-style:normal;
	font-size:3.2rem;
	letter-spacing:.24rem;
	line-height:3.2rem;
	text-transform:uppercase;
	margin:0 !important
}
@media screen and (max-width: 1022px){
	.col-3#get-involved{
		grid-template-columns:1fr
}
}