/**
****************************************************************************************************
**                              ********      *******    ******     ***        ****   ******
**                               **    ***   ***    **  **           ***      ****   **    *** 
**  dogmo.com stylie goodness    **     ***  ***    **  **   ******  ** *    ** **   **    *** 
**  for your viewing pleasure    **     ***  ***    **  **     **    **  *  **  **   **    ***
**                               **    ***   ***    **  **    ***    **   ***   **   **    ***
**                      510.IS. ********      *******    ****** **  ***   ***   ***   ******
****************************************************************************************************
**/


/* 
HTML5 styles: 
be sure to include display: block; 
for browser compatibility
-----------------------------------*/

html, body { height:100%; }

html, body, p, li  {
	font-size: 16px;
	font-family: Frutiger, 'Frutiger Linotype', Univers, 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-style: normal;
	font-weight: normal;
	line-height: 1.5;
}

body {
	height:100%;
	width:100%;
	margin:0 auto;
	background:#dadada;
	}

header {display: block;}

header.interim {
	background: #ccc;
    color: #666;
    font-size: 0.85em;
    padding: 5px 10px;
    text-align: right;
	}
	.blogPage header.interim {text-align: center; background: #eee;}

nav {
	display: inline-block;
	float: right;
	margin: 1rem;
	border: 0;
	}

.gray {
	color:#999; 
}

section {display: block;}

article {display: block;}
aside {display: block;}
	
footer {
	display:block;
	position:relative;
	background:#888;
	width:100%;
	min-height:10rem;
	z-index:10;
	clear: both;
	height: 3px; /* weird bit part 1: makes the footer sticky at the bottom */
	margin-top: -3px; /* weird bit part 2: makes the footer sticky at the bottom */
}
footer nav {
	margin: 1rem 2rem;
}
footer nav, footer nav p, footer nav a {
	color: #dadada;
}
footer nav .social {
	margin: 1rem 1rem 1rem 0;
	text-align: left;
}
footer nav .social a {
	color: #dadada;
	font-weight: normal;
}

/* structural styles 
-----------------------------------*/

section.container {
	position: relative; 
	min-height: 100%; 
	max-width: 1280px;
	top:0px;
	margin: 0 auto;
	/*padding: 0 1rem;*/
	border:0;
	padding-bottom:3px; /* weird bit part 3: makes the footer sticky at the bottom */
	}
	
section#portoHed {
	width: 100%;
	height:180px;
	margin:0;
	border:0;
	padding:0;
	background: url(../img/bg_sfsunset.jpg) no-repeat center #dedede; /* background image set as default in case js is disabled */
	background-size: cover;
	position:relative;
	z-index:0;
	}
	
.mainContent {
	/*width:960px;*/
	/*margin: 0 4rem; */
	/* padding:10px 20px; */
	border: 0;
	overflow: hidden; /* this forces the container to have a height/width, which keeps the float: left or right images displaying within the container */
	/* background: url(../img/bg_dadada.png) repeat-y scroll center top #fff; dropshadow on main well, needs its own div? */
	}

	footer nav {
	    /*margin: 2rem 15%;*/
	}	
	footer nav p {
		color: #ccc;
		display: block;
		font-weight: normal;
		font-size: 0.85rem;
		line-height: 1.5;
		margin: 0 0 0 0;
	}
	#about footer nav p {
		margin-bottom: 0;
	}
	footer nav a {
		margin:0;
		font-size: 0.85rem;
	}
}

/* kludgey nonsense 
-----------------------------------*/

body section.portoImg p.radius5 {
	display:none; /* for all but home page: hiding the boxes in the header image for now. will use to call out info. */
	}
		
body#hm section.portoImg p.radius5 {
	display:block; /* revealing the boxes on the homepage. */
	font-size: 1.125rem;
    font-weight: normal;
    line-height: 1.25;
    padding: 1rem;
	}		
	
/* content styles 
-----------------------------------*/

a {
	color:#369;
	line-height: 1.5;
	text-decoration:none;	
	cursor: pointer;
	}
	
