/* @override http://thiswebsite.ca/css/main.css */

/* @override http://thiswebsite.ca/css/main.css */

/*--------------!GENERAL----------------*/

body {
	margin: 0;
}
h1, h2, h3, h4, h5, h6, h7 {
	font-weight: 100;
}
p {
	line-height: 1.2em;
	font-size: .8em;
}
a {
	text-decoration: none;
	outline: none;
}
ol, ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.bold {
	font-weight: 700
}
.floatl {
	float: left
}
.floatr {
	float: right
}
.no-margin {
	margin-right: 0!important;
}
.clearing {
	clear: both
}
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
* html .clearfix {
	zoom: 1;
} /* IE6 */
*:first-child+html .clearfix {
	zoom: 1;
} /* IE7 */
img {
	border: none;
}
/*--------------!FONTS----------------*/

body, h1, h2, #filters a, #social a, nav#nav-mobile a {
	font-family: 'Titillium Web', "Trebuchet MS", arial, sans-serif
}
p, #home #homepage, .panel h3, #folio-header h3, #bleak-header h3, li {
	font-family: Arial, Helvetica, Geneva, sans-serif;
}
/*--------------!COLOURS----------------*/
/* Grey */
#social a, #filters a {
	color: #333;
}
#folio-header a {
	color: #386594;
	font-weight: bold;
	opacity: 0.5;
	filter: alpha(opacity = 50)
}
#folio-header a:hover, ≈ a:hover {
	opacity: 1;
	filter: alpha(opacity = 100);
}
#folio-header, #bleak-header {
	color: #525252;
}
#folio-header h2, #bleak-header h2 {
	color: #767676;
}
/*--------------!LAYOUT----------------*/
.logo {
	z-index: 400
}
a.logo {
	position: fixed;
	/*top: 20px;*/
	left: 0;
	display: block;
	height: 83px;
	width: 140px;
	font-weight: 700;
	background: url(/g/logo.png) no-repeat 0px 0;
	background-size: 140px 83px;
	text-indent: -9999px;
}
body {
	background: url(../g/background.png) 0px 0px repeat-x #fffdff;
}
#container {
	/*min-width: 840px;*/
	margin: 0 auto;
	position: relative;
	/*border: 1px solid red;*/
	top: 0px;
}
/*---!Main Nav---*/
#social {
	position: absolute;
	right: 5em;
	top: 10px;
}
#social li a {
	margin-left: 10px;
	background-position: right center;
	background-repeat: no-repeat;
	background-size: 20px 20px;
	padding: 12px 28px 10px 0;
	font-size: .7em;
}
#social #twitter a {
	background-image: url(../g/nav/twitter.png);
}
#social #insta a {
	background-image: url(../g/nav/insta.png);
}
#social #email-me a {
	background-image: url(../g/nav/email-me.png);
}
#social #about a {
	background-image: url(../g/nav/about.png);
}
#filters {
	position: absolute;
	top: 30px;
	right: 28px;
}
#filters li, #social li {
	display: inline-block;
	text-transform: uppercase;
}
#social li a, #filters li a {
	opacity: 0.5;
	filter: alpha(opacity = 50);
}
#filters li a {
	margin-left: 20px;
	background-position: right center;
	background-repeat: no-repeat;
	background-size: 25px 25px;
	padding: 10px 35px 10px 0;
	font-size: .9em;
}
#social li a:hover, #filters li a:hover, #about-me #about a {
	opacity: 1;
	filter: alpha(opacity = 100);
}
#filters #all a {
	background-image: url(../g/nav/all.png);
}
#filters #code a {
	background-image: url(../g/nav/code.png);
}
#filters #web a {
	background-image: url(../g/nav/web.png);
}
#filters #print a {
	background-image: url(../g/nav/print.png);
}
#filters #email a {
	background-image: url(../g/nav/emails.png);
}
#filters li a.selected {
	opacity: 1;
	filter: alpha(opacity = 100);
}
/*--------------!CONTENT----------------*/


/*---!Main Content---*/
#social li {
	display: inline;
}
#iso-container {
	position: absolute;
	top: 80px;
	/*min-width: 812px;*/
	margin-left: 28px;
/*border: 1px solid blue;*/	}
#iso-container div {
	margin: 0 0 28px 22px
}

