/* CONCATENATED CSS USING CHALK CSS */ /* ./css/styles.css */ /* * * * * This file was automatically generated from /src by Gulp. * Do not edit directly unless Gulp is removed from this repository! * * * */ /*! normalize.css v3.0.0 | MIT License | git.io/normalize */ /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. */ html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /** * Remove default margin. */ body { margin: 0; } /* HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined for any HTML5 element in IE 8/9. * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. * Correct `block` display not defined for `main` in IE 11. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } /** * 1. Correct `inline-block` display not defined in IE 8/9. * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */ audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address `[hidden]` styling not present in IE 8/9/10. * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */ [hidden], template { display: none; } /* Links ========================================================================== */ /** * Remove the gray background color from active links in IE 10. */ a { background: transparent; } /** * Improve readability when focused and also mouse hovered in all browsers. */ a:active, a:hover { outline: 0; } /* Text-level semantics ========================================================================== */ /** * Address styling not present in IE 8/9/10/11, Safari, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /** * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */ b, strong { font-weight: bold; } /** * Address styling not present in Safari and Chrome. */ dfn { font-style: italic; } /** * Address variable `h1` font-size and margin within `section` and `article` * contexts in Firefox 4+, Safari, and Chrome. */ h1 { font-size: 2em; margin: 0.67em 0; } /** * Address styling not present in IE 8/9. */ mark { background: #ff0; color: #000; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* Embedded content ========================================================================== */ /** * Remove border when inside `a` element in IE 8/9/10. */ img { border: 0; } /** * Correct overflow not hidden in IE 9/10/11. */ svg:not(:root) { overflow: hidden; } /* Grouping content ========================================================================== */ /** * Address margin not present in IE 8/9 and Safari. */ figure { margin: 1em 40px; } /** * Address differences between Firefox and other browsers. */ hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } /** * Contain overflow in all browsers. */ pre { overflow: auto; } /** * Address odd `em`-unit font size rendering in all browsers. */ code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } /* Forms ========================================================================== */ /** * Known limitation: by default, Chrome and Safari on OS X allow very limited * styling of `select`, unless a `border` property is set. */ /** * 1. Correct color not being inherited. * Known issue: affects color of disabled elements. * 2. Correct font properties not being inherited. * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */ button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ } /** * Address `overflow` set to `hidden` in IE 8/9/10/11. */ button { overflow: visible; } /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. * Correct `select` style inheritance in Firefox. */ button, select { text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. */ button, html input[type="button"], /* 1 */ input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ } /** * Re-set default cursor for disabled elements. */ button[disabled], html input[disabled] { cursor: default; } /** * Remove inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /** * Address Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ input { line-height: normal; } /** * It's recommended that you don't attempt to style these elements. * Firefox's implementation doesn't respect box-sizing, padding, or width. * * 1. Address box sizing set to `content-box` in IE 8/9/10. * 2. Remove excess padding in IE 8/9/10. */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Fix the cursor style for Chrome's increment/decrement buttons. For certain * `font-size` values of the `input`, it causes the cursor style of the * decrement button to change from `default` to `text`. */ input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Address `appearance` set to `searchfield` in Safari and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari and Chrome * (include `-moz` to future-proof). */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /** * Remove inner padding and search cancel button in Safari and Chrome on OS X. * Safari (but not Chrome) clips the cancel button when the search input has * padding (and `textfield` appearance). */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * Define consistent border, margin, and padding. */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 1. Correct `color` not being inherited in IE 8/9/10/11. * 2. Remove padding so people aren't caught out if they zero out fieldsets. */ legend { border: 0; /* 1 */ padding: 0; /* 2 */ } /** * Remove default vertical scrollbar in IE 8/9/10/11. */ textarea { overflow: auto; } /** * Don't inherit the `font-weight` (applied by a rule above). * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */ optgroup { font-weight: bold; } /* Tables ========================================================================== */ /** * Remove most spacing between table cells. */ table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */ /* * What follows is the result of much research on cross-browser styling. * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal, * Kroc Camen, and the H5BP dev community and team. */ /* ========================================================================== Base styles: opinionated defaults ========================================================================== */ html, button, input, select, textarea { color: #222; } html { font-size: 1em; line-height: 1.4; } /* * Remove text-shadow in selection highlight: h5bp.com/i * These selection rule sets have to be separate. * Customize the background color to match your design. */ ::-moz-selection { background: #b3d4fc; text-shadow: none; } ::selection { background: #b3d4fc; text-shadow: none; } /* * A better looking default horizontal rule */ hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } /* * Remove the gap between images, videos, audio and canvas and the bottom of * their containers: h5bp.com/i/440 */ audio, canvas, img, video { vertical-align: middle; } /* * Remove default fieldset styles. */ fieldset { border: 0; margin: 0; padding: 0; } /* * Allow only vertical resizing of textareas. */ textarea { resize: vertical; } /* ========================================================================== Browse Happy prompt ========================================================================== */ .browsehappy { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } /* ========================================================================== Author's custom styles ========================================================================== */ /* ========================================================================== Helper classes ========================================================================== */ /* * Image replacement */ .ir { background-color: transparent; border: 0; overflow: hidden; /* IE 6/7 fallback */ *text-indent: -9999px; } .ir:before { content: ""; display: block; width: 0; height: 150%; } /* * Hide from both screenreaders and browsers: h5bp.com/u */ .hidden { display: none !important; visibility: hidden; } /* * Hide only visually, but have it available for screenreaders: h5bp.com/v */ .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } /* * Extends the .visuallyhidden class to allow the element to be focusable * when navigated to via the keyboard: h5bp.com/p */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } /* * Hide visually and from screenreaders, but maintain layout */ .invisible { visibility: hidden; } /* * Clearfix: contain floats * * For modern browsers * 1. The space content is one way to avoid an Opera bug when the * `contenteditable` attribute is included anywhere else in the document. * Otherwise it causes space to appear at the top and bottom of elements * that receive the `clearfix` class. * 2. The use of `table` rather than `block` is only necessary if using * `:before` to contain the top-margins of child elements. */ .clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ } .clearfix:after { clear: both; } /* * For IE 6/7 only * Include this rule to trigger hasLayout and contain floats. */ .clearfix { *zoom: 1; } /* ========================================================================== EXAMPLE Media Queries for Responsive Design. These examples override the primary ('mobile first') styles. Modify as content requires. ========================================================================== */ @media only screen and (min-width: 35em) { /* Style adjustments for viewports that meet the condition */ } @media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { /* Style adjustments for high resolution devices */ } /* ========================================================================== Print styles. Inlined to avoid required HTTP connection: h5bp.com/r ========================================================================== */ @media print { * { background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */ box-shadow: none !important; text-shadow: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } /* * Don't show links for images, or javascript/internal links */ .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; /* h5bp.com/t */ } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * VARIABLES (Template settings - RALLY) * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * SITE HEADER / NAVIGATION * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * FOOTER * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * NAV BANNER * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * SEARCH BAR * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * WALLPAPER * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * TILE GRID Very basic scaffolding for tiled content. When the the presentation of content is intended to appear in tiles, use the .tile-grid class on a DataSlate Repeater component. This ensures that tiles stack up across columns correctly for different media widths, and have the proper margins and spacing within the site container. Set the number of columns as necessary for each media query width. // TODO Allow tile grid columns to be set // on a per-component basis. Currently these // variables will affect the entire layout. // EXPERIMENTAL This may be possible if the component // uses @include tile-width(x) in its // definition. Test this to ensure that // inheritance rules are working. * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * TILE GRID - CATEGORIES Presentation for tiles containing categories. * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * RESPONSIVE LAYOUT * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * TYPOGRAPHY * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 300; src: local('Open Sans Light'), local('OpenSans-Light'), url(https://fonts.gstatic.com/s/opensans/v13/DXI1ORHCpsQm3Vp6mXoaTYnF5uFdDttMLvmWuJdhhgs.ttf) format('truetype'); } @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; src: local('Open Sans'), local('OpenSans'), url(https://fonts.gstatic.com/s/opensans/v13/cJZKeOuBrn4kERxqtaUH3aCWcynf_cDxXwCLxiixG1c.ttf) format('truetype'); } @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 600; src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(https://fonts.gstatic.com/s/opensans/v13/MTP_ySUJH_bn48VBG8sNSonF5uFdDttMLvmWuJdhhgs.ttf) format('truetype'); } * { font-family: 'Open Sans', Helvetica, Arial, sans-serif; } .pika, .ss-icon, .ss-icon.ss-pika, [class^="ss-"]:before, [class*=" ss-"]:before, [class^="ss-"].ss-pika:before, [class*=" ss-"].ss-pika:before, [class^="ss-"].right:after, [class*=" ss-"].right:after, [class^="ss-"].ss-pika.right:after, [class*=" ss-"].ss-pika.right:after { font-family: 'SSPika'; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * BASE STYLES Overrides on base.css - Sets up generic site structure - Modifies box-sizing - Provides for responsive layout - Sets up default element behaviors * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ html, body { background: #f7f7f7; color: #5f5f5f; overflow-x: hidden; height: auto; } body.controller_custom_content * { box-sizing: border-box; } body.controller_custom_content .siteContentWrapper { padding: 0 !important; } header *, footer *, #header *, #footer * { box-sizing: border-box; } .siteOuterWrapper { min-width: 0 !important; min-height: 0 !important; margin: 0; } .siteInnerWrapper { padding: 0; margin: 0; max-width: 100%; } #siteFooter { height: auto !important; margin-top: 0 !important; clear: both; } body:not([class*='action_datasets_'], [class*='action_odysseus_']) { display: -ms-flexbox; display: flex; min-height: 100vh; -ms-flex-direction: column; flex-direction: column; } body:not([class*='action_datasets_'], [class*='action_odysseus_']) .siteOuterWrapper { -ms-flex: 1 0 auto; flex: 1 0 auto; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * CONTAINER * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ .container, body:not(.controller_custom_content) .siteContentWrapper { position: relative; max-width: 650px; margin: 0 auto; padding-bottom: 0; } @media only screen and (min-width: 768px) { .container, body:not(.controller_custom_content) .siteContentWrapper { max-width: 1200px; padding: 0 40px; } } #analyticsDataContainer .container { max-width: none; padding: 0; } body:not(.controller_custom_content) .siteContentWrapper { padding: 20px 40px; box-sizing: border-box; } body.layout-small-header .container, body[class*='action_datasets_'] .container { padding: 0; max-width: 100%; } .row { position: relative; } .row.full-bleed { margin: 0; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * STANDARD BEHAVIOR FOR HTML ELEMENTS * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit !important; text-decoration: none; } a { color: #3b5998; } a:hover { color: #4c70ba; } a:active { color: #5f7ec1; } a:visited { color: #3b5998; } a { text-decoration: none; } a:hover { text-decoration: underline; } p { font-size: inherit; line-height: inherit; } a:focus img, a:active img { box-shadow: none; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * DATASET VIEW OVERRIDES * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ .browseSection .searchSection .searchBox { background: transparent; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * COMPONENT OVERRIDES * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ .socrata-component { min-height: 0; } .component-Text { padding: 0; font-size: inherit; } .ss-icon, [class^="ss-"]:before, [class*=" ss-"]:before, [class^="ss-"]:after, [class*=" ss-"]:after { vertical-align: baseline; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * TILE GRID Very basic scaffolding for tiled content. When the the presentation of content is intended to appear in tiles, use the .tile-grid class on a DataSlate Repeater component. This ensures that tiles stack up across columns correctly for different media widths, and have the proper margins and spacing within the site container. Set the number of columns as necessary for each media query width. // TODO Allow tile grid columns to be set // on a per-component basis. Currently these // variables will affect the entire layout. // EXPERIMENTAL This may be possible if the component // uses @include tile-width(x) in its // definition. Test this to ensure that // inheritance rules are working. Do not use the .tile-grid class to affect the content of tiles. These will be targeted through other classes elsewhere. * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ .tile-grid { margin-top: 20px !important; } .tile-grid .tile { position: relative; float: left; height: 165px; overflow: hidden; margin-right: 20px; margin-bottom: 20px; } @media only screen and (max-width: 400px) { .tile-grid { margin-bottom: 0; } .tile-grid .tile { width: 100%; } .tile-grid .id-clone .tile { margin-right: 20px; } } @media only screen and (min-width: 401px) and (max-width: 767px) { .tile-grid .tile { width: calc(50% - 10px); } .tile-grid .id-clone .tile { margin-right: 20px; } .tile-grid .id-clone:nth-of-type(2n) .tile { margin-right: 0; } } @media only screen and (min-width: 768px) and (max-width: 1049px) { .tile-grid .tile { width: calc(25% - 15px); } .tile-grid .id-clone .tile { margin-right: 20px; } .tile-grid .id-clone:nth-of-type(4n) .tile { margin-right: 0; } } @media only screen and (min-width: 1050px) { .tile-grid .tile { width: calc(20% - 16px); } .tile-grid .id-clone .tile { margin-right: 20px; } .tile-grid .id-clone:nth-of-type(5n) .tile { margin-right: 0; } } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * NAVIGATION (BANNER STYLE) * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ nav, #nav { position: relative; } nav.nav-banner, #nav.nav-banner { margin-top: 20px; margin-bottom: 0; border-radius: 0; background-color: #0084C3; overflow: hidden; font-size: 1.4em; } nav.nav-banner *, #nav.nav-banner * { box-sizing: border-box; } @media only screen and (max-width: 400px) { nav.nav-banner, #nav.nav-banner { margin-top: 10px; margin-bottom: 0; } nav.nav-banner .container, #nav.nav-banner .container { margin: 0; } } nav.nav-banner li, #nav.nav-banner li { display: inline-block; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; position: relative; margin-right: 4px; } @media only screen and (max-width: 400px) { nav.nav-banner li, #nav.nav-banner li { display: block; float: none; border-bottom: 1px solid rgba(0, 0, 0, 0.08); } nav.nav-banner li:last-of-type, #nav.nav-banner li:last-of-type { border-bottom: 0; } } nav.nav-banner li a, #nav.nav-banner li a { display: block; background-color: inherit; border-radius: 0; color: white; font-size: 1em; padding: 16px; white-space: nowrap; } nav.nav-banner li a:hover, #nav.nav-banner li a:hover { background-color: #0095dd; color: white; } nav.nav-banner li a:hover, nav.nav-banner li a:active, #nav.nav-banner li a:hover, #nav.nav-banner li a:active { text-decoration: none; } body.layout-small-header nav.nav-banner, body[class*='action_datasets_'] nav.nav-banner, body.layout-small-header #nav.nav-banner, body[class*='action_datasets_'] #nav.nav-banner { margin-top: 0; margin-bottom: 0; } body.layout-small-header nav.nav-banner li a, body[class*='action_datasets_'] nav.nav-banner li a, body.layout-small-header #nav.nav-banner li a, body[class*='action_datasets_'] #nav.nav-banner li a { font-size: 1.4em; padding: 12px; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * SEARCH * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ .search-container { position: absolute; right: 0; top: 45px; font-size: 1.6em; } @media only screen and (max-width: 400px) { .search-container { position: relative; text-align: left; margin-top: 10px; top: 0; } } .search-container form { height: 100%; vertical-align: top; } .search-container form input[type=text] { line-height: 20px; font-size: inherit; width: 100px; height: 32px; padding: 4px; border: 1px solid #cacaca; border-top-left-radius: 3px; border-bottom-left-radius: 3px; outline: none; } @media only screen and (max-width: 400px) { .search-container form input[type=text] { width: 100%; border-radius: 3px; padding-right: 54px; } } @media only screen and (min-width: 768px) { .search-container form input[type=text] { width: 175px; } } @media only screen and (min-width: 1050px) { .search-container form input[type=text] { width: 250px; } } .search-container button.search-button { border: 1px solid #cacaca; border-left: none; border-top-right-radius: 3px; border-bottom-right-radius: 3px; background-color: #e3e3e3; color: #5f5f5f; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; position: relative; margin: 0; font-size: 1.2em; margin-left: -4px; width: 48px; height: 32px; padding: 0px 6px 3px 6px; } @media only screen and (max-width: 400px) { .search-container button.search-button { position: absolute; top: 0; right: 0; } } .search-container button.search-button:hover { background-color: #f0f0f0; } .search-container .search-icon { top: 3px; position: relative; } .nav-banner .search-container { right: 40px; top: 0; } .nav-banner .search-container form { margin: 8px 0; } @media only screen and (max-width: 400px) { .nav-banner .search-container { border-top: 1px solid rgba(0, 0, 0, 0.08); } } body.layout-small-header .search-container, body[class*='action_datasets_'] .search-container { right: 0; } body.layout-small-header .search-container, body[class*='action_datasets_'] .search-container { display: none; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * Mobile Login Forces login page to be mobile responsive * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ .loginSignupForm { width: 100% !important; } .loginSignupForm input { width: 100% !important; } .visually-hidden { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * LAYOUT / MISCELLANEOUS STYLES * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ body.controller_custom_content h1 { font-size: 4.8em; font-weight: 200; color: #0084C3; margin: 0.33em 0; } @media only screen and (max-width: 650px) { body.controller_custom_content h1 { font-size: 4em; } } body.controller_custom_content h2 { font-size: 2em; font-weight: 200; color: #006190; } @media only screen and (max-width: 650px) { body.controller_custom_content h2 { font-size: 2.2em; } } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * TEMPLATE STYLES * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ body.home #main { margin-top: 20px; } @media only screen and (max-width: 400px) { body.home #main { margin-top: 0; } .tile-grid { margin-bottom: 20px !important; } .tile-grid .tile { margin-bottom: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); } } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * CATEGORY PAGE STYLES * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ .category-content { margin-top: 20px; margin-bottom: 20px !important; } .category-content .category-header h1 { margin-top: 0; } .category-content .category-header p { font-size: 1.6em; line-height: 1.4em; } .category-content .catalog-container { margin-top: 20px; } .catalog-frame iframe { padding: 10px; border: 1px solid #eee; border-radius: 3px; background-color: white; min-height: 1000px; height: auto !important; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * SITE HEADER / NAVIGATION * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ header, #header { z-index: 100; } @media only screen and (max-width: 400px) { header, #header { padding-top: 8px; } } header .header-title, #header .header-title { position: relative; height: 100px; color: #7a7a7a; white-space: nowrap; } @media only screen and (max-width: 400px) { header .header-title, #header .header-title { height: 30px; } } header .header-title a, #header .header-title a { display: inline-block; height: 100%; line-height: 45px; } @media only screen and (max-width: 400px) { header .header-title a, #header .header-title a { line-height: 38px; } } header .header-title .header-logo, #header .header-title .header-logo { position: absolute; height: 100%; } header .header-title .header-text, #header .header-title .header-text { margin-left: 60px; font-size: 3.2em; font-weight: 200; letter-spacing: -0.02em; color: #7a7a7a; } @media only screen and (max-width: 400px) { header .header-title .header-text, #header .header-title .header-text { font-size: 2em; margin-left: 40px; line-height: 20px; } } header .header-links, #header .header-links { display: none; overflow: hidden; text-align: right; font-size: 1.2em; line-height: 1.2em; height: auto; } @media only screen and (max-width: 400px) { header .header-links, #header .header-links { position: relative; top: 10px; right: 2px; } } @media only screen and (min-width: 401px) { header .header-links, #header .header-links { position: relative; top: 10px; right: 0; } } @media only screen and (min-width: 768px) { header .header-links, #header .header-links { display: block; position: absolute; right: 0; top: 0; margin-bottom: 0; } } @media only screen and (max-width: 400px) { header .header-links .site-user-nav li, #header .header-links .site-user-nav li { display: block; } } header .header-links .site-user-nav li a, #header .header-links .site-user-nav li a { color: #3b5998; } header .header-links .social-nav, #header .header-links .social-nav { margin-left: 1em; } @media only screen and (min-width: 768px) { header .header-links .social-nav, #header .header-links .social-nav { position: relative; top: 2px; } } header .header-links .social-nav .fa, #header .header-links .social-nav .fa { font-size: 1.4em; } header .header-links .social-nav a, #header .header-links .social-nav a { color: #FFFFFF; } header .header-links .social-nav li:not(:first-of-type), #header .header-links .social-nav li:not(:first-of-type) { margin-left: 0.5em; } header .header-links ul, #header .header-links ul { display: inline-block; } @media only screen and (max-width: 400px) { header .header-links ul, #header .header-links ul { display: block; margin-bottom: 10px; } } header .header-links ul li, #header .header-links ul li { display: inline-block; line-height: 2em; } header .header-links ul li:not(:first-of-type), #header .header-links ul li:not(:first-of-type) { margin-left: 1em; } header .header-toggle, #header .header-toggle { display: block; position: absolute; right: 0; top: 10px; font-size: 2em; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; color: #0084C3; } header .header-toggle.toggle-highlight, #header .header-toggle.toggle-highlight { color: #00a7f6; } @media only screen and (max-width: 400px) { header .header-toggle, #header .header-toggle { right: 3px; font-size: 1.6em; } } @media only screen and (min-width: 768px) { header .header-toggle, #header .header-toggle { display: none; } } body.layout-small-header header, body[class*='action_datasets_'] header, body.layout-small-header #header, body[class*='action_datasets_'] #header { padding-top: 0; } body.layout-small-header header .header-title, body[class*='action_datasets_'] header .header-title, body.layout-small-header #header .header-title, body[class*='action_datasets_'] #header .header-title { height: 50px; } body.layout-small-header header .header-title a, body[class*='action_datasets_'] header .header-title a, body.layout-small-header #header .header-title a, body[class*='action_datasets_'] #header .header-title a { line-height: inherit; } body.layout-small-header header .header-text, body[class*='action_datasets_'] header .header-text, body.layout-small-header #header .header-text, body[class*='action_datasets_'] #header .header-text { margin-left: 30px; font-size: 2.2em; } body.layout-small-header header .header-toggle, body[class*='action_datasets_'] header .header-toggle, body.layout-small-header #header .header-toggle, body[class*='action_datasets_'] #header .header-toggle { top: 6px; } body.layout-small-header header > .container, body[class*='action_datasets_'] header > .container, body.layout-small-header #header > .container, body[class*='action_datasets_'] #header > .container { padding: 12px 0; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * FOOTER * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ footer { padding: 36px 12px 0; text-align: center; font-size: 1.2em; border-top: 1px solid transparent; color: #ffffff; background-color: #505060; } footer .site-footer-nav, footer .site-footer-copyright { margin: 36px auto; } footer .site-footer-logo .footer-logo { height: 100px; margin: 0 auto; } footer ul li { display: inline-block; line-height: 2em; float: none; } @media only screen and (max-width: 400px) { footer ul li { display: block; } } footer ul li:not(:first-of-type) { margin-left: 12px; } @media only screen and (max-width: 400px) { footer ul li:not(:first-of-type) { margin-left: 0; } } @media only screen and (min-width: 768px) { footer ul li:not(:first-of-type) { margin-left: 24px; } } @media only screen and (min-width: 1050px) { footer ul li:not(:first-of-type) { margin-left: 30px; } } footer a { color: #ffffff; } footer a:hover { color: #ffffff; } footer a:active { color: #ffffff; } footer a:visited { color: #ffffff; } footer .site-footer-copyright { line-height: 2em; } @media only screen and (min-width: 401px) { footer .site-footer-copyright > div { display: inline-block; vertical-align: middle; } } @media only screen and (max-width: 400px) { footer .site-footer-copyright > div { margin: 10px auto; } } footer .site-footer-copyright .socrata-logo { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNzkgMTAyIj48c3R5bGU+LnN0eWxlMHtmaWxsOgkjMkUyQTI1O30uc3R5bGUxe2ZpbGw6CSM1RDU5NTU7fS5zdHlsZTJ7ZmlsbDoJIzkwOEM4OTt9LnN0eWxlM3tmaWxsOgkjRjQyNTM0O308L3N0eWxlPjxwYXRoIGQ9Ik0xNDguNzM5IDMwLjQxNmMtNC4zMDItMS42ODktNi42NjQtMi40NDUtMTEuMDUtMi40NDVjLTQuNzI3IDAtMTAuMjkzIDEuNjg5LTEwLjI5MyA3LjggYzAgMTEuMyAyNS4zIDguNyAyNS4zIDI4LjA4OGMwIDEyLjU3Mi05LjcwMSAxNy41NDUtMjEuNTExIDE3LjU0NWMtNC4xMzQgMC04LjE4NS0xLjE4LTEyLjA2Mi0yLjQ0M2wwLjg0Mi03Ljg0NCBjMi44NjggMS4yIDcuOSAyLjkgMTIuMiAyLjg2NWM0LjgxMSAwIDExLjU1Ni0yLjY5NyAxMS41NTYtOS42MTdjMC0xMy4xNTMtMjUuMzA2LTkuNTI5LTI1LjMwNi0yNy44MzMgYzAtMTAuNDYyIDguMjY4LTE2LjAyOSAxOC44OTMtMTYuMDI5YzMuODgyIDAgOC41IDAuNyAxMi42IDIuMTA5TDE0OC43MzkgMzAuNDE2eiIgY2xhc3M9InN0eWxlMCIvPjxwYXRoIGQ9Ik0xNzguNjk1IDM2LjQwMmMxMy4wNzMgMCAyMS44IDkuNCAyMS44IDIyLjUyNGMwIDEyLjMxOC04Ljk0MSAyMi41MjUtMjEuODQ2IDIyLjUgYy0xMi45OSAwLTIxLjkzNi0xMC4yMDctMjEuOTM2LTIyLjUyNUMxNTYuNzU5IDQ1LjkgMTY1LjUgMzYuNCAxNzguNyAzNi40IE0xNzguNjk1IDc1IGM5LjI3NiAwIDEzLjQxMS04LjQzNiAxMy40MTEtMTYuMTExYzAtOC4xOC00Ljk3OS0xNi4xMDgtMTMuNDExLTE2LjEwOGMtOC41MiAwLTEzLjQ5NSA3LjkyOC0xMy40OTUgMTYuMSBDMTY1LjIgNjYuNiAxNjkuMyA3NSAxNzguNyA3NSIgY2xhc3M9InN0eWxlMCIvPjxwYXRoIGQ9Ik0yMzQuNzExIDQ0LjY3Yy0zLjAzMy0xLjI2NS02LjA3LTEuODUzLTguNjA1LTEuODUzYy04Ljg1NSAwLTEzLjgzIDcuOTI4LTEzLjgzIDE2LjEgYzAgNy43IDQuMSAxNi4xIDE0LjMgMTYuMTExYzIuNjk3IDAgNi4wNy0wLjg0NCA4LjUyLTIuNDQzbDAuNTg4IDcuMDg2Yy0zLjI4OSAxLjUxNi03LjA4MiAxLjc3MS05Ljk1MSAxLjggYy0xMi45OSAwLTIxLjkzMi0xMC4yMDctMjEuOTMyLTIyLjUyNWMwLTEzLjA3NSA4Ljc3My0yMi41MjQgMjEuOTMyLTIyLjUyNGMzLjIwNSAwIDcuMyAwLjggOS42IDEuNjg5TDIzNC43MTEgNDQuNjd6IiBjbGFzcz0ic3R5bGUwIi8+PHBhdGggZD0iTTI0MS4wNDcgMzcuNDE0aDcuNDJ2Ni42NjhoMC4xNzJjMi4xMDUtNC40NzUgNi42NjQtNy42ODEgMTEuMjE3LTcuNjgxYzIuMzYxIDAgMy41IDAuMyA1LjIgMC42IHY3LjA4N2MtMS40MzgtMC41OTItMy4wMzktMC43Ni00LjM4Ny0wLjc2Yy03LjA4OCAwLTExLjcyNyA2Ljc0Ny0xMS43MjcgMTcuNTQ1djE5LjU2OGgtNy45MjhWMzcuNDE0eiIgY2xhc3M9InN0eWxlMCIvPjxwYXRoIGQ9Ik0yNzIuMDkgNDAuNDU3YzMuOTY3LTIuMzY2IDguNjg5LTQuMDU1IDE0LjE3Ni00LjA1NWMxMi4zMTQgMCAxNy4zIDYuMSAxNy4zIDE3LjgwMXYxNy43OTUgYzAgNC45IDAuMiA3LjIgMC4zIDguNDM4aC03LjQyNHYtNS41NjZoLTAuMTY4Yy0xLjg1NSAyLjYxOS02LjA3NCA2LjU3OC0xMy4zMyA2LjYgYy05LjI3NSAwLTE1Ljc3MS00LjA0NS0xNS43NzEtMTMuNDA4YzAtMTAuNzk5IDExLjgxMS0xNC4xNzIgMTkuOTg4LTE0LjE3MmMzLjEyMyAwIDUuMyAwIDguNCAwLjIgYzAtNy40MjQtMi42OTctMTEuMjIyLTEwLjYyOS0xMS4yMjJjLTQuNDcxIDAtOS4yNzcgMS42ODktMTIuNDgyIDQuMzg2TDI3Mi4wOSA0MC40NTd6IE0yOTUuNjI3IDU5LjkgYy0xLjY4NiAwLTMuMzc1LTAuMTY2LTUuMDYyLTAuMTY2Yy00LjI5OSAwLTE0LjkyOCAwLjY3Mi0xNC45MjggOC4yNjZjMCA0LjYgNC40IDcgOCA3IGM3Ljg0NCAwIDExLjk3OS00Ljg5MSAxMS45NzktMTEuMzAxVjU5LjkzOXoiIGNsYXNzPSJzdHlsZTAiLz48cGF0aCBkPSJNMzM2LjAzOSA0My44MjZoLTExLjM4NXYyMy41NDFjMCA1IDMgNy43IDYuNyA3LjY3YzIuNDQ1IDAgNC4yMjEtMC43NTQgNS40LTEuNTE2djYuNzQ2IGMtMS43NzMgMC41MS00LjIxOSAxLjE4LTYuNzQ4IDEuMThjLTguMTg0IDAtMTMuMjQ2LTMuODc3LTEzLjI0Ni0xMi40OFY0My44MjZoLTkuNzAxdi02LjQxMmg5LjcwMXYtOS45NTNsNy45MzItMi41Mjh2MTIuNDgxIGgxMS4zODVWNDMuODI2eiIgY2xhc3M9InN0eWxlMCIvPjxwYXRoIGQ9Ik0zNDQuMjI5IDQwLjQ1N2MzLjk2Ny0yLjM2NiA4LjY4OS00LjA1NSAxNC4xNzItNC4wNTVjMTIuMzEyIDAgMTcuMyA2LjEgMTcuMyAxNy44MDF2MTcuNzk1IGMwIDQuOSAwLjIgNy4yIDAuMyA4LjQzOGgtNy40MjR2LTUuNTY2aC0wLjE2OGMtMS44NTIgMi42MTktNi4wNyA2LjU3OC0xMy4zMjYgNi42IGMtOS4yODEgMC0xNS43NzUtNC4wNDUtMTUuNzc1LTEzLjQwOGMwLTEwLjc5OSAxMS44MTEtMTQuMTcyIDE5Ljk5NC0xNC4xNzJjMy4xMjEgMCA1LjMgMCA4LjQgMC4yIGMwLTcuNDI0LTIuNzAzLTExLjIyMi0xMC42MzEtMTEuMjIyYy00LjQ2OSAwLTkuMjgxIDEuNjg5LTEyLjQ4NiA0LjM4NkwzNDQuMjI5IDQwLjQ1N3ogTTM2Ny43NjYgNTkuOSBjLTEuNjg5IDAtMy4zNzUtMC4xNjYtNS4wNjItMC4xNjZjLTQuMzAzIDAtMTQuOTMyIDAuNjcyLTE0LjkzMiA4LjI2NmMwIDQuNiA0LjQgNyA4IDcgYzcuODQ0IDAgMTEuOTc5LTQuODkxIDExLjk3OS0xMS4zMDFWNTkuOTM5eiIgY2xhc3M9InN0eWxlMCIvPjxwYXRoIGQ9Ik05Ni4yMDMgMzAuNTI4bC0xLjA4MyAwLjUxM0w4OS41MyAzMy43YzIuNDgzIDUuNCAzLjkgMTEuMyAzLjkgMTcuNiBjMCAyMy4zMDctMTguOTU5IDQyLjI2Ni00Mi4yNjYgNDIuMjY2Yy0yMy4zMSAwLTQyLjI3Ny0xOC45NTktNDIuMjc3LTQyLjI2NmMwLTIzLjMxMiAxOC45NjctNDIuMjc0IDQyLjI3Ny00Mi4yNzQgYzQuODkzIDAgOS42IDAuOCAxNCAyLjM3OWwyLjAzMi01LjgzNmwwLjM5NS0xLjEzNUM2Mi4zOTcgMi43IDU2LjkgMS43IDUxLjEgMS43IGMtMjcuMzgzIDAtNDkuNjU5IDIyLjI3Ni00OS42NTkgNDkuNjYxQzEuNDgxIDc4LjcgMjMuOCAxMDEgNTEuMSAxMDFjMjcuMzc4IDAgNDkuNjQ5LTIyLjI3NSA0OS42NDktNDkuNjUzIEMxMDAuNzg5IDQzLjkgOTkuMSAzNi45IDk2LjIgMzAuNTI4eiIgY2xhc3M9InN0eWxlMCIvPjxwYXRoIGQ9Ik02Mi42MTEgMTguNjJjLTMuNTk3LTEuMjIyLTcuNDU2LTEuODk5LTExLjQ2OS0xLjg5OWMtMTkuMzkyIDAtMzUuMTczIDE1LjUzMy0zNS4xNzMgMzQuNiBjMCAxOS4xIDE1LjggMzQuNiAzNS4yIDM0LjYzNmMxOS4zODggMCAzNS4xNjItMTUuNTM3IDM1LjE2Mi0zNC42MzZjMC01LjE5My0xLjE3NC0xMC4xMi0zLjI2OS0xNC41NTJsLTEuMTI1IDAuNSBsLTUuNjk4IDIuNzE2YzEuNjI1IDMuNCAyLjYgNy4zIDIuNiAxMS4zMDVjMCAxNC45NDEtMTIuMzkzIDI3LjEwNS0yNy42MjggMjcuMTA1Yy0xNS4yMzcgMC0yNy42MzctMTIuMTY0LTI3LjYzNy0yNy4xMDUgYzAtMTQuOTM1IDEyLjQtMjcuMDg2IDI3LjYzNy0yNy4wODZjMy4xNSAwIDYuMiAwLjUgOSAxLjUwMmwyLjA3MS01Ljk1OEw2Mi42MTEgMTguNjJ6IiBjbGFzcz0ic3R5bGUxIi8+PHBhdGggZD0iTTUxLjEzOCA2NC4xMTVjLTcuMzYzLTAuMDEyLTEzLjMxMS01Ljk1NS0xMy4zMjQtMTMuMzIyYzAuMDE0LTcuMzYgNS45NjMtMTMuMzA5IDEzLjMyNC0xMy4zMTggYzEuNjI0IDAgMy4yIDAuMyA0LjYgMC44NDVsMi4zOS02Ljg2NGMtMi4xOTEtMC43OTMtNC41NDMtMS4yNS03LjAwNi0xLjI1Yy0xMS4zNzYgMC4wMDQtMjAuNTg5IDkuMjE1LTIwLjU4OSAyMC42IGMwIDExLjQgOS4yIDIwLjYgMjAuNiAyMC41ODljMTEuMzcxIDAgMjAuNTg2LTkuMjA5IDIwLjU4Ni0yMC41ODloMC4wMDVjLTAuMDA1LTIuNzkyLTAuNTY3LTUuNDQ2LTEuNTctNy44NzcgbC02LjU5MSAzLjEzNmMwLjU2NCAxLjUgMC45IDMuMSAwLjkgNC43NDJDNjQuNDQ1IDU4LjIgNTguNSA2NC4xIDUxLjEgNjQuMTE1eiIgY2xhc3M9InN0eWxlMiIvPjxwYXRoIGQ9Ik02MS41NTIgNDAuMjQ4bDM3LjM0My0xNy43NTVDOTMuMjc3IDEzLjIgODUgNS43IDc1LjIgMUw2MS41NTIgNDAuMjQ4eiIgY2xhc3M9InN0eWxlMyIvPjwvc3ZnPg=="); opacity: 0.75; background-repeat: no-repeat; height: 22px; width: 80px; } footer .site-footer-copyright .socrata-logo a { display: block; width: 100%; height: 100%; } @media only screen and (min-width: 401px) { footer .site-footer-copyright .copyright { margin-right: 3em; } } body.layout-small-footer footer, body[class*='action_datasets_'] footer { padding: 0 12px; border-top: 0; color: #ffffff; background-color: #f7f7f7; max-height: 36px; overflow: hidden; } body.layout-small-footer footer a, body.layout-small-footer footer a:hover, body.layout-small-footer footer a:visited, body.layout-small-footer footer a:active, body[class*='action_datasets_'] footer a, body[class*='action_datasets_'] footer a:hover, body[class*='action_datasets_'] footer a:visited, body[class*='action_datasets_'] footer a:active { color: #ffffff; } body.layout-small-footer footer .container, body[class*='action_datasets_'] footer .container { display: -ms-flexbox; display: flex; } body.layout-small-footer footer .site-footer-nav, body.layout-small-footer footer .site-footer-copyright, body[class*='action_datasets_'] footer .site-footer-nav, body[class*='action_datasets_'] footer .site-footer-copyright { margin: 6px 0; } body.layout-small-footer footer .site-footer-nav, body[class*='action_datasets_'] footer .site-footer-nav { float: left; text-align: left; } body.layout-small-footer footer .site-footer-copyright, body[class*='action_datasets_'] footer .site-footer-copyright { float: right; white-space: nowrap; text-align: right; -ms-flex: 1 0 auto; flex: 1 0 auto; } body.layout-small-footer footer .site-footer-copyright > div, body[class*='action_datasets_'] footer .site-footer-copyright > div { display: inline-block; vertical-align: middle; } @media only screen and (max-width: 400px) { body.layout-small-footer footer .site-footer-copyright > div, body[class*='action_datasets_'] footer .site-footer-copyright > div { margin-top: 0; } } body.layout-small-footer footer .site-footer-copyright .copyright, body[class*='action_datasets_'] footer .site-footer-copyright .copyright { margin-right: 1em; } body.layout-small-footer .site-footer-logo, body[class*='action_datasets_'] .site-footer-logo { display: none; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * COMPONENTS * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * TILE GRID - CATEGORIES Presentation for tiles containing categories. * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ .category-tiles .tile { background-color: #0084C3; cursor: pointer; } .category-tiles .tile .tile-icon { font-size: 3.5em; text-align: center; color: white; margin-top: 45px; } .category-tiles .tile .tile-title { font-size: 1.2em; text-align: center; color: white; margin-top: 20px; padding: 5px; } .category-tiles .tile .tile-description { display: none; position: absolute; margin: 10px; color: #5f5f5f; background-color: white; overflow: hidden; } .category-tiles .tile .tile-description p { padding: 12px; line-height: 1.2em; font-size: 1em; } .category-tiles .tile > a, .category-tiles .tile > div { position: absolute; display: block; top: 0; left: 0; right: 0; bottom: 0; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * 4x FEATURED STORIES * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ @media only screen and (min-width: 768px) and (max-width: 1049px) { .featured-tiles .tile { width: calc(50% - 10px); } .featured-tiles .id-clone .tile { margin-right: 20px; } .featured-tiles .id-clone:nth-of-type(2n) .tile { margin-right: 0; } } .featured-tiles .tile { height: auto; } .featured-tiles .tile-image { height: 165px; width: 100%; background-position: center; background-size: cover; border: 1px solid lightgray; } @media only screen and (max-width: 400px) { .featured-tiles .tile-image { border-left-width: 0 !important; border-right-width: 0 !important; } } .featured-tiles .tile-image:hover { border: 1px solid #3b5998; } .featured-tiles .tile-image a { display: block; width: 100%; height: 100%; } .featured-tiles .tile-title { margin: 16px 0; font-size: 1em; line-height: 1.2em; color: #3b5998; } @media only screen and (max-width: 650px) { .featured-tiles .tile-title { padding-left: 10px; padding-right: 10px; } } .featured-tiles .tile-description { font-size: 1em; line-height: 1.2em; color: #000000; margin-bottom: 20px; } @media only screen and (max-width: 650px) { .featured-tiles .tile-description { padding-left: 10px; padding-right: 10px; } } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * SIDEBAR - Raleigh / Soapbox style * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ .sidebar { background-color: #f1f1f1; font-size: 1.6em; } .sidebar a:hover { text-decoration: none; } .sidebar a:hover .section { background-color: #e9e9e9; } .sidebar .section { padding: 18px; border-bottom: 1px solid #e2e2e2; } .sidebar .section .label { color: #3b5998; } .sidebar .section.no-border { border-bottom-width: 0; } .sidebar .message { position: relative; padding: 18px; min-height: 120px; font-weight: 200; color: white; } .sidebar .message.developer { background-color: #555555; } .sidebar .message.explore { background-color: #6a6a6a; } .sidebar .message h3 { font-weight: 200; margin-bottom: 8px; } .sidebar .message .description { font-size: 1.4em; } .sidebar .message .more { position: absolute; right: 18px; bottom: 18px; font-size: 1.2em; } .sidebar .message .more:after { content: '\25b8'; margin-left: 0.4em; } .sidebar .message .api-counter { position: absolute; left: 18px; bottom: 18px; font-size: 1.2em; } .sidebar .icon { display: inline-block; position: relative; top: 2px; left: -6px; width: 30px; text-align: center; } .sidebar .twitter { padding: 8px; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * WALLPAPER * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ .wallpaper { position: relative; } .wallpaper .wallpaper-image { height: 100%; min-height: 310px; background-size: cover; background-repeat: no-repeat; background-position: center center; background-color: black; overflow: hidden; } .wallpaper .wallpaper-content { position: relative; margin: 50px auto; padding: 40px; width: 75%; max-width: calc(75% * 1200px); background-color: rgba(80, 80, 96, 0.9); color: white; } .wallpaper .wallpaper-content h1 { font-size: 2em; color: inherit; margin-top: 0; } .wallpaper .wallpaper-content p { font-size: 1.2em; line-height: 1.4em; } /* Design One Govstat Page By James Chuang Last Updated: July 11th 2014 */ /* GovStat Component */ body.rally-home .siteContentWrapper { padding: 0; } body.rally-home .dashboardHeader { position: relative; height: 310px; overflow: hidden; display: block; } body.rally-home .dashboardTitle { position: absolute; top: 0; left: 0; right: 0; background-color: rgba(80, 80, 96, 0.9); max-width: 840px; margin: 60px auto 0 auto; padding: 40px 40px 0 40px; color: #fff; } body.rally-home .dashboardTitle h2 { font-size: 3.6em; } body.rally-home .dashboardTitle h1, body.rally-home .dashboardTitle h2, body.rally-home .dashboardTitle h3, body.rally-home .dashboardTitle h4, body.rally-home .dashboardTitle h5, body.rally-home .dashboardTitle h6, body.rally-home .dashboardTitle p { color: #fff; } body.rally-home .dashboardDescription { margin: 69px auto 0 auto; padding: 10px 40px; max-width: 840px; max-height: 105px; background-color: rgba(80, 80, 96, 0.9); position: absolute; top: 85px; left: 0; right: 0; overflow: auto; } body.rally-home .dashboardDescription h1, body.rally-home .dashboardDescription h2, body.rally-home .dashboardDescription h3, body.rally-home .dashboardDescription h4, body.rally-home .dashboardDescription h5, body.rally-home .dashboardDescription h6, body.rally-home .dashboardDescription p { color: #fff; line-height: 1.4em; } body.rally-home .dashboardDescription a { color: #ffffff; text-decoration: underline; font-weight: 600; } body.rally-home .dashboardDescription h1 { font-size: 3.6em; } body.rally-home .dashboardDescription p { font-size: 1.4em; } body.rally-home .dashboardImage.full > img { width: 100%; background-size: cover; margin-top: -20%; } body.rally-home .gridFlowLayoutNew { padding: 0 40px; max-width: 1200px; margin: auto; } body.rally-home .goalList { max-width: 1200px; margin: 0 auto; } body.rally-home .categoryTitle { border-bottom: none; margin-bottom: 0; position: relative; } body.rally-home .gridFlowLayoutNew .singleItem .singleInner { width: 100%; height: 180px; } body.rally-home .gridFlowLayoutNew .singleItemWrapper { display: inline-block; width: calc(25% - 20px); margin-right: 20px; margin-bottom: 20px; } body.rally-home .categoryTitle h2 { margin: 10px auto; } body.rally-home .dashboardImage.blur { display: none; } /* Govstat overrides */ .gridFlowLayoutNew .goalItem .singleInner .goalValue { font-size: 4em; } .gridFlowLayoutNew .singleItem .singleInner .itemTitle { font-size: 1.7em; height: 3.3em; } .gridFlowLayoutNew .goalItem .singleInner .goalUnit { font-size: 1.4em; margin-top: 0; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * CUSTOM STYLESHEETS * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ header, #header { padding-top: 0 !important; } header .row, #header .row { padding: 0; margin: 0; } header .container, #header .container { max-width: 100%; margin: 0; padding: 0; } header .nav-banner .container, #header .nav-banner .container { max-width: 1200px; padding: 0 40px; } header nav.nav-banner, header #nav.nav-banner, #header nav.nav-banner, #header #nav.nav-banner { margin-top: 0; } header .header-title, header #header .header-title, #header .header-title, #header #header .header-title { background: #214363; height: 100px !important; } @media only screen and (min-width: 768px) { header .header-links, header #header .header-links, #header .header-links, #header #header .header-links { top: 10px !important; right: 10px !important; } header .search-container, #header .search-container { right: 10px; } } @media only screen and (max-width: 401px) { header .search-container, #header .search-container { margin-top: 0px; } } .gridFlowLayoutNew .goalItem .singleInner .goalIcon.hasIcon.ss-like { color: #38B400; } .gridFlowLayoutNew .goalItem .singleInner .goalIcon.hasIcon.ss-dislike { color: #C3000E; } .gridFlowLayoutNew .goalItem .singleInner .goalIcon.hasIcon.ss-leftright { color: #505060; } .gridFlowLayoutNew .goalItem .singleInner .goalIcon.hasIcon.ss-hyphen { color: #505060; } .gridFlowLayoutNew .goalItem .singleInner .goalIcon.hasIcon ~ .goalProgress { left: 5.8em; } .gridFlowLayoutNew .goalItem .singleInner .goalProgress .progressIcon { line-height: 1.8em; height: 1.5em; width: 1.5em; } #siteFooter { display: block !important; } body.rally-home .gridFlowLayoutNew .singleItemWrapper { width: calc(20% - 20px) !important; min-width: 204px; } .gridFlowLayoutNew .singleItem .singleInner .itemTitle h3 { font-size: 1.8em; } .gridFlowLayoutNew .goalItem .singleInner .goalValue { font-size: 3.8em; } /* Header */ #header-img img { width: 100%; } .nav { background: #406496; width: 100%; overflow: hidden; margin-top: -2px; } .nav li { padding: 15px 2px; background: #406496; font-size: 1.5em; color: #fff; min-width: 12%; text-align: center; } #siteHeader .clearfix { background: #505060; border-bottom: 1px solid #243957; } #siteHeader .siteUserNav li a { color: #fff; } #siteHeader .siteUserNav li a.miGov { background-image: url(https://data.michigan.gov/api/assets/97F5F29C-9608-4BC3-AF37-B67D41A5CF53); padding-top: 10px; padding-bottom: 10px; padding-left: 35px; background-repeat: no-repeat; } .wallpaper-image a { color: #ffffff; text-decoration: underline; font-weight: 600; } .progressIcon.progress-no_judgement { display: none; } .progressText.progress-no_judgement { display: none; } body.rally-home .dashboardTitle { margin: 50px auto 0 auto; padding: 20px 40px 0 40px; } body.rally-home .dashboardDescription { margin: 70px auto 0 auto; padding: 27px 0 20px 40px; max-height: 140px; top: 54px; } body.rally-home .dashboardDescription p { padding-right: 1em; } nav.nav-banner { overflow: visible; } nav.nav-banner .nav-links li .dropdown-dashboard-menu { display: none; background-color: #0084C3; } nav.nav-banner .nav-links li .dropdown-dashboard-menu li { position: relative; display: block; margin-right: 0px; } @media only screen and (min-width: 401px) { nav.nav-banner .nav-links li:hover .dropdown-dashboard-menu { display: block; z-index: 10000; position: absolute; } } @media only screen and (max-width: 400px) { nav.nav-banner .nav-links li .dropdown-dashboard-menu.rolldown { display: block; background-color: steelblue; } } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * Borrowed from Hiko's IE8 fix for IRS These are styles specific to IE8 Assumptions: - No support for responsive design - Fixed width of 960 pixels wide: 960 was chosen based on the fact that most IRS internal users are still on IE8, and thus assumed they may still have monitors that may be only 1028 pixels wide - Some HTML5 tags (header, footer, etc.) are not recognized * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ .ie8 .controller_custom_content .container, .ie8 .controller_browse .container, .ie8 .controller_profile .container { width: 960px; margin-left: auto; margin-right: auto; } .ie8 .controller_browse .siteContentWrapper, .ie8 .controller_profile .siteContentWrapper { width: 960px; margin-left: auto; margin-right: auto; } .ie8 #siteHeader .container { width: auto; } .ie8 #siteHeader .header-title { background: #214363; } .ie8 #siteHeader .header-title img { width: 800px; height: 100px; } .ie8 #siteHeader .header-links { position: absolute; top: 0; right: 0; } .ie8 #siteHeader .header-links ul li { display: block; float: left; margin-left: 1em; line-height: 2em; } .ie8 #siteHeader .header-links ul li:first-child { margin-left: 0; } .ie8 #siteHeader .header-links ul li a { color: #3b5998; } .ie8 #siteHeader .header-toggle { display: none; } .ie8 #siteHeader .search-container { margin-right: 15px; } .ie8 #siteHeader .search-container form input[type=text] { width: 250px; } .ie8 #siteHeader .nav-banner { margin-top: 0; } .ie8 .controller_browse .search-container form input[type=text], .ie8 .controller_profile .search-container form input[type=text], .ie8 .controller_odysseus .search-container form input[type=text] { height: 22px; } .ie8 .wallpaper .wallpaper-content { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FF505060,endColorstr=#FF505060); } .ie8 #siteFooter { padding: 36px 12px 0; border-top: 1px solid transparent; background-color: #505060; color: white; text-align: center; font-size: 12px; } .ie8 #siteFooter .site-footer-nav { margin: 36px auto; } .ie8 #siteFooter .site-footer-nav-bottom { margin-bottom: 36px; } .ie8 #siteFooter ul { clear: both; } .ie8 #siteFooter ul li { display: inline; margin-left: 30px; } .ie8 #siteFooter ul li:first-child { margin-left: 0; } .ie8 #siteFooter ul li a { color: white; } .ie8 .controller_datasets #siteHeader .header-title img, .ie8 .controller_administration #siteHeader .header-title img { width: 800px; height: 100px; } .ie8 .controller_datasets #siteFooter, .ie8 .controller_administration #siteFooter { padding: 10px 0; } .ie8 .controller_datasets #siteFooter ul, .ie8 .controller_administration #siteFooter ul { width: 50%; float: left; clear: none; } .ie8 .controller_datasets #siteFooter ul.site-footer-nav, .ie8 .controller_administration #siteFooter ul.site-footer-nav { margin: 0; text-align: left; } .ie8 .controller_datasets #siteFooter ul.site-footer-nav li:first-child, .ie8 .controller_administration #siteFooter ul.site-footer-nav li:first-child { margin-left: 10px; } .ie8 .controller_datasets #siteFooter ul.site-footer-nav-bottom, .ie8 .controller_administration #siteFooter ul.site-footer-nav-bottom { margin: 0; text-align: right; } .ie8 .controller_datasets #siteFooter ul.site-footer-nav-bottom li, .ie8 .controller_administration #siteFooter ul.site-footer-nav-bottom li { margin-left: 20px; margin-right: 10px; } .ie8 .controller_datasets #siteHeader .search-container, .ie8 .controller_user_sessions #siteHeader .search-container, .ie8 .controller_administration #siteHeader .search-container { display: none; } .ie8 .tile-grid .tile { width: 220px; } .ie8 .category-tiles .tile > a { width: 100%; height: 100%; } .ie8 .wallpaper .wallpaper-image, .ie8 .featured-tiles .tile-image { -ms-behavior: url(/api/assets/7061FC3B-D1B0-4368-A449-7DDDF962BDE6?backgroundsize.min.htc); } .ie8 .featured-tiles .background-size-polyfill img { cursor: pointer !important; }