a:link {color:#369;}	
a:visited {color:#47a;}	
/*a:active {color:#69c;}
a:hover {color:#9cf;}*/
a:hover, a:active { 
	color:#fff; 
	}
	
p, li {
	color:#333;
	font-size: 0.85rem;
	line-height:1.5;
	text-decoration:none;
	padding:0;
	margin:0;
	}	
	
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	line-height: 1.5;
	color: #666;
	/* background:#dadada; */
	}
	
h1, .h1 { font-size: 1.5rem; }
h2, .h2 { font-size: 1.25rem; }
h3, .h3 { font-size: 1rem; }
h4, .h4 { font-size: 0.85rem; }
h5, .h5, h6, .h6 { font-size: 0.85rem; }

img { 
	float:left; 
	border:0;
	margin: 1rem 0;
	}
.left {
	float:left;
}
.right {
	float:right;
}		
.ctr	{
	text-align:center;
	margin: 0 auto;
}	
.clearfix {
	clear: both;
}		
.caption {
	margin: 0;
	font-size: 0.85rem;
}
.photoCaption {    
	color: #666;
    font-size: 0.85rem;
    display: inline-block;
    margin: -5px 10px 20px;
}
.blockquote {
	border-left: 5px solid #69c;
	display: inline-block;
	margin: 1rem 2rem !important;
	width: 50%;
}
.abt-img {
	max-width: 200px;
}
.social {
	margin:0 0 20px 0;
	padding: 0 0 20px 0;
	position: relative;
	text-align: right; 
	/*top: -105px; left: 135px;*/
}

.social img {margin: 0 10px;}

.social span {
	margin: 0 0.5rem;
}

.social a:link {
	-moz-opacity:1.0; /* for older mozilla */
	-khtml-opacity: 1.0; /* for nonwebkit safari */
	-webkit-opacity:0.99; /* for buggy chrome */
	filter:alpha(opacity=100); /* for IE*/
	opacity:0.99; /* FF/Opera/Safari/Chrome */
}	
.social a:active {
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	-webkit-opacity:0.8;
	filter:alpha(opacity=80);
	opacity:0.8;
}


.social a:hover {
	-moz-opacity:0.75;
	-khtml-opacity: 0.75;
	-webkit-opacity:0.75;
	filter:alpha(opacity=75);
	opacity:0.75;
}


.portoImg p {
	background: rgba(108, 108, 108, 0.8);
	padding: 0 10px;
	min-height:60px;
}
	
.tidbits p {margin-bottom:10px;}	

.intro, .intro p {
	color: #888;
	font-size: 1.125rem;
	font-style: italic;
	font-weight: normal;
	line-height: 1.5;
	margin-bottom: 2.5rem;
}

#res .intro {
	font-size: 1.25rem;
}

nav p, nav a {
	color:#888;
	display: inline-block;
	font-size: 0.85rem;
	font-weight: bold;
	margin: 0 0 0 0.75rem;
	text-decoration:none;
	}

nav a {
	color:#69c;
	}

section.mask {
	postion: relative;
	background: url(../img/masky_dadada.png) repeat-x transparent;
	border: 0;
	margin:0;
	padding:0;
	height:100px;
	z-index:-1;
	}

section#portoHed p a {
	color:#9cf;
	}

section.portoImg {
	position: absolute;
	width:220px;
	height:190px;
	/*background: url(../img/sfsunset.jpg) no-repeat center;*/
	float:left;
	margin:0 20px 20px 0;
	/*border-left:1px #999 dotted;*/
	z-index:2;
	}
	
section.portoImg.first {
	margin: 0 20px 20px 10px;
	}
		
section.portoImg.last {
	margin: 0 10px 20px 0;
	}

section.portoImg.h01 {
	left: 0; 
	width: 30%;
	}
section.portoImg.h02 {
	left: 33%; 
	width: 30%;
	}
section.portoImg.h03 {
	left: 67%; 
	width: 30%;
	}
/*section.portoImg.h04 {
	left: 90%; 
	width: 25%;
	}
*/
/* ahem. still working on getting the reveal to work correctly 
section.h01reveal {
	background: url(../img/scrn_cisco.jpg) no-repeat center;
	width:400px;
	height:500px;
	display:hidden;
	}
*/

section.portoImg p {
	color: #ccc;
	position:absolute;
	bottom:10px;
	right:10px;
	left: 10px;
	}
	

/* display kludgey styles */
.left320 {
	width:320px;
	float:left;
	}
	
.left600 {
	width:600px;
	float:left;
	}
		
	
	
/* i <3 rounded corners 
-----------------------------------*/

