body{
	background-color:#272727;
	color:white;
}

.bgnav{
	background-color:#272727;
	color:white;
}

.minCard > *{
	border-radius: 5px;
    border: 2px solid white;
    overflow: hidden;
	box-shadow: 0px 0px 30px #ffd400;
}

.cbg{
	background-color: #272727;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    background-blend-mode: overlay;
	box-shadow: inset 0px 0px 20px #000000;
}

.cbgQnBad {
    background-color: #2d0000;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    background-blend-mode: soft-light;
	box-shadow: inset 0px 0px 20px #000000;
}

.cbgQnNetral {
    background-color: #0b002d;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    background-blend-mode: overlay;
}

.cbgQnGood {
    background-color: #f9e0b2;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    background-blend-mode: screen;
    color: black;
}

.hCard{
	border-radius: 1rem;
    border: 2px solid #141414;
    overflow: hidden;
    transition: all 0.3s;
    max-width: 300px;
    display: flex;
    justify-content: center;
	box-shadow: 0px 0px 25px #000;
}

.hCard > *{
	transition:all 0.3s;
}

.hCard.active{
	border: 5px solid #c70909;
    box-shadow: inset 0px 0px 25px #c70909, 0px 0px 25px #c70909;
}

.hCard.active > *{
	opacity:0.2
}

.rotation180{
	transform: rotate(180deg);
}

/* ----------------------------------------- */