/* HINTERGRUENDE */
* {
    margin: 0;
    padding: 0;
}

body {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100vw;
}

.wrapper {
  width: 80%;
  max-width: 700px;
}

@font-face {
    font-family: LexendGiga;
    src: url("wissen/font/LexendGiga-Variable.ttf");
}

.button-container {
    width: 100%;
    margin-bottom: 100px;
}

.button {
    width: 100%;

    bottom: 0;
    padding: 15px 3%;
    margin: 20px 0;
    
    text-align: center;
    box-sizing: border-box;

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.button-wr {
    flex-direction: column!important;
    border: 5px solid;
    background: white;
}

.button img {
    width: 15%;
}

.button-wr img {
    width: 100%!important;
    margin-bottom: 10px;
}

.button-wr p {
    font-size: 0.7rem!important;
}

.button p {
    font-family: LexendGiga, sans-serif;
    font-weight: 500;
    font-size: 1rem;
    color: black;
    text-decoration: none;
}



.col-1 {
    border-color: #FFDE00;
}

.button-weiter-1 {
    background: #FFDE00;
    background: linear-gradient(88deg,rgba(255, 222, 0, 1) 0%, rgba(235, 220, 0, 1) 85%, rgba(196, 217, 0, 1) 100%);
}

.col-2 {
    border-color: #1B7FFF;
}

.button-weiter-2 {
    background: #1B7FFF;
    background: linear-gradient(88deg,rgba(27, 127, 255, 1) 0%, rgba(20, 112, 255, 1) 75%, rgba(0, 70, 255, 1) 100%);
}

.col-3 {
    border-color: #FF3DBD;
}

.button-weiter-3 {
    background: #FF3DBD;
    background: linear-gradient(88deg, rgba(255, 61, 189, 1) 0%, rgba(245, 46, 201, 1) 80%, rgba(214, 0, 238, 1) 100%);
}

.col-4 {
    border-color: #FF3B05;
}

.button-weiter-4 {
    background: #FF3B05;
    background: linear-gradient(88deg, rgba(255, 59, 5, 1) 0%, rgba(243, 43, 5, 1) 80%, rgba(212, 0, 5, 1) 100%);
}

.col-5 {
    border-color: #A526E8;
}

.button-weiter-5 {
    background: #A526E8;
    background: linear-gradient(88deg, rgba(165, 38, 232, 1) 0%, rgba(155, 27, 238, 1) 80%, rgba(128, 0, 255, 1) 100%);
}

.col-6 {
    border-color: #00DCCC;
}

.button-weiter-6 {
    background: #00DCCC;
    background: linear-gradient(88deg, rgba(0, 220, 204, 1) 0%, rgba(0, 229, 193, 1) 80%, rgba(0, 255, 163, 1) 100%);
}



h3 {
    margin-top: 40px;
    font-family: LexendGiga, sans-serif;
    font-weight: 500;
    font-size: 1.5rem;
    hyphens: auto;
}

a {
  text-decoration: none;
}