


/* Reset styles */
html,body,div,iframe,h1,h2,h3,p,img,strong,ol,ul,li,form,article,aside,footer,header,nav {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent
}
/* navigation related styles */
nav ul {
	list-style:none
}
nav {
	display:inline-block
}
nav ul li a {
	padding:2px px;
	font-size:14px;
	text-decoration:none;
	font-weight:bold;
	color:#344;
	
}
nav ul li {
	display:inline-block;
	margin:1px
}
nav ul {
	list-style:none
}
/* main content */
body,html {
	background-color:#FFF
}

body {
	line-height:1;
	font-family:arial
}
img {
	padding: 5px;
}
.pfp {
	float: left;
}
h1	{
	font-size:25px
}
h2 {
	font-size:21px
}
h3 {
	font-size:18px
}
article,aside,footer,header,nav {
	display:block
}
a {
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent
}
article {
	border-bottom:2px groove #998;
	padding-bottom:20px;
	margin-bottom:20px
}
article h2 {
	font-weight:normal;
	margin-bottom:12px
}
#page {
	padding:20px
}
#main {
	margin-left:320px
}
#wrapall {
	padding-top:50px
}
/* contact form */
input[type=text], select, textarea {
  width: 100%; 
  padding: 12px; 
  border: 1px solid #ccc; 
  border-radius: 4px; 
  box-sizing: border-box; 
  margin-top: 6px; 
  margin-bottom: 16px; 
  resize: vertical
}
input[type=submit] {
  background-color: #8f0021;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #73001A;
}

.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}
/* header and footer */
header {
	background:#1990ff;
	padding:10px 30px;
	margin:auto;
	position:fixed;
	left:0;
	right:0;top:0;
	z-index:999;
	height:30px
}
footer {
	background:#8f0021;
	max-width:1000px;
	margin:10px -20px;
	clear:both;
	text-align:right
}
footer p {
	padding:20px;
	color:#FFF
}
footer a {
	color:#FFF
}
#wrapall,#header {
	max-width:1100px;
	margin:0 auto
}

/* sidebar */
aside > div {
	margin:10px auto;
	background:#8f0021;
	min-height:150px;
	padding:10px 10px;
	text-align:center;
	color:#FFF
}
a#logo {
	vertical-align:middle;
	font-size:40px;
	color:white;
	font-weight:bold;
	display:block;
	text-decoration:none;
	text-align:center;
	line-height:40px;
	padding:40px 5px;
	background: #8f0021;
}
#sidebarContent {
	width:200px;
	background:#0008a8;
	padding:5px
}
#sidebar {
	float:left;
	position:absolute
}
/* mobile menu items */
#menuToggle,#mobileToggle {
	background:#FFF;
	cursor:pointer;
	display:inline-block;
	font-size:30px;
	width:30px;
	font-weight:bold;
	text-align:center;
	height:30px;
	line-height:30px;
	color:#344;
	border-radius:5px
}
#mobileToggle {
	vertical-align:middle;
	display:none;
	font-size:30px
}
#menuToggle:hover {
	color:#FFF;
	background:#344
}
/* responsive queries */
@media screen and (max-width:1100px){
	header {
		padding:10px
	}
	#headerLeft {
		width:auto
	}
	#headerRight {
		width:60%
	}
}
@media screen and (max-width:820px){
	#sidebar {
		display:none
	}
	#main {
		margin-left:0
	}	
}
@media screen and (max-width:600px) {
	#headerLeft {
		float:right
	}
	#headerRight {
		height:auto;
		position:absolute;
		width:auto;
		top:46px;
		background:#6f9898;
		left:0;
		display:none
	}
	.showMobileMenu #headerRight {
		display:block
	}
	nav ul li a {
		display:block;
		background:transparent;
		color:#FFF;
		text-align:center;
		font-size:16px;
		padding:3px 29px;
		line-height:25px
	}
	.showMobileMenu #mobileToggle {
		background:#344;
		color:#FFF
	}
	nav ul li {
		display:block;
		margin:0
	}
	header {
		padding:3px 10px
	}
	#page {
		padding: 20px 10px
	}
	#wrapall {
		padding-top:46px
	}
	#sidebarContent {
		right:0;
		background:#6f9898
	}
	#mobileToggle {
		display:inline-block
	}
}