aside {
    background-color: rgb(71, 70, 70);
    height: 100vh;
}

.collapseSide {
    margin: 0;
}

.stratButton {
    background: none;
    border: 0;
    margin-top: 5%;
    color: white;
    font-size: 130%;
}

.stratButton:hover {
    background-color: orange;
}

.heroLinks {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.currentHeroLink {
    color: orange !important;
    margin: 2% !important;
}

.heroVis:active {
    color: orange !important;
    margin: 2% !important;
}

.heroVis {
    color: white;
    text-decoration: none;
    margin: 2% !important;
}

.heroVis:visited {
    color: white;
    text-decoration: none;
    margin: 2% !important;
}

.heroVis:hover {
    color: orange !important;
    text-decoration: none !important;
    margin: 2% !important;
}

.stratBox {
    padding: 1%;
}

.heroP {
    color: black;
    height: 9vh;
    font-size: 150%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    border-bottom: 3px solid orange;
}

.ability {
    border: 3px solid grey;
    border-top: 0;
}
.abilityTitle {
    font-size: 110%;
    text-align: center;
    margin-top: 1%;
}

.cooldown {
    margin-bottom: 2%;
}

.videoGuide {
    height: 30vh;
    margin-top: 4%;
    display: flex;
    justify-content: center;
    align-items: center;
    
}

.videoBox {
    height: 100%;
    width: 40%;
}

iframe {
    height: 100%;
    width: 100%;
    object-fit: fill;
}

.externalVideoLink {
    margin: 2%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.extLink:link {
    color: blue;
    text-decoration: underline;
    opacity: 1 !important;
}

.extLink:visited {
    color: purple;
    text-decoration: underline;
    opacity: 0.5 !important;
}

.guideDesc {
    margin: 1%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.roleList {
    margin-left: 2%;
}

.surveyContent {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.someReason {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}