.radius1 {
	-webkit-border-radius: 1px;
	-khtml-border-radius: 1px;
	-moz-border-radius: 1px;
	border-radius:1px; 
	}
	.radius1_topR { 
		-webkit-border-top-right-radius: 1px; 
		-khtml-border-radius-topright: 1px; 
		-moz-border-radius-topright: 1px;
		border-top-right-radius: 1px; 
		}
	.radius1_topL { 
		-webkit-border-top-left-radius: 1px;
		-khtml-border-radius-topleft: 1px; 	
		-moz-border-radius-topleft: 1px;
		border-top-left-radius: 1px; 
		}
	.radius1_top { 
		-moz-border-radius-topleft:1px;
		-moz-border-radius-topright:1px; 
		}
	.radius1_btmR { 
		-webkit-border-bottom-right-radius: 1px; 
		-khtml-border-radius-bottomright: 1px; 
		-moz-border-radius-bottomright: 1px; 	
		border-bottom-right-radius: 1px; 
		}
	.radius1_btmL { 
		-webkit-border-bottom-left-radius: 1px; 
		-khtml-border-radius-bottomleft: 1px; 
		-moz-border-radius-bottomleft: 1px; 	
		border-bottom-left-radius: 1px; 
		}
	.radius1_btm { 
		-moz-border-radius-bottomleft:1px;
		-moz-border-radius-bottomright:1px; 
		}
	
.radius2 { 
	-webkit-border-radius: 2px; 
	-khtml-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px; 
	}
	.radius2_topR { 
		-webkit-border-top-right-radius: 2px; 
		-khtml-border-radius-topright: 2px; 
		-moz-border-radius-topright: 2px;
		border-top-right-radius: 2px; 
		}
	.radius2_topL { 
		-webkit-border-top-left-radius: 2px; 
		-khtml-border-radius-topleft: 2px; 	
		-moz-border-radius-topleft: 2px;
		border-top-left-radius: 2px; 
		}
	.radius2_top { 
	-moz-border-radius-topleft:2px;
	-moz-border-radius-topright:2px; 
	}
	.radius2_btmR { 
		-webkit-border-bottom-right-radius: 2px; 
		-khtml-border-radius-bottomright: 2px; 
		-moz-border-radius-bottomright: 2px; 	
		border-bottom-right-radius: 2px; 
		}
	.radius2_btmL { 
		-webkit-border-bottom-left-radius: 2px; 
		-khtml-border-radius-bottomleft: 2px; 
		-moz-border-radius-bottomleft: 2px; 	
		border-bottom-left-radius: 2px; 
		}
	.radius2_btm { 
		-moz-border-radius-bottomleft:2px;
		-moz-border-radius-bottomright:2px; 
		}
	
.radius3 { 
	-webkit-border-radius: 3px; 
	-khtml-border-radius: 3px; 
	-moz-border-radius: 3px;
	border-radius: 3px; 
	}	
	.radius3_topR { 
		-webkit-border-top-right-radius: 3px; 
		-khtml-border-radius-topright: 3px; 
		-moz-border-radius-topright: 3px;
		border-top-right-radius: 3px; 
		}
	.radius3_topL { 
		-webkit-border-top-left-radius: 3px; 
		-khtml-border-radius-topleft: 3px; 	
		-moz-border-radius-topleft: 3px;
		border-top-left-radius: 3px; 
		}
	.radius3_top { 
		-moz-border-radius-topleft:3px;
		-moz-border-radius-topright:3px; 
		}
	.radius3_btmR { 
		-webkit-border-bottom-right-radius: 3px; 
		-khtml-border-radius-bottomright: 3px; 
		-moz-border-radius-bottomright: 3px; 	
		border-bottom-right-radius: 3px; 
		}
	.radius3_btmL { 
		-webkit-border-bottom-left-radius: 3px; 
		-khtml-border-radius-bottomleft: 3px; 
		-moz-border-radius-bottomleft: 3px; 	
		border-bottom-left-radius: 3px; 
		}
	.radius3_btm { 
		-moz-border-radius-bottomleft:3px;
		-moz-border-radius-bottomright:3px; 
		}
		
