/* Jiggys
*********************************/
.jiggy {}
.jiggy-header h4 {}
.jiggy-content {}

/* Seite, Standard
*********************************/
.page-standard {
  background-color:#fff;
  padding-top:3rem;
  padding-bottom:3rem;
}
.page-standard .page-header {
  max-width:45rem;
  margin:0 auto 3rem auto;
  text-transform: uppercase;
}
.page-standard .page-header h1,
.page-standard .page-header .h1 {
  font-size:2.5rem;
  font-size:clamp(1.75rem, -0.875rem + 8.333vw, 2.5rem);
  max-width:100%;
  margin: 0;
}
.page-standard .page-header p {
  font-size: 1.1666rem;
  line-height:1;
  font-weight:400;
  text-transform: uppercase;
  color: #000;
}
.page-standard .page-content [class^=col-] {
  margin-left:auto;
  margin-right:auto;
}
.page-standard .page-morelink {
  text-align: center;
}
.page-standard .page-morelink .btn {
  width:27rem;
  max-width: 100%;
}
.page-standard .page-morelink .btn span {
  margin-left:1rem;
}

/* Seite, Standard, Blau *******************/
.page-standard.colorscheme-blue {
  background:var(--blue);
  color:#fff;
}
.page-standard.colorscheme-blue .page-header h1,
.page-standard.colorscheme-blue .page-header .h1 {
  color:#fff;
  border-color:#fff;
}
.page-standard.colorscheme-blue .page-header h1::after,
.page-standard.colorscheme-blue .page-header .h1::after {
  border-color:#fff;
}
.page-standard.colorscheme-blue .page-header p {
  color:#fff;
  border-color:#fff;
}

/* Seite, Standard, Cyan *******************/
.page-standard.colorscheme-cyan {
  background:var(--cyan);
  color:#fff;
}
.page-standard.colorscheme-cyan .page-header h1,
.page-standard.colorscheme-cyan .page-header .h1 {
  color:#fff;
  border-color:#fff;
}
.page-standard.colorscheme-cyan .page-header h1::after,
.page-standard.colorscheme-cyan .page-header .h1::after {
  border-color:#fff;
}
.page-standard.colorscheme-cyan .page-header p {
  color:#fff;
  border-color:#fff;
}

/* Seite, Standard, Gelb *******************/
.page-standard.colorscheme-yellow {
  background:var(--yellow);
}
.page-standard.colorscheme-yellow .page-content h2,
.page-standard.colorscheme-yellow .page-content .h2 {
  color:#000;
}

/* Seite, Standard, Gelb, hell *******************/
.page-standard.colorscheme-yellow-light {
  background:var(--yellow-light);
}
.page-standard.colorscheme-yellow-light .page-header :where(h1,.h1,p) {
  color:var(--yellow);
}
.page-standard.colorscheme-yellow-light .page-content h2,
.page-standard.colorscheme-yellow-light .page-content .h2 {
  color:##000;
}

/* Seite, Standard, Weiss/Gelb *************/
.page-standard.colorscheme-whiteyellow {
  background:#fff;
}
.page-standard.colorscheme-whiteyellow .page-header h1,
.page-standard.colorscheme-whiteyellow .page-header .h1 {
  color:var(--yellow);
  border-color:var(--yellow);
}
.page-standard.colorscheme-whiteyellow .page-header h1::after,
.page-standard.colorscheme-whiteyellow .page-header .h1::after {
  border-color:var(--yellow);
}
.page-standard.colorscheme-whiteyellow .page-header p {
  color:var(--yellow);
  border-color:var(--yellow);
}
.page-standard.colorscheme-whiteyellow .page-morelink .btn {
  background:var(--yellow);
  border-color:var(--yellow);
}
.page-standard.colorscheme-whiteyellow .page-morelink .btn:hover {
  background:#fff;
  color:var(--yellow);
}

