body,
span,
p,
a,
button,
input,
button:focus {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    text-decoration: none;
    background: inherit;
    font-family: inherit;
    color: inherit;
    border: inherit;
    margin: inherit;
    padding: inherit;
    height: inherit;
    outline: none;
}

body {
    background: var(--c1);
    color: var(--c4);
    font-family: sans-serif;
}

button:hover {
    cursor: pointer;
}

.listWr {
    width: 600px;
    max-width: calc(100vw - 80px);
    margin: 0 40px;
    margin-top: 20px;
    padding: 0 0 0 20px;
}

.listWr li {
    margin-bottom: 10px;
}

.msg {
    text-align: center;
    width: 100%;
    box-sizing: border-box; 
    padding: 20px 20px;
}

.classOptionWr {
    width: calc(100vw - 80px);
    max-width: 600px;
    margin-top: 20px;
    background: white;
    padding: 20px;
    border-radius: 5px;
    border: solid 1px grey;
}

.classOptionTitle {
    padding: 0;
    font-weight: bold;
    border:none;
    margin: 0;
}

.classOptionDescription {
    padding: 0;
    margin-top: 20px;
    border: none;
}

.classDatesList {
    padding: 0 20px;
    margin: 0;
    margin-top: 10px;
}

.classDatesList li {
    margin-top: 10px;
    line-height: 1.5;
}

.classSchedule {
    padding:0;
    margin: 0;
    border: none;
    margin-top: 30px;
    font-weight: bold;
}

.classPrice {
    padding:0;
    margin: 0;
    margin-top: 30px;
    border:none;
}

.classPrice span {
    font-weight: bold;
}

.signUpLink {
    padding:0;
    margin: 0;
    margin-top: 30px;
    border:none;
}

.signUpButton,
.signUpButton:hover,
.signUpButton:active,
.signUpButton:focus {
    width: 100%;
    background: blue;
    padding: 10px 20px;
    color: white;
    font-weight: bold;
    border-radius: 5px;
}

.soldOutButton,
.soldOutButton:hover,
.soldOutButton:active,
.soldOutButton:focus {
    background: grey;
    margin-top: 30px;
    cursor: unset;
}

.refundEmailLink {
    text-decoration: underline;
    color: rgb(45, 136, 248);
}