#assessment {

    font-family: "Open Sans";
    background-color:#e8dfdf;
    margin-top:16px;
    outline: 2px solid black;
    padding-top:15px;
    padding-bottom:15px;

}

.logo {
    padding: 5px;
}

#answer-buttons button {

    white-space: normal;
    border: 1px solid white;

}

.card {

    height: 405px;

}

.card-title {
    
    height: 150px;
    
}

#wheel {

    height: 420px;

}

[class|=wheelnav-wheel-title] {
    fill: #ffffff;
    cursor: pointer;
}

[class|=wheelnav-wheel-title] > tspan {
    font-family: "Open Sans";
    font-size: 20px;
    cursor: default;
}

.wheelnav-wheel-slice-basic-0 {
    fill: #C1E766;
}
.wheelnav-wheel-slice-hover-0 {
    fill: #C1E766;
}
.wheelnav-wheel-slice-selected-0 {
    fill: #97D700;
}

.wheelnav-wheel-slice-basic-1 {
    fill: #667E99;
}
.wheelnav-wheel-slice-hover-1 {
    fill: #667E99;
}
.wheelnav-wheel-slice-selected-1 {
    fill: #002855;
}

.wheelnav-wheel-slice-basic-2 {
    fill: #66AAE2;
}
.wheelnav-wheel-slice-hover-2 {
    fill: #66AAE2;
}
.wheelnav-wheel-slice-selected-2 {
    fill: #0072CE;
}

.wheelnav-wheel-slice-basic-3 {
    fill: #E6E4DC;
}
.wheelnav-wheel-slice-hover-3 {
    fill: #E6E4DC;
}
.wheelnav-wheel-slice-selected-3 {
    fill: #D6D2C4;
}

.wheelnav-wheel-slice-basic-4 {
    fill: #C1E766;
}
.wheelnav-wheel-slice-hover-4 {
    fill: #C1E766;
}
.wheelnav-wheel-slice-selected-4 {
    fill: #97D700;
}

.wheelnav-wheel-slice-basic-5 {
    fill: #667E99;
}
.wheelnav-wheel-slice-hover-5 {
    fill: #667E99;
}
.wheelnav-wheel-slice-selected-5 {
    fill: #002855;
}

.wheelnav-wheel-slice-basic-6 {
    fill: #66AAE2;
}
.wheelnav-wheel-slice-hover-6 {
    fill: #66AAE2;
}
.wheelnav-wheel-slice-selected-6 {
    fill: #0072CE;
}

.wheelnav-wheel-slice-basic-7 {
    fill: #E6E4DC;
}
.wheelnav-wheel-slice-hover-7 {
    fill: #E6E4DC;
}
.wheelnav-wheel-slice-selected-7 {
    fill: #D6D2C4;
}

.wheelnav-wheel-slice-basic-8 {
    fill: #C1E766;
}
.wheelnav-wheel-slice-hover-8 {
    fill: #C1E766;
}
.wheelnav-wheel-slice-selected-8 {
    fill: #97D700;
}

.wheelnav-wheel-slice-basic-9 {
    fill: #667E99;
}
.wheelnav-wheel-slice-hover-9 {
    fill: #667E99;
}
.wheelnav-wheel-slice-selected-9 {
    fill: #002855;
}

.wheelnav-wheel-slice-basic-10 {
    fill: #66AAE2;
}
.wheelnav-wheel-slice-hover-10 {
    fill: #66AAE2;
}
.wheelnav-wheel-slice-selected-10 {
    fill: #0072CE;
}

.wheelnav-wheel-slice-basic-11 {
    fill: #E6E4DC;
}
.wheelnav-wheel-slice-hover-11 {
    fill: #E6E4DC;
}
.wheelnav-wheel-slice-selected-11 {
    fill: #D6D2C4;
}




.lds-ring {
    display: inline-block;
    position: relative;
    width: 64px;
    height: 64px;
  }
  .lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 51px;
    height: 51px;
    margin: 6px;
    border: 6px solid rgb(0, 0, 0);
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: rgb(0, 0, 0) transparent transparent transparent;
  }
  .lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
  }
  .lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
  }
  .lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
  }
  @keyframes lds-ring {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  