#iso-container div a div {
	background-position:center; 
	background-repeat:no-repeat;
	background-size:138px;
	height:138px; width:138px; margin:0
}

#home-sixstops {background-image: url(../g/home/6stops.png);}
#home-avere {background-image: url(../g/home/avere.png);}
#home-ascend {background-image: url(../g/home/ascend.png);}
#home-birchill {background-image: url(../g/home/birchill.png);}
#home-bmir {background-image: url(../g/home/bmir.png);}
#home-boots {background-image: url(../g/home/boots.png);}
#home-ba {background-image: url(../g/home/british-airways.png);}
#home-calgary-reads {background-image: url(../g/home/calgary-reads.png);}
#home-calgary-stampede {background-image: url(../g/home/calgary-stampede.png);}
#home-comet {background-image: url(../g/home/comet.png);}
#home-confetti {background-image: url(../g/home/confetti.png);}
#home-creative-chamber {background-image: url(../g/home/creative-chamber.png);}
#home-cyyc {background-image: url(../g/home/cyyc.png);}
#home-dm {background-image: url(../g/home/depeche-mode.png);}
#home-diane-mcgeachy {background-image: url(../g/home/diane-mcgeachy.png);}
#home-dover {background-image: url(../g/home/dover.png);}
#home-estateco {background-image: url(../g/home/estateco.png);}
#home-ebs {background-image: url(../g/home/ebs.png);}
#home-fh-and-me {background-image: url(../g/home/fh-and-m.png);}
#home-frank-bauer {background-image: url(../g/home/frank-bauer.png);}
#home-garrard {background-image: url(../g/home/garrard.png);}
#home-gerhard-richter {background-image: url(../g/home/gerhard-richter.png);}
#home-ica {background-image: url(../g/home/ica.png);}
#home-inglewood {background-image: url(../g/home/inglewood.png);}
#home-ivanhoe {background-image: url(../g/home/ivanhoe.png);}
#home-life-by-example {background-image: url(../g/home/life-by-example.png);}
#home-little-libraries {background-image: url(../g/home/little-libraries.png);}
#home-london-connection {background-image: url(../g/home/london-connection.png);}
#home-m-and-s {background-image: url(../g/home/m-and-s.png);}
#home-new-street {background-image: url(../g/home/new-street.png);}
#home-nfl {background-image: url(../g/home/nfl.png);}
#home-petrobakken {background-image: url(../g/home/petrobakken.png);}
#home-petrobank {background-image: url(../g/home/petrobank.png);}
#home-petrofrontier {background-image: url(../g/home/petrofrontier.png);}
#home-posters {background-image: url(../g/home/posters.png);}
#home-renegade {background-image: url(../g/home/renegade.png);}
#home-secret-springs {background-image: url(../g/home/secret-springs.png);}
#home-shell {background-image: url(../g/home/shell.png);}
#home-tamarack-valley {background-image: url(../g/home/tamarack.png);}
#home-tesco {background-image: url(../g/home/tesco.png);}
#home-wayfinder {background-image: url(../g/home/wayfinder.png);}
#home-wings-of-hope {background-image: url(../g/home/wings-of-hope.png);}
#home-zeros {background-image: url(../g/home/zeros.png);}

