article.home-visitor {

  p {
    margin:     2rem auto 1rem auto;
    width:      80%;
    text-align: center;
  }

  div.lang-comparison {

    display:        flex;
    flex-direction: column;
    gap:            1.4rem;
    margin:         3rem auto;
    width:          70vw;

    div {

      height: fit-content;

      background-color: var(--baseSecondary);

      img {
        height: auto; width: 25%;

        &.left  { float: left; padding-right: 1rem; }
        &.right { float: right; padding-left: 1rem; }
      }

      p {
        padding:    0.33rem 3%;
        margin:     0;
        width:      94%;

        font-size:  0.9rem;
        text-align: left;
      }

    }

    ol {

      display:          flex;
      flex-direction:   row;
      justify-content:  space-between;
      vertical-align:   middle;
      margin:           0 auto;
      padding:          0 0.5rem;
      width:            fit-content;

      font-size:        0.8rem;

      li {

        cursor:         pointer;
        margin:         0 0.5rem;
        text-wrap:      nowrap;
        line-height:    1.2;
        list-style:     none;

        color:          var(--basePrimary);

        img { height: 2rem; width: auto; }

      }

      .current { border-bottom: 3px solid var(--baseSecondary); }

    }

  }

  a.subscribe {

    background-color: var(--baseSecondary);
    color:            var(--basePrimary);

    display:          flex;
		flex-direction:	column;
    align-items:      center;
    margin:           3rem auto;
    text-decoration:  none;
    width:            70%;

    &:hover { color: var(--baseBG);  }

    img { flex: 1; height: auto; max-width: 100%; }

    p {
      flex:           2;
      cursor:         pointer;
      padding:        0.66rem;
      margin:         0 auto;
      font-size:      2rem;
      font-weight:    bold;
      text-align:     center;
      width:          100%;
    }

  }

}

div.cookies-consent {

  border-style:     solid;
  border-width:     0.15rem 0 0 0;
  border-radius:    0.5rem;

  position:         fixed;
    bottom:         4%;
  margin:           0 2%;
  padding:          2% 0;
  width:            96%;

  font-size:        0.9rem;

  background-color: var(--gdprBG);

  & ul {

    display:          flex;
    flex-direction:   row;
    justify-content:  flex-end;
    padding:          0.25em 3%;
    width:            94%;

  }

  & li {

    border-radius:  0.5rem;
    margin:         0 0 0 0;
    padding:        1em 1em;
    list-style:     none;

    font-size:      0.8rem;

    color:          var(--gdprText);

  }

  & li:last-of-type {

    cursor:   pointer;
    display:  flex;
    flex-direction: row;
    align-items:    center;

    font-size: 0.9rem;
    text-align: center;

    background-color: var(--btnSuccessBG);
    color:            var(--btnSuccessText);

  }

  & li:last-of-type:hover { color: var(--baseSecondary); }

  & a         { color: var(--gdprLink);  outline: none; }
  & a:visited { color: var(--gdprVisited);  }
  & a:hover   { color: var(--gdprHover);    }
  & a:active  { color: var(--gdprLink);     }

}


@media  only screen and (max-width: 479px) {

  article.home-visitor {

    p { width: 90%; }

    a.subscribe {
      flex-direction: column;
      img { width: 100%; }
      p { width: fit-content; }
    }

    div.lang-comparison {
      div {
        img { height: auto; width: 40%; }
      }
    }

  }

}