div h2{
	display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom:  20px;
  margin-top:  30px;
  width: 50%;
  color: red;
}
div h4{
	display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom:  20px;
  margin-top:  20px;
  width: 50%;
  color: red;
}
header img{
	display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom:  0;
  margin-top:  0;
  width: 50%;
}
nav {
		    	float:left;
				background-color: orange;
				color:#000000;
				width:100%;
				padding-top :0;
		        padding-bottom :0;
		        padding-right :0;
		        padding-left :0;
				}

/*Navbar Functionality*/
#navbar{
    display:flex;
    flex-direction: column;
    background-color: gray;
    height: 14vh;
    width: 100vw;
    font-family: 'Ubuntu Mono', monospace;
    margin-top:5px;
   border: 2px solid black;
   border-radius:15px;
}
nav a {
		
		width:6em;
		float:left;
		text-decoration:none;
		padding-top :0.2em;
		padding-bottom :0.2em;
		padding-right :0.6em;
		padding-left :0.6em;
		color:white;
		background-color:blue;
		border: 1px solid white;	
		}
nav a:hover {
		background-color: #c39b77;
		}
nav	a:active {
    background-color: #fc0 !important;
    color: #ccc !important;
}
/*Navbar content functionality*/


/*Navbar content styling*/
ul li{
    list-style: none;
    margin: 5px;
    border-radius: 20px;
}
ul li a{
    padding: 1px;
    color:white;
    text-decoration: none;
    border-radius:10px;
}
ul li a:hover{
    background-color: red;
    border-radius: 10px;
}
ul li a:hover{
    background-color: green;
    border-radius: 10px;
}
/* Style the form to a fixed width so the form looks the same
	 even if the browser window is resize
*/
form {
	width 				: 50em;
}

/* Style the labels and input by aligning all input fields 
*/
label {
	float 				: left;
	text-align		: right;
	width 				: 10em;
	margin-right	: 1em;
}
input {
	width 				: 50%;
}

/* Style text input to have spacing between input fields
*/
.textinput {
	margin				: 10px;
}
/* Style radio button input to a single line
	 note that declarations are inherited 
*/
.radioinput fieldset {
	border				: none;
}
.radioinput legend {
	float 				: left;
	text-align		: right;
	width 				: 9em;		/* Not 10em as it is inside a fieldset */
	margin-right	: 1em;
}
.radioinput input  {
	width				: 2em;		/* reset inherited value from 10em to 2em */
}
.radioinput label  {
	float 				: none;		/* clears the inherited float left */
	text-align		: left;		/* reset inherited alignment to left */
}

/* Style  button input 
	 note that declarations are inherited 
*/
.buttoninput {
	text-align 		: right;
}
.buttoninput input {
	width				: auto;
}
.buttonreset {
	text-align 		: left;
	color: red;
}
.buttonreset input {
	width				: auto;
	color: red;
}
.btn{
	float: right;
    margin-top:15px;
    border: 3px solid white;
    border-radius:15px;
    background-color:yellow;
    font-size:20px;
    font-weight: bold;
    font-family: 'Ubuntu Mono', monospace;
}
.btn:hover{
    cursor: pointer;
    background-color: green;
}
.btn1{
	float: left;
    margin-top:15px;
    border: 3px solid white;
    border-radius:15px;
    background-color:orange;
    font-size:20px;
    font-weight: bold;
    font-family: 'Ubuntu Mono', monospace;
}
.btn1:hover{
    cursor: pointer;
    background-color: red;
}
footer {
    float: right;
    height: 35px;
    margin: 40px 50px 0px 0px;
    background: #9FF;
    color: #000;
    text-align: right;
    padding: 10px 30px;
    width: 400px;
}