body {
background: #F5F5F5;
}

.group-wrapper {
	background: #fff;
	border: 1px solid #ddd;
	border-top: 0;
	border-bottom: 0;
}

header {
	margin: 1.5em;
}

form {
	border: 1px solid #ddd;
	padding: 1em;
}

fieldset {
	margin-bottom: 1em;
}

legend {
	font-size: 1.2em;
}

input.ng-invalid:focus {
 box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483;
 border-color: #843534;
}

input.ng-invalid {
 border-color: #843534;

}

.group-wrapper {
	border-top: 0px;
	padding: 30px 15px;
}


.foot {
	padding: 1em;
	border-top: 1px solid #ddd;
}

.fixed {
	position: fixed;
    top: 0;
    left: 50%;
    width: 49%;

}

form {
	  border-color: #ddd;
}

.key form, .key th {
  background: #C4DDDE;
}

.prelim form, .prelim th {
  background: #F1C5BC;
}


.first form, .first th {
  background: #E0EECB;
}


.advanced form, .advanced th {
  background: #BADBED;
}


.prof form, .prof th {
  background: #B7B5D6;
}

@media (max-width: 1200px) {
	
	.fixed {
		width: 48.5%;
	}
	
}


@media (max-width: 768px) {
  .nav li {
	font-size: 1.2em;
}

	.results {
	max-width: 500px;
	margin: 1em auto;
}
	
	.fixed {
		position: relative;
		left: auto;
		top: auto;
		width: auto;
	}
	
	form {
		margin: 1em auto;
		max-width: 80%;
	}
}

@media (max-width: 450px) {
	 .nav li {
		font-size: 0.8em;
  }

	.nav>li>a {
		padding: 5px;
	}
}