html, body, div, span, h1, h2, h3, p, a, em, img, strong, sub, sup, b, u, i, center, ol, ul, li,
form, fieldset, label, input, select, textarea, button, legend, table, caption, tbody, tfoot, thead, tr, th, td,
header, footer, nav, menu, aside, article, canvas, details, embed, figure, figcaption, section {
    margin  : 0;
    padding : 0;
    border  : none;
    outline : none;
}

html, body {
    min-height : 100%;
    height     : 100%;
}

html {
    font-size : 100%;
}

body {
    display          : flex;
    flex-flow        : column nowrap;
    font-family      : "Open Sans", Helvetica, Arial, sans-serif;
    line-height      : 1.5;
    background-color : #f8f8ff;
    color            : #000000;
}

h1 {
    font-size      : 1.5rem;
    font-weight    : bold;
    margin         : .5em 0;
    text-align     : center;
    text-transform : uppercase;
    letter-spacing : .2em;
    color          : #3758a1;
}

h2 {
    font-size      : 1.2rem;
    font-weight    : bold;
    letter-spacing : .1em;
    text-transform : uppercase;
    margin         : .3em 0;
    text-align     : center;
    color          : #3758a1;
}

h3 {
    font-size      : 1rem;
    font-weight    : bold;
    text-transform : uppercase;
    margin         : .2em 0;
    text-align     : center;
    color          : #3758a1;
}

h4 {
    font-size   : 1rem;
    font-weight : bold;
    margin      : .1em 0;
    text-align  : left;
}

h1 > a, h2 > a, h3 > a, h4 > a {
    font-size : inherit !important;
    color     : inherit !important;
}

a {
    color           : #3758a1;
    text-decoration : none;
}

a > .fa {
    margin         : 0 .5em;
    vertical-align : middle;
}

.errorInput {
    border-color     : #cb2156;
    background-color : rgba(203, 33, 86, .05);
}

table {
    font-size       : .8em;
    margin          : 1em auto;
    border-collapse : collapse;

}

td {
    box-sizing     : border-box;
    padding        : .1em .3em;
    border         : 1px solid steelblue;
    vertical-align : middle;
}

table > caption {
    font-size      : 1rem;
    font-weight    : bold;
    text-transform : uppercase;
    padding        : .3em 0;
    text-align     : center;
    color          : steelblue;
}

table > thead > tr > td {
    font-weight : bold !important;
    text-align  : center !important;
}

input, select, textarea {
    font-size        : 1rem;
    box-sizing       : border-box;
    border           : 1px solid #3758a1;
    border-radius    : 40px;
    padding          : .3em .7em;
    vertical-align   : middle;
    background-color : white;
    font-family      : inherit;
}

button:focus,
img#menu-logo:focus,
a.menu-item:focus,
a:focus,
h1 > a:focus, h2 > a:focus,
h3 > a:focus, h4 > a:focus,
h5 > a:focus,
textarea:focus,
input:focus,
img:focus {
    outline        : none;
    box-shadow     : none;
    border         : 2px dashed lightskyblue !important;
}

.select2-container--default .select2-selection--single {
    font-size     : 1rem;
    border-radius : 40px !important;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height : 500px !important;
}

.mce-path.mce-flow-layout-item {
    /*padding : 8px 8px !important;*/
}

textarea {
    resize        : vertical;
    border-radius : 1em !important;
}

input:focus, select:focus, textarea:focus {
    /*box-shadow : inset 0 2px 10px 1px rgba(70, 130, 180, .3), inset 0 0 0 60px rgba(70, 130, 180, .1);*/
    background-color : khaki;
}

input[type=checkbox] {
    width          : 2em;
    height         : 2em;
    vertical-align : -.7em;
}

input[type=date] {
    text-align : center;
}

input[type=radio] {
    width          : 2em;
    height         : 2em;
    vertical-align : -.7em;
}

.select2-container {
    max-width : 100% !important;
}

.select2-selection--single {
    border-color : #3758a1 !important;
}

.select2-selection--single, .select2-selection--multiple {
    border-color  : #3758a1 !important;
    border-radius : 40px !important;
    padding-left: .5em !important;
}

.select2-container--default .select2-results__option[aria-disabled=true] {
    display : none;
}

optgroup {
    font-weight    : bold;
    font-style     : normal;
    text-transform : uppercase;
}

option {
    font-weight    : normal;
    font-style     : normal;
    text-transform : none;
}

label {
    display        : inline-block;
    margin-right   : .5em;
    vertical-align : middle;
    color          : #3758a1;
}

#wrapper button, #wrapper .button, .buttons-panel .button {
    display         : flex;
    flex-direction  : column;
    justify-content : center;
    align-items     : center;
    box-sizing      : border-box;
    font-size       : 1rem;
    margin          : .3em 1em;
    padding         : .5em 1em;
    font-weight     : bold;
    border          : 3px solid  #f1bd44;
    border-radius   : 40px;
    background      : #3758a1;
    text-align      : center;
    color           : #f1bd44;
    cursor          : pointer;
}

#wrapper button:hover, #wrapper .button:hover, .buttons-panel .button:hover {
    background   : #f1bd44 !important;
    border-color : #3758a1;
    color        : #3758a1;
}

p {
    font-size   : 1rem;
    margin      : .3em 0;
    text-indent : 1.5em;
    text-align  : justify;
}

img {
    vertical-align : middle;
}

ul {
    list-style : none outside;
}

