@charset "utf-8";
/* Numerica Skate Ribbon - April 2026 - ADA */

/* CSS Root - Set root font size to base 10 (10/16 = 0.625 = 62.5%) or calc(1em * 0.625) if supported, required for REM measurements (percentages or relative units are used to support client specified font sizes which allows for better accessibility). */
:root { font-size: 62.5%; font-size: calc(1em * 0.625); }

/* CSS Reset - 1em Base with Box Sizing */
* { border: 0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; font-family: arial,sans-serif; font-size: 1em; -webkit-font-smoothing: antialiased; line-height: 1em; margin: 0; padding: 0; text-align: center; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; vertical-align: middle; }

body, html { margin: 0;padding:0;background-color: #f6f7f8;font-family:sans-serif; vertical-align: middle;  }

.wrapper {position: relative; height: 100vh; overflow-x: hidden;}

.parallax { height: auto;min-height: 75%; margin: 0px; background-attachment: fixed; background-position: center bottom; background-repeat: no-repeat; background-size: cover;}

.bg1 {background-image: url('//static.spokanecity.org/my/images/pages/riverfrontspokane/numerica-skate-ribbon/numerica-skate-ribbon.jpg');}

#NumericaLogo {background-color:#0b7cc1; width: 42%; padding: 2.4rem; position: absolute; top:10%; left: 0; border-radius: 0 2.4rem 2.4rem 0;}
#NumericaLogo img {width: 71%;}

.Logo {width: 20rem; height: 20rem; background-color: #f6f7f8; border: 1.2rem solid #f6f7f8; border-radius: 50%;margin: 0 auto;margin-top: -12rem;}

.Container {background-color: #f6f7f8; padding: .8rem .8rem 3.2rem .8rem; }

.MainContent {position: relative; width: 100%;max-width: 96rem;margin: 0 auto; padding:1rem .5rem; text-align: center;}

.ThreeUp {position: relative; width: 100%;max-width: 96rem;margin: 1.6rem auto; text-align: center; display: flex; flex-wrap: wrap; column-gap: 3%; }

#LeftColumn, #CenterColumn, #RightColumn { width: 31.3%;}

h1 {font-size: 3.6rem; margin: 0; padding: 1.2rem; text-align: left; color: #0b7cc1;}

h1.Clear {clear: both; padding-top: 2rem;}

p {color: #666; font-size: 1.6rem; line-height: 2.4rem; padding: .8rem 1.6rem 1.6rem 1.6rem;}

.Center {text-align: center;}


hr {height: 1px; border: none; border-top: 1px dotted #999; margin-top: 7rem; margin-bottom: 4.5rem;margin-left: 1.5rem;}

a, a:visited {font-family:sans-serif;text-decoration: underline;font-size: 1.8rem;color:#006699;}
a:hover {font-family:sans-serif;color: #06476F;}

a.Button, a.Button:visited {background-color:#006699; width:auto;  padding: 1.2rem 3.6rem; color: #fff;text-decoration: none;}
a.Button:hover {background-color:#06476F;color: #fff;}

ul {}
ul li {color: #666; font-size: 1.8rem; line-height: 2.6rem; padding: 0rem 1.6rem 1.2rem 1.6rem ;}

.ExtraSpace {margin: 2.4rem auto; text-align: center; max-width: 96rem; position: relative;}
.BttnWrapper {margin: 1.2rem 0 1.2rem 0;}
.BttnWrapper>a.Button {display:inline-block; width: 100%; padding: 1.2rem; line-height: 2.8rem;}
.FeaturedImg {width: 100%; padding: 0;}

.Video {width: 98%; margin: 1.6rem auto 3.2rem auto; padding: 0 2rem;}
.EmbedContainer {position: relative; padding-bottom: 56.25%; overflow: hidden; }	
.EmbedContainer iframe,.EmbedContainer object,.EmbedContainer embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}



@media only screen and (max-width: 950px) {
	.Container {padding: .8rem;}
	.Photo {width: 100%; }
	.Text {width: 100%;padding: 10px 4px;}
	.parallax { background-position: center bottom;}
	
}

@media only screen and (max-width: 780px) {
	#LeftColumn, #CenterColumn, #RightColumn { width: 100%; margin-bottom: 4.8rem;}

}


@media only screen and (max-width: 660px) {
	.MainPhoto {  max-width: 88%;}
	.Video {width: 90%;}
}



@media only screen and (max-width: 680px) {
	h1 {font-size: 36px;line-height: 36px;}

}


@media only screen and (max-width: 542px) {
	.MainPhoto { max-width: 84%;}
	.parallax {max-height: 25%; background-position: center bottom; }
	.bg1 {min-height: 70%; background-image: url('//static.spokanecity.org/my/images/pages/riverfrontspokane/numerica-skate-ribbon/numerica-skate-ribbon-small.jpg'); }
	h1 {font-size: 32px;line-height: 28px;}
}

@media only screen and (max-height: 650px) {
	h1 {font-size: 42px;line-height: 42px; }
	.parallax {max-height: 25%; background-position: center bottom;}
	.bg1 {min-height: 70%; background-image: url('//static.spokanecity.org/my/images/pages/riverfrontspokane/numerica-skate-ribbon/numerica-skate-ribbon-small.jpg'); }
}


@media only screen and (max-width: 320px) {
	.MainPhoto {  max-width: 70%;}
}