/** Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, hr, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, main, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

main, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

html { font-size: 62.5%; text-align: left; }

table { border-collapse: collapse; border-spacing: 0; }

th { text-align: inherit; }

li { list-style-type: none; }

a { color: inherit; text-decoration: inherit; outline: 0; }

input, textarea, button, select { margin: 0; padding: 0; font-family: inherit; font-size: inherit; font-weight: inherit; color: inherit; }

input, textarea { -moz-user-select: text; }

textarea { line-height: inherit; resize: none; }

button { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; background: none; text-shadow: inherit; }

a, button, select, input[type=submit], input[type=checkbox] { cursor: pointer; }
a:disabled, button:disabled, select:disabled, input[type=submit]:disabled, input[type=checkbox]:disabled { cursor: auto; }

button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; }

[hidden] { display: none !important; }

td[hidden] { display: table-cell !important; visibility: hidden; }

fieldset { min-width: 0; }

@-moz-document url-prefix() { fieldset { display: table-cell; } }
@font-face { font-family: "Aino"; font-weight: normal; font-style: normal; src: url("/assets/aino-regular.eot"); src: url("/assets/aino-regular.eot?#iefix") format("embedded-opentype"), url("/assets/aino-regular.woff") format("woff"), url("/assets/aino-regular.ttf") format("truetype"); }
@font-face { font-family: "Aino"; font-weight: bold; font-style: normal; src: url("/assets/aino-bold.eot"); src: url("/assets/aino-bold.eot?#iefix") format("embedded-opentype"), url("/assets/aino-bold.woff") format("woff"), url("/assets/aino-bold.ttf") format("truetype"); }
html, body { height: 100%; }

body { background-color: white; font-family: Aino, sans-serif; display: flex; flex-direction: column; color: #222; text-align: left; }

strong { font-weight: bold; }

big { font-size: 130%; }

section center { padding-top: 6rem; padding-bottom: 8rem; }
@media only screen and (max-width: 569px) { section center { padding-top: 4rem; padding-bottom: 4rem; } }

center { max-width: 100rem; margin: 0 auto; padding: 0 6rem; text-align: inherit; }
@media only screen and (max-width: 569px) { center { padding-left: 2rem; padding-right: 2rem; } }
center > * { margin-right: auto; }

.white-section + .white-section center { padding-top: 0; }

.grey-section { background-color: #f2f2f2; }

.text-section { font-size: 1.6rem; line-height: 1.6; hyphens: manual; }
.text-section center { max-width: 80rem; }
.text-section * + h2 { margin-top: 4rem; }
.text-section * + h3 { margin-top: 4rem; }
.text-section ul { margin: 2.56rem 0; }
.text-section ul li { margin-left: 4rem; list-style-type: disc; }
.text-section img { max-width: 100%; }

.heading, .text-section h1 { font-size: 3.4rem; color: #312f9d; margin-bottom: 2rem; line-height: 1.5; }
@media only screen and (max-width: 569px) { .heading, .text-section h1 { font-size: 3rem; } }

.subheading, .text-section h2 { font-size: 2.6rem; color: #312f9d; margin-bottom: 2rem; line-height: 1.5; }

.subsubheading, .text-section h3 { color: #312f9d; font-size: 2rem; line-height: 1.5; }

.paragraph, .text-section p { font-size: 1.6rem; line-height: 1.6; }
.paragraph + p, .text-section p + p { margin-top: 2.56rem; }

.paragraph a, .text-section a { color: #339; border-bottom: 1px solid #339; }
.paragraph a:visited, .text-section a:visited { color: #6666cc; border-color: #d9d9f2; }

#nav, #footer { color: white; background: #312f9d; }

#main { flex-grow: 1; }

#nav { padding: 2rem 0; line-height: 3rem; }
#nav .home { display: inline-block; vertical-align: top; font-weight: bold; font-size: 1.8rem; height: 3rem; margin-right: 2rem; }
#nav .home img { height: 100%; }
#nav menu a { display: inline-block; padding: 0 1rem; }
#nav menu { float: right; }
#nav menu a { border-radius: 0.3rem; border: 1px solid transparent; font-size: 1.3rem; margin-left: 0.3rem; }
#nav menu a.selected { color: #312f9d; background-color: white; font-weight: bold; }
#nav menu a:hover { border-color: white; }
@media only screen and (max-width: 569px) { #nav { line-height: 2; padding: 2rem 0 1rem; }
  #nav center { padding: 0 2rem; }
  #nav .home { display: block; font-size: 2.4rem; }
  #nav menu { float: none; }
  #nav menu a { margin: 0.5rem 0.5rem 0.1rem 0; } }

#home-page #welcome p { width: 50%; padding-right: 2rem; }
#home-page #welcome iframe { float: right; width: 44rem; max-width: 50%; height: 24.75rem; margin-bottom: 3rem; }
#home-page #welcome menu { clear: both; margin-top: 4rem; text-align: center; }
#home-page #welcome menu a { margin-right: 4rem; }
@media only screen and (max-width: 865px) { #home-page #welcome p { width: auto; padding-right: 0; }
  #home-page #welcome iframe { float: none; width: 100%; max-width: none; } }
#home-page #vision { position: relative; text-align: center; }
#home-page #vision .text-section center { max-width: 64rem; }
#home-page #vision .unpointable { pointer-events: none; }
#home-page #vision #vision-visions { display: block; margin: 0 auto 1rem; }
#home-page #vision #vision-visions strong { font-weight: bold; }
#home-page #vision #vision-visions .vision-arc { cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-user-select: none; user-select: none; }
#home-page #vision #vision-visions .vision-arc .fillable { fill: white; }
#home-page #vision #vision-visions .vision-arc text { fill: #312f9d; font-weight: 500; font-size: 1.7rem; }
#home-page #vision #vision-visions .vision-arc.highlighted .fillable { fill: #312f9d; filter: url(#vision-shadow); }
#home-page #vision #vision-visions .vision-arc.highlighted text { fill: white; }
#home-page #vision #vision-visions .vision-description p { text-align: center; font-family: serif; padding: 0.5rem; font-size: 1.3rem; }
#home-page #vision .initiative, #home-page #vision .initiative-details { background: white; text-align: left; }
#home-page #vision .initiative { display: inline-block; vertical-align: top; box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.4); transition: transform 200ms ease-out, box-shadow 200ms ease-out, opacity 200ms ease-out; }
#home-page #vision .initiative .initiative-title { display: block; height: 4.8rem; overflow: hidden; color: #757575; margin: 1rem 1rem 0.7rem; font-size: 1.3rem; line-height: 1.6rem; hyphens: auto; text-overflow: ellipsis; }
#home-page #vision .initiative .initiative-progress { height: 1rem; background-image: none; }
#home-page #vision .initiative.inline { margin-bottom: 1rem; margin-right: 1rem; }
#home-page #vision .initiative.highlighted { box-shadow: 0 1px 10px 1px rgba(49, 47, 157, 0.6); }
#home-page #vision .initiative.highlighted .initiative-title { color: #222; }
#home-page #vision .initiative.disabled { transform: scale(0.9); opacity: 0.5; }
#home-page #vision .initiative-details { width: 260px; min-height: 97px; margin-left: -130px; margin-top: -48.5px; z-index: 100; box-shadow: 0 1px 10px 1px rgba(0, 0, 0, 0.5); border-radius: 0.8rem; animation: 150ms ease-out forwards scale-in; overflow: hidden; }
#home-page #vision .initiative-details .initiative-title { display: block; min-height: 51px; margin: 13px; font-size: 1.4rem; font-weight: 500; line-height: 17px; color: black; }
#home-page #vision .initiative-details .initiative-title small { font-family: serif; font-size: 1.3rem; color: #7d7d7d; }
#home-page #vision .initiative-details .initiative-progress { padding-left: 13px; height: 20px; line-height: 22px; font-size: 1.1rem; font-weight: normal; background-image: none; }
#home-page #vision .initiative-progress { display: block; padding-left: 2rem; padding-right: 2rem; font-size: 1.3rem; font-weight: bold; color: #3a434a; background-color: #eee; background-repeat: no-repeat; }
#home-page #vision .initiative-progress.private { color: white; background-color: #9a9a9a; }
#home-page #vision .initiative-progress.discussable.completed { background-color: #ffb400; background-image: url(/images/discussion-over.png); background-position: 1rem center; padding-left: 3.5rem; }
#home-page #vision .initiative-progress.votable.completed { color: white; background-color: #00cb81; background-image: url(/images/vote-success.png); background-position: 1rem center; padding-left: 3.5rem; }
#home-page #vision .initiative-progress.processable { color: #1C71A2; background-image: url(/images/clock.png); background-position: 1rem center; padding-left: 3.5rem; }
#home-page #vision .initiative-progress.finished { color: #1C71A2; background-image: url(/images/discussion-over.png); background-position: 1rem center; padding-left: 3.5rem; }
#home-page #vision .initiative-progress.failed { color: white; background-color: #9a9a9a; background-image: url(/images/vote-failed.png); background-position: 1rem center; padding-left: 3.5rem; }

#footer { padding: 4rem 0; font-size: 1.4rem; line-height: 1.6; }
#footer h2 { font-weight: bold; margin-bottom: 1rem; }
#footer a { text-decoration: underline; }