#folio-header {
	/*border: 1px solid red;*/
	padding-left: 198px;
	margin-left: 150px;
	margin-right: 50px;
	margin-bottom: 2em;
	min-height: 210px;
	max-width: 800px;
}
#header-image {
	position: absolute;
	top: 10px;
	left: 160px;
	border: 1px solid #eee;
	background: white;
	padding: 10px;
	border: 1px solid #E8E8EA;
}
#folio-header h2 {
	font-size: 5em;
	margin-bottom: 20px;
	text-shadow: 0px 1px 0px #fff;
}
#folio-header h3 {
	text-shadow: 0px 1px 0px #fff;
	margin-bottom: .4em;
	font-size: .9em;
	font-weight: 700;
}
#folio-header .involvement li {
	display: inline;
	background: url(../g/bullet.png) no-repeat 0 2px;
	padding-left: 14px;
	margin-right: 10px;
}
#folio-header p {
	text-shadow: 0px 1px 0px #fff;
	font-size: .9em;
	line-height: 1.4em;
	margin-bottom: .8em;
}
#folio-header li {
	text-shadow: 0px 1px 0px #fff;
	font-size: .75em;
	line-height: 1.5em;
}
#visuallightbox {
	/*border: 1px solid red;*/
	margin: 0 0 0 150px;
}
#visuallightbox a {
	display: inline-block;
	margin: 10px;
	/* background: url(../g/folio/button-bg.png) no-repeat; */
	padding: 10px 10px 10px 10px;
	opacity: .9;
	filter: alpha(opacity = 90);
	background-color: #fff;
	border: 1px solid #E8E8EA;
}
#visuallightbox a:hover {
	background-position: 0 -167px;
	opacity: 1;
	filter: alpha(opacity = 100);
	border: 1px solid rgb(207, 210, 214);
}
#folio-header #home404 {
	background: #175c92;
	padding: 5px;
	font-size: 3em;
	margin-top: 15px;
	display: inline-block;
	color: #fff;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	border: 3px solid #fff;
	opacity: .5;
	filter: alpha(opacity = 50);
}
#folio-header #home404:hover {
	opacity: 1;
	filter: alpha(opacity = 100);
}
.live-site {
	margin-top: .8em;
	background: url(../g/arrow.png) no-repeat 0 5px;
	padding-left: 14px;
}
.list-vertical li {
	display: inline;
}
.list-vertical li a {
	background: url(../g/arrow.png) no-repeat 0 3px;
	padding-left: 14px;
	margin: 5px 5px 0 0;
	display: inline-block;
}
/*--------------!FOOTER----------------*/

#footer {
	display: none/*clear: both;
margin: 20px auto 0 auto;
text-align: center;
font-size: .7em;
width: 140px;
padding: 5px;
background-color: #0c5782;
color: white;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
-moz-border-radius-topleft:4px;
-moz-border-radius-bottomleft:4px;
opacity: 0.7;
position: absolute;
bottom: -12em;
left: 0px;
z-index: 100;*/
}

/*--------------!BLEAK----------------*/
#bleak-header {
	/*border: 1px solid red;*/
	padding-left: 0px;
	margin-left: 150px;
	margin-right: 50px;
	margin-bottom: 2em;
	min-height: 210px;
	max-width: 800px;
}
#header-image {
	position: absolute;
	top: 10px;
	left: 160px;
	border: 1px solid #eee;
	background: white;
	padding: 10px;
	border: 1px solid #E8E8EA;
}

#bleak-header div div {
	border-bottom: 1px solid #dddbdb;
	padding-left: 0px;
	margin-bottom: 1em;
}


#bleak-header h2 {
	font-size: 5em;
	margin-bottom: 20px;
	text-shadow: 0px 1px 0px #fff;
}
#bleak-header h3 {
	font-size: 2em;
	text-shadow: 0px 1px 0px #fff;
	margin-bottom: .4em;
	font-weight: 700;
}

#bleak-header h4 {
	font-size: 1.3em;
	margin-bottom: .3em;
	line-height: 1.3em;
}

#bleak-header p {
	text-shadow: 0px 1px 0px #fff;
	font-size: .9em;
	line-height: 1.4em;
	margin-bottom: .8em;
}
#bleak-header li {
	text-shadow: 0px 1px 0px #fff;
	font-size: .75em;
	line-height: 1.5em;
}

#bleak-header a {
	color: #386594;
	font-weight: bold;
	opacity: 0.5;
	filter: alpha(opacity = 50)
}


#bleak-header a:hover {
	opacity: 1;
	filter: alpha(opacity = 100)
}
/*--------------!RESPONSIVE----------------*/

@media all and (max-width: 800px) {
#folio-header h2 {
	font-size: 3.3em;
}
img#header-image {
	height: 150px;
	width: 150px;
}
#folio-header {
	/*border: 1px solid red;*/
	padding-left: 20em;
	margin-left: 0px;
	margin-right: 3em;
	min-height: 210px;
	max-width: 800px;
}





}

