*, *:before, *:after {

  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;

 }

body {

	font-family: 'Open Sans', sans-serif;

	font-size: 17px;

	line-height: 1.5;

  padding:0px;

  margin:0px;

}



textarea, input, button {

	font-size: inherit;

	/*background-color:#B26C00;*/

}





.container-content, .container-nav .container-inner, .container-footer .container-inner, .container-header .container-inner {

  width: 1024px;

  margin: 0 auto;

}

.container-header, .container-footer, .container-content, .container-nav {

	display: block;

	overflow: hidden;

	

}

.container-skills div {

	padding:0.9em;

	width: 49%;

	margin-left: 1%;

	float: left;

	transition: ease 0.5s;

}

.container-skills div h2 {

	transition: ease 0.5s;

	margin-top:0;

}

.container-skills div:hover h2 {

	color:#0064B2;

}

.container-skills div:hover {

	background-color:#EAEAEA;

}



.container-inner {

	padding:5px;

	display: block;

	overflow: hidden;

  width: 100%;

}



.container-content .container-inner {

	padding: 5px 20px;



}



.float-right {

	float: right;

}

.float-left {

	float: left;

}

.clearfix {

	clear: both;

}	

.container-nav {

	background-color:#450000;

	box-shadow: 0px 0px 15px #ADADAD;

	margin-top: 0px;

	position: relative;

	overflow: visible;

 

}

.container-header {

  width: 100%;

}

.container-header .container-inner {

	/*background-color: #FFFFFF;*/

	box-shadow: 0px 0px 225px #ADADAD;



}

.container-footer {

	background-color:#450000;

	color:white;

	font-size: 0.9em;

	box-shadow: 0px 0px 15px #ADADAD;

	padding: 20px 5px;

}

.container-nav ul, .container-nav li  {

	list-style-type: none;

	margin: 0px;

	padding:0px;

}

.container-nav li { 

	margin: 0px;

	float: left;

}

.container-header .container-inner {

	padding: 20px;

}

.container-left {

	width: 65%;

	float: left;

}

.container-right {

	width: 24%;

	margin-top: 10px;

	

	float: right;

}

.container-content h1 {

	font-size: 1.5em;

	color:#B26C00;

}

.container-content h2 {

	font-size: 1.2em;

}

.container-content h3 {

	font-size: 1.1em;

	color:#0064B2;

}

.container-header h2 {

	font-size: 1,4em;

	color:#0064B2;

	margin: 0px;

}

.container-header h3 {

	font-size: 1.2em;

	margin: 0px;

	margin-left: 20px;

}

.container-nav li a {

	padding:5px 10px;

	display: block;

	text-decoration: none;

	font-weight: bold;

	color:white;

	transition: ease 0.5s;

}

.container-content a {

	color:#0064B2;

}

.container-content a:hover {

	color:#676767;

}



.container-nav li a:hover, .container-nav li.active a.dropdown-header {

	color:#676767;

	background-color:#FFA419;

	

	box-shadow: 0px 0px 3px #FFFFFF;

	

}

.show-480 {

	display: none;

}

.hidden {

	display: none;

}

.dropdown {

	float: none;

	position: absolute;

	background-color:#91CEFF;

	top: 100%;

	

}

.container-header .linkedin, .container-header .github , .container-header .twitter {

	float: right;

	margin-right: 15px;

	margin-top: 5px;

}

.contact-social span {

  width:50px;

  display: inline-block;

  max-height: 25px;

  overflow: hidden;

}

.contact-social span img {

  height: 25px;

}



.hover-highlight:hover {

	opacity: 0.5;

}

.container-right img {

	width: 100%;

	max-width:220px;

}

.text-did-you-know {

	height: 140px;

	display: block;

}

label {

	display: block;

	float: left;

	width: 23%;

	clear:both;

	margin-top: 5px;

}



fieldset {

	border: 1px solid #DADADA;

}

fieldset input, fieldset textarea{

	border: 1px solid #0064B2;

	padding: 5px;

	box-shadow: 0px 0px 5px #ADADAD;

	width: 98%;

}

fieldset textarea {

	height: 100px;

}

fieldset input:focus, fieldset textarea:focus {

	background-color:#D0F0FF;

}