.radius4 { 
	-webkit-border-radius: 4px; 
	-khtml-border-radius: 4px; 
	-moz-border-radius: 4px; 
	border-radius: 4px; 
	}	
	.radius4_topR { 
		-webkit-border-top-right-radius: 4px; 
		-khtml-border-radius-topright: 4px; 
		-moz-border-radius-topright: 4px;
		border-top-right-radius: 4px; 
		}
	.radius4_topL { 
		-webkit-border-top-left-radius: 4px; 
		-khtml-border-radius-topleft: 4px; 	
		-moz-border-radius-topleft: 4px;
		border-top-left-radius: 4px; 
		}
	.radius4_top { 
		-moz-border-radius-topleft:4px;
		-moz-border-radius-topright:4px; 
		}
	.radius4_btmR { 
		-webkit-border-bottom-right-radius: 4px;
		-khtml-border-radius-bottomright: 4px; 
		-moz-border-radius-bottomright: 4px; 	
		border-bottom-right-radius: 4px; 
		}
	.radius4_btmL { 
		-webkit-border-bottom-left-radius: 4px; 
		-khtml-border-radius-bottomleft: 4px; 
		-moz-border-radius-bottomleft: 4px; 	
		border-bottom-left-radius: 4px; 
		}
	.radius4_btm { 
		-moz-border-radius-bottomleft:4px;
		-moz-border-radius-bottomright:4px; 
		}

.radius5 { 
	-webkit-border-radius: 5px;
	-khtml-border-radius: 5px; 
	-moz-border-radius: 5px; 
	border-radius: 5px; 
	}	
	.radius5_topR { 
		-webkit-border-top-right-radius: 5px; 
		-khtml-border-radius-topright: 5px; 
		-moz-border-radius-topright: 5px;
		border-top-right-radius: 5px; 
		}
	.radius5_topL { 
		-webkit-border-top-left-radius: 5px; 
		-khtml-border-radius-topleft: 5px; 	
		-moz-border-radius-topleft: 5px;
		border-top-left-radius: 5px; 
		}
	.radius5_top { 
		-moz-border-radius-topleft:5px;
		-moz-border-radius-topright:5px; 
		}
	.radius5_btmR { 
		-webkit-border-bottom-right-radius: 5px; 
		-khtml-border-radius-bottomright: 5px; 
		-moz-border-radius-bottomright: 5px; 	
		border-bottom-right-radius: 5px; 
		}
	.radius5_btmL { 
		-webkit-border-bottom-left-radius: 5px; 
		-khtml-border-radius-bottomleft: 5px; 
		-moz-border-radius-bottomleft: 5px; 	
		border-bottom-left-radius: 5px; 
		}
	.radius5_btm { 
		-moz-border-radius-bottomleft:5px;
		-moz-border-radius-bottomright:5px; 
		}
	
.radius10 { 
	-webkit-border-radius: 10px; 
	-khtml-border-radius: 10px; 
	-moz-border-radius: 10px; 
	border-radius: 10px; 
	}
	.radius10_topR { 
		-webkit-border-top-right-radius: 10px; 
		-khtml-border-radius-topright: 10px; 
		-moz-border-radius-topright: 10px;
		border-top-right-radius: 10px; 
		}
	.radius10_topL { 
		-webkit-border-top-left-radius: 10px; 
		-khtml-border-radius-topleft: 10px; 	
		-moz-border-radius-topleft: 10px;
		border-top-left-radius: 10px; 
		}
	.radius10_top { 
		-moz-border-radius-topleft:10px;
		-moz-border-radius-topright:10px; 
		}
	.radius10_btmR { 
		-webkit-border-bottom-right-radius: 10px; 
		-khtml-border-radius-bottomright: 10px; 
		-moz-border-radius-bottomright: 10px; 	
		border-bottom-right-radius: 10px; 
		}
	.radius10_btmL { 
		-webkit-border-bottom-left-radius: 10px; 
		-khtml-border-radius-bottomleft: 10px; 
		-moz-border-radius-bottomleft: 10px; 	
		border-bottom-left-radius: 10px; 
		}
	.radius10_btm { 
		-moz-border-radius-bottomleft:10px;
		-moz-border-radius-bottomright:10px; 
		}


/* 
page specific styles
-----------------------------------*/

