@media only screen and (min-width: 1800px) {
	:root{
		--gap: 20px;
		--padding-v:120px;
		--padding-w:80px;
	}
	.card {
		aspect-ratio: unset;
		min-height: 45vw;
	}
	.card h2 {
    margin-bottom: 40px;
}
	.card .text {
		max-width: 600px;
	}
	.banner, #footer{
		min-height:600px;
	}
	section.centered-text .writeup {
		max-width: unset;
	}
	section.inline_video iframe{

	max-width: 1100px;

}
	.warning{
		margin-top:60px;
	}
	.ride-node .info h6 {
        font-size: 35px;
        line-height: 40px;
    }
	.rides-nodes
	.container{
		max-width: unset;
	}

	section.bullet_points .bullets{
		max-width: unset;
	}

	section.centered-text .portraits .title{
		font-size:25px;
		line-height:35px;
	}
	section.bullet_points p {
    font-size: 19px;
    line-height: 25px;
}
	.button{
		padding:20px 50px;
	font-size:22px;
	}
	section.bullet_points .bullets .bullet{
		padding:20px;
	}

	section.bullet_points .bullet p {
    font-size: 18px;
    line-height: 25px;
}
	#page form {
    max-width: 1200px;
}
}

@media only screen and (min-width: 1600px) {
	section.centered-text h2 {
		max-width: unset;
	}
	.container {
    max-width: 1400px;
}

	    section.centered-text .container {
        max-width: 1200px;
    }
}

@media only screen and (max-width: 1400px) {
#masthead #logo {
		width: 150px;
		height: 130px;
	}
	#masthead ul li a {
		padding: 10px 16px;
		font-size: 14px;
	}
}
@media only screen and (max-width: 1200px) {


	#masthead.scrolled{
		width:calc(100% - 40px);
		margin:0 20px;
	}


	.card {
		aspect-ratio: unset;
	}

	section.text-only .text .left{
		flex:1 0 300px;
	}
}



@media only screen and (max-width: 1024px) {


	:root {

		--element-gap: 30px;
		--padding-w: 40px;
		--gutter: 30px;
	}

	#menu ul li a {

		font-size: 30px;
		line-height: 40px;
		padding: 10px 0px;
	}

	#masthead #main-menu {
		display: none;
	}

	#masthead #menu-btn {
		display: block;
		right: 20px;
		top: 22px;
	}

	#masthead.scrolled #menu-btn {

		top: 20px;
	}
	section.overlay_panel .card {
    max-width: 400px;
	}
	#masthead.scrolled {

		padding-top: 5px;
		padding-bottom: 5px;
	}

	#masthead.scrolled #logo {
		width: 100px;
		margin-left: 10px;
		height: 56px;
		background: url('../images/logo.webp') left top no-repeat;
		margin-top: 0px;
		background-size: contain;
	}

	#masthead .button {
		margin-top: 8px;
	}

	#masthead.scrolled .button {
		margin-top: 6px;
	}

	#page {
		padding-top: 60px;
	}

	.button {
		min-width: unset;
	}

	#masthead.scrolled {
		width: calc(100% - 60px);
		margin: 0 30px;
		border-radius: 40px;
		top: 20px
	}
	section.three_text_columns .columns{
		grid-template-columns: 1fr 1fr;
	}

	section.three_text_columns .column{
		padding: 30px;
	}
	#masthead.scrolled.hidden {
		top: 0;
	}
	section.three_text_columns .column:last-child {
        grid-column: 1 / -1;
    }
	.banner {
		min-height: 300px;
	}

	#footer .left {
		flex: 0 1 calc(100% - 200px);
	}

	#footer .right {
		flex: 1 0 200px;
	}

	.home .banner {
		min-height: calc(100vh - 60px - var(--gap));
	}

	section.centered-text .portraits .media .title {
		font-size: 17px;
	}

	section.centered-text h2 {
		margin: 10px auto 0 auto;
	}

	.card .icon {
		top: 20px;
		right: 20px;
	}
	.marquee .marquee-content{
		font-size: 18px;
		line-height: 23px;
		}
	.card.text-type {
		padding-top: 80px;
		padding-bottom:80px;
	}
	section.schedule .container{

	grid-template-columns: 1fr ;
}
	.rides-grid,
	.suggestions-grid{
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	section.three_cards .card {}

	section.three_cards {
		grid-template-columns: 1fr 1fr;
	}

	section.three_cards .card.video-type,
	section.three_cards .card.image-type {
		order: -1;
		min-height:35vw;
		aspect-ratio: unset;
	}

	section.three_cards .card.text-type {
		grid-column: 1 / -1;
        justify-content: center;
	}
	section.bullet_points .bullets {
    margin: 30px auto;
	}
	iframe.video.landscape {
		height: 100%;
		width: 130%;
	}
	section.three_cards iframe.video{

    min-height: 120vh;
	}
	.two_cards .card.video-type, .two_cards .card.image-type{
		min-height:35vw;
	}
	section.text-only .text .left{
		flex:1 0 250px;
	}
	.two_cards {
		grid-template-columns: 1fr 1fr;
	}

	.two_cards .card.image-type,
	.two_cards .card.video-type {
		grid-column: span 1;
	}

	section.bullet_points .bullets {
		display: block;
	}
	.event .info .place{
		font-size:17px;
		padding-right:50px;
	}
	section.bullet_points .bullets .bullet {
		margin-bottom: 10px;
	}
	#filter .filter-button{
		font-size:16px;
		line-height:20px;
	}
	#filter{
		margin-bottom:30px;
	}
	.banner.compact{
		min-height:140px;
	}
	#page form .gform_body, section.form{
		padding:40px 20px;
	}
	.card.text-type{

    min-width: unset;
	}
	section.two_text_columns .columns{
		grid-template-columns: 1fr 1fr;
	}
}


