html, body * { box-sizing: border-box; font-family: 'Exo 2', sans-serif;}

.bad{
    background: #b44444;
	color: white;
}
.good{
    background: #e2e2e2;
}


form { 
	margin: 0 auto;
}

h1{
	width: 80%;
    background-color: #1750ad;
    padding: 20px 20px;
	border-radius: 1px;
	margin: 0 auto;
	color: white;
	font-size: 22px;
	font-weight: lighter;
}

h2{
	width: 80%;
    background-color: #cccccc;
    padding: 20px 15px;
	border-radius: 1px;
	margin: 0 auto;
	font-size: 18px;
	font-weight: lighter;
}

h3{
	width: 80%;
    background-color: #1750ad;
    padding: 20px 20px;
	border-radius: 1px;
	margin: 0 auto;
	color: white;
	font-size: 18px;
	font-weight: lighter;
}

p{
	width: 80%;
    background-color: #b44444;
    padding: 10px 15px;
	border-radius: 1px;
	margin: 0 auto;
	color: white;
	font-size: 18px;
	font-weight: lighter;
}


#result{
    border: 1px solid #cccccc;
    padding: 10px 14px;
    margin: 6px 0;
	font-size: 14px;
	border-radius: 1px;
	float: left;
}

#result1{
    border: 1px solid #cccccc;
    padding: 10px 14px;
    margin: 6px 0;
	font-size: 14px;
	border-radius: 1px;
	float: left;
}

.container {
	width: 80%;
    background-color: #f2f2f2;
    padding: 10px 15px;
	border: 1px solid #cccccc;
	border-radius: 1px;
}

.col-60 {
    width: 60%;
	float: left;
}

.col-40 {
    width: 30%;
	float: left;
}

.row:after {
    content: "";
    display: table;
    clear: both;
}

@media screen and (max-width: 600px) {
    .col-60, .col-40, input[type=button] {
        width: 100%;
        margin-top: 0;
    }
}

label {
    padding-top: 20px;
    display: inline-block;
	font-size: 16px;
}

input[type=number] {
    padding: 12px 12px;
    margin: 6px 0;
    box-sizing: border-box;
	border: 1px solid #cccccc;
    border-radius: 1px;
	font-size: 14px;
}

input[type=button] {
    background-color: #1750ad;
    border: none;
    color: white;
    padding: 12px 25px;
    text-decoration: none;
    margin: 4px 0;
    cursor: pointer;
	font-size: 16px;
	border-radius: 1px;
}

input[type=button]:hover {
    background-color: #163c79;
}

a.button1 {
  display: inline-block;
  background: #1750ad;
  color: #fff;
  padding: 12px 25px;
  border-radius: 1px;
  text-decoration: none;
  font-size: 16px;
  position: absolute;
  left: 10.4%;
}

a[type=button]:hover {
    background-color: #163c79;
}
