/*
  Note the following sizes used in the pure-css responsive grid:
       sm: 35.5em - 568px
       md:   48em - 768px
       lg:   64em - 1024px
       xl:   80em - 1280px
      xxl:  120em - 1920px
     xxxl:  160em - 2560px
      x4k:  240em - 3840px
 */
@media (max-width: 48em) { .mobileonly {display: block;} .desktoponly {display: none;}}
@media (min-width: 48em) { .mobileonly {display: none;} .desktoponly {display: block;}}

@media (max-width: 64em) { .leftorcenter {text-align: center;} .centerorcenter {text-align: center;} .rightorcenter{text-align: center;}}
@media (min-width: 64em) { .leftorcenter {text-align: left;} .centerorcenter {text-align: center;} .rightorcenter{text-align: right;}}

.center {display: block; margin-left: auto; margin-right: auto;}
.bg-highlight1 {background-color: var(--background-highlight-1);}
.bg-highlight2 {background-color: var(--background-highlight-2);}
.bg-highlight3 {background-color: var(--background-highlight-3);}
.bg-highlight4 {background-color: var(--background-highlight-4);}
.copyright {background-color: var(--background-copyright); color: var(--foreground-copyright); font-size:0.75em;}
a.copyright:link {color: var(--foreground-copyright-link); font-size:1em;}
a.copyright:visited {color: var(--foreground-copyright-visited); font-size:1em;}
a.copyright:hover {color: var(--foreground-copyright-hover); font-size:1em;}
a.copyright:active {color: var(--foreground-copyright-active); font-size:1em;}
.padded {padding: 10px; margin: 5px}
.innerpadded {padding: 10px;}
.narrowpadded {padding: 5px; margin: 2.5px}
.innernarrowpadded {padding: 5px;}
.cookie-notice {background: var(--background-cookie); color: --var(--foreground-cookie); ; position: sticky; bottom: 0; width: 100%; padding: 0px; margin:0px; text-align: center;}
.cookie-notice.cookies-accepted {display: none;}
.cookie-notice_wrapper {margin: 10px;}
.cookie-notice a {color: inherit ;}
.cookie-notice_button {display: inline-block; padding: 5px 10px; background: var(--background-cookie-button); text-decoration: none; border-radius: 3px; font-size: 1.2em;}