/* homepage styles */
body#hm section.container {	
	min-height: auto; 
}	
body#hm footer {
	min-height: 100%;
}
body#hm section#portoHed {
	height: 20rem;
	margin:0;
	border:0;
	padding:0;
	background: url(../img/bg_sfsunset.jpg) no-repeat center #dedede; /* background image set as default in case js is disabled */
	background-size: cover;
	position:relative;
	z-index:0;
}
body#hm section.portoImg {height:270px;}
body#hm .social img {
	margin:10px;
}


/* porto styles */
#porto .portoItem, 
#samples .portoItem, 	{
	margin:10px auto;
	padding:10px 20px;
}
#porto .portoItem object,
#samples .portoItem object {
	display:inline;
	margin:10px;
	float:left;	
}	
#porto #brand .portoItem img {
	float:right;
	background:#fff;
	padding:5px;
	margin: 5px 10px;
}	
#porto #brand .portoItem h3,
#samples #brand .portoItem h3, p {
	margin: 0.5rem 0;
}
#porto h2 span,
#samples h2 span {
	color:#777; font-size: 0.75em;	
}
#porto .mainContent p, 
#samples .mainContent p {
	margin: 0 0 1em 0;
}	
/* sample page styles */
#samples .container {
	width: 100%;
	/*max-width: 960px;*/
}
#samples #portoHed {
	margin: 0 auto;
}
#samples .mainContent {
	width: 100%;
	min-width: 480px;
}
#samples #slider {
	background: none;
	margin: 2rem auto;
	width: 100%;
	min-width: 480px;
}
#samples .navContainer {
	float: right;
	width: 25%;
	margin: 0 auto;
	padding-left: 40px;
}
#samples .navigation li {
	clear: both;
	display: block;
	float: left;
	padding: 10px;
}
#samples .scroll {
	background: none;
	border-right: 1px solid #aaa;
	clear: none;
	display: block;
	float: left;
	height: auto;
	/*margin: 2rem auto;*/
	max-height: 70rem;
	/*max-width: 30rem; */
	/*padding-top: 2rem;*/
	padding-right: 4rem;
	width: 67%;
}
#samples .scrollContainer .panel {
	background: rgba(255, 255, 255, .25);
	width: 100%;
	margin-right: 4rem; /* matches padding-right for #samples .scroll */
	min-height: 70rem; /* matches max-height for #samples .scroll */
	max-width: 60rem;
	padding: 1rem;
}
#samples .scrollContainer .panel .porto-meta {
	display: none;
	color: #666; 
	font-size: 0.85rem; 
	text-align: right; 
	text-transform: uppercase;
}
#samples .scrollContainer .panel .porto-dek {
	color: #333; 
	font-size: 0.85rem; 
	text-transform: uppercase;
}


#samples .scrollContainer .portoItem {
	float: left;
	width: 96%;
}
#samples .scrollContainer .portoText {
	float: left;
	width: 96%;
}
#samples .portoItem img {
	max-width: 96%;
	height: auto;
	max-height: 650px;
}
#samples #logos .portoItem img, 
#samples #dlse-report .portoItem img {
	background: #fff;
	float: left;
	padding: 5px;
	margin: 5px;
}
#samples #amn .portoItem img {
	/*height: 200px;*/
}
#samples #amn .portoItem .conf {
	max-height: 315px;
}
#samples #rjf .portoItem .rjf {
	/*border: 1px #aaa solid;*/
}
#samples .panel .portoText h2, #samples .panel .portoText p {
	padding: 0 1rem;
}
#samples .panel h2, #samples .panel h2 a {
	line-height: 1.25;
	margin-bottom: 0.25rem;
}
#samples #val .portoItem .fieldtrip {
	max-width: 480px;
}
#samples #sketchbooks .portoItem .sketchbook {
	max-width: 400px;
	margin: 1rem;
}


/* sample page btnNav styles */
#samples .navContainer.btnNav {
	float: right;
	margin: 0;
	padding: 0;
}

#samples .porto-category {
/*    background-color: #efefef;
	display: inline-block;
    float: left;
    margin: 0.5rem;
    padding: 1rem;
*/
    max-width: 24rem;
    margin: 0 auto;
    text-align: left;
}

#samples .porto-category h2 {
	font-size: 0.85rem;
	text-transform: uppercase;
}