@media all and (max-width: 600px) {
a.logo {
	height: 42px;
	background-position: -20px -40px;
}
#social li a {
	margin: 0 5px;
}
#social li {
	font-size: 0;
}
/*#header-image {
	position: absolute;
	top: -55px;
	left: 150px;
}*/
#folio-header, #bleak-header {
	/*border: 1px solid red;*/
	padding-left: 0px;
	margin-left: 2em;
	margin-right: 2em;
}
#folio-header h2, #bleak-header h2 {
	font-size: 3.3em;
}
#visuallightbox {
	/*border: 1px solid red;*/
	margin: 0 0 0 1.3em;
}
#header-image {
	display: none;
}
}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
a.logo {
	background-image: url(/g/logo@2x.png);
}
#filters #all a {
	background-image: url(../g/nav/all@2x.png);
}
#filters #code a {
	background-image: url(../g/nav/code@2x.png);
}
#filters #web a {
	background-image: url(../g/nav/web@2x.png);
}
#filters #print a {
	background-image: url(../g/nav/print@2x.png);
}
#filters #email a {
	background-image: url(../g/nav/emails@2x.png);
}
#social #twitter a {
	background-image: url(../g/nav/twitter@2x.png);
}
#social #insta a {
	background-image: url(../g/nav/insta@2x.png);
}
#social #email-me a {
	background-image: url(../g/nav/email-me@2x.png);
}
#social #about a {
	background-image: url(../g/nav/about@2x.png);
}


#home-sixstops {background-image: url(../g/home/6stops@2x.png);}
#home-avere {background-image: url(../g/home/avere@2x.png);}
#home-ascend {background-image: url(../g/home/ascend@2x.png);}
#home-birchill {background-image: url(../g/home/birchill@2x.png);}
#home-bmir {background-image: url(../g/home/bmir@2x.png);}
#home-boots {background-image: url(../g/home/boots@2x.png);}
#home-ba {background-image: url(../g/home/british-airways@2x.png);}
#home-calgary-reads {background-image: url(../g/home/calgary-reads@2x.png);}
#home-calgary-stampede {background-image: url(../g/home/calgary-stampede@2x.png);}
#home-comet {background-image: url(../g/home/comet@2x.png);}
#home-confetti {background-image: url(../g/home/confetti@2x.png);}
#home-creative-chamber {background-image: url(../g/home/creative-chamber@2x.png);}
#home-cyyc {background-image: url(../g/home/cyyc@2x.png);}
#home-dm {background-image: url(../g/home/depeche-mode@2x.png);}
#home-diane-mcgeachy {background-image: url(../g/home/diane-mcgeachy@2x.png);}
#home-dover {background-image: url(../g/home/dover@2x.png);}
#home-estateco {background-image: url(../g/home/estateco@2x.png);}
#home-ebs {background-image: url(../g/home/ebs@2x.png);}	
#home-fh-and-me {background-image: url(../g/home/fh-and-m@2x.png);}
#home-frank-bauer {background-image: url(../g/home/frank-bauer@2x.png);}
#home-garrard {background-image: url(../g/home/garrard@2x.png);}
#home-gerhard-richter {background-image: url(../g/home/gerhard-richter@2x.png);}
#home-ica {background-image: url(../g/home/ica@2x.png);}
#home-inglewood {background-image: url(../g/home/inglewood@2x.png);}
#home-ivanhoe {background-image: url(../g/home/ivanhoe@2x.png);}
#home-life-by-example {background-image: url(../g/home/life-by-example@2x.png);}
#home-little-libraries {background-image: url(../g/home/little-libraries@2x.png);}
#home-london-connection {background-image: url(../g/home/london-connection@2x.png);}
#home-m-and-s {background-image: url(../g/home/m-and-s@2x.png);}
#home-new-street {background-image: url(../g/home/new-street@2x.png);}
#home-nfl {background-image: url(../g/home/nfl@2x.png);}
#home-petrobakken {background-image: url(../g/home/petrobakken@2x.png);}
#home-petrobank {background-image: url(../g/home/petrobank@2x.png);}
#home-petrofrontier {background-image: url(../g/home/petrofrontier@2x.png);}
#home-posters {background-image: url(../g/home/posters@2x.png);}
#home-renegade {background-image: url(../g/home/renegade@2x.png);}
#home-secret-springs {background-image: url(../g/home/secret-springs@2x.png);}
#home-shell {background-image: url(../g/home/shell@2x.png);}
#home-tamarack-valley {background-image: url(../g/home/tamarack@2x.png);}
#home-tesco {background-image: url(../g/home/tesco@2x.png);}
#home-wayfinder {background-image: url(../g/home/wayfinder@2x.png);}
#home-wings-of-hope {background-image: url(../g/home/wings-of-hope@2x.png);}
#home-zeros {background-image: url(../g/home/zeros@2x.png);}
}