.nav { text-align: center; padding:10px; }
.nav ul { list-style: none; padding: 0px; margin: 0px; font-weight: bold; }
.nav ul li { display: inline-block; }
.nav ul li a { 
	display: block; 
	text-decoration: none; 
	color: #ffffff;
	transition: 0.4s ease background; 
	padding: 15px 20px; 
	border-radius: 2px; 
	background-color: #000; 
	}
.nav ul li a:hover { 
	background-color: #000080;
	color: #000000; 
	}


body {
	background-color: #000000;
	font-family: arial, helvetica, sans-serif;
}

h1 {
	margin-left: 20px;
	margin-right: 20px;
}

input[type=text].domreg, select.domreg {
	padding: 12px 20px;
	margin: 8px 0;
	display: inline-block;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
}

input[type=submit].domreg {
	color: #fff;
	background-color: #000080;
	padding: 14px 20px;
	margin: 8px 0;
	border: 1px solid #000;
	border-radius: 4px;
	cursor: pointer;
	transition: 0.4s ease background;
}

input[type=submit].domreg:hover {
	color: #000080;
	background-color: #fff; 
}


.estate {
	/* The overall outer div that everything sits inside. 
	*/
	max-width: 800px;
	margin-top: 1%;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
	border-radius: 20px;
	border: 2px solid #ff0000;
	background-color: #ffffff;
	background: linear-gradient(#444, #ccc);
}

.regbox {
	/* The "register your domain" div */
	margin-left: auto;
	margin-right: auto;
	padding: 1px;
	border-radius: 20px;
	border: 1px solid black;
	text-align: center;
	/* background: linear-gradient(#aaa, #ccc); */
	background: linear-gradient(#aaa, #ddd);
}

.purplebox {
	/* The graduated purple main box (support page and others) div */
	margin-left: auto;
	margin-right: auto;
	padding: 10px;
	border-radius: 20px;
	border: 1px solid black;
	text-align: left;
	/* background: linear-gradient(#aaa, #ccc); */
	background: linear-gradient(#aaf, #ccf);
}

.login {
	font-size: 0.75em;
	border-top: 2px solid #000080;
	background: linear-gradient(#aaa, #ccc);
	border-bottom: 1px solid black;
}

.basebox {
	font-size: 0.75em;
	border-top: 2px solid #000080;
	background: linear-gradient(#aaa, #ccc);
	border-bottom: 1px solid black;
	border-radius: 0px 0px 10px 10px;
}

.textcolcontainer {
	margin: auto;
	padding: 5px;
}

.textcol {
	font-size: 1em;
	background: linear-gradient(#aaa, #eee);
	max-width: 220px;
	float: left;
	border: 1px solid black;
	margin: 8px;
	padding: 12px;
}


@media all and (min-width:640px) {

	\* CSS to be used when screen larger than 639px *\

	.nav { float: right; padding: 10px 0 0 0; }
	.nav ul li a { padding: 5px 10px; }

	.estate {
	border: 8px solid #000080;
	}

	.regbox {
	max-width: 80%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
	padding: 10px;
	border-radius: 20px;
	border: 8px solid #000080;
	text-align: center;
	}

	.purplebox {
        max-width: 80%;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 20px;
        padding: 10px;
        border-radius: 20px;
        border: 8px solid #000080;
	}

	.regbox>p {
	font-size: 2em;
	}

	input[type=text].domreg, select.domreg {
	font-size: 2em;
	background-color: #fff;
	}

	input[type=submit].domreg {
	color: #000080;
	background-color: #fff; 
	font-size: 2em;
	}

	input[type=submit].domreg:hover {
	color: #fff;
        background-color: #000080;
	}

	.bigger_on_the_inside {
	font-size: 2em;
        }

}