/* Text */

body {
    font-family: 'Roboto', sans-serif;
	font-size: 15px;
	font-weight: 500;
	text-align: left;
	margin: 0;
	padding: 0;}

nav p { margin: 0 2em 1.5em 0; line-height: 0.5em; }
.sectionInfo p { margin: 1.5em 1em 1.5em 0; line-height: 1.5em; }
.sectionContact p { margin: 0 2em 1.5em 0; line-height: 1.5em; }
.sectionWork p { margin: 0 2em 1em 0; line-height: 1.1em; }
.sectionProjectItem p { margin: 0 2em 1em 0; line-height: 1.1em; }

a.standardLink { color: #000000; font-style: italic; }
a.standardLink:visited { color: #000000; }

header a.logo { color: #000000; font-weight: 700; font-style: none; text-decoration:none; }
header a.logo:visited { color: #000000; }

b { font-weight: 900; }

.sidebarText {
	position: absolute;
	left: -9em;
	width: 120px;
	word-wrap: break-word;
	color: #d6d6d6;
	font-weight: 400;
}

@media only all and (max-width: 840px) {
	.sidebarText {display: none;}
}

img {cursor:url('../circle.svg') 50 50,auto;
max-height: 480px;}

.imagespin {
    -webkit-animation:spin 8s linear infinite;
    -moz-animation:spin 8s linear infinite;
    animation:spin 8s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

/* Blue Circle */

.circle {width:20px;
  height:20px;
  border-radius:10px;
  background:#4540e5}

/* Formatting Stuff */

.pageColumn {
    margin: 20px auto;
    max-width: 620px;
    width: 100%;
	padding: 10px;
	position: relative;
}

* {-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

header { margin: 0 0 40px 0;
	position: relative;}

nav { margin: 0 0 20px 0;}


.centreline hr{
	width: 100%;
	color: #000;
	background-color: #000;
	border-top-style: solid;
	border-top-width: 2px;
}

section.sectionNav {
list-style: none;
display: -ms-flexbox;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: flex;
-webkit-flex-flow: row wrap;
-moz-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
position:relative;
}

.navLogo {
	position: absolute;
	right: -8em;
	width: 100px;
}

@media only all and (max-width: 840px) {
	.navLogo {display: none;}}

section.sectionImageBank{
	padding-top: 20px;
    padding-bottom: 20px;
    position: relative;
	margin-bottom: 40px; }
}

section.sectionInfo {
position:relative;
	margin-bottom: 30px;
}

section.sectionContact, section.sectionWork, section.sectionNews {
	list-style: none;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  -moz-flex-flow: row wrap;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  position:relative;
  margin-top: 30px;
  margin-bottom: 30px;
}

section.sectionContact aside.left {	
	-webkit-flex:auto;
	-moz-flex:auto;
	flex: auto;
	width: 50%; 
	float: left; 
	font-weight: 400;
}

  section.sectionContact aside.right {	
  	-webkit-flex:auto;
  	-moz-flex:auto;
	flex: auto;
	width: 50%; 
	float: left;
}

.pindexGroup { 	-webkit-flex:auto;
	-moz-flex:auto;
	flex: auto;
	width: 100%; 
	float: left; 
	margin-bottom: 20px;}

.pindexNumberBold {
	-webkit-flex:auto;
	-moz-flex:auto;
	flex: auto;
	width: 15%; 
	float: left; 
	font-weight: 900;
}

.pindexNumber {
	-webkit-flex:auto;
	-moz-flex:auto;
	flex: auto;
	width: 15%; 
	float: left; 
	font-weight: 400;
}

.pindexDescription {
	-webkit-flex:auto;
	-moz-flex:auto;
	flex: auto;
	width: 85%; 
	float: left; }

.pindexType { 	-webkit-flex:auto;
	-moz-flex:auto;
	flex: auto;
	width: 35%; 
	float: left; 
	padding-right: 20px;}

.pindexProject { 	-webkit-flex:auto;
	-moz-flex:auto;
	flex: auto;
	width: 50%; 
	float: left; 
	padding-right: 20px;}

section.sectionProjectItem {
	list-style: none;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  -moz-flex-flow: row wrap;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  position:relative;
  	margin-top: 30px;
	margin-bottom: 40px; }

.newsGroup { 	-webkit-flex:auto;
	-moz-flex:auto;
	flex: auto;
	width: 100%; 
	float: left; 
	margin-bottom: 20px;}

.newsDate { 	-webkit-flex:auto;
	-moz-flex:auto;
	flex: auto;
	width: 30%; 
	float: left; 
	font-weight: 400;
	word-wrap: break-word;}

.newsText {-webkit-flex:auto;
	-moz-flex:auto;
	flex: auto;
	width: 70%; 
	float: left; 
}