ol {
    list-style  : decimal outside;
    margin-left : 1rem;
}

li {
    margin-left : 1.5em;
    line-height : 1.2;
}

#content ul > li::before {
    content      : '\00bb';
    font-weight  : bold;
    margin-right : .3em;
    font-size    : 1.5rem;
}

.hidden {
    display : none !important;
}

.error {
    font-weight : bold !important;
    color       : #cb2156 !important;
    font-size   : .8em;
}

#wrapper {
    flex      : 1 0 auto;
    display   : flex;
    flex-flow : column nowrap;
}

#wrapper > * {
    flex-shrink : 0;
}

#footer {
    display         : flex;
    justify-content : center;
    align-items     : center;
    font-size       : .8rem;
    padding         : .1em;
    border-top      : 2px solid #3758a1;
    background      : #f1bd44;
}

#footer > #footer-copy {
    flex-grow  : 1;
    text-align : center;
}

#main-menu {
    display         : flex;
    flex-flow       : row wrap;
    justify-content : flex-start;
    align-items     : center;
    padding         : .2em 2em;
    background      : #3758a1;
    font-size       : inherit;
}

#main-menu #menu-logo {
    font-size     : 1rem;
    height        : 4.5rem;
    width         : 15rem;
    margin-right  : 2em;
    background    : aliceblue url(../img/logo.png) center/12em no-repeat;
    padding       : .5em 1em;
    border-radius : 0 1em;
    box-sizing    : border-box;
}

#main-menu > a.menu-item {
    display       : flex;
    align-items   : center;
    height        : 3em;
    box-sizing    : border-box;
    margin        : 0 1em 0 0;
    padding       : 0 .5em;
    font-size     : 1rem;
    font-weight   : bold;
    border        : 4px solid transparent;
    border-left   : none;
    border-right  : none;
    line-height   : 1;
    color         : white;
    text-align    : center;
}

#main-menu > a.menu-item:hover {
    color        : #f1bd44;
    border-color : #f1bd44;
}

#main-menu > a.menu-item-active {
    color        : #f1bd44;
    border-color : #f1bd44;
}

#main-menu .fa-facebook,
#main-menu .fa-low-vision,
#main-menu .fa-volume-up,
#main-menu .fa-volume-mute {
    font-size   : 1.7rem;
    margin-left : .5em;
    color       : white;
    cursor      : pointer;
}

#main-menu .fa-youtube {
    font-size        : 1.7rem;
    margin-left      : .5em;
    color            : red;
    background-color : white;
}

#content {
    flex-grow : 1;
    display   : flex;
    flex-flow : column nowrap;
}

#content img {
    max-width : 100%;
}

.buttons-panel {
    display         : flex;
    flex-flow       : row wrap;
    justify-content : center;
    align-items     : center;
    margin          : .3em 0;
}

.buttons-panel.bordered {
    border-top    : 1px solid #3758a1;
    border-bottom : 1px solid #3758a1;
}

.flex-separator {
    flex-grow : 1;
}

.hint {
    font-size : .8rem;
}

.ui-dialog {
    max-width  : 100%;
    box-sizing : border-box;
}

.ui-widget-header {
    background : linear-gradient(to bottom right, steelblue, darkblue, steelblue);
}

.ui-dialog .ui-dialog-titlebar {
    padding : .2em 1em;
}

.ui-dialog .ui-dialog-title {
    color     : white;
    font-size : 1rem;
}

.ui-widget-header.error {
    background : linear-gradient(to bottom right, gold, darkgoldenrod, gold);
}

.ui-dialog .ui-widget-header.error .ui-dialog-title {
    color : #cb2156 !important;
}

.ui-dialog .ui-dialog-buttonpane {
    margin     : 0;
    padding    : .2em 1em;
    text-align : center;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    float : none;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset .ui-button {
    margin        : .2em 1em;
    background    : linear-gradient(to bottom right, steelblue, darkblue, steelblue);
    color         : white;
    border-radius : 0 .5em !important;
    border        : none !important;
    font-size     : 1rem;
    font-weight   : bold;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset .ui-button:hover {
    background : linear-gradient(to bottom right, gold, darkgoldenrod, gold);
    color      : black;
}

.flex-break {
    flex-basis : 100%;
    width      : 0px;
    height     : 0px;
    overflow   : hidden;
    display    : none;
}

@media only screen and (max-width : 50rem) {
    #main-menu .flex-break {
        display : block;
    }

    #main-menu > a {
        margin-bottom : .5em !important;
    }
}

.eu-sign-loading {
    color          : #cb2156;
    text-align     : center;
    font-weight    : bold;
    text-transform : uppercase;
}

.region-map {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 67.8%;
    overflow: hidden;
}
.region-map svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.region-map__fill {
    -webkit-transition: fill .25s ease-in-out;
    -o-transition: fill .25s ease-in-out;
    transition: fill .25s ease-in-out;
    stroke: #ffcf4a;
    fill: #3758a1;
}
.region-map__region a.is-fill .region-map__fill, .region-map__region a:hover .region-map__fill {
    fill   : #ffcf4a;
}

@media only screen and (max-width : 40rem) {
    #content {
        padding : .5em .5em;
    }

    #main-menu {
        flex-flow   : column wrap;
        align-items : flex-start;
    }

    #main-menu .flex-break {
        display : none;
    }

    #main-menu > a.menu-item {
        text-align : left;
    }
}
