﻿
body                     { padding: 0; margin: 0; background-color: #e0e0f0 }

body,
button                   { font-family: Arial, Helvetica, sans-serif }

.page                    { margin: 0 auto; min-width: 300px; max-width: 860px }


/* Header */
.heading                 {  }
.header                  { height: 95px; background-color: #222289; color: white; padding: 0 18px }

.skip                    { float: right; margin: 0; padding-top: 8px }
.skip a,
.skip a:link,
.skip a:visited          { color: #222289 }
.skip a:focus,
.skip a:active,
.skip a:hover            { color: white }

.logo,
.tagline                 { font-weight: bold; margin: 0; padding: 0 }
.logo                    { font-size: 42pt; margin-left: -3px }
.tagline                 { font-size: 13pt }


/* Navigation */
.navigation              { background-color: #161659; font-weight: bold }
.navigation .menu        { display: none }
.navigation ol           { list-style-type: none; margin: 0; padding: .7em 0 .5em 11px }
.navigation li           { margin-right: .3em; display: inline; white-space: nowrap }
.navigation a:link,
.navigation a:visited    { text-decoration: none; color: white; padding: .3em .5em .5em .5em }
.navigation a.current,
.navigation a:hover      { color: #161659; background-color: white }


/* Main Content */
.content                 { padding: 1.3em 18px; min-height: 550px; background-color: white;
                           border-left: 1pt #1C3149 solid; border-right: 1pt #1C3149 solid }

.content p               { line-height: 1.5 }

.content img             { width: auto !important; height: auto !important; max-width: 100% }


/* Footer */
.footer                  { font-weight: bold; padding: 10px 18px 5px 18px; color: white; background-color: #161659 }
.footer a:link,
.footer a:visited        { color: white }


/* General */
table                    { margin-bottom: .8em }
th                       { text-align: left }
th p,
td p                     { margin: 0 }
caption                  { font-weight: bold; text-align: left; caption-side: top }

p                        { margin: 0 0 .8em 0 }

h1, h2, h3, h4           { color: #161659 }
h1                       { font-size: 150%; margin: 0 0 .3em 0 }
h2                       { font-size: 125%; margin: 2em 0 .5em 0 }
h3                       { font-size: 115%; margin: 1.2em 0 .5em 0 }
h4                       { font-size: 100%; margin: 1em 0 .5em 0 }

dt                       { margin-top: 1em; margin-bottom: .2em }

a:link,
a:hover                  { color: #11116D }
a:visited                { color: #444 }

a[href^="http"]          { background: url("../images/external.png") center right no-repeat; padding: 0 13px 0 0 }

.disperse li             { margin-bottom: 0.5em }

.mainlist                { padding-left: 1.8em }
.mainlist li             { margin-bottom: 1.1em }

.highlight               { color: #872121 }
.highlight2              { color: #11116D }

.clr                     { clear: both }


/* Reports */
.block dt                { margin-top: 2em; margin-bottom: .3em; padding-top: .3em; border-top: 1px black dotted;
                           font-weight: bold }
.block dt:first-child    { margin-top: 1.5em }

.block dt a              { text-decoration: none }
.block dt a:focus,
.block dt a:active,
.block dt a:hover        { text-decoration: underline }

.block dd                { margin-left: 0 }
.block dd p              { margin-bottom: .3em }

table.plain              { border-collapse: collapse; margin: 1em 0 }
.plain th,
.plain td                { padding: 6px 8px; border: 1pt black solid; vertical-align: top; font-weight: normal }
.plain th                { text-align: left }
.plain td                { text-align: right }
.plain th p,
.plain td p              { margin: 0 }


/* Sources of Statistics */
.toggle                  { display: none }
.toggle.show             { display: block }

.stats                   { margin-bottom: .8em }

.stats-header            { padding: .5em; background-color: #e0e0f0 }
.js .stats-header        { display: flex; padding-left: 0 }
.stats-header-icon       { flex: none; width: 35px; height: 30px; margin: auto 0; border: 0; background-color: #e0e0f0; cursor: pointer }
.stats-header-icon svg   { fill: none; stroke: #222289; stroke-linecap: round; stroke-linejoin: round; stroke-width: 32px;
                           transition: transform .2s ease-in }
.collapse .stats-header-icon svg { transform: rotate(-90deg) }
.stats-header-icon span  { display: none }

.stats .pointer          { cursor: pointer }
.stats h2                { font-size: 115%; margin: 0 0 .2em 0 }
.stats p.title           { font-size: 90%; font-weight: bold; margin: 0; padding: 0; line-height: normal }

.stats dl                { display: grid; grid-template-columns: 30% 70%; margin: .5em 0 .7em .5em }
.stats.js dl             { margin-left: 35px }
.stats.collapse dl       { display: none }
.stats dt,
.stats dd                { margin: 0 0 .5em 0; padding: .5em 0 0 0; border-top: 1px solid #0F253F }
.stats dt                { font-weight: bold; padding-right: 1em }
.stats dd p              { margin: 0 0 .5em 0 }


/* Minutes, Reports & Consultations */
.attendees td            { vertical-align: top; padding-bottom: .4em; padding-right: .5em }

table.actions            { width: 95%; margin: 1em 0; border-collapse: collapse }
.actions th,
.actions td              { padding: .4em; border: 1pt black solid; vertical-align: top }

table.boxes              { margin: 1em 0; border-collapse: collapse }
.boxes th,
.boxes td                { padding: .4em; border: 1pt black solid; vertical-align: top }

.action-block            { margin-bottom: .8em; padding: .6em .5em 0 .5em; border: 1px black solid }

.action                  { color: #132F4F; font-weight: bold }

.section                 { font-weight: bold; font-size: 130%; margin: 2em 0 }


/* Meetings List */
dl.meetings              { display: grid; grid-template-columns: 20% 34% 23% 23%; max-width: 45em;
                           margin: 1em 0 0 0; padding: .5em 0; border-top: 1px solid #0F253F }
dl.meetings dt,
dl.meetings dd           { margin: 0 0 .5em 0; padding: 0 0 .5em 0; border-bottom: 1px solid #0F253F }
dl.meetings dd           { text-align: right }


/* Members */
.members dt              { font-weight: bold }


/* News */
.published               { color: #666; font-size: 90%; font-weight: bold; font-style: italic }


/* Home Page */
h1.home                  { font-size: 125%; margin-bottom: 1em }

.panel2col               { display: grid; grid-template-columns: 50% 50% }
.panel2col .left         { margin: .8em 1em .3em 0 }
.panel2col .right        { padding: .8em; background-color: #f0f0f8 }
.panel2col h2            { margin-top: 0 }
.panel2col ul            { padding: 0 0 0 1em }
.panel2col .left p       { margin-bottom: .5em }


@media screen and (max-width: 799px)
{
.header,
.content,
.footer                  { padding-left: 8px; padding-right: 8px }

.navigation ol           { padding-left: .4em }
.navigation li           { margin-right: 0 }
.navigation a:link,
.navigation a:visited    { padding-left: .2em; padding-right: .2em }

.content                 { border: 0 }
}

@media screen and (max-width: 639px)
{
.header                  { height: 80px }
.logo                    { font-size: 32pt }
.tagline                 { font-size: 12pt; font-weight: normal }

.navigation .menu        { display: block; width: 100%; padding: .5em 8px; margin: 0; border: 0; color: #F29A3C; background-color: #161659;
                           font-size: 120%; text-align: left; font-weight: bold }
.navigation .menu:enabled { cursor: pointer }


.navigation ol           { padding: 0 0 1px 0 }
.navigation ol.hide      { display: none }
.navigation li           { display: block; margin-right: 0; border-top: 1px solid white }

.navigation a:link,
.navigation a:visited    { display: block; padding-left: 8px; padding-top: .4em; padding-bottom: .4em; border-top: 1px solid #161659 }

.content                 { min-height: 250px }


.panel2col               { display: block; margin-top: 0 }
.panel2col .left,
.panel2col .right        { margin-top: 2em }


dl.meetings              { display: block; padding: 0; border-top: 0 }
dl.meetings dt,
dl.meetings dd           { border-bottom: 0 }
dl.meetings dt           { font-weight: bold; margin-top: 2em; padding: .3em 0 0 0; border-top: 1px solid #0F253F }
dl.meetings dd           { padding: 0; text-align: left }


.stats dl                { display: block }
.stats.js dl             { margin-left: 0 }
.stats dt,
.stats dd                { border-top: 0 }
.stats dt                { margin: 0; padding: 0 }
.stats dd                { margin: 0 0 1em 35px }
}

