@charset "utf-8";

html {
	overflow-x: hidden;
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

body {
    color: #FFF;
	background-color: #000;
}

#left {
	background-color: #333;
}

nav:not(#skill-labels) {
	padding-left: 10% !important; 
}

#gemstone_medal {
	width: 75%;
	height: auto;
  	margin-left: auto;
  	margin-right: auto;
  	display: block;
}

#gems_summary {
	padding: 10%;
	font-size: 120%;
}

#right {
    height: 100vh;
}

.step, #custom {
	margin-left: 5%;
}

.step {
    display: none;
}

.step.active {
    display: block;
}

#GEMS_logo {
	width: auto;
	height: 115px;
}

#UMD_logo {
	width: auto;
	height: 115px;
}

.btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary:visited {
    background-color: #008B00 !important;
    border-color: #008B00 !important;
}

.btn.disabled, .btn:disabled {
	background-color: #6e6e6e !important;
	border-color: #6e6e6e !important;
	opacity: 0.55;
}

a:link:not(#back_button), a:visited:not(#back_button), a:hover:not(#back_button), a:active:not(#back_button) {
	color: #008B00;
}

#nav {
	text-align: right;
}

#nav button {
	border-radius: 25px;
}

#other_input {
	width: 50%;
}

.rotated {
    -ms-transform: rotate(270deg); /* IE 9 */
    -webkit-transform: rotate(270deg); /* Chrome, Safari, Opera */
    transform: rotate(270deg);
    width: auto;
}

#notifs {
	color: #8B0000;
	font-weight: 550;
}

.task-list {
	display: flex;
	align-items: center;
	margin-bottom: 10px;
}

.task-list label {
	margin-left: 10px;
}

.task-list .task-status {
	color: red;
	font-weight: bold;
	font-size: 18px;
	margin-right: 5px;
}