@media only screen and (max-width: 768px) {
	:root {
		--gap: 10px;
		--gutter: 20px;
		--padding-w: 30px;
		--padding-v:60px;
	}
	.wca-popup-content{
		gap:10px;
	}

	.schedule .head{
		padding-bottom:20px;
	}
	section.text-only .text{
		display: block;
	}
	section.text-only .text .left{
		margin-bottom:20px;
	}
	section.overlay_panel .card {
		max-width: 50%;
	}

	#masthead.scrolled {
		width: calc(100% - 40px);
		margin: 0 20px;

	}
	section.two_text_columns .columns{
		grid-template-columns: 1fr ;
	}
	#masthead.scrolled #menu-btn {
		top: 16px;
	}

	#masthead.scrolled .button {
		margin-top: 6px;
	}

	#masthead.scrolled #logo {
		width: 90px;
		height: 47px;
	}

	#masthead.scrolled .button {
		display: block;
		margin-left: var(--gap);
		padding: 10px 20px;
		font-size: 14px;
	}
	.ride-node .info h6 {

    margin: 6px 0 0 0;
    font-size: 17px;
}


	#menu {
		width: 90%;
		right: -90%;
	}

	#masthead .button {}

	.warning {
		font-size: 16px;
	}

	#footer .left {
		flex: 0 1 calc(100% - 150px);
	}

	#footer .right {
		flex: 1 0 150px;
	}

	#footer .content {
		display: block;
	}

	#footer .right {
		text-align: right;
	}

	#footer .right img {

		max-width: 150px;
	}

	#footer .social h6 {
		display: block;
		margin-bottom: 20px;
	}
	.marquee {
		padding: 8px 0;
		}
	#footer {
		min-height: unset;
		padding: var(--padding-w);
	}

	.home .banner {
		min-height: calc(100vh - 60px - var(--gap));
	}


	section.centered-text .images.bubbles {

		gap: 10px;
	}
	section.three_text_columns .column .free_text {

    margin: 30px 0 20px 0;
}
	.button{
	font-size: 16px;
	padding:14px 26px;
	line-height: 16px;
	}
	   .banner {
        min-height: 300px;
    }

	.two_cards .card.image-type, .two_cards .card.video-type, section.three_cards .card.video-type, section.three_cards .card.image-type{


        aspect-ratio: 9 / 16;
    }
	.event .info .place{
		position: unset;
		text-align:left;
		padding:0;
		margin-top:5px;
		top:unset;
		right:Unset;
	}
	.schedule .schedule-tabs{

    padding:10px 20px;
	justify-content: flex-start;

}
}