button {

	background-color:#0064B2;

	padding:10px;

	color:white;

	border: 0px;

	box-shadow: 0px 0px 5px #ADADAD;

	margin-top: 10px;

	clear: both;

	cursor: pointer;

}

fieldset div {

	margin-top: 5px;

	width: 73%;

	float: left;

}

button:active {

	background-color:#FFA419;

}

button:hover {

	background-color:#008FFE;

}

.button-internal {

	width: 100%;

}



.form-submit {

	display: none;

}

.errortext {



	color:red;

	display: block;

	float: left;

}	

.fullscreen-backdrop {

	background-color:black;

	position: fixed;

	z-index:100;

	opacity: 0.5;

	top: 0px;

	left: 0px;

	right: 0px;

	bottom: 0px;

display: none;

}

.modal-progress {

	left: 25%;

	right: 25%;

	top: 45%;

	display: block;

	overflow: hidden;

	padding: 20px;

	background-color:white;

	box-shadow: 0px 0px 10px #DADADA;

	position: fixed;

	z-index:105;

	display: none;

}

.modal-progress img {

	float: left;

}

.modal-progress .text-progress {

	float: left;

	margin-left: 10px;

	margin-top:5px;

}	

.errorfield {

	background-color:yellow;

	color:red;

}

.container-peterborough, .container-contact-form {

	display: none;

}

.linkedin img {

	border: 0px solid black;

}

.grid-home {

	width: 100%;

	list-style:none;

	padding:0px;

	margin:0px;

	margin-top: 40px;

	margin-bottom: 20px;

	overflow:hidden;

}

.grid-home  li {

	float: left;

	width: 100%;

	margin: 0px 10%;

	height: 100%;

	

}

.grid-home li img {

	max-width: 50%;

	max-height: 70px;

	float: left;

	-webkit-filter: grayscale(100%);

	-moz-filter: grayscale(100%);

	filter: grayscale(100%);	

	transition: ease 0.5s;

	

}

.grid-home li:hover img {

	-webkit-filter: grayscale(0%);

	-moz-filter: grayscale(0%);

	filter: grayscale(0%);	

	

}

.grid-home li a {

	text-decoration:none;

	display: block;

	width: 100%;

	overflow: hidden;

	border: 1px solid #FFF;

	padding: 7px;

	transition: ease 0.5s;

	font-size: 1.5em;

	

}

.grid-home li a:hover {

	background-color:#FFA419;

	border: 1px solid #0064B2;

	box-shadow: 0px 0px 5px #343434;

}

.grid-home li a span {

	display: block;

	float: left;

	margin-top: 15px;

	margin-left: 25px;

	

}

.photo {

	border-radius: 100%;

	padding: 6px;

	box-shadow: 0px 0px 30px #ADADAD;

}

/** Responsive Code **/

@media (max-width: 1024px) {

  .container-content, .container-nav .container-inner, .container-footer .container-inner, .container-header .container-inner {



		width: 100%;

	}

}

@media (max-width: 720px) {

	.container-left, .container-right {

		width: 100%;

		float: none;

	}

	.container-right {

		padding-top: 30px;

		border-top: 3px #DADADA solid;

	}

	.container-content h1 {

		font-size: 1.5em;

	}

	.container-content h2 {

		font-size: 1.4em;

	}

	.container-content h3 {

		font-size: 1.3em;

	}

	.container-header h2 {

		font-size: 1.6em;

	}

	.container-header h3 {

		font-size: 1.2em;

		margin-left: 0px;

	}	

	fieldset label, fieldset input, fieldset textarea {

		width:96%;

		

	}

	.grid-home {

		margin-top: 20px;	

	}

	

	.grid-home  li {

		width: 100%;

		margin-left: 3%;

	}	

	.grid-home li img {

		max-width: 60%;

	}

	

}

@media (max-width: 480px) {

  .grid-home li a {

    font-size: 1.3em;

    

  }

  .container-header h2 {

    clear: both;

  }

  .footer-copyright {

    clear: both;

    display: block;

  }

	.show-480 {

		display: block;

	}

	.hide-480 {

		display: none;

	}

	.container-header h2 {

		font-size: 1.3em;

		

	}

	.container-header h3 {

		font-size: 0.9em;

		margin-left: 0px;

	}

	.container-footer div {

		text-align:center;

		display: block;

		float: none;

	}

}