#samples .btnNav .navigation {
	padding-bottom: 0;
}
#samples .btnNav .navigation li {
	display: inline-block;
	float: none;
	margin: 0;
	padding: 0;
}
#samples .btnNav .navigation li a {
	background-color: #cbcbcb;
	display: inline-block;
	width: 5rem;
	height: 5rem;
	padding: 0;
}
#samples .btnNav .navigation img {
	margin: 0;
	min-width: 5rem;
	min-height: 5rem;
}

/* resume styles */
body#res h2 {
	background:#dadada;
	text-align:right;
	text-transform:uppercase;
	font-size: 0.85rem;
	line-height:1.5;
	letter-spacing:0.25rem;
	border-bottom: #999 dotted 1px;
	padding: 0;
	}	

body#res h3, #about h3 {
	clear: both;
	padding: 0;
	}	
#res h1 .name {
	color:#666; 
	font-size: 0.85rem;	
}
body#res h4 {
	padding: 0 40px;
	margin: 0;
	}

body#res ul, body#about ul {
	margin: 0 20px 20px;
	}

#res .rightCol .thumb {
	border:1px #aaa solid;
	max-width: 300px;
}


/* about styles */
body#about h2 {
	background:#dadada;
	text-align:right;
	text-transform:uppercase;
	font-size:12px;
	line-height: 1.5;
	letter-spacing:0.5em;
	border-bottom: #999 dotted 1px;
	padding: 0 20px;
	}	
	#about p {
		margin-bottom: 1em;
	}
body#about ul, body#about li { 	/* need to: create inline list style for whole site... */
	/*display: inline;
	list-style: none;*/
	color: #666;
	/*padding: 0;*/
	}	
	body#about ul li:after {
		/*content: " | ";*/
		}
	body#about ul li.last:after {
		/*content: " ";*/
		}
body#about .teamP img {
	margin: 0 0 10px 20px;
	padding: 0;
	border: 1px solid #999;
	}
body#about .teamP {
	margin-bottom: 2.5em;
	clear: both;	
	}
	body#about .teamP h3 {
		color: #666;
		font-weight: bold;
		padding: 0;
	}

/* Media queries */
@media (max-width: 1280px) {
	section.container {
		max-width: 98%;
		padding: 0 1rem;
	}
}
@media (min-width: 1024px) {
	/* .leftCol {
		width: 63%;
		margin: 0 5%;
		padding: 10px 20px 10px 0;
		border: 0;
		float: left;
		}
	.rightCol {
		display: block;
		width: 25%;
		margin: 10px auto;
		padding: 10px 0;
		border: 0;
		float: left; */
		/*border-bottom: #999 1px dotted;*/
}	
@media (max-width: 929px) {
	/* Content width */
	.container, .mainContent, #portoHed,
	.ctr object /* flickr slideshow on illustrations page */ {
		max-width: 100%;
	}
	.portoImg {
		display: none;
	}
	.portoImg.first {
		display: block;
	}
	.leftCol, .rightCol {
		max-width: 100%;
		width: 100%;
	} 
	/* Top nav */
	.container nav {
		border-bottom: 1px dotted #bababa;
		padding-bottom: 1rem;
	}
	/* Footer nav */
	footer nav {
		margin: 1.5rem;
	}

	/* Home page */
	body#hm section.portoImg {
		border: 0;
		clear: both;
		display: block;
		position: relative;
		top: 0;
		left: 1rem;
		height: auto;
		min-width: 20rem;
		margin: 0;
	}
	#hm .portoImg p {
		min-height: 3rem;
		margin: 0;
		padding: 0;
	}
	#hm .portoImg .radius5 {
		margin: 0 0 0.125rem 0;
		padding: 0.5rem 1rem;
		position: relative;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
	}
}
@media (min-width: 768px) {
	.mainContent {
		margin: 0;
	}
	.leftCol {
		clear: none;
		float: left;
		margin: 0 auto 0 5%;
		padding: 0 2.5% 0 0;
		width: 66%;
	}
	.rightCol {
		clear: none;
		float: right;
		margin: 5% 0 0 auto;
		padding: 0;
		width: 25%;
	}
}
@media (max-width: 767px) {
	p, li, a {
		font-weight: normal;
	}
	nav p, nav a {
		font-size: 1rem;
	}
	.leftCol, .rightCol {
		margin: 0 1%; 
		width: 98%;
	}
	/* .leftCol, .rightCol {
		margin: 0;
	} */
	.rightCol {
		margin-bottom: 2rem;
	}
	body#res ul, 
	body#about ul {
		margin: 0;
	}
	body#about .teamP img, 
	.abt-img, 
	#res .rightCol .thumb {
		display: block;
		float: none;
		margin: 1rem 0;
	}
	.social {
		text-align: left;
	}
	body#about h2, 
	body#res h2 {
		text-align: left;
		padding: 1rem 0 0 0;
	}
	#res h1 .name {
		float: none;
		font-size: 1rem;
		display: block;
	}
	.container nav {
		float: none;
		margin: 1rem 0;
	}
}
	

