/* Variables */
/* ## Fonts ## */
/* ## Colors ## */
/* ## Transition ## */
/* Functions */
/* 12-Column Grid System */
/* 	For 3 columns add: "width: grid-width(4);" For 4 add: "width: grid-width(3);" */
/* rem Sizing */
/* Font Sizing */
/* Mixins */
/*********************
BREAKPOINTS

Usage:

	@include breakpoint(breakPointName) {
		 Styles 
	}

*********************/
/* //////////////////
FLEXBOX
////////////////// */
/* Search Section
////////////////////////////// */
#search-banner { position: relative; width: 100%; height: 100vh; margin: 0; padding: 0; background-image: url("/images/home/search/visitastatepark.jpg"); background-repeat: no-repeat; background-size: cover; background-position: center center; /* /form */ /* /#searchResults */ }

#search-banner::after { content: ""; z-index: 0; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: radial-gradient(#447f99, #244553); opacity: 0; transition: opacity 1s ease; }

#search-banner.fade::after { opacity: 1; }

#search-banner form { position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; /* /button */ /*Clear search link*/ }

#search-banner form p { position: relative; width: 80%; top: 40vh; margin: 0 auto; padding: 0; transition: top .4s; }

@media (min-width: 1024px) { #search-banner form p { width: 60%; } }

#search-banner form p.search-ajax-active { top: 20vh; }

#search-banner form p.search-ajax-active label { opacity: 0; }

#search-banner form p.search-ajax-active button.clear-search { display: block; }

#search-banner form label { position: absolute; top: -1.5em; left: 0; color: white; font-size: 22px; font-size: 1.375rem; font-family: Georgia, "Times New Roman", serif; font-style: italic; font-weight: 400; text-shadow: 0 0.0625em 0.125em rgba(0, 0, 0, 0.8); transition: opacity .4s; }

@media (min-width: 769px) { #search-banner form label { font-size: 28px; font-size: 1.75rem; } }

@media (min-width: 1024px) { #search-banner form label { font-size: 32px; font-size: 2rem; } }

#search-banner form input { width: 100%; height: 3rem; margin: 0 auto; padding: 0 1rem; border: none; font-size: 21px; font-size: 1.3125rem; color: #346276; background: rgba(255, 255, 255, 0.8); text-shadow: 0 1px 1px rgba(255, 255, 255, 0.8); border-radius: 0.25rem; }

@media (min-width: 1024px) { #search-banner form input { font-size: 32px; font-size: 2rem; height: 4rem; } }

#search-banner form button[type=submit] { position: absolute; top: 0; right: 0; width: 3rem; height: 3rem; padding: 0; background: #346276 url("../../images/icons/search-white.svg") center no-repeat; background-size: 32px; text-indent: 100%; overflow: hidden; white-space: nowrap; border-radius: 0 0.20rem 0.20rem 0; }

#search-banner form button[type=submit] svg { width: 1.5rem; height: 1.5rem; vertical-align: middle; }

#search-banner form button[type=submit] svg path, #search-banner form button[type=submit] svg polygon, #search-banner form button[type=submit] svg rect { fill: white; }

@media (min-width: 1024px) { #search-banner form button[type=submit] { width: 4rem; height: 4rem; } }

#search-banner form button.clear-search { display: none; position: absolute; top: 0; right: 3rem; width: 3rem; height: 3rem; text-indent: -999em; background: transparent url(/images/icons/clear.svg) center no-repeat; border-radius: 2px; }

@media (min-width: 1024px) { #search-banner form button.clear-search { right: 4rem; width: 4rem; height: 4rem; } }

#search-banner #searchResults { position: relative; top: 28vh; z-index: 0; width: 90%; height: 0; opacity: 0; margin: 0 auto; padding: 0 0 2.5rem 0; background: white; transition: height, opacity .4s .5s; /* /#searchTabs */ /* /#results */ /* /#relatedResults */ }

#search-banner #searchResults.search-ajax-active { height: 50vh; opacity: 1; z-index: 2; }

#search-banner #searchResults #searchTabs { position: absolute; top: 0; left: 0; width: 100%; height: 4vh; z-index: 5; }

@media (min-width: 769px) { #search-banner #searchResults #searchTabs { float: left; width: 70%; } }

#search-banner #searchResults #searchTabs li { float: left; width: 25%; height: 4vh; }

@media (min-width: 769px) { #search-banner #searchResults #searchTabs li { width: 33.33%; }
  #search-banner #searchResults #searchTabs li#webTab { width: 33.34%; }
  #search-banner #searchResults #searchTabs li:last-child { display: none; } }

#search-banner #searchResults #searchTabs li a { display: block; text-align: center; text-decoration: none; line-height: 4vh; background: linear-gradient(0deg, rgba(0, 0, 0, 0.125), transparent), #e0dede; }

#search-banner #searchResults #searchTabs li a.active { background: white; }

#search-banner #searchResults #searchTabs li a:hover { background: #f0f0f0; }

#search-banner #searchResults #results { position: relative; width: 100%; height: 50vh; }

#search-banner #searchResults #results iframe { width: 100%; height: 46vh; }

#search-banner #searchResults #results #servicesList, #search-banner #searchResults #results #formsResults, #search-banner #searchResults #results #googleResults { display: none; width: 100%; height: 46vh; position: relative; top: 4vh; }

#search-banner #searchResults #results #servicesList.search-panel-active, #search-banner #searchResults #results #formsResults.search-panel-active, #search-banner #searchResults #results #googleResults.search-panel-active { display: block; }

@media (min-width: 769px) { #search-banner #searchResults #results #servicesList, #search-banner #searchResults #results #formsResults, #search-banner #searchResults #results #googleResults { width: 70%; } }

#search-banner #searchResults #results #servicesList { overflow-x: hidden; overflow-y: auto; /* /.item */ }

#search-banner #searchResults #results #servicesList .item { border-bottom: 1px solid #e0dede; background: white; }

#search-banner #searchResults #results #servicesList .item a { display: block; position: relative; padding: .5rem; }

@media (min-width: 769px) { #search-banner #searchResults #results #servicesList .item a { padding: 1rem; } }

#search-banner #searchResults #results #servicesList .item a h4.title { font-size: 16px; font-size: 1rem; font-weight: 700; line-height: 1.2; width: 60%; }

@media (min-width: 769px) { #search-banner #searchResults #results #servicesList .item a h4.title { font-size: 18px; font-size: 1.125rem; width: 80%; } }

#search-banner #searchResults #results #servicesList .item a .agency, #search-banner #searchResults #results #servicesList .item a .description { display: block; color: #676767; font-size: 11px; font-size: 0.6875rem; line-height: 1; }

@media (min-width: 480px) { #search-banner #searchResults #results #servicesList .item a .agency, #search-banner #searchResults #results #servicesList .item a .description { font-size: 12px; font-size: 0.75rem; } }

@media (min-width: 769px) { #search-banner #searchResults #results #servicesList .item a .agency, #search-banner #searchResults #results #servicesList .item a .description { font-size: 14px; font-size: 0.875rem; } }

#search-banner #searchResults #results #servicesList .item a .description { width: 76%; }

#search-banner #searchResults #results #servicesList .item a .agency { position: absolute; top: .5rem; right: .5rem; width: 20%; font-style: italic; }

@media (min-width: 769px) { #search-banner #searchResults #results #servicesList .item a .agency { top: 1rem; right: 1rem; } }

#search-banner #searchResults #results #servicesList .item a:hover { text-decoration: none; }

#search-banner #searchResults #results #formsResults, #search-banner #searchResults #results #googleResults { overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; position: relative; }

#search-banner #searchResults #results #formsResults iframe, #search-banner #searchResults #results #googleResults iframe { position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; }

@media (min-width: 769px) { #search-banner #searchResults #results #formsResults, #search-banner #searchResults #results #googleResults { overflow: hidden; } }

#search-banner #searchResults #results .readmore { color: white; }

#search-banner #searchResults #results .readmore a { color: white; }

#search-banner #searchResults #relatedResults { display: none; width: 100%; height: 46vh; position: relative; top: 4vh; padding: .5rem; overflow-x: hidden; overflow-y: auto; /* /#agency */ /* /#trending */ /* /#trending */ }

#search-banner #searchResults #relatedResults.search-panel-active { display: block; }

@media (min-width: 769px) { #search-banner #searchResults #relatedResults { display: block; width: 30%; height: 50vh; position: absolute; top: 0; right: 0; bottom: 0; left: 70%; padding: 1rem; background: #e0dede; line-height: 1.2; } }

#search-banner #searchResults #relatedResults h3 { font-size: 16px; font-size: 1rem; margin: .5rem; }

#search-banner #searchResults #relatedResults #agency, #search-banner #searchResults #relatedResults #trending, #search-banner #searchResults #relatedResults #relatedJobs, #search-banner #searchResults #relatedResults #youtube, #search-banner #searchResults #relatedResults #social { margin: 0 0 1rem 0; padding: .5rem; background: rgba(0, 0, 0, 0.1); border: 1px solid #e0dede; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.8); }

@media (min-width: 769px) { #search-banner #searchResults #relatedResults #agency, #search-banner #searchResults #relatedResults #trending, #search-banner #searchResults #relatedResults #relatedJobs, #search-banner #searchResults #relatedResults #youtube, #search-banner #searchResults #relatedResults #social { background: rgba(255, 255, 255, 0.625); } }

#search-banner #searchResults #relatedResults #agency { display: none; }

#search-banner #searchResults #relatedResults #agency a { float: right; width: 20%; margin: 0 0 .5rem .5rem; border: 2px solid #346276; }

#search-banner #searchResults #relatedResults #agency h4 { color: #346276; font-size: 16px; font-size: 1rem; font-weight: 700; }

#search-banner #searchResults #relatedResults #agency .agency-address { font-size: 14px; font-size: 0.875rem; }

#search-banner #searchResults #relatedResults #agency.active { display: block; }

#search-banner #searchResults #relatedResults #trending { display: none; }

#search-banner #searchResults #relatedResults #trending a { color: #346276; display: block; padding-left: 32px; background: url(/images/icons/trending.svg) left center no-repeat; background-size: 20px; font-style: italic; }

#search-banner #searchResults #relatedResults #trending.active { display: block; }

#search-banner #searchResults #relatedResults #youtube { padding-left: 32px; background-image: url(/images/icons/youTube.svg); background-position: 8px 8px; background-repeat: no-repeat; background-size: 16px; }

#search-banner #searchResults #relatedResults #youtube li { display: inline-block; }

#search-banner #searchResults #relatedResults #youtube li a { display: block; margin-right: 3px; width: 108px; height: 60px; text-indent: -999em; background-position: center; background-size: cover; }

#search-banner #searchResults #relatedResults #youtube.active { display: block; }

#search-banner #searchResults #relatedResults #social { padding-left: 32px; background-image: url(/images/icons/twitter.svg); background-position: 8px 8px; background-repeat: no-repeat; background-size: 16px; }

#search-banner #searchResults #relatedResults #social #tweets a.tweetLink { display: block; text-decoration: none; font-size: 0.9rem; margin: 0.5rem 0; overflow: hidden; }

#search-banner #searchResults #relatedResults #social #tweets a.tweetLink.tweetHasImg { background-repeat: no-repeat; background-size: 80px auto; background-position: right top; padding-right: 90px; }

#search-banner #searchResults #relatedResults #social #tweets a.tweetLink span { display: block; }

#search-banner #searchResults #relatedResults #social #tweets a.tweetLink span.tweetPost { padding: 0 0 0.3rem; }

#search-banner #searchResults #relatedResults #social #tweets a.tweetLink span.tweetAuthor { font-size: 0.8rem; }

#search-banner #searchResults #relatedResults #social #tweets a.tweetLink span.tweetDate { font-size: 0.7rem; }

#search-banner #goToCity { position: absolute; bottom: 0; z-index: 1; display: block; text-align: center; font-size: 24px; font-size: 1.5rem; color: white; width: 100%; height: 22vh; padding-top: .5rem; border-top: 1px solid rgba(0, 0, 0, 0.2); background: rgba(0, 0, 0, 0.25) url("../../images/home/goToCity.svg") center 3rem no-repeat; background-size: 2rem; box-shadow: inset 0 24px 48px -24px rgba(0, 0, 0, 0.625); }

#search-banner #goToCity:hover { text-decoration: none; }

/* /#search */
#backToTop { display: none; }

a.covid19 { display: block; position: relative; top: 48vh; width: 80vw; margin: 0 auto; padding: 1rem; z-index: 2; color: white; font-size: 1.2rem; border-radius: 5px; box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.3); background-color: #AD301E; background-image: url("/images/home/corona-virus-utah-gov.svg"); background-position: center 1rem; background-repeat: no-repeat; background-size: 200px auto; transition: all 300ms ease; }

a.covid19:hover { background-color: #00AE8B; }

a.covid19 span { display: block; margin: 50px 0 0 0; text-align: center; }

@media (min-width: 1024px) { a.covid19 { top: 50vh; width: 40vw; background-position: 1rem center; }
  a.covid19 span { margin: 0 0 0 220px; text-align: right; } }

.search-ajax-active a.covid19 { display: none; }

.maria-relief { position: absolute; right: 0; top: 58vh; height: 60px; width: 180px; border-radius: 5px 0 0 5px; background-color: #003266; background-image: url("/images/other/hurricane-maria-relief.png"); background-repeat: no-repeat; background-position: 1rem center; background-size: auto 80%; box-shadow: 0 1px 8px rgba(0, 0, 0, 0.3); z-index: 2; transition: all 300ms ease; }

@media (min-width: 1024px) { .maria-relief { top: 80vh; height: 100px; width: 220px; } }

.maria-relief.hidden { display: none !important; }

.maria-relief .maria-relief-close { content: 'x'; text-align: center; font-weight: bold; line-height: 1em; width: 22px; height: 22px; background-color: rgba(0, 0, 0, 0.2); position: absolute; top: 7px; right: 7px; }

.cdg-award { position: absolute; left: 0; height: 60px; width: 80px; top: 21vh; border-radius: 0 5px 5px 0; background-color: white; background-image: url("../../images/other/digital-winner-2020-sm.png"); background-repeat: no-repeat; background-position: 1rem center; background-size: auto 80%; box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2); z-index: 2; transition: all 300ms ease; text-indent: 100%; overflow: hidden; white-space: nowrap; }

@media (min-width: 1024px) { .cdg-award { top: 39vh; left: 0; width: 90px; height: 80px; background-position: 1rem center; } }

.cdg-award::before { content: ''; width: 0; height: 0; background-image: url("/images/other/digital-winner-2020.png"); }

.cdg-award:hover { width: 140px; background-color: white; background-image: url("/images/other/digital-winner-2020.png"); background-size: auto 80%; transition: all 300ms ease; }

@media (min-width: 1024px) { .cdg-award:hover { width: 180px; } }

.section-nav { display: none; position: fixed; top: 37vh; right: 0; margin-top: -6rem; padding: .5rem .5rem 0 .5rem; z-index: 3; }

@media (min-width: 480px) { .section-nav { display: block; } }

.section-nav li { margin: 0 0 .75rem 0; padding: 0; }

.section-nav li:last-child { margin-bottom: none; }

.section-nav a { display: block; text-indent: -999em; width: 1.5rem; height: 1.5rem; border-radius: 50%; font-size: 10px; font-size: 0.625rem; color: white; background: rgba(255, 255, 255, 0.4); border: 1px solid rgba(255, 255, 255, 0.5); box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.4); transition: background .4s; }

.section-nav a:hover { text-decoration: none; border-color: white; }

.section-nav a.active { border-color: white; background-color: white; background-color: rgba(255, 255, 255, 0.8); }

@media (min-width: 769px) { .section-nav a { width: 1.5rem; height: 1.5rem; } }

/* Homepage main content section(s) ////////////////////////////// */
main.main-home { /* Homepage Sections ////////////////////////////// */ /* /section */ }

main.main-home > section { position: relative; overflow: hidden; margin: 0; padding: 0; border: none; /* Main Section Header ////////////////////////////// */ /* /section header */ /* Large Photo/Featured Section ////////////////////////////// */ /* /.feature */ /* Content Container for "cards" ////////////////////////////// */ /* /.content-container */ /* Individual Section Overrides ////////////////////////////// */ /* /#locals */ /* /#gov-news */ /* /#digital */ /* /#open */ /* /#citizen */ /* Animation positions when "scrolled to" ////////////////////////////// */ /* /.scrolled */ }

@media (min-width: 769px) { main.main-home > section { height: 100vh; } }

main.main-home > section > header { position: absolute; top: 0; width: 100%; height: 4rem; color: white; background-color: #5d5d5d; box-shadow: 0 1px 8px rgba(0, 0, 0, 0.5); z-index: 1; transition: top 1s; /* /.social */ }

main.main-home > section > header.hidden { top: -4rem; }

main.main-home > section > header h2 { position: relative; float: left; margin: 0; padding: 0 0 0 1rem; border: none; color: white; background: transparent; text-shadow: none; font-size: 18px; font-size: 1.125rem; line-height: 4rem; }

@media (min-width: 1024px) { main.main-home > section > header h2 { font-size: 24px; font-size: 1.5rem; } }

main.main-home > section > header svg { position: relative; float: left; width: 50px; height: 4rem; }

main.main-home > section > header nav { display: none; }

main.main-home > section > header ul.social { float: right; height: 1.5rem; margin: 1.25rem 1rem 0 0; /* /.social li */ }

main.main-home > section > header ul.social li { display: inline-block; line-height: 1.5rem; padding: 0; background: none; /* /.social li a */ }

main.main-home > section > header ul.social li a { display: block; width: 1.5rem; height: 1.5rem; text-indent: 100%; overflow: hidden; white-space: nowrap; background-color: #007B84; background-position: center center; background-repeat: no-repeat; background-size: 100%; transition: background-color .4s; }

main.main-home > section > header ul.social li a.twitter { background-image: url("../../images/icons/social/twitter.svg"); }

main.main-home > section > header ul.social li a.facebook { background-image: url("../../images/icons/social/facebook.svg"); }

main.main-home > section > header ul.social li a.g-plus { background-image: url("../../images/icons/social/googlePlus.svg"); }

main.main-home > section > header ul.social li a:hover { background-color: rgba(0, 0, 0, 0.125); }

main.main-home > section .feature { display: table; position: relative; top: 0; width: 100%; height: 66vh; color: white; background-color: #676767; background-position: top left; background-repeat: no-repeat; background-size: cover; text-shadow: 0 1px 10px rgba(0, 0, 0, 0.5); transition: height 1s, background-position 8s; }

@media (min-width: 769px) { main.main-home > section .feature { height: 100vh; } }

main.main-home > section .feature .feature-content { position: absolute; bottom: 7rem; left: -90%; width: 90%; padding: 0; text-shadow: 0 1px 5px rgba(0, 0, 0, 0.8); transition: left 1s .5s; }

main.main-home > section .feature .feature-content a { display: block; width: 100%; min-height: 6rem; color: white; padding: 1rem 104px 1rem 5%; background: black; background: rgba(0, 0, 0, 0.6) url("../../images/home/call-to-action.svg") right 16px center no-repeat; background-size: 80px; }

main.main-home > section .feature .feature-content a:hover { text-decoration: none; }

@media (min-width: 769px) { main.main-home > section .feature .feature-content { left: -80%; width: 80%; } }

main.main-home > section .feature .call-out { font-size: 24px; font-size: 1.5rem; line-height: 1; width: 100%; margin: 0; padding: 0; }

@media (min-width: 769px) { main.main-home > section .feature .call-out { font-size: 32px; font-size: 2rem; } }

@media (min-width: 1024px) { main.main-home > section .feature .call-out { font-size: 36px; font-size: 2.25rem; } }

@media (min-width: 1366px) { main.main-home > section .feature .call-out { font-size: 48px; font-size: 3rem; } }

main.main-home > section .feature svg { position: absolute; top: 0; right: 0; height: 100%; opacity: 0; z-index: 0; transition: right .8s; }

main.main-home > section .feature svg .angle { fill: white; }

main.main-home > section .feature .attribution { position: absolute; left: .5rem; bottom: 1rem; margin: 0; padding: 0; font-size: 12px; font-size: 0.75rem; color: white; }

main.main-home > section .feature .attribution a { color: white; }

@media (min-width: 769px) { main.main-home > section .feature .attribution { bottom: 3rem; } }

main.main-home > section .content-container { position: relative; width: 100%; margin: 0; padding: 1px .5rem; /* Individual content "not cards" ;) */ /* /article (card) */ }

@media (min-width: 769px) { main.main-home > section .content-container { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; height: 40vh; padding: .5rem 0; position: absolute; bottom: 0; transition: bottom 1s; }
  main.main-home > section .content-container.hidden { bottom: -40vh; } }

main.main-home > section .content-container > article { font-size: 14px; font-size: 0.875rem; position: relative; width: 100%; min-height: 16rem; margin: .5rem 0; padding: 0; border-bottom: 1px solid rgba(0, 0, 0, 0.3); border-radius: 2px; color: white; background: rgba(255, 255, 255, 0.1); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.125); }

@media (min-width: 480px) { main.main-home > section .content-container > article { float: left; width: 49%; height: 33vh; margin-right: 2%; }
  main.main-home > section .content-container > article:nth-child(2n + 2) { margin-right: 0; } }

@media (min-width: 769px) { main.main-home > section .content-container > article { -webkit-box-flex: 1; -moz-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; float: none; margin: 0 .5rem; height: 100%; min-height: 100%; overflow: hidden; }
  main.main-home > section .content-container > article:nth-child(2n + 2) { margin-right: .5rem; } }

main.main-home > section .content-container > article a { color: white; text-decoration: none; }

main.main-home > section .content-container > article a:hover { color: white; }

main.main-home > section .content-container > article a:hover h4 { color: white; }

main.main-home > section .content-container > article svg { width: 100%; padding: .5em; }

main.main-home > section .content-container > article img { width: 100%; }

main.main-home > section .content-container > article h3 { position: relative; z-index: 1; font-size: 16px; font-size: 1rem; line-height: 1em; margin: 0; width: 100%; }

main.main-home > section .content-container > article h3 a { display: block; width: 100%; padding: .5rem; border-top: 1px solid rgba(255, 255, 255, 0.2); border-bottom: 1px solid rgba(255, 255, 255, 0.125); color: white; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.125), transparent); border-top-right-radius: 2px; border-top-left-radius: 2px; transition: .4s; }

main.main-home > section .content-container > article h3 a:hover { background: black; background: rgba(0, 0, 0, 0.5); border-top: 1px solid rgba(0, 0, 0, 0.25); }

main.main-home > section .content-container > article h3 svg { display: inline-block; float: right; width: 16px; height: 16px; padding: 0; vertical-align: middle; }

main.main-home > section .content-container > article h3 svg path, main.main-home > section .content-container > article h3 svg polygon, main.main-home > section .content-container > article h3 svg rect, main.main-home > section .content-container > article h3 svg circle { fill: white; }

main.main-home > section .content-container > article h4 { line-height: 1em; }

main.main-home > section .content-container > article p { font-size: 14px; font-size: 0.875rem; line-height: 1.2; margin: 0; padding: .5rem; }

main.main-home > section .content-container > article ul { margin: 0; overflow-y: auto; }

main.main-home > section .content-container > article ul li { margin: 0; padding: .5rem; background: none; border-top: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 1px solid rgba(0, 0, 0, 0.1); line-height: 1; }

main.main-home > section .content-container > article ul li:first-child { border-top: none; }

main.main-home > section .content-container > article ul li:last-child { border-bottom: none; }

main.main-home > section .content-container > article ul li .title { font-size: 14px; font-size: 0.875rem; margin-bottom: .2em; }

main.main-home > section .content-container > article ul li h4 { font-weight: 700; margin-bottom: .2rem; }

main.main-home > section .content-container > article ul li p { margin: 0; padding: 0; }

main.main-home > section .content-container > article.news h3 { border-bottom: 1px solid transparent; }

main.main-home > section .content-container > article.tweets { background-image: url("../../images/home/tweets-bg.png"); background-position: center bottom 1rem; background-size: 70%; background-repeat: no-repeat; }

main.main-home > section .content-container > article .twitter-link .twitter-post { margin: 0; padding: .5rem; background: none; border-bottom: 1px solid rgba(0, 0, 0, 0.1); }

main.main-home > section .content-container > article div.news-item a { position: absolute; display: block; width: 100%; top: 34px; right: 0; bottom: 0; left: 0; overflow: hidden; background-position: center center; background-size: cover; }

main.main-home > section .content-container > article div.news-item a h5 { position: absolute; bottom: 0; width: 100%; margin: 0; padding: .5rem 32px .5rem .5rem; color: white; background: rgba(0, 0, 0, 0.6) url("../../images/home/call-to-action.svg") right 6px center no-repeat; background-size: 28px; font-size: 16px; font-size: 1rem; line-height: 1.2; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); }

main.main-home > section .content-container > article div.news-item a .synopsis { display: none; }

main.main-home > section .content-container > article#representatives p { margin: 0; padding: .5rem 5%; width: 50%; float: left; }

main.main-home > section .content-container > article#representatives p img { width: 90%; }

main.main-home > section#locals { background: #004b51; }

main.main-home > section#locals .feature { background-image: url("../../images/home/parkcity.jpg"); }

main.main-home > section#locals > header { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; background-color: #004b51; }

main.main-home > section#locals > header h2 { line-height: 1rem; padding-top: 8px; padding-right: 1rem; }

main.main-home > section#locals > header h2 a { font-size: 11px; color: rgba(255, 255, 255, 0.5); }

main.main-home > section#locals > header h2 a em { display: block; color: white; font-size: 18px; }

main.main-home > section#locals > header h2 a em .showing-default, main.main-home > section#locals > header h2 a em .showing-outofstate { display: none; }

@media (min-width: 769px) { main.main-home > section#locals > header h2 a em .showing-default, main.main-home > section#locals > header h2 a em .showing-outofstate { display: inline; } }

main.main-home > section#locals > header svg .angle { fill: #007B84; }

main.main-home > section#locals > header .location-locals { float: left; height: 100%; margin: 0; padding: 1rem 1rem; background: rgba(0, 0, 0, 0.2); transform: skewX(20deg); }

@media (min-width: 769px) { main.main-home > section#locals > header .location-locals { margin-left: 2rem; padding: 1rem 2rem; } }

main.main-home > section#locals > header .location-locals input, main.main-home > section#locals > header .location-locals label, main.main-home > section#locals > header .location-locals button { display: inline-block; transform: skewX(-20deg); border: none; height: 2rem; vertical-align: middle; }

main.main-home > section#locals > header .location-locals label { margin-left: 1rem; line-height: 2rem; }

main.main-home > section#locals > header .location-locals label[for="location-locals-city"] { display: none; }

main.main-home > section#locals > header .location-locals input[type=text] { font-weight: 700; padding: 0 1rem; color: #004b51; background: white; background: rgba(255, 255, 255, 0.75); width: 100px; }

@media (min-width: 769px) { main.main-home > section#locals > header .location-locals input[type=text] { width: auto; } }

main.main-home > section#locals > header .location-locals input[type=text]::-webkit-input-placeholder { color: #004b51; }

main.main-home > section#locals > header .location-locals input[type=text]::-moz-placeholder { /* Firefox 18- */ color: #004b51; }

main.main-home > section#locals > header .location-locals input[type=text]::-moz-placeholder { /* Firefox 19+ */ color: #004b51; }

main.main-home > section#locals > header .location-locals input[type=text]::-ms-input-placeholder { color: #004b51; }

main.main-home > section#locals > header .location-locals input[type=text]:focus { color: #001c1e; background: white; }

main.main-home > section#locals > header .location-locals button { background: #004b51; padding: 0 0.5rem; }

main.main-home > section#locals > header .location-locals button:hover { background-color: rgba(0, 0, 0, 0.125); }

main.main-home > section#locals > header ul.social { display: none; flex-grow: 2; text-align: right; }

@media (min-width: 769px) { main.main-home > section#locals > header ul.social { display: block; } }

main.main-home > section#locals .content-container { background: #004b51; }

main.main-home > section#locals .content-container article { /* /.representatives */ }

main.main-home > section#locals .content-container article.jobs { overflow: hidden; }

main.main-home > section#locals .content-container article .meetingRow { position: relative; padding-left: 34px; }

main.main-home > section#locals .content-container article .meetingRow .meetingTitle { font-size: 14px; font-size: 0.875rem; font-weight: 700; margin: 0; }

main.main-home > section#locals .content-container article .meetingRow .month { position: absolute; top: 8px; left: 6px; width: 22px; height: 30px; font-size: 10px; font-size: 0.625rem; line-height: 1.5; font-weight: 700; text-align: center; letter-spacing: 1px; color: white; border: none; background: rgba(0, 0, 0, 0.2); text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6); }

main.main-home > section#locals .content-container article .meetingRow .day { position: absolute; top: 22px; left: 8px; width: 18px; font-size: 12px; font-size: 0.75rem; line-height: 1.2; font-weight: 700; text-align: center; color: #346276; background: white; text-shadow: none; }

main.main-home > section#locals .content-container article .meetingRow .meetingTime { position: absolute; width: 1px; height: 0px; overflow: hidden; top: -1px; left: -1px; }

main.main-home > section#locals .content-container article .meetingRow .meetingLocation { display: block; font-size: 12px; font-size: 0.75rem; margin: 0; line-height: 1.2; }

main.main-home > section#locals .content-container article.representatives { /* /.aggregator */ /* /.legislatorSearch */ }

main.main-home > section#locals .content-container article.representatives .aggregator { position: absolute; width: 100%; height: 66%; }

main.main-home > section#locals .content-container article.representatives .aggregator a { position: absolute; display: block; width: 50%; height: 100%; border: 0.5rem solid #007B84; background-position: center 20%; background-repeat: no-repeat; background-size: cover; }

main.main-home > section#locals .content-container article.representatives .aggregator a .legislator-name, main.main-home > section#locals .content-container article.representatives .aggregator a .legislator-district { position: absolute; left: .5rem; line-height: 1; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6); }

main.main-home > section#locals .content-container article.representatives .aggregator a .legislator-name { font-weight: 700; bottom: auto; top: .5rem; }

main.main-home > section#locals .content-container article.representatives .aggregator a .legislator-district { left: 0; bottom: 0; width: 100%; padding: .25rem .5rem; background: rgba(0, 0, 0, 0.5); display: none; }

main.main-home > section#locals .content-container article.representatives .aggregator a .legislator-party { position: absolute; bottom: -.5rem; right: -.5rem; width: 1em; height: 1em; padding: .125em; color: rgba(0, 0, 0, 0.5); background: #007B84; border-radius: 50%; font-size: 20px; font-size: 1.25rem; font-weight: 700; text-align: center; line-height: 1; z-index: 2; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25); }

main.main-home > section#locals .content-container article.representatives .aggregator a:last-child { right: 0; }

main.main-home > section#locals .content-container article.representatives #change-rep { position: absolute; left: .5rem; right: .5rem; bottom: .5rem; padding: .5rem; color: white; font-weight: 700; text-align: center; background: #004b51; background: rgba(0, 0, 0, 0.25); }

main.main-home > section#locals .content-container article.representatives .legislatorSearch { position: absolute; left: 0; bottom: 0; width: 100%; padding: .5rem; }

main.main-home > section#locals .content-container article.representatives .legislatorSearch label { font-weight: 700; display: block; }

main.main-home > section#locals .content-container article.representatives .legislatorSearch input { width: 75%; height: 1.5rem; padding: 0 .5rem; color: #004b51; background: white; border: none; }

main.main-home > section#locals .content-container article.representatives .legislatorSearch input::-webkit-input-placeholder { color: #004b51; }

main.main-home > section#locals .content-container article.representatives .legislatorSearch input::-moz-placeholder { /* Firefox 18- */ color: #004b51; }

main.main-home > section#locals .content-container article.representatives .legislatorSearch input::-moz-placeholder { /* Firefox 19+ */ color: #004b51; }

main.main-home > section#locals .content-container article.representatives .legislatorSearch input::-ms-input-placeholder { color: #004b51; }

main.main-home > section#locals .content-container article.representatives .legislatorSearch button { float: right; width: 25%; height: 1.5rem; padding: 0; color: white; font-weight: 700; text-align: center; background: #004b51; background: rgba(0, 0, 0, 0.25); }

main.main-home > section#locals .content-container article.parksSchools { -webkit-box-flex: 2; -moz-box-flex: 2; -webkit-flex: 2; -ms-flex: 2; flex: 2; }

main.main-home > section#locals .content-container article.parksSchools .mdi-map { position: absolute; top: 2rem; right: 0; bottom: 0; left: 0; width: 100%; color: #007B84; height: 100%; text-shadow: none; }

main.main-home > section#locals .content-container article.parksSchools .mdi-map a { color: #346276; text-shadow: none; }

main.main-home > section#locals .content-container article.jobs .aggregator { position: absolute; width: 100%; height: 66%; }

main.main-home > section#locals .content-container article.jobs .aggregator a.job-listing { display: block; border-top: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 1px solid rgba(0, 0, 0, 0.1); margin: 0; padding: .5rem; background: none; }

main.main-home > section#locals .content-container article.jobs .aggregator a.job-listing span { display: block; }

main.main-home > section#locals .content-container article.jobs .aggregator a.job-listing span.jobTitle { font-size: 14px; font-size: 0.875rem; font-weight: 700; }

main.main-home > section#locals .content-container article.jobs .aggregator a.job-listing span.jobPostedDate { font-size: 12px; font-size: 0.75rem; margin: 0; line-height: 1.2; }

main.main-home > section#locals .content-container article.jobs .aggregator a.job-listing span.jobPostedDate::before { content: 'Posted: '; }

main.main-home > section#locals .content-container article.jobs .aggregator a.job-listing span.jobError { font-size: 12px; font-size: 0.75rem; margin: 0; line-height: 1.2; }

main.main-home > section#locals .content-container article.jobs .aggregator a.job-listing span.jobCity { font-size: 12px; font-size: 0.75rem; margin: 0; line-height: 1.2; }

main.main-home > section#locals .content-container article.jobs .aggregator a.job-listing span.jobCity::before { content: 'Location: '; }

main.main-home > section#locals nav a { background: #007B84; }

main.main-home > section#gov-news { background: #5e4575; }

main.main-home > section#gov-news .gov-news-featured { display: table-cell; width: 100%; height: 66vh; }

@media (min-width: 769px) { main.main-home > section#gov-news .gov-news-featured { height: 100vh; } }

main.main-home > section#gov-news .gov-news-featured a { display: block; position: absolute; width: 100%; height: 66vh; top: 0; right: 0; bottom: 0; left: 0; background-position: top left; background-repeat: no-repeat; background-size: cover; transition: height 1s, background-position 8s; }

@media (min-width: 769px) { main.main-home > section#gov-news .gov-news-featured a { height: 100vh; } }

main.main-home > section#gov-news .gov-news-featured a h5 { position: absolute; bottom: 9rem; left: -90%; font-size: 24px; font-size: 1.5rem; line-height: 1.2; color: white; width: 90%; min-height: 72px; margin: 0; padding: .75rem 72px 0 5%; background: black; background: rgba(0, 0, 0, 0.6) url("../../images/home/call-to-action.svg") right 8px center no-repeat; background-size: 60px; text-shadow: 0 1px 5px rgba(0, 0, 0, 0.8); transition: left 1s .5s; }

@media (min-width: 769px) { main.main-home > section#gov-news .gov-news-featured a h5 { left: -80%; width: 80%; font-size: 30px; font-size: 1.875rem; } }

@media (min-width: 1024px) { main.main-home > section#gov-news .gov-news-featured a h5 { font-size: 32px; font-size: 2rem; } }

@media (min-width: 1366px) { main.main-home > section#gov-news .gov-news-featured a h5 { font-size: 48px; font-size: 3rem; } }

main.main-home > section#gov-news .gov-news-featured a .synopsis { position: absolute; bottom: 4rem; left: 0; margin: 0; padding: .5rem .5rem .5rem 5%; color: white; background: #346276; background: rgba(0, 0, 0, 0.8); left: -90%; width: 90%; height: 5rem; overflow: hidden; transition: left 1s .5s; font-size: 14px; font-size: 0.875rem; line-height: 1.2; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.6); }

@media (min-width: 769px) { main.main-home > section#gov-news .gov-news-featured a .synopsis { font-size: 16px; font-size: 1rem; left: -80%; width: 80%; height: 4rem; bottom: 5rem; } }

@media (min-width: 1024px) { main.main-home > section#gov-news .gov-news-featured a .synopsis { font-size: 18px; font-size: 1.125rem; } }

@media (min-width: 1366px) { main.main-home > section#gov-news .gov-news-featured a .synopsis { font-size: 20px; font-size: 1.25rem; } }

main.main-home > section#gov-news .gov-news-featured a:hover { text-decoration: none; }

main.main-home > section#gov-news > header { background: #443255; }

main.main-home > section#gov-news > header svg .angle { fill: #5e4575; }

main.main-home > section#gov-news > header nav a { background: #5e4575; }

main.main-home > section#gov-news > header ul.social li a { background-color: #5e4575; }

main.main-home > section#gov-news > header ul.social li a:hover { background-color: rgba(0, 0, 0, 0.6); }

main.main-home > section#gov-news .content-container { background: #443255; }

main.main-home > section#digital { background: #46617b; }

main.main-home > section#digital .feature { background-image: url("../../images/home/digital.jpg"); }

main.main-home > section#digital > header { background: #46617b; }

main.main-home > section#digital > header svg { left: -1px; }

main.main-home > section#digital > header svg .angle { fill: #587a9c; }

main.main-home > section#digital > header nav a { background: #587a9c; }

main.main-home > section#digital > header ul.social li a { background-color: #587a9c; }

main.main-home > section#digital > header ul.social li a:hover { background-color: rgba(0, 0, 0, 0.6); }

main.main-home > section#digital .content-container { background: #46617b; }

main.main-home > section#open { background: #346276; /* /.transparency */ }

main.main-home > section#open .feature { background-image: url("../../images/home/open.jpg"); }

main.main-home > section#open > header { background: #244553; }

main.main-home > section#open > header svg .angle { fill: #346276; }

main.main-home > section#open > header nav a { background: #346276; }

main.main-home > section#open > header ul.social li a { background-color: #346276; }

main.main-home > section#open > header ul.social li a:hover { background-color: rgba(0, 0, 0, 0.6); }

main.main-home > section#open .content-container { background: #244553; }

main.main-home > section#open .transparency { -webkit-box-flex: 2; -moz-box-flex: 2; -webkit-flex: 2; -ms-flex: 2; flex: 2; /* /svg */ /* /ul */ }

main.main-home > section#open .transparency h4 { position: absolute; z-index: 2; font-size: 24px; font-size: 1.5rem; font-weight: 700; padding: .5rem; line-height: 1em; }

main.main-home > section#open .transparency p { position: absolute; z-index: 2; bottom: 0; width: 100%; margin: 0; padding: .5rem 32px .5rem .5rem; background: rgba(0, 0, 0, 0.25) url("../../images/home/call-to-action.svg") right 8px center no-repeat; background-size: 20px; }

main.main-home > section#open .transparency svg.transparency-donut { width: 100%; padding: .5rem; -webkit-transform: rotate(360deg); transform: rotate(360deg); transition: transform 3s 1s; /* /path */ }

@media (min-width: 769px) { main.main-home > section#open .transparency svg.transparency-donut { width: auto; float: right; } }

main.main-home > section#open .transparency svg.transparency-donut path { transition: fill .4s; }

main.main-home > section#open .transparency svg.transparency-donut path:hover { cursor: pointer; fill: rgba(255, 255, 255, 0.5); }

main.main-home > section#open .transparency svg.transparency-donut path.capital:hover { fill: #447f99; }

main.main-home > section#open .transparency svg.transparency-donut path.publicEd:hover { fill: #80aac6; }

main.main-home > section#open .transparency svg.transparency-donut path.socialServices:hover { fill: #00abb7; }

main.main-home > section#open .transparency svg.transparency-donut path.higherEd:hover { fill: #da3409; }

main.main-home > section#open .transparency svg.transparency-donut path.gov:hover { fill: #57bce8; }

main.main-home > section#open .transparency svg.transparency-donut path.transportation:hover { fill: #f48057; }

main.main-home > section#open .transparency svg.transparency-donut path.law:hover { fill: #bb140d; }

main.main-home > section#open .transparency ul { margin-bottom: 2rem; }

main.main-home > section#open .transparency ul li { transition: all .4s; }

main.main-home > section#open .transparency ul li .percentage { font-weight: 700; }

main.main-home > section#open .transparency ul li .transIcon { display: inline-block; width: 1em; height: 1em; margin: 0 1em 0 0; }

main.main-home > section#open .transparency ul li.socialServices .transIcon { background: #007B84; }

main.main-home > section#open .transparency ul li.publicEd .transIcon { background: #5D92B6; }

main.main-home > section#open .transparency ul li.higherEd .transIcon { background: #a92807; }

main.main-home > section#open .transparency ul li.gov .transIcon { background: #2AAAE2; }

main.main-home > section#open .transparency ul li.transportation .transIcon { background: #F15C27; }

main.main-home > section#open .transparency ul li.law .transIcon { background: #8b0f0a; }

main.main-home > section#open .transparency ul li.debt .transIcon { background: #5e4575; }

main.main-home > section#open .transparency ul li.capital .transIcon { background: #346276; }

main.main-home > section#open .transparency ul li.active { background: #5D92B6; padding: 1rem 0.5rem; }

main.main-home > section#open .transparency ul li.active .transIcon { background: rgba(255, 255, 255, 0.5); }

@media (min-width: 480px) { main.main-home > section#open .transparency ul li { font-size: 16px; font-size: 1rem; position: absolute; bottom: 20%; left: -60%; width: 60%; border: none; opacity: 0; transition: opacity, left 1s; }
  main.main-home > section#open .transparency ul li.active { left: 0; opacity: 1; } }

@media (min-width: 769px) { main.main-home > section#open .transparency ul li { font-size: 18px; font-size: 1.125rem; } }

main.main-home > section#citizen { background: #a92807; }

main.main-home > section#citizen .feature { background-image: url("../../images/home/citizen.jpg"); }

main.main-home > section#citizen > header { background: #781c05; }

main.main-home > section#citizen > header svg .angle { fill: #a92807; }

main.main-home > section#citizen > header nav a { background: #a92807; }

main.main-home > section#citizen > header ul.social li a { background-color: #a92807; }

main.main-home > section#citizen > header ul.social li a:hover { background-color: rgba(0, 0, 0, 0.6); }

main.main-home > section#citizen .content-container { background: #a92807; }

main.main-home > section#citizen .content-container article.collaborate svg { width: 100%; }

main.main-home > section#citizen .content-container article.collaborate svg path, main.main-home > section#citizen .content-container article.collaborate svg circle { fill: white; }

@media (min-width: 480px) { main.main-home > section#citizen .content-container article.publiccomment p { font-size: 0.6em; } }

@media (min-width: 1024px) { main.main-home > section#citizen .content-container article.publiccomment p { font-size: 0.6em; } }

@media (min-width: 1366px) { main.main-home > section#citizen .content-container article.publiccomment p { font-size: 0.8em; } }

main.main-home > section.scrolled { /* /.feature */ /* /.content-container */ /* /#gov-news */ }

main.main-home > section.scrolled > header { top: 0; z-index: 1; padding-top: 3rem; height: auto; }

main.main-home > section.scrolled .feature { background-position: bottom right; }

@media (min-width: 769px) { main.main-home > section.scrolled .feature { height: 60vh; } }

@media (min-width: 1024px) { main.main-home > section.scrolled .feature { height: 66vh; } }

main.main-home > section.scrolled .feature svg { right: -100%; opacity: 0.2; }

@media (min-width: 769px) { main.main-home > section.scrolled .feature svg { right: 0; } }

main.main-home > section.scrolled .feature .feature-content { left: 0; }

main.main-home > section.scrolled .content-container { bottom: 0; }

@media (min-width: 769px) { main.main-home > section.scrolled#gov-news .gov-news-featured { height: 60vh; } }

@media (min-width: 1024px) { main.main-home > section.scrolled#gov-news .gov-news-featured { height: 66vh; } }

main.main-home > section.scrolled#gov-news .gov-news-featured a { background-position: bottom right; }

@media (min-width: 769px) { main.main-home > section.scrolled#gov-news .gov-news-featured a { height: 60vh; } }

@media (min-width: 1024px) { main.main-home > section.scrolled#gov-news .gov-news-featured a { height: 66vh; } }

main.main-home > section.scrolled#gov-news .news-item a h5, main.main-home > section.scrolled#gov-news .news-item a .synopsis { left: 0; }

main.main-home > section.scrolled#open .transparency svg.transparency-donut { -webkit-transform: rotate(0deg); transform: rotate(0deg); }

/* /main */

/*# sourceMappingURL=style.css.map */