@charset "UTF-8";

/*color guide********************
logo blue: color: #4369B2;
logo green: color: #6D6D2D;
quote background: #a1a179;
********************************/

html {
	width: 100%;
}
body {
	font-size: 100%;
	text-align: center;
	color: #333;/*trumps browser defaults*/
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0; /*removes border in old IE*/
	background: #8b8a57;
}
h1, h2, h3 {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	color: #000;
}
p {
	font-family: 'Habibi', 'Times New Roman', serif;
	font-size: 1em;/*keep*/
	letter-spacing: .01em;
	color: #333;
	text-align: left;
	margin: 0px;
	padding: 0px 3%;
}
h1 {
	font-size: 1.3em;
	letter-spacing: .1em;
	text-align: left;
	padding: 30px 3% 10px 3%;
	color: #6D6D2D;
}
h2 {
	font-size: 1.1em;
	letter-spacing: .1em;
	margin-top: 20px;
	padding: 0px 3%;
	color: #333;
}
h3 {
	font-size: .9em;
	margin: 0;
	padding: 0px 3%;
	color: #333;
}
p._centered, h1._centered,
h2._centered , h3._centered {
	text-align: center;
	margin-top: 20px;
	padding: 0;
}
/*h2.left_margin {
	margin-top: 20px;
	padding-left: 1.9em;
}*/
h2 a:link, h2 a:visited, h2 a:hover {
	color: #6E6D2D;
}
a {
	outline: 0;	
}
a:link, a:visited {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	text-decoration: none;
	color: #000;
	outline: 0;
}
a:hover, 
a:active/* IE's a:focus */, 
a:focus {
	text-decoration: underline;
	outline: 0;
}
a:active {
	color: #333;	
}
a img {/* removes default blue border displayed in some browsers when image is surrounded by a link */
	border: none;
}
ul {
	font-family: 'Habibi', 'Times New Roman', serif;
	font-size: 1em;
	list-style: none;
	margin: 0;
	padding: 0;
}
ul li {
	color: #000;
	margin: 0;
	padding: 0;
}
ul li a {
	font-size: 1em;
	color: #000;
}
ul li img {
	margin: 0;
	padding: 0;
}
ul li a:active {
	text-decoration: none;
}
img {
	margin: 0;
	padding: 0;
}
#container {/*whole doc*/
	width: 70%;
	max-width: 1366px;
	min-width: 768px;
	height: auto;
	margin: 0 auto;
	padding: 0;
	overflow: hidden;
	position: relative;
	box-shadow: 4px 4px 4px 4px rgba(0,0,0,.3);
	-moz-box-shadow: 4px 4px 4px 4px rgba(0,0,0,.3);
	-webkit-box-shadow: 4px 4px 4px 4px rgba(0,0,0,.3);	
	background: #fff;
}
#content {/*sidebar and main*/
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 0;
	display: block;
	position: relative;
	z-index: 10;/*helps with nav dropdown issue*/
	background: #545454;
}
#header {
	width: 100%;
	height: 210px;
	margin: 0;
	padding: 0;
	position: relative;
	background: #4369B2;
	z-index: 200;
}
#nav {
	height: 100px;
	width: 100%;
	margin: 0;
	position: relative;
	background: #fff;
}
.navleft {
	width: 48%;
	font-size: 1em;
	margin: 50px auto 0;
	padding-left: 1%;
	float: left;
}
.navright {
	width: 48%;
	font-size: 1em;
	margin-top: 50px;
	padding-right: 2%;
	float: right;
}
#nav ul {
	list-style-type: none;
}
#nav ul.navigation {
	/*empty: used for nav highlight page script*/
}
#nav ul.navigation li.selected a {
	border-bottom: 4px solid #a1a179;
}
#nav ul li {
	margin-left: 15px;
}
#nav ul li.arrow {
	margin: 0;
	padding: 0;
}
#nav ul li.arrow a {
	padding: 0;
}
#nav ul li.arrow img {
	margin: 4px 0 0;
	padding: 4px;
}
#nav ul li.arrow li a {/*submenu*/
	padding: 5px 0 5px 10px;
}
#nav ul li.arrow ul.MenuBarSubmenuVisible li {
	margin-left: 0;
}
#nav ul li.arrow ul.MenuBarSubmenuVisible li a {/*dropdown:*/
	height: auto;
}
#nav ul li.arrow ul.MenuBarSubmenuVisible li a:active,
#nav ul li.arrow ul.MenuBarSubmenuVisible li a:hover,
#nav ul li.arrow ul.MenuBarSubmenuVisible li a:focus {/*dropdown:*/
	color: #000;
	background: url(images/waves4.png) no-repeat scroll;
	border: none;
}
#nav ul li.arrow a:active,
#nav ul li.arrow a:hover,
#nav ul li.arrow a:focus {
	color: #000;
	background: none;
	border: none;
}
#nav ul li a {
	padding: 5px 5px 3px;
}
.navleft ul li {
	float: left;
}
.navright ul li {
	float: right;
}
#nav ul li a:hover,
#nav ul li a:active,
#nav ul li a:focus {
	text-decoration: none;
	background: url(images/waves4.png) no-repeat scroll;	
}
#logowrap {
	height: 80px;
	width: 80px;
	position: absolute;
	left: 45%;
	top: 20px;
	z-index: 4;
}
#branding {
	width: 100%;
	height: 70px;
	background: #fff;
}
#branding p {
	font-family: 'Droid Serif', Georgia, serif;
	font-size: 2em;
	letter-spacing: 0.2em;
	text-align: center;
	color: #000;
	padding: 10px 0px;	
}
#tagline {
	width: 100%;
	height: 40px;
	margin: 0;
	background: #4369B2;
}
#tagline p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: 0.95em;
	text-align: center;
	letter-spacing: .08em;
	color: #eee;
	padding: 10px 0 0;
}
#sidebarleft {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	text-align: center;
	width: 25%;
	margin: 0;
	padding: 0;
	float: left;
	position: relative;
	z-index: 12;
	background: #779DE5 url(images/waves4.png) repeat scroll;
	/*below keeps extended sidebar level with footer:*/
	padding-bottom: 5000em;
	margin-bottom: -5000em;
}
#sidebarleft h2,
#sidebarleft h3 {
	margin-top: 20px;
	padding: 0;
	color: #333;
}
#sidebarleft h2 a:link {
	color: #333;	
}
#sidebarleft .featured {
	width: 100%;
	margin: 0;/*here?**************************************************************************************/
	display: block;
}
#sidebarleft .featured img {	
	width: 90%;
	margin: 0 0 10px;
}
#sidebarleft .featured img.orca {	
	width: 90%;
	margin: 0;
}
#sidebarleft .featured img.expert {/*on peer page*/	
	padding-top: 20px;
}
#sidebarleft .featured p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: .8em;
	letter-spacing: .11em;
	text-align: left;
	color: #000;
	margin: 0 0 10px 0;
	padding: 0 3% 0 7%;/*here?**************************************************************************************/
}
#sidebarleft .featured p.centered {
	text-align: center;
}
#sidebarleft .featured p a {
	font-weight: bold;
	color: #4c4c1f;
}
#sidebarleft .featured p.photocredit {
    font-size: .75em;
	text-align: center;
	color: #333;
	margin-top: 2px;
}cer
#sidebarleft .summaryServices {/*home page list*/
	font-size: .95em;
	letter-spacing: .12em;	
}
/*#sidebarleft .specificServices {/*on dedicated services pages*/
	/*font-size: 1.05em;
	letter-spacing: .15em;
	margin-bottom: 20px;
}*/
#sidebarleft .serviceList {/*on home and dedicated services pages*/
	width: 85%;
	margin: 0 0 10px 1.7em;
	padding: 0;
	clear: both;