@media only screen and (max-width: 600px) {
	:root {
		--gap: 10px;
		--gutter: 10px;
		--padding-w: 30px;
		--padding-v:40px;
		--element-gap: 20px;
	}
	.schedule .schedule-tab{
		padding:8px 16px;
		line-height:16px;
		font-size:16px;
	}
	section.wca-popup-block{
		padding:20px 40px;
	}
	.event h2 {
    margin-top: 5px;
}
	.event .overlay{
		opacity: 1;
	}
	.wca-popup-content table td{
		display: block;
		padding:0;
	}
	.wca-popup-content table tbody tr {
		padding: 10px;
		display: block;
	}
	section.bullet_points .bullets .bullet{
		align-items: unset;
		display: block;
		padding: 30px 20px;
	}
	section.bullet_points .bullets .bullet .info{
		padding:16px 0 0 0;
		text-align: center;
	}
	section:not(.overlay_panel_extra), .banner{
		margin-bottom:var(--gap);
	}
	.event .info h2{        padding-right: 30px;
	}
	section.bullet_points .bullets .bullet h6 {

		margin-bottom: 5px;
		text-align: center;
	}

	section.overlay_panel .bg{
		display: none;
	}

	section.bullet_points .bullets .bullet .image {
		width: 120px;
		margin: 0 auto;
	}

	section.centered-text .portraits .image .title,
	section.centered-text .portraits .media .title {
		border-radius: 10px;
		padding: 10px;
		font-size: 15px;
		text-align:center;
		line-height: 20px;
	}

	section.bullet_points {
		padding-left: 10px;
		padding-right: 10px;
	}

	section.centered-text .portraits .image {
		flex: 0 1 calc(50% - var(--gap));
	}

	section.centered-text .images.portraits {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: var(--gap);
        margin-top: 30px;
	}

	section.centered-text .images.portraits .image:nth-child(n+3) {
		grid-column: 1 / -1;
        aspect-ratio: 16 / 9;
	}

	section.centered-text .bubbles .image {

        width: 80px;
        height: 80px;
		border-radius: 70px;
	}
	.event .info .place {

    font-size: 16px;
}
	section.centered-text .portraits .image .title::after {
		display: none;
	}
	#masthead .button.secondary{
		display: none;
	}
	section.bullet_points .bullets .bullet.has-link::after {

		right: 10px;
		bottom: -10px;
	}
	section.bullet_points .bullets .bullet.bullet.has-link .info {
    padding-right:0px;
}
	#footer {
		padding: 30px;
        text-align: center;
	}
	.button{
		min-width:230px;
		font-size:18px;
		padding:16px 30px;
	}

	section.three_cards .card.text-type {
		grid-column: 1 / -1;
	}

	section.three_cards .card.text-type {
		aspect-ratio: unset;
	}

	section.overlay_panel .card {
		max-width: 100%;

	}
	section.centered-text .portraits .portrait .title::after{
		display: none;
	}
	section.overlay_panel {
		align-items: flex-end;
		padding: 0;
		min-height: unset;
	}
	section.overlay_panel .card{

		color:var(--black);
	}
	#footer .footer-logo{

    text-align: center;
    margin-top: 30px;
	}
	section.overlay_panel iframe.video.landscape{
		display: none;
	}
	section.centered-text .portraits .media .title ,
	section.centered-text .portraits .image .title {
		width: 100%;
		left: 0;
		bottom: 0;
		border-radius: 20px;
		margin: 0;
	}

	    .warning {
        font-size: 14px;
        margin: 20px 40px 0 40px;
        line-height: 18px;
    }
	.warning::before{
		display: none;
	}
	.overlay_panel_extra{

	display: block;
}
	.bullet p {
		font-size: 12px;
		line-height: 18px;
	}
	.event .info::after{
		bottom:0px;
		right:10px;
		top:unset;
		width: 30px;
		height: 30px;
	}
	section.centered-text {
		padding: 60px 30px;
}
	.card.text-type,
	section.three_cards .card.text-type {

        padding: 60px 30px;
	}

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

	section.overlay_panel iframe.video.landscape {
		height: 100%;
		width: 230%;
	}
	.marquee.bg-warning .marquee-item{
		font-size:16px;
	}
	.two_cards {
		grid-template-columns: 1fr;

	}
	.marquee.bg-warning {
		padding: 6px 0px;
	}
	.ride-node:hover{
		background:unset;
		color:unset;
	}
	section.bullet_points .bullet p {
    margin-top: 0px;
    font-size: 14px;
    line-height: 20px;
}
	section.centered-text .images.portraits .image{
		aspect-ratio: 2/3;
	}

	section.two_cards .card.text-type {
		grid-column: 1 / -1;
		order: 99;
	}

	.two_cards .card.video-type, .two_cards .card.image-type  {
	aspect-ratio: 16/9;
        width: 100%;
	}

	.two_cards .card.video-type iframe.video {
	height: 100%;
        width: 100%;
        min-height: 100vw;
		min-width: 120vw;
	}
	section.centered-text.portraits{
		background:none;
		padding:60px 0;
	}

	section.bullet_points .bullets .bullet.has-link::after{

	}
	.card{
		display: block;
		text-align:center;
	}
	.event .info {
		padding: 20px;
	}
	.card .icon{
		position: unset;
		margin-bottom:10px;
	}
	section.bullet_points .bullets .bullet.has-link{
		padding-bottom:60px;
	}
	section.bullet_points .bullets .bullet.has-link::after{

		bottom:10px;
		width: 28px;
		height: 28px;
		background-size: 20px 20px;
		right:calc(50% - 14px);
	}
	section.three_text_columns .columns{
		grid-template-columns: 1fr;
	}
	.rides-grid,
	.suggestions-grid{
		grid-template-columns:1fr 1fr;
        column-gap: 10px;
		row-gap:30px;
	}
	section.rides-nodes{
		padding:0;
		background:none;
        padding-bottom: 40px;
	}
	.ride-node{
		padding:0;
		border-radius: 0;
	}

	#filter .filter-button{
		background:#eee;
		font-size:14px;
	}
	    #masthead .button {
        font-size: 14px;
        padding: 14px 12px;
    }
	    #masthead #logo {
        width: 130px;
        height: 110px;
    }
	    #filter {
        margin-top: 30px;
    }
	    section.three_cards iframe.video {

        min-width: 100vw;
        min-height: 100vw;
    }
	.banner .text h1.hero{
		padding:0 10px;

		font-size: 45px;
		line-height: 50px;
	}

	.home .banner .text h1.hero{
		font-size:60px;
		line-height:65px;
	}
	   .banner {
        min-height: 300px;
    }
	   .single-ride .banner {
        min-height: 300px;
    }
	 section.suggestions{
		padding:var(--padding-v) 0;
		background:none;

	 }
	 section.suggestions > h4{
		padding:0 30px;
}

	section.inline_video{
    padding: 0;
}
	section.wca-popup-block .content{
		flex-direction: column;
		text-align: center;
		gap:10px;
	}
	.wca-popup-content table{
		font-size:12px;
		line-height:16px;
	}

	section.bullet_points .text {

    padding: 0 20px;
}
}


@media only screen and (max-width: 400px) {
	#masthead .secondary{
		display: none;
	}
	#page .button{
		width:100%;
	}
}