@font-face 
{
			font-family: "Anonymous Pro";
			src: url("../fonts/AnonymousPro-Regular.ttf") format("truetype");
			font-style: normal;
			font-weight: normal;
}

@font-face 
{
			font-family: "Press Start 2P";
			src: url("../fonts/PressStart2P-Regular.ttf") format("truetype");
			font-style: normal;
			font-weight: normal;
}

@font-face 
{
			font-family: "Jura";
			src: url("../fonts/Jura-Bold.ttf") format("truetype");
			font-style: normal;
			font-weight: bold;
}

body
{
	width: 100%;
	background-color: darkblue;
	margin: 0 auto;
	color: lightblue;
	font-family:"Anonymous Pro", sans-serif;
}

.bd1
{
	width: 98%;
	margin: 1%;
}

header
{
	width: 100%;
	height: 80px;
	background-color: lightblue;
	color: darkblue;
	border-radius: 5px;
	font-family:"Press Start 2P", sans-serif;
	
}

.hd1
{
	width: 29%;
	float: left;
	padding-left: 1%;
	font-size: 15px;
}

.hd2
{
	width: 69%;
	float: left;
	padding-right: 1%;
	font-size: 5px;
}

.ul1
{
	float: right;
	margin-right: 30px;
	margin-top: 10px;
}

header div ul li 
{
	float: left;
	list-style-type: none;
	margin-top: 20px;
	margin-left: 60px;
	text-decoration: none;
	font-size: 5px;
}

li a 
{
	text-decoration: none;
	color: darkblue;
	font-size: large;
}

aside
{
	margin-top: 10px;
	width: 20%;
	float: left;
	background-color: lightblue;
}

.ap1
{
	text-align: center;
	width: 99%;
	color: lightblue;
	background-color: darkblue;
	margin: 1%;
	margin-right: 0;
	clear: both;
	font-family: "Jura", sans-serif;
}

aside ul
{
	margin-top: 0;
	margin-left: 1%;
	padding-inline-start: 0;
	list-style-type: none;	
}

aside ul li
{
	text-align: left;
	color: lightblue;
	background-color: darkblue;
	margin-top: 0;
	margin-left: 0;
	width: 94%;
	padding: 3%;
}

.ad1
{
	background-color: darkblue;
	width: 97%;
	margin: 1%;
	margin-right: 0;
	padding: 1%;
}

content
{
	margin-top: 10px;
	padding-left: 1%;
	padding-right: 1%;
	width: 78%;
	float: left;
	color: darkblue;
	background-color: lightblue;
}

.cp1
{
	font-size: x-large;
	font-family: "Jura", sans-serif;
}

.cp2
{
	font-size: large;
	font-family: "Jura", sans-serif;
}

.ci1
{
	float: left;
	margin-right: 2%;
	width: 30.3%;
	border: 10px solid darkblue;
}

.ci2
{
	float: left;
	margin-right: 2%;
	width: 28.25%;
	border: 10px solid darkblue;
}

.ci3
{
	float: left;
	width: 28.25%;
	border: 10px solid darkblue;
	margin-bottom: 20px;
}

.cp3
{
	font-size: large;
	clear: both;
	font-family: "Jura", sans-serif;
}

.cu1
{
	margin-top: 0;
	width: 28%;
	float: left;
	margin-right: 1%;
}

.cu2
{
	margin-top: 0;
	width: 28%;
	float: left;
	margin-right: 1%;
	list-style-type: none;
}

table
{
	clear: both;
	width: 98%;
	border: 2px solid darkblue;
	border-radius: 5px;
	border-collapse: collapse;
}

td
{
	padding-left: 1%;
	border: 1px solid darkblue;
}

.td1
{
	background-color: darkblue;
	color: lightblue;
	font-weight: bold;
	border: 1px solid lightblue;
}
.button {
    font-size: 18px;
    font-weight: bold;
    color: #FFFFFF;
    padding: 10px 75px;
    margin: 0 20px;
    text-shadow: 2px 2px 1px #595959;
    filter: dropshadow(color=#595959, offx=1, offy=1);
    text-decoration: none;
}
.shape-1 {
    -webkit-border-radius: 5px 50px 5px 50px;
    border-radius: 5px 50px 5px 50px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 50px;
    -moz-border-radius-bottomleft: 50px;
    -moz-border-radius-bottomright: 5px;
}

.blue {
    border: solid 1px #004F72;
    background-color: darkblue;
    font-family: "Jura", sans-serif;
    background: -moz-linear-gradient(top, royalblue 0%, darkblue 100%);
    background: -webkit-linear-gradient(top, royalblue 0%, darkblue 100%);
    background: -o-linear-gradient(top, royalblue 0%, darkblue 100%);
    background: -ms-linear-gradient(top, royalblue 0%, darkblue 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1982A5', endColorstr='#1982A5',GradientType=0 );
    background: linear-gradient(top, royalblue 0%, darkblue 100%);
    -webkit-box-shadow: 0px 0px 1px #00CCFF, inset 0px 0px 1px #FFFFFF;
    -moz-box-shadow: 0px 0px 1px #00CCFF, inset 0px 0px 1px #FFFFFF;
    box-shadow: 0px 0px 1px #00CCFF, inset 0px 0px 1px lightblue;
}
.blue:hover {
    background-color: darkblue;
    background: -moz-linear-gradient(top, mediumblue 0%, darkblue 100%);
    background: -webkit-linear-gradient(top, mediumblue 0%, darkblue 100%);
    background: -o-linear-gradient(top, mediumblue 0%, darkblue 100%);
    background: -ms-linear-gradient(top, mediumblue 0%, darkblue 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0b7396', endColorstr='#0b7396',GradientType=0 );
    background: linear-gradient(top, mediumblue 0%, darkblue 100%);
}
.blue:active {
    background-color: darkblue;
    background: -moz-linear-gradient(top, darkblue 0%, darkblue 100%);
    background: -webkit-linear-gradient(top, darkblue 0%, darkblue 100%);
    background: -o-linear-gradient(top, darkblue 0%, darkblue 100%);
    background: -ms-linear-gradient(top, darkblue 0%, darkblue 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0d6380', endColorstr='#0d6380',GradientType=0 );
    background: linear-gradient(top, darkblue 0%, darkblue 100%);
}.effect-1 {
    transition: padding 1s;
    -webkit-transition: padding 1s;
    -moz-transition: padding 1s;
    -o-transition: padding 1s;
    -ms-transition: padding 1s;
}
.effect-1:hover {
    padding: 10px 130px;
}

.a_demo_two {
    background-color:darkblue;
    padding:10px;
    position:relative;
    font-size:18px;
    text-decoration:none;
    color: lightblue;
    box-shadow: inset 0px 1px 0px mediumblue, 0px 6px 0px mediumblue;
    border-radius: 5px;
}
 
.a_demo_two:active {
    top:7px;
    box-shadow: inset 0px 1px 0px mediumblue, inset 0px -1px 0px mediumblue;
    color: #156785;
    text-shadow: 0px 1px 1px rgba(255,255,255,0.3);
}