/*here?**************************************************************************************/
}
/*
#sidebarleft .summaryServices.about {
	margin-bottom: 40px;
	padding-left: .5em;
}
#sidebarleft .summaryServices.about p {
	text-align: center;
}
#sidebarleft .summaryServices.about .serviceList {
	margin: 0 0 10px 0;
}
*/
#sidebarleft .serviceList a:link,
#sidebarleft .serviceList a:visited {
	text-decoration: none;	
}
#sidebarleft .serviceList a:hover {
	text-decoration: underline;	
}
#sidebarleft .serviceList img {
	margin: 0;
	float: left;
}
#sidebarleft .serviceList p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: 1em;
	text-align: left;
	color: #333;
	overflow: hidden;
}
.services_list {
	width: 100%;
	margin: 0;
	padding: 0;	
}
.services_list li {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	text-align: left;
	color: #333;
	margin: 0;
	padding:  0 8px 10px 2px;
	overflow: hidden;
}
.services_list p {
	margin: 0;
	padding: 0;
	overflow: hidden;	
}
.services_list img.outside_li {
	margin: 0;
	padding: 0 0 0 10%;
	float: left;	
}
.services_list img.inside_li {
	margin: 0;
	padding: 0 0 0 10%;
	float: left;	
}
#sidebarleft .resumes {/*about page*/
	width: 100%;
	margin: 20px auto 40px;/*here?**************************************************************************************/
	padding: 0;
	overflow: hidden;
}
#sidebarleft .resumes .serviceList {/*about page*/
	text-align: left;
	margin: 0 0 15px 2em;/*here?**************************************************************************************/	
}
#sidebarleft .resumes .serviceList img {/*about page*/
	margin: 4px .6em 0 0;/*here?**************************************************************************************/
}
#sidebarleft .sidebar_aside {
	width: 100%;
	margin: 10px auto 0;/*change to zero?*//*here?**************************************************************************************/
}
#sidebarleft .sidebar_aside p {
	text-align: center;
	color: #333;
	margin-left: 5%;/*here?**************************************************************************************/
}
#sidebarleft .certs {
	width: 95%;
	margin: 20px auto 0;
}
#sidebarleft .certs p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: 1.1em;
	letter-spacing: .07em;
	font-weight: bold;
	text-align: center;
	text-shadow: 1px 1px 2px #ddd;
	margin-bottom: 15px;
}
.logoBreak {
	width: 100%;
	margin: 10px 0;
	padding-top: 20px;	
}
.logoBreak img {
	width: 15%;
}
blockquote {
    font-family: 'Habibi', 'Times New Roman', serif;
	font-size: .9em;
    text-align: left;
    font-style: italic;
	color: #333;
    width: 90%;
    margin: 40px auto 0;/*here?**************************************************************************************/
    quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
	font-family: 'Habibi', 'Times New Roman', serif;
	font-size: 4em;
    line-height: 0.1em;
	color: #575724;
    content: open-quote;
    margin-right: 0.1em;
    vertical-align: -0.4em;
}
blockquote p {
    display: inline;
}
blockquote:after {
	content: none;
}
blockquote cite {
	font-family: 'Habibi', 'Times New Roman', serif;
	font-size: .9em;
	letter-spacing: .05em;
	color: #000;
	color: #333;
	display: block;
	margin: 10px 0 0;
	padding-left: 2em;
}
.peerQuote {/* on peer page */
	width: 88%;
	font-size: .9em;
	margin: 30px auto 10px;
	padding: 0 2% 6px;
	border-radius: 10px;
	border-top: 6px solid #4369B2;
	border-bottom: 6px solid #4369B2;
}
.peerQuote blockquote {
	font-family: 'Habibi', 'Times New Roman', serif;
	letter-spacing: .05em;
	width: 100%;
	margin: 10px 0;
	padding: 10px 0 0;
	position: relative;
	border: none;
	background: #fff;
}
.peerQuote blockquote:before {
	font-family: 'Habibi', 'Times New Roman', serif;
	color: #575724;
	line-height: 0.1em;
	content: open-quote;
	font-size: 4em;
    margin-right: 0.1em;
    vertical-align: -0.4em;
}
#main {
	width: 75%;
	text-align: center;
	margin: 0;
	padding: 0 0 10px;
	background: #fff;
	float: right;/*here?**************************************************************************************/
	position: relative;
	/*below keeps main nailed down to footer*/
	padding-bottom: 5000em;
	margin-bottom: -5000em;
}
#main p {
	font-size: 1em;
	line-height: 1.3;
	margin-bottom:	15px;
}
#main p.caption {
	font-size: .8em;	
}
#main h1.index {/*index page*/
	text-align: center;
	color: #333;
	margin-top: 30px;	
}
#main h1.services_h1 {
	margin-top: 0;
	padding-top: 20px;	
}
#main h2 {
	text-align: left;	
}
#main h2 a {
	color: #4369B2;
}
#main p a:link, 
#main p a:visited, 
#main p a:hover {
	font-family: 'Habibi', 'Times New Roman', serif;
	color: #4369B2;
}	
#main ul li a:link,
#main ul li a:visited,
#main ul li a:hover {
	color: #4369B2;	
}
#main p.breadcrumbs {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: .75em;
	color: #333;
	margin: 8px 0 0;
	padding-bottom: 0;
}
#main p.breadcrumbs a,
#main p.breadcrumbs a:hover,
#main p.breadcrumbs a:active,
#main p.breadcrumbs a:visited {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	color: #333;	
}
#main .slider {
	
}
#main .main_aside {
	width: 94%;
	font-size: 1em;
	clear: both;
	display: block;
	border-radius: 10px;
	border: solid 3px #8A8957;
	margin: 30px auto 20px;/*here?**************************************************************************************/
	padding: 0 0 10px;
	background: #fff;
	overflow: hidden;
}
#main .main_aside h2 {
	font-size: 1.2em;
	text-align: center;
	color: #6E6D2D;
	margin-bottom: 20px;
}
#main .main_aside h3 {
	font-size: 1.1em;
	text-align: center;	
	color: #333;
	margin: 30px 0 20px;
}
#main .main_aside img {
	width: 100%;
	max-width: 400px;	
}
#main .main_center {
	width: 62%;/*here?**************************************************************************************/
	float: left;/*here?**************************************************************************************/
	background: #fff;
}
#main .main_center p, 
#main .main_center h1, 
#main .main_center h2 {
	margin-left: 2%;
}
#main .main_right {
	width: 34%;
	margin: 0 0 10px 0;
	padding-right: 3%;/*here?**************************************************************************************/
	float: right;
}
#main .main_right img {
	width: 95%;
	max-width: 220px;
	margin: 30px 0 20px;
	background: #fff;
}
#main .main_right p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: .9em;
	padding-left: 15%;	
}
#main .main_right h2 {
	margin-top: 0;
	padding-left: 10%;	
}
#main #projectsList img.projects {
	width: 50%;
	margin: 0 3% 20px;/*here?**************************************************************************************/
}
#main p.projects {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	letter-spacing: .1em;
	font-size: 1em;
	color: #333;
	padding-left: 5%;
}
#projectsList img {
	margin: 10px 2% 0 0;
}
#main .services_list {
	width: 80%;
	height: auto;
	margin: 0 auto 20px;
	border: none;
}
#main ul.services {/*services page*/
	font-size: .9em;
	margin: 0 6% 10px 3%;
	list-style-type: none;
}
#main .full_size_photo {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0 0 10px;
	background: #fff;
}
#main .full_size_photo img {
	width: 94%;
	max-width: 680px;/*here?**************************************************************************************/
	margin: 0 auto 10px;
	display: block;
}
#main .medium_size_photo {
	width: 100%;
	margin: 20px auto 0;
	background: #fff;
}
#main .medium_size_photo img {
	width: 75%;
	max-width: 530px;/*here?**************************************************************************************/
	margin: 0 auto 10px auto;
	padding: 0;	
}
#main .small_size_photo {
	width: 60%;
	height: auto;/*need?*/
	margin: 4px 0;
	padding: 0 3% 10px 3%;
}
#main .small_size_photo img {
	width: 99%;/*keep: some have border class which adds a bit of width*/
	max-width: 430px;/*here?**************************************************************************************/
	margin: 0 0 10px;
	padding: 0;
}
#main .small_size_photo p,
#main .medium_size_photo p
#main .full_size_photo p
 {
	margin-bottom: 0;
	padding-bottom: 6px;
}
#main .ex_small_size_photo {
	width: 40%;
	height: auto;/*need?*/
	margin: 0 0 0 2%;/*here?**************************************************************************************/
	padding: 0;
}
#main .ex_small_size_photo img {
	width: 99%;/*keep: some have border class which adds a bit of width*/
	max-width: 400px;
	margin: 5px auto 10px;
	padding: 0;
}
#main ul.list_indent {/*on resources page*/
	font-family: 'Century Gothic', 'Muli', sans-serif;
	list-style-type: none;
	margin: 0 0 10px 6em;
}
#main ul.list_indent li {
	text-align: left;
	margin-bottom: 5px;
}
#main ul.list_indent a:link {
	color: #4369B2;
}
#main .hobbies {
	padding-bottom: 20px;	
}
.caption {/*used on main*/
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: .8em;
	letter-spacing: .14em;
	text-align: center;
	color: #6D6D2D;
	clear: both;
}
#main .main_contact {
	margin: 30px 0 0;
	padding: 0 0 60px 10%;/*here?**************************************************************************************/
}
#main .contact_item {
	height: 4em;
	margin: 0 0 10px 0;
	padding: 0;
}
#main .main_contact img {
	margin-right: 10px;
	float: left;
}
#main .certs {
	width: 95%;
	margin: 20px auto;
}
#main .certs p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: 1.2em;
	letter-spacing: .07em;
	font-weight: bold;
	text-align: center;
}
#main .mainBottom {
	height: 20px;
	clear: both;	
}
#main ul.sitemap {
	width: 100%;
	line-height: 2;
	margin-bottom: 20px;
}
#main ul.sitemap li {
	color: #4369B2;
	text-align: left;
	margin-left: 10%;	
}
#main ul.sitemap ul {
	margin-left: 6%;
}
.certs p a:link,
.certs p a:visited,
.certs p a:hover,
.certs p a:active
 {
	color: #6D6D2D;
}
.certs p a:hover {
	text-decoration: underline;
}
#certs p a:active {
	text-decoration: none;
}
#footer {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	line-height: 1.4;	
	height: 130px;
	width: 100%;
	background: #4369B2;
	margin-bottom: 0;
	padding-bottom: 10px;
	position: relative;/*makes IE6 hasLayout properly clear */
	/*z-index: 10;*/
	clear: both;
	overflow: hidden;
}
#footer_contact {
	width: 70%;
	margin-top: 20px;
	float: right;
}
#footer_contact p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: .8em;
	letter-spacing: .1em;
	text-align: center;	
	color: #eee;
	padding: 10px 0px;
}
#footer_contact p a {
	color: #eee;
}
#copyright {
	width: 70%;
	margin-bottom: 10px;
	position: relative;
	float: right;
}
#copyright p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: .8em;
	letter-spacing: .1em;
	text-align: center;
	color: #eee;
	margin-bottom: 0;
}
#copyright p a {
	color: #eee;	
}
#footer2 {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	line-height: 1.4;	
	height: 130px;
	width: 100%;
	background: #4369B2;
	margin-bottom: 0;
	padding-bottom: 10px;	
}
#footer_contact2 {
	width: 100%;
	margin-top: 20px;
}
#footer_contact2 p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: .8em;
	letter-spacing: .1em;
	text-align: center;	
	color: #eee;
	padding: 10px 0px;
}
#footer_contact2 p a.color_e,
#copyright2 p a.color_e {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	color: #eee;
}
#copyright2 {
	width: 100%;
	margin-bottom: 10px;
	position: relative;
	float: right;
}
#copyright2 p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: .8em;
	letter-spacing: .1em;
	text-align: center;
	color: #eee;
	margin-bottom: 0;
}
.certsAbsolute {
	width: 25%;
	position: absolute;
	left: 0;
	bottom: 150px;
	z-index: 220;
}
.certsAbsolute p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: 1.2em;
	letter-spacing: .07em;
	font-weight: bold;
	text-align: center;
	text-shadow: 1px 1px 2px #ddd;
	margin-bottom: 15px;
}
.certsAbsolute p a {
	font-weight: bold;
	color: #6d6d2d;
}
.linkedIn {
	width: 25%;
	text-align: center;
	position: absolute;
	left: 0;
	bottom: 60px;
	z-index: 200;
}
.design {
	width: 25%;
	position: absolute;
	left: 0;
	bottom: 20px;
	z-index: 210;
}
.design p {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-size: .8em;
	text-align: center;
	color: #ddd;
}
.hobbies {
	margin-top: 20px;	
}
.aboutLogoIcon {
	width: 100%;
	height: auto;
	text-align: center;
	margin-bottom: 20px;
}
.aboutLogoIcon img {
	margin: 0;
}
.fltrt {
	float: right;
}
.fltlft {
	float: left;
}
.centered {
	margin-left: auto;
	margin-right: auto;
}
.centered_text,
.centered_text p {
	text-align: center;
}
.clear {
	clear: both;	
}
.clear_left {
	clear: left;	
}
.clearfix:before, 
.clearfix:after {
	content: "";
	display: table;
}
.clearfix:after {
	clear: both;	
}
.clearfloat {
	clear: both;
	height: 0;
}
/*
in head CC:
<style>
(trigger hasLayout)
.clearfix {
	zoom:1;	
}
</style>*/
.habibi {
	font-family: 'Habibi', 'Times New Roman', serif;
	font-size: .9em;
}
.century_gothic {
	font-family: 'Century Gothic', 'Muli', sans-serif;
}
.italic {
	font-style: italic;
}
.bold {
	font-weight: bold;
}
.underline {
	text-decoration: underline;
}
.textleft {
	text-align: left;
}
.no_margin {
	margin: 0;	
}
.currentPage {
	border-bottom: 6px solid #a1a179;
}
.green_bg {
	background: #a1a179;	
}
.bluetext {
	color: #4369B2;	
}
.greentext {
	color: #6E6D2D;	
}
.greentext.italic {
	font-size: 1em;	
}
.pdf {
	font-family: 'Century Gothic', 'Muli', sans-serif;
	font-weight: bold;
	font-size: .9em;
	letter-spacing: .15em;
	text-align: center;
	color: #000;
	color: #333;
	margin-bottom: 15px;
	clear: both;	
}
a.arsenalFC {
	font-size: 2em;
	color: red;
}
.image_border_grey {
	border: .1em solid #999;	
}