/* Media queries for samples/work */
@media (max-width: 1279px) {
	#samples .scrollContainer .panel {
		max-width: 55rem;
	}
}
@media (max-width: 1180px) {
	#samples .scrollContainer .panel {
		max-width: 50rem;
	}
}
@media (max-width: 1080px) {
	#samples .scroll, #samples .scrollContainer .panel {
		min-height: 90rem;
	}
	#samples .scrollContainer .panel {
		max-width: 45rem;
	}
}
@media (max-width: 960px) {
	#samples .scrollContainer .panel {
		max-width: 40rem;
	}
}
@media (max-width: 929px) {
	#samples .container {
		width: auto;
	}
	#samples .scroll, #samples .scrollContainer .panel {
		/*min-height: 80rem;*/
	}
}
@media (max-width: 880px) { 
	#samples .porto-category {
		max-width: 100%;
	}
	#samples .navContainer.btnNav {
  		border-bottom: #999 dotted 1px;
  		float: left;
  		margin: 0 0 2rem;
  		max-width: 860px;
  		padding: 0 0 2rem;
  		width: 100%;
  	}
  	#samples .scroll {
  		border-right: 0;
  		padding-right: 0; 
  		width: 98%;
  	}
	#samples .navigation li {
		clear: none;
		display: inline;
		float: left;
	}
	#samples .navContainer.btnNav img {
		/* max-width: 40px; */
		height: auto; 
	}  	
	#samples .scrollContainer .panel {
		/*max-width: 50rem;*/
	}
	#samples .portoItem img,
	#samples #logos .portoItem img,
	#samples #dlse-report .portoItem img {
		clear: both;
		max-width: 96%;
		margin: 1rem auto;
	}
	#samples #amn .portoItem .conf {
		max-height: 225px;
	}
	#samples #amn .portoItem img {
		clear: right;
		margin: 10px 0 10px 30px;
	}
	#samples .scrollContainer .portoItem {
		max-width: 50rem;
	}
	#samples .scrollContainer .portoText {
		max-width: 96%;
	}
}
@media (max-width: 879px) { 
	#samples .scrollContainer .panel {
		max-width: 50rem;
	}
}
@media (max-width: 800px) {
	#samples .scrollContainer .panel {
		max-width: 45rem;
	}
}
@media (max-width: 720px) {
	#samples .scrollContainer .panel {
		max-width: 40rem;
	}
}
@media (max-width: 660px) {
	#samples .scroll, #samples .scrollContainer .panel {
		min-height: 84rem;
	}
	#samples .scrollContainer .panel {
		max-width: 35rem;
	}
}
@media (max-width: 580px) {
	#samples .scrollContainer .panel {
		max-width: 30rem;
	}
}
@media (max-width: 500px) {
	#samples .scrollContainer .panel {
		max-width: 28rem;
	}
}
@media (max-width: 480px) {
	#samples .scrollContainer .panel {
		max-width: 25rem;
	}
}
@media (max-width: 460px) {
	#samples .scrollContainer .panel {
		max-width: 22rem;
	}
}
@media (max-width: 320px) {
	#samples .scrollContainer .panel {
		max-width: 18rem;
	}
}
/* sandbox styles: need to add body ids and classes and then move styles here  
h2 {
	border-bottom: 1px dotted #666;
}
h2.h1 {
	border: 0;
}
*/



/*** 
* blog styles moved into wp style.css file
***

.widgetFooter {background:#999;}
.widgetFooter {
	background: url("http://dogmo.com/img/twitter_birdgray_80x100.png") no-repeat scroll 960px 3px #999;
	}

*** deleting this style for now
* footer.blogFooter {	border-top: 1px solid #bbb; padding:0; }
***/