/* Seite, Tage bis zur ...
*********************************/
.page-daysleft {
  background:var(--yellow);
  color:#fff;
  padding-top:1rem;
  padding-bottom:1rem;
}
.page-daysleft .page-content {
  display:flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.page-daysleft .page-content-clock {
  margin-left:auto;
  margin-right:auto;
  max-width: 15rem;
}
.page-daysleft .page-content-dates {
  font-family: 'SketchBlock';
  font-weight:800;
  font-size:2.5rem;
  line-height: 1;
  padding-bottom:1rem;
  margin-bottom:1rem;
  border-bottom:dotted var(--blue) 2px;

}
.page-daysleft .page-content-dates-inner {
  position: relative;
}
.page-daysleft .page-content-dates span {
  display:block;
}
.page-daysleft .page-content-dates .daysleft-start {
  margin-bottom:1rem;
}
.page-daysleft .page-content-dates .daysleft-dash {
  font-family: 'Dobra',sans-serif;
  font-size:3.75rem;
  font-weight: 300;
  line-height:1;
  position: absolute;
  left:50%;
  top:44%;
  transform: translate(-50%, -50%);
}
.page-daysleft .page-content-clock img {
  margin-top:-30%;
  /*margin-bottom:-4.5rem;*/
  display: block;
  width:100%;
  height:auto;
}
.page-daysleft .page-content-daysleft {
  text-transform:uppercase;
  line-height: 1;
}
.page-daysleft .page-content-daysleft .daysleft-days {
  color:var(--orange);
  font-size:5rem;
  line-height: 1;
  display:block;
  font-weight:600;
}
@media only screen and (min-width : 768px) {
  .page-daysleft .page-content {
    display: grid;
    grid-template-columns: 1fr 15rem 1fr;
  }
  .page-daysleft .page-content-clock {
    order: 2;
    flex:0 0 15rem;
  }
  .page-daysleft .page-content-dates {
    order: 1;
    text-align: right;
    flex:0 1 auto;
    border-right:dotted var(--blue) 2px;
    padding-right:1.5rem;

    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;

    display: flex;
    justify-content: flex-end;
  }
  .page-daysleft .page-content-dates-inner {
    width:min-content;
  }
  .page-daysleft .page-content-daysleft {
    order: 3;
    text-align: left;
    border-left:dotted var(--blue) 2px;
    padding-left:1.5rem;
  }
}

/* Seite, CTA
*********************************/
.page-cta {
  background:var(--yellow);
  text-align: center;
  padding-top:3rem;
  padding-bottom:3rem;
}
.page-cta .page-header {
  max-width:45rem;
  margin:0 auto;
}
.page-cta .page-header h1,
.page-cta .page-header .h1 {
  margin-bottom:.5rem;
}
.page-cta .page-header p {
  font-family:'SketchBlock';
  font-size:2rem;
  line-height:1;
  font-weight:300;
  text-transform: uppercase;
  color:#fff;
  margin:0;
}

/* Seite, Unterseite
*********************************/
.page-subpage {
  margin-top: -110%;
  position: relative;
  z-index: 1;
}
.page-subpage-header h1 {
  font-family:'SketchBlock';
  font-size:2rem;
  font-size:13vw;
  line-height:.9;
  font-weight:300;
  text-transform: uppercase;
  color:var(--blue);
}
.page-subpage-header h1 span {
  display:block;
}
.page-subpage-header h1 b,
.page-subpage-header h1 strong {
  font-weight:800;
}
.page-subpage-subheadline {
  background:var(--blue);
  color:#fff;
  font-size:1.5rem;
  line-height: 1.1;
  font-weight:400;
  text-transform: uppercase;
  padding-top:1.5rem;
  padding-bottom:1.5rem;
}
.page-subpage-subheadline .container {
  position: relative;
}
.page-subpage-deco {
  position: absolute;
  right:-3rem;
  top:-5rem;
  width:10rem;
  width:18.2%;
}
.page-subpage-deco::after {
  content:'';
  display:none;
  background-repeat: no-repeat;
  background-size:contain;
  background-position: 50% 50%;
  height:0;
  /* Seastar */
  padding-bottom:106%;
  background-image:url(/assets/images/header-deco-seastar.png);
}
@media only screen and (min-width : 768px) {
  .page-subpage-deco::after {
    display:block;
  }
}
/* Flip Flops */
.id-50 .page-subpage-deco {
  position: absolute;
  right:-2rem;
  top:-6rem;
  width:14rem;
  width:25.5%;
}
.id-50 .page-subpage-deco::after {
  padding-bottom:101%;
  background-image:url(/assets/images/header-deco-flipflops.png);
}
/* Shells */
.id-49 .page-subpage-deco {
  position: absolute;
  right:-2rem;
  top:-5rem;
  width:13rem;
  width:23.6%;
}
.id-49 .page-subpage-deco::after {
  padding-bottom:61%;
  background-image:url(/assets/images/header-deco-shells.png);
}
/* Glasses */
.id-52 .page-subpage-deco {
  position: absolute;
  right:-4rem;
  top:-4rem;
  width:16rem;
  width:30%;
}
.id-52 .page-subpage-deco::after {
  padding-bottom:58%;
  background-image:url(/assets/images/header-deco-glasses.png);
}

.page-subpage-content {
  padding-top:2rem;
  padding-bottom:2rem;
}
.page-subpage-header + .page-subpage-content {
  padding-top:7rem;
}
@media only screen and (min-width : 768px) {
  .page-subpage {
    margin-top: -21rem;
  }
  .page-subpage-header h1 {
    font-size:3.3817rem;
  }
  .page-subpage-subheadline {
    font-size:1.5655rem;
    padding-top:1.1272rem;
    padding-bottom:1.1272rem;
  }
}
@media only screen and (min-width : 992px) {
  .page-subpage {
    margin-top: -21.539rem;
  }
  .page-subpage-header h1 {
    font-size:3.3817rem;
  }
  .page-subpage-subheadline {
    font-size:1.5655rem;
    padding-top:1.1272rem;
    padding-bottom:1.1272rem;
  }
}
@media only screen and (min-width : 1200px) {
  .page-subpage {
    margin-top: -22.45rem;
  }
  .page-subpage-header h1 {
    font-size:3.8862rem;
  }
  .page-subpage-subheadline {
    font-size:1.8rem;
    padding-top:1.2954rem;
    padding-bottom:1.2954rem;
  }
}
@media only screen and (min-width : 1400px) {
  .page-subpage {
    margin-top: -26rem;
  }
  .page-subpage-header h1 {
    font-size:4.5rem;
  }
  .page-subpage-subheadline {
    font-size:2.0833rem;
    padding-top:1.5rem;
    padding-bottom:1.5rem;
  }
}

/* Seite, Abstimmung
*********************************/
.form-voting {
  counter-reset: voting-step;
}
.form-voting-section {
  counter-increment: voting-step;
  position: relative;
  padding-top:1rem;
  border-bottom:solid var(--yellow) 2px;
}
.form-voting-section:last-child {
  border:0;
}
.form-voting-section::before {
  display:block;
  content:counters(voting-step,'.', decimal-leading-zero);
  width:2.5rem;
  height:2.5rem;
  line-height:2.5rem;
  text-align: center;
  font-size:1.3333rem;
  font-weight:600;
  background:var(--yellow);
  color:#fff;
  position: absolute;
  left:0;
  top:0;
}

.form-voting-section-books,
.form-voting-section-submit {
  display:none;
}


.form-voting-section-header {
  padding-left:4rem;
}
.form-voting h2 {
  color:var(--blue);
}
.form-voting button[type=submit] {
  width:100%;
  max-width: 27rem;
}

@media only screen and (min-width : 580px) {
  .form-voting-section-header {
    padding-left:8rem;
  }
  .form-voting-section::before {
    width:5.1666rem;
    height:5.1666rem;
    line-height:5.1666rem;
    font-size:2.9583rem;
  }
}

/* Seite, Auswertung, Deine Bibliothek
*********************************/
.page-yourlibrary {
  background:var(--blue);
  color:#fff;
  padding-top:2rem;
  padding-bottom:2rem;
}
.page-yourlibrary h2 {
  color:var(--yellow);
  font-family:'SketchBlock';
  font-weight:300;
  font-size:2.5rem;
}
.articles-books-evaluation-yourlibrary .article-book {
  grid-template-areas: 'image header';
  grid-template-columns: 4.3125rem auto;
}
.articles-books-evaluation-yourlibrary .article-book-header h2,
.articles-books-evaluation-yourlibrary .article-book-header .h2 {
  color: #fff;
}
.articles-books-evaluation-yourlibrary .votingbar::before {
  background:#fff;
  color:var(--blue);
}
@media only screen and (min-width : 768px) {
  .articles-books-evaluation-yourlibrary .article-book {
    grid-template-columns: 7rem auto;
  }
}
@media only screen and (min-width : 992px) {
  .article-book {
    grid-template-columns: 10rem auto;
  }
}

/* Artikel, Favoriten
*********************************/
.articles-favorites {}
.article-favorites {
  border-bottom:solid #fff 2px;
  margin-bottom:1.5rem;
  padding-bottom:1.5rem;
  position: relative;
}
.article-favorites-images {
  --gutter-x:.6666rem;
  display:flex;
  margin-left:calc(var(--gutter-x) * -1);
  margin-right:calc(var(--gutter-x) * -1);
  margin-bottom: 1.5rem;
}
.article-favorites-images > * {
  padding-left:calc(var(--gutter-x) / 2);
  padding-right:calc(var(--gutter-x) / 2);
  flex:0 0 50%;
  max-width: 50%;
}
.article-favorites-image-inner {
  height:0;
  padding-bottom:100%;
  position: relative;
}
.article-favorites-images img {
  display:block;
  position: absolute;
  top:0;
  right:0;
  height:100%;
  width:auto;
}
.article-favorites-header {
  text-align:right;
}
.article-favorites-header .year {
  font-family:'SketchBlock';
  font-size:1.5rem;
  line-height: 1;
  color:var(--yellow);
  margin-bottom:1rem;
}
.article-favorites-header h2,
.article-favorites-header .h2 {
  margin-bottom:1.5rem;
  font-size:1.1666rem;
  color:#fff;
}
.article-favorites-header .author {
  display:block;
  font-weight:400;
  color:var(--yellow);
  margin:0;
}
.article-favorites-header .book {
  display: block;
}
.article-toggle {
  position: absolute;
  right:0;
  bottom:0;
  background:#fff;
  color:var(--cyan);
  border:0;
  padding:0;
  width:1.875rem;
  min-width: 0;
  height:1.875rem;
  line-height:1.875rem;
  font-size:1.5rem;
  font-weight: 600;
  text-align: center;
}
.article-toggle:hover {
  background-color: #fff;
  color: var(--cyan);
}
.article-toggle.collapsed::before {
  content:'+';
}
.article-toggle::before {
  content:'\2013';
}

@media only screen and (min-width : 992px) {
  .article-favorites {
    display: flex;
  }
  .article-favorites-images {
    flex:0 0 35%;
    max-width:35%;
    margin-bottom:0;
  }
  .article-favorites-header {
    text-align:left;
  }
  .article-favorites-content {
    flex:0 0 60%;
    max-width:60%;
    margin-left: 5%;
  }
}

/* Artikel, Buecher
*********************************/
.articles-books {
  counter-reset: book;
  padding-top:1rem;
  padding-bottom:5rem;
  /*margin-left:calc(var(--bs-gutter-x) * -1);*/
  /*margin-right:calc(var(--bs-gutter-x) * -1);*/
}
.article-book {
  counter-increment: book;
  border-bottom:solid var(--orange) 2px;
  margin-bottom:1rem;
  padding-bottom:1rem;
  position: relative;

  display: grid;
  grid-template-columns: 2.5rem 4.3125rem auto;
  grid-template-areas: '. image header'
                       'main main main'
}
.article-book::before {
  display:block;
  content:counters(book,'.', decimal-leading-zero);
  width:2.5rem;
  height:2.5rem;
  line-height:2.5rem;
  text-align: center;
  font-size:1.3333rem;
  font-weight:600;
  background:var(--orange);
  color:var(--yellow-light);
  position: absolute;
  left:0;
  top:-1rem;
}
.article-book-header {
  grid-area: header;
  padding-left:1rem;
  padding-right:1rem;
  align-self: flex-end;
}
.article-book-header h2,
.article-book-header .h2 {
  color: #000;
  font-size:1.1666rem;
  margin:0;
}
.article-book-header span {
  display:block;
}
.article-book-header .author {
  font-weight: 400;
  text-transform: none;
}
.article-book-image {
  grid-area: image;
  justify-self: flex-end;
}
.article-book-image img {
  height:6rem;
  width:auto;
}
.article-book-main {
  grid-area: main;
}
.article-book-main-inner {
  display:grid;
  grid-template-areas: 'content'
                       'video';
  margin-bottom:1.5rem;
}
.article-book-content {
  grid-area: content;
  padding-top:1rem;
  padding-left: 1rem;
  padding-right: 1rem;
}
.article-book-video {
  grid-area: video;
  background:var(--blue);
  color:#fff;
  display:grid;
  grid-template-areas: 'heading'
                       'video';
}
.article-book-video-heading {
  padding:1rem 1rem .5rem 1rem;
  grid-area: heading;
  text-transform: uppercase;
}
.article-book-video-container {
  padding:.5rem 1rem 1rem 1rem;
  grid-area: video;
}
.article-book .article-toggle {
  position: absolute;
  right:0;
  bottom:0;
  background:var(--orange);
  color: var(--yellow-light);
  border:0;
  padding:0;
  width:1.875rem;
  min-width: 0;
  height:1.875rem;
  line-height:1.875rem;
  font-size:1.5rem;
  font-weight: 600;
  text-align: center;
}
@media only screen and (min-width : 768px) {
  .articles-books {
    margin:0;
  }
  .article-book {
    grid-template-columns: 2.5rem 7rem auto;
    grid-template-areas: '. image header'
                         'main main main'
  }
  .article-book-image img {
    height:8rem;
  }
  .article-book-main-inner {
    grid-template-columns: 2.5rem 7rem auto;
    grid-template-areas: '. . content'
                         'video video video'
  }
  .article-book-video {
    grid-template-columns: 2.5rem 7rem auto;
    grid-template-areas: 'heading heading video'
  }
  .article-book-video-heading {
    padding:1rem;
  }
  .article-book-video-container {
    padding:1rem;
  }
}
@media only screen and (min-width : 992px) {
  .article-book {
    grid-template-columns: 5.1666rem 10rem auto;
  }
  .article-book::before {
    width:5.1666rem;
    height:5.1666rem;
    line-height:5.1666rem;
    font-size:2.9583rem;
  }
  .article-book-image img {
    height:10.8333rem;
  }
  .article-book-main-inner {
    grid-template-columns: 5.1666rem 10rem auto;
  }
  .article-book-video {
    grid-template-columns: 5.1666rem 10rem auto;
  }
}

/* Artikel, Buecher, Abstimmung
*********************************/
.page-voting {
  background-image: url(/assets/images/page-voting-bg.jpg);
  background-position: 100% 47rem;
  background-repeat: no-repeat;
}
.page-voting-message a {
  font-weight:400;
  color:var(--yellow);
}
.page-voting-message a span {
  color:#fff;
}
.page-voting .page-subpage-content {
  min-height:20rem;
}
.page-voting .form-voting {
  padding-top:6rem;
}
.articles-books-voting .article-book::before {
  content:normal;
}
/* Artikel, Buecher, Auswertung
*********************************/
.articles-books-evaluation .article-book::before {
  content:normal;
}
.votingbar {
  padding-right:5rem;
  position: relative;
  margin-bottom: 1.5rem;
}
.votingbar::before {
  content:counters(book,'.', decimal-leading-zero);
  display:block;
  width:2rem;
  height:2rem;
  line-height:2rem;
  background:var(--blue);
  color:#fff;
  text-align:center;
  border-radius:100%;
  font-weight:800;
  position: absolute;
  z-index: 1;
  left:1rem;
  top:50%;
  transform:translate(0, -50%);
}
.votingbar-bar {
  height:.8333rem;
  background:var(--yellow);
  position: relative;
  min-width:4rem;
}
.votingbar-percent {
  color:var(--yellow);
  font-weight:800;
  font-size:1.1666rem;
  line-height:1;
  white-space: nowrap;

  position: absolute;
  left:calc(100% + 1rem);
  top:50%;
  transform:translate(0, -50%);
}

.page-books-evaluation-top3 .page-content {
  margin-left:auto;
  margin-right:auto;
  max-width:45rem;
}
.page-books-evaluation-top3 .page-content .btn {
  width: 27rem;
  max-width: 100%;
}
.page-books-evaluation-top3 .page-content .btn span {
  margin-left:1rem;
}

.articles-books-evaluation-top3 {
  max-width:45rem;
  margin-left:auto;
  margin-right:auto;
}
@media only screen and (min-width : 1360px) {
  .articles-books-evaluation-top3 .articles-books {
    margin-left:-3.8333rem;
  }
}
.articles-books-evaluation-top3 .article-book {
  grid-template-areas: 'image header';
  grid-template-columns: 2.8333rem auto;
  grid-template-rows: 3.9583rem;
  align-items: center;

  padding:0;
  margin-bottom:1rem;
}
.articles-books-evaluation-top3 .article-book-image img {
  height: 3.9583rem;
  width:auto;
}
.articles-books-evaluation-top3 .article-book-header {
  align-self: center;
}
.articles-books-evaluation-top3 .article-book h2 {
  display:none;
}
.articles-books-evaluation-top3 .votingbar {
  margin:0;
}
.articles-books-evaluation-top3 .votingbar::before {
  background:#fff;
  color:var(--yellow);
}
.articles-books-evaluation-top3 .votingbar-percent {
  color:#fff;
}

/* Artikel, Buecher, Karusell
*********************************/
.articles-book-carousel {}
.article-book-carousel img {
  height:12rem;
  width:auto;
  display:block;
}

/* Artikel, Jury
*********************************/
.articles-jury {
  padding-top:2rem;
}
.article-jury {
  margin-bottom:1rem;
}
.article-jury-inner {
  position: relative;
  border-bottom:solid var(--orange) 2px;
  display:grid;
  grid-gap:1rem;
  grid-template-areas: 'image header'
                       'content content';
  grid-template-columns: 1fr 1fr;
}
.article-jury-image {
  grid-area: image;
}
.article-jury-image-inner {
  height:0;
  padding-bottom:100%;
  background-color:var(--yellow);
  background-image:url(/assets/images/article-jury-image-girl.svg);
  background-size:cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
.article-jury-Boy .article-jury-image-inner {
  background-image:url(/assets/images/article-jury-image-boy.svg);
}
.article-jury-header {
  grid-area: header;
  align-self: flex-end;
  font-size:1.1666rem;
}
.article-jury-header h2 {
  font-size:1.1666rem;
  color: #000;
  margin:0;
}
.article-jury-header p {
  margin:0;
}
.article-jury-content {
  grid-area: content;
}
.article-jury-content p {
  margin-bottom:.5rem;
}
.article-jury .article-toggle {
  background:var(--orange);
  color:var(--yellow-light);
}

/* Formulare
*********************************/
form p {}

fieldset {}
fieldset legend {}

.required label:after,
.required-span span.label:after,
.required-span span.label-indent:after,
.required-span span.label-block:after {
  content:'*';
}
input[type=text],
input[type=password],
input[type=date],
input[type=datetime],
input[type=datetime-local],
input[type=email],
input[type=month],
input[type=number],
input[type=search],
input[type=tel],
input[type=time],
input[type=url],
input[type=week],
textarea,
select {
  width:100%;
  max-width:27rem;
  margin:0;
  padding:.8rem 1rem;
  border:solid var(--yellow) 2px;
}
input[type=text]:focus,
input[type=password]:focus,
input[type=date]:focus,
input[type=datetime]:focus,
input[type=datetime-local]:focus,
input[type=email]:focus,
input[type=month]:focus,
input[type=number]:focus,
input[type=search]:focus,
input[type=tel]:focus,
input[type=time]:focus,
input[type=url]:focus,
input[type=week]:focus,
textarea:focus,
select:focus {
  margin:0;
}
textarea {
  height:12rem;
}
a.btn,
.btn,
button,
input[type=submit] {
  display:inline-block;
  margin:0;
  padding:.8rem 1rem;
  border: solid var(--orange) 2px;
  border-radius:0;
  min-width:16.6666rem;
  cursor:pointer;
  background:var(--orange);
  color:#fff;
  font-size:1.1666rem;
  font-weight: 800;
  text-transform:uppercase;
  text-decoration:none;
  text-align: center;
  transition:background .2s ease;
}
input[type=submit]::-moz-focus-inner {
  border: 0;
}
a.btn:hover,
.btn:hover,
button:hover,
input[type=submit]:hover {
  background-color:var(--orange);
  color:#fff;
  text-decoration: none;
}

.btn-transparent,
a.btn-transparent {
  background:transparent;
  color:var(--blue);
}
.btn-whiteyellow,
a.btn-whiteyellow {
  background:#fff;
  color:var(--yellow);
}
.btn-whiteyellow:hover,
a.btn-whiteyellow:hover {
  background:var(--yellow);
  color:#fff;
}

/* input radio replacement
 * *****************************/
.radio-replacement {
  cursor: pointer;
}
.radio-replacement input[type=radio],
.radio-replacement input[type=checkbox] {
  position: absolute;
  left: -100vw;
}
.radio-replacement .radio {
  display:inline-block;
  width:1.5rem;
  height:1.5rem;
}
.radio-replacement .radio path {
  fill:var(--blue);
}
.radio-replacement .radio rect {
  fill:transparent;
}
.radio-replacement input[type=radio]:checked ~ .radio rect,
.radio-replacement input[type=checkbox]:checked ~ .radio rect {
  fill:var(--blue);
}

.user-is-tabbing .radio-replacement input[type=radio]:focus ~ .radio,
.user-is-tabbing .radio-replacement input[type=checkbox]:focus ~ .radio {
  outline:solid var(--yellow) 2px;
}

.sendmail_emptyfield1 label,
label.sendmail_emptyfield1 {
  color:#f00;
}
.sendmail_emptyfield1 input.text,
input.sendmail_emptyfield1,
.sendmail_emptyfield1 textarea {
  border-color:#f00;
}
.message {
  border:solid #f6e468 1px;
  background:#ffffdb;
  padding:5px;
  margin:0 0 .8em 0;
}