@import url('text-style.css');

html, body { margin:0; font-size:0.in; line-height:1.2; color:#222222; font-family:Roboto; }
* { box-sizing:border-box; }
.layout { height:inherit; width:12in; margin:0 auto; }
.logo { display:block; }
.button { display:inline-flex; height:0.5in; width:fit-content; background:#d92a1b; text-decoration:none; border-radius:0.05in; color:#ffffff; justify-content:center; align-items:center; line-height:1; text-transform:uppercase; font-family:Roboto Bold; padding-left:0.4in; padding-right:0.4in; white-space:nowrap; transition:background-color 0.2s, color 0.2s; }
.button:hover { background-color:#0e1f5c; color:#ffffff; }
.button.blue-bkg:hover { background-color:#ffffff; color:#0e1f5c; }
.button:active { padding-top:0.1em; box-shadow:0 0.05em 0.025em 0.025em rgba(0,0,0,0.5) inset; }

#contact-bar { background:#222222; height:0.3in; line-height:1; }
#contact-bar-layout { display:flex; justify-content:space-between; align-items:center; }
#contact-bar address { color:#ffffff; font-family:Crimson Text; font-size:0.2in; display:flex; gap:2em; }
#contact-bar address a { color:#ffffff; text-decoration:none; }
#contact-bar address a:hover { text-decoration:underline; }
#contact-bar address span { display:block; }
#contact-social { }
#contact-social a { color:#222222; text-decoration:none; border-radius:50%; background:#ffffff; line-height:1; display:inline-flex; width:0.3in; height:0.3in; aspect-ratio:1/1; align-items:center; justify-content:center; text-align:center; transition:color 0.2s, background-color 0.2s; }
#contact-social a:hover { background:#d92a1b; color:#ffffff; }
#contact-bar * { display:none !important; }
#masthead { height: 1.2in; line-height:1; z-index:1001; background:#ffffff; }
#masthead-layout { display:flex; align-items:center; justify-content:space-between; gap:1em; }
#masthead-logo { display:block; height:0.5in; margin-right:auto; justify-self:start; }
.nav-root { list-style-type:none; display:flex; padding:0; margin:0; gap:0.01in; }
.nav-root li { display:flex; padding:0; margin:0; }
#masthead-nav { margin-left:auto; }
#masthead-nav-root a { display:flex; text-transform:uppercase; color:#222222; text-decoration:none; align-items:center; justify-content:center; padding:0.1in 0.15in; transition:background-color 0.2s, color 0.2s; font-size:80%; white-space:nowrap; border-radius:0.075in; font-family:Raleway Semibold; }
#masthead-nav-root a:hover { color:#ffffff; background:#0e1f5c; }
#masthead-facebook-link { color:#ffffff; text-decoration:none; display:flex; width:0.5in; height:0.5in; border-radius:50%; background:linear-gradient(45deg, #3b5a9a, #28476f); justify-content:center; align-items:center; font-size:170%; padding-top:0.05in; overflow:hidden; }
#masthead-facebook-link::after { display:block; position:absolute; left:0; right:0; top:0; bottom:0; background:rgba(69,110,204,0); transition:background-color 0.2s; content:' '; z-index:1; }
#masthead-facebook-link:hover::after { background:rgba(69,110,204,1); }
#masthead-facebook-link i { position:relative; z-index:2; }

#mobile-nav { display:none; flex-direction:flex-end; align-items:center; height:100%; position:relative; z-index:1001; }
#mobile-nav-link { height:100%; aspect-ratio:1/1; color:#0e1f5c; font-size:300%; text-align:center; display:flex; justify-content:center; align-items:center; text-decoration:none; }
#mobile-nav-link:hover { background:#d92a1b; color:#ffffff; }
#mobile-nav-link:active, .mobile-nav-active #mobile-nav-link { background:#0e1f5c; color:#ffffff; }
#mobile-nav-container { display:flex; flex-direction:column; align-items:stretch; justify-content:stretch; position:fixed; top:0.8in; bottom:0; width:fit-content; right:-100%; background:#0e1f5c; transition:right 0.2s; box-shadow:-0.025in 0.025in 0.0125in 0.0125in rgba(0,0,0,0.5); }
#mobile-nav-container address { display:flex; flex-direction:column; align-items:center; justify-content:space-between; text-align:center; }
#mobile-nav-container ul li { border-bottom:0.02in #ffffff solid; flex:1; }
#mobile-nav-container ul a { display:flex; align-items:center; justify-content:center; white-space:nowrap; height:100%; width:100%; }
#mobile-nav-shroud { position:fixed; left:0; right:0; top:0; bottom:0; z-index:1000; background:rgba(0,0,0,0.01); display:none; }
.mobile-nav-active #mobile-nav-shroud { display:block; }
.mobile-nav-active #mobile-nav-container { right:0; }
#mobile-nav-root { flex-direction:column; flex:1; border-top:0.02in #ffffff solid; }
#mobile-nav-contact { display:flex; align-items:center; justify-content:space-between; text-align:center; gap:0.1in; padding:0.25in; }
#mobile-nav-contact a { display:flex; justify-content:center; align-items:center; border-radius:50%; width:0.4in; height:0.4in; background:#ffffff; text-decoration:none; font-size:150%; }
#mobile-nav-contact i { color:#0e1f5c !important; }
#mobile-nav-container * { color:#ffffff; }
#mobile-nav-root a { text-decoration:none; font-size:0.25in; font-family:Raleway Semibold; padding:0 0.25in; }
#mobile-nav-address { padding:0.25in; line-height:1.5; }
#mobile-nav-root a:hover, #mobile-nav-root a.active-link { background:#d92a1b; }

#promo { aspect-ratio:1920/776; background:url('../img/layout/promo.bkg.jpg') center no-repeat; background-size:cover; }
#promo-layout { height:100%; display:flex; justify-content:flex-start; align-items:center; }
#promo-content { display:flex; flex-direction:column; align-items:center; justify-content:center; color:#ffffff; width:35%; }
#promo-content h1 { /*font-family:Julietta Messie;*/ font-size:0.9in; color:#ffffff; text-transform:none; font-weight:normal; margin:0; }
#promo-content h2 { font-family:Crimson Text; color:#ffffff; margin:0; font-weight:normal; text-transform:uppercase; letter-spacing:0.3em; font-size:0.2in; }
#promo-content .button { margin-top:0.5in; }
#main-space { padding:0.75in 0; }
#main-space-layout { width:9.5in; text-align:center; max-width:90%; }
#main-space .button { margin:0.5in auto 0; }
#features { background:url('../img/layout/layout-bottom.bkg.jpg') center top no-repeat #f3f3f3; background-size:100% auto; padding:1.45in 0; }
#features-layout { display:flex; justify-content:space-around; align-items:flex-start; width:9in; max-width:90%; }
#features-layout article { width:4in; max-width:100%; }
#features-layout h2 { font-family:Bebas; font-weight:normal; text-transform:uppercase; text-align:center; font-size:230%; letter-spacing:-0.05em; margin:0; }
#features-layout h2 strong { color:#cc3333; font-weight:normal; }
#features-layout img { display:block; margin:0; width:100%; }
#main-footer { background:#141f40; height:1.2in; }
#main-footer-layout { justify-content:flex-end; display:flex; gap:2em; align-items:center; }
#main-footer-layout a { display:block; text-transform:uppercase; color:#ffffff; text-decoration:none; font-family:Roboto Bold; }
#main-footer-logo { height:0.25in; }

@media (max-width:13in) {
	.layout { width:auto; margin-left:0.5in; margin-right:0.5in; }
	#masthead-layout, #main-footer-layout { margin-left:0.1in; margin-right:0.1in; }
	#main-space-layout, #features-layout { margin-left:auto; margin-right:auto; }
}

@media (max-width:12in) {
	body { padding-top:0.8in; }
	#masthead { height:0.8in; position:fixed; left:0; right:0; top:0; box-shadow:0 0.025in 0.0125in 0.0125in rgba(0,0,0,0.5); }
	#main-footer { height:0.8in !important; }
	#masthead-nav { display:none; }
	#masthead-petition-button { display:none; }
	#masthead .button { margin-left:auto; }
	#promo { background-position:top left !important; height:5in; aspect-ratio:unset !important; }
	#promo-content { width:4in !important; }
	#mobile-nav { display:flex; }
	#masthead-layout { margin-right:0; }
	#masthead-facebook-link { display:none; margin-left:auto; }
	#contact-bar { display:none; }
}

@media (max-width:10in) {
	#features { padding:1in 0 !important; }
	#features-layout { flex-direction:column; justify-content:space-between; align-items:center; width:fit-content !important; gap:2em; }
	#features article { text-align:center; }
	#main-footer-layout { justify-content:space-between !important; }
	#contact-bar { display:none; }
}

@media (max-width:5in) {
	#promo-layout { margin:0 !important; }
	#promo-content { width:100% !important; }
	#promo-content h1 { font-size:0.7in !important; }
	#promo-content h2 { font-size:0.15in !important; }
}

@media (max-height:5in) {
	body { padding-top:0.6in; }
	#masthead { height:0.6in; }
	#mobile-nav-link { height:0.6in; width:0.6in; }
	#mobile-nav-container { top:0.6in; }
	#mobile-nav-contact { position:absolute; right:100%; top:0; bottom:0; flex-direction:column; background:inherit; box-shadow:inherit; border-right:0.02in #ffffff solid; }
	#mobile-nav-root { border-top:none; }
	#mobile-nav-address { padding-top:0.1in; padding-bottom:0.1in; }
}

@media (max-height:4in) {
	#mobile-nav-contact { flex-direction:row; width:2.6in; height:0.9in; }
	#mobile-nav-address { position:absolute; width:2.6in; right:100%; top:0.9in; bottom:0; border-right:0.02in #ffffff solid; background:inherit; box-shadow:inherit; }
	#mobile-nav-root > li:last-child { border-bottom:none; }
}