/* @override 
	/assets/css/screen.css */

h1, .page-header__title, .referrals-footer__title {
	font-size: 1.875em;
	line-height: 1
}
	
	@media (min-width: 30.0625em) {
	h1, .page-header__title, .referrals-footer__title {
		font-size: 3em;
		line-height: 1.0833333333
	}
}@media (min-width: 48.0625em) {
	h1, .page-header__title, .referrals-footer__title {
		font-size: 4em;
		line-height: 1.0833333333
	}
}.endorsement p {
	font-size: 1em;
	line-height: 1.3333333333
}
	
	@media (min-width: 30.0625em) {
	.endorsement p {
		font-size: 1.875em;
		line-height: 1.2
	}
}h2, .intro__work__title, .values__title {
	font-size: 1.3125em;
	line-height: 1.1428571429
}
	
	@media (min-width: 30.0625em) {
	h2, .intro__work__title, .values__title {
		font-size: 1.75em;
		line-height: 1.2142857143
	}
}h3, .page-header__subtitle {
	font-size: 1em;
	line-height: 1.3125
}
	
	@media (min-width: 30.0625em) {
	h3, .page-header__subtitle {
		font-size: 1.625em;
		line-height: 1.2307692308
	}
}.legend, .notebook__listing__title {
	font-size: 1.3125em;
	line-height: 1.4285714286
}
	
	@media (min-width: 30.0625em) {
	.legend, .notebook__listing__title {
		font-size: 1.5em;
		line-height: 1.25
	}
}h4, .page-header__description, .notebook__item blockquote, .intro__title, .referrals-footer__content {
	font-size: 1em;
	line-height: 1.3125
}
	
	@media (min-width: 30.0625em) {
	h4, .page-header__description, .notebook__item blockquote, .intro__title, .referrals-footer__content {
		font-size: 1.3125em;
		line-height: 1.4285714286
	}
}.brands__title, .style-guide__title {
	font-size: 1.125em;
	line-height: 1.3333333333
}

h5, .field__label, .btn, .entry__date, .entry__category, .image__title, .image__author, .image__description, .style-guide__description, .referral__name, .endorsement cite, .jobs {
	font-size: 1em;
	line-height: 1.5
}

.fieldset__description, input[type=text], input[type=password], input[type=email], input[type=url], input[type=number], input[type=datetime], input[type=date], input[type=tel], input[type=month], input[type=week], input[type=search], textarea, select, .input--check label, .dragdealer .value, .field__feedback, .btn__note, .notebook__categories__list, .notebook__item__details, .notebook__item__excerpt, .brand__title, .intro__team__title, .intro__team__location, .portfolio__meta, .referral__link, .referral__twitter, .team__title, .team__social {
	font-size: 0.875em;
	line-height: 1.2857142857
}

.site-cta span, .site-credits {
	font-size: 0.8125em;
	line-height: 1.2857142857
}

h6, .site-header a {
	font-size: 0.8125em;
	line-height: 1.3846153846;
	text-transform: uppercase
}

*, *:before, *:after {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
	display: block
}

audio, canvas, video {
	display: inline-block
}

audio:not([controls]) {
	display: none;
	height: 0
}

[hidden] {
	display: none
}

html {
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%
}

body {
	margin: 0
}

a:focus {
	outline: thin dotted
}

a:active, a:hover {
	outline: 0
}

abbr[title] {
	border-bottom: 1px dotted
}

b, strong {
	font-weight: bold
}

dfn {
	font-style: italic
}

hr {
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	height: 0
}

mark {
	background: #ff0;
	color: #000
}

code, kbd, pre, samp {
	font-family: monospace, serif;
	font-size: 1em
}

pre {
	white-space: pre-wrap
}

q {
	quotes: "\201C" "\201D" "\2018" "\2019"
}

small {
	font-size: 80%
}

sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline
}

sup {
	top: -0.5em
}

sub {
	bottom: -0.25em
}

img {
	border: 0
}

svg:not(:root) {
	overflow: hidden
}

figure {
	margin: 0
}

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em
}

legend {
	border: 0;
	padding: 0
}

button, input, select, textarea {
	font-family: inherit;
	margin: 0
}

button, input {
	line-height: normal
}

button, select {
	text-transform: none
}

button, html input[type="button"], input[type="reset"], input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer
}

button[disabled], html input[disabled] {
	cursor: default
}

input[type="checkbox"], input[type="radio"] {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0
}

input[type="search"] {
	-webkit-appearance: textfield
}

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none
}

button::-moz-focus-inner, input::-moz-focus-inner {
	border: 0;
	padding: 0
}

textarea {
	overflow: auto;
	vertical-align: top
}

table {
	border-collapse: collapse;
	border-spacing: 0
}

blockquote, .input--check label, .field__feedback, .figure__caption, .site-credits, .page-header__description, .notebook__jobs__list, .notebook__jobs__item span, .notebook__listing__title, .notebook__item__details, .notebook__item blockquote cite, .entry__date, .entry__category, .inlinefootnote, .image__author, .image__description, .intro__team__location, .portfolio__meta, .style-guide__description, .referral__expertise, .referral__link, .referral__twitter, .team__member, .values__description, .endorsement cite {
	font-family: "Yantramanav","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-style: normal;
	font-weight: 400
}

h4, h5, h6, .legend, .dragdealer .value, .field__label, .btn, .site-header a, .notebook__categories__list, .notebook__jobs__title, .notebook__item__title, .entry__content h3, .entry__content h4, .image__title, .brand__title, .intro__title, .intro__team__name, .portfolio__meta em, .style-guide__title, .portfolio__nav__title, .referral__name, .team__name {
	font-family: "Yantramanav","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-style: normal;
	font-weight: 500
}

.notebook__item__desc, .notebook__item__desc--author, .team__details {
	font-family: "Yantramanav","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-style: normal;
	font-weight: 300
}

body, .notebook__item blockquote, .entry__content {
	font-family: "Neuton",Palatino,"Times New Roman",Times,serif;
	font-style: normal;
	font-weight: 400
}

i, em, .btn__note, .site-cta span, .entry__content em, .entry__content i, .brands__title, .intro__team__title, .portfolio__nav__main-title, .portfolio__nav__role, .team__title, .jobs {
	font-family: "Neuton",Palatino,"Times New Roman",Times,serif;
	font-style: italic;
	font-weight: 400
}

b, strong, .entry__content h2, .entry__content strong, .entry__content b {
	font-family: "Neuton",Palatino,"Times New Roman",Times,serif;
	font-style: normal;
	font-weight: 600
}

h1, .page-header__title, .referrals-footer__title, .cta__teaser, .intro__work__title, .values__title, .endorsement p {
	font-family: "Neuton",Palatino,"Times New Roman",Times,serif;
	font-style: normal;
	font-weight: 400
}

.page-header__title em, .referrals-footer__title em, .page-header__subtitle {
	font-family: "Neuton",Palatino,"Times New Roman",Times,serif;
	font-style: italic;
	font-weight: 400
}

h2, .entry__title {
	font-family: "Neuton",Palatino,"Times New Roman",Times,serif;
	font-style: normal;
}

h3 {
	font-family: "Neuton",Palatino,"Times New Roman",Times,serif;
	font-style: italic;
	font-weight: 600
}

.is-accelerated, .site-credits, .about .page-header, .about .values, .page-header--home, .page-header__img img, .brand, .gallery__item, .gallery__control-button, .intro__team__img, .team__img {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0)
}

.delay-1 {
	-webkit-animation-delay: .1s;
	animation-delay: .1s
}

.delay-2 {
	-webkit-animation-delay: .2s;
	animation-delay: .2s
}

.delay-3 {
	-webkit-animation-delay: .3s;
	animation-delay: .3s
}

.delay-4 {
	-webkit-animation-delay: .4s;
	animation-delay: .4s
}

.delay-5 {
	-webkit-animation-delay: .5s;
	animation-delay: .5s
}

.delay-6 {
	-webkit-animation-delay: .6s;
	animation-delay: .6s
}

.delay-7 {
	-webkit-animation-delay: .7s;
	animation-delay: .7s
}

.delay-8 {
	-webkit-animation-delay: .8s;
	animation-delay: .8s
}

.delay-9 {
	-webkit-animation-delay: .9s;
	animation-delay: .9s
}

.delay-10 {
	-webkit-animation-delay: 1s;
	animation-delay: 1s
}

.animated {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}@-webkit-keyframes fade-in-up {
0% {
	opacity: 0;
	-webkit-transform: translateY(20px);
	transform: translateY(20px)
}

100% {
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0)
}
}@keyframes fade-in-up {
0% {
	opacity: 0;
	-webkit-transform: translateY(20px);
	transform: translateY(20px)
}

100% {
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0)
}
}.fade-in-up {
	-webkit-animation-name: fade-in-up;
	animation-name: fade-in-up
}@-webkit-keyframes fade-in {
0% {
	opacity: 0
}

100% {
	opacity: 1
}
}@keyframes fade-in {
0% {
	opacity: 0
}

100% {
	opacity: 1
}
}@-webkit-keyframes pulse {
0% {
	color: #838d94
}

50% {
	color: #2d3138
}

100% {
	color: #838d94
}
}@keyframes pulse {
0% {
	color: #838d94
}

50% {
	color: #2d3138
}

100% {
	color: #838d94
}
}@-webkit-keyframes flapper {
0% {
	-webkit-transform: rotate3d(0, 1, 0, 40deg);
	transform: rotate3d(0, 1, 0, 40deg)
}

100% {
	-webkit-transform: rotate3d(0, 1, 0, 0deg);
	transform: rotate3d(0, 1, 0, 0deg)
}
}@keyframes flapper {
0% {
	-webkit-transform: rotate3d(0, 1, 0, 40deg);
	transform: rotate3d(0, 1, 0, 40deg)
}

100% {
	-webkit-transform: rotate3d(0, 1, 0, 0deg);
	transform: rotate3d(0, 1, 0, 0deg)
}
}.flapper {
	-webkit-animation: flapper 3s ease-in-out 1;
	animation: flapper 3s ease-in-out 1
}

html, .brands, .brand__title, .cta, .intro, .team, .endorsements, .jobs {
	background-color: #2d3138
}

.legend, .fieldset__description, .dragdealer .value, .field__label, .page-header__title, .referrals-footer__title, .page-header__description, .notebook__jobs__title, .notebook__jobs__list, .notebook__listing__title, .notebook__item__desc, .notebook__item__title, .notebook__item__excerpt, .entry__content, .image__title, .image__description, .portfolio__nav__title, .referral__name, .values__title {
	color: #2d3138
}

.brand {
	background-color: #22262c
}

.intro__work__img {
	background-color: #393e47
}

blockquote, .field__feedback, .page-header__subtitle, .notebook__jobs__item span, .notebook__item__more, .brands__title, .intro__title, .portfolio__nav__main-title, .team__title, .endorsement p {
	color: #ad823e
}

input[type=text], input[type=password], input[type=email], input[type=url], input[type=number], input[type=datetime], input[type=date], input[type=tel], input[type=month], input[type=week], input[type=search], textarea, select, .field__select, .dragdealer .handle, .site-header, .notebook__item, .entry__content img, .portfolio__section--white, .portfolio__nav, .referral {
	background-color: #fff
}

.page-header--portfolio .page-header__title, .page-header--portfolio .referrals-footer__title, .brand__title, .cta__teaser, .intro__work__title, .intro__team__name, .portfolio__meta em, .team__name {
	color: #f9f9f9
}

blockquote cite, .figure__caption, .site-credits, .notebook__item__details, .entry__date, .entry__category, .inlinefootnote, .image__author, .intro__team, .portfolio__meta, .portfolio__meta__role em:after, .referral__expertise {
	color: #838d94
}

input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=url]:focus, input[type=number]:focus, input[type=datetime]:focus, input[type=date]:focus, input[type=tel]:focus, input[type=month]:focus, input[type=week]:focus, input[type=search]:focus, textarea:focus, select:focus, .entry__notes {
	color: #616c74
}

.dragdealer, .portfolio__browser:after {
	background-color: #bec4c7
}

.notebook__listing__title span, .intro__work, .intro__team__title, .team, .endorsement cite, .jobs {
	color: #bec4c7
}

.entry__content img, .referral {
	border: 1px solid #d1d5d7
}

.container:after, .nav:after, .media:after, .site-header:after, .notebook__listing__nav:after, .notebook__item:after, .referral:after {
	content: "";
	display: table;
	clear: both
}

.container {
	margin: 0 auto;
	max-width: 68.75em;
	padding: 0 1rem
}
	
	@media (min-width: 30.0625em) {
	.container {
		padding: 0 2rem
	}
}.multimedia embed, .multimedia object, .multimedia video, .multimedia iframe {
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0
}

.grid {
	list-style: none;
	margin: 0;
	padding: 0;
	margin-left: -2rem
}

.grid__item {
	display: inline-block;
	padding-left: 2rem;
	vertical-align: top;
	width: 100%;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}

.grid--rev {
	direction: rtl;
	text-align: left
}

.grid--rev>.grid__item {
	direction: ltr;
	text-align: left
}

.grid--full {
	margin-left: 0
}

.grid--full>.grid__item {
	padding-left: 0
}

.grid--right {
	text-align: right
}

.grid--right>.grid__item {
	text-align: left
}

.grid--center {
	text-align: center
}

.grid--center>.grid__item {
	text-align: left
}

.grid--middle>.grid__item {
	vertical-align: middle
}

.grid--bottom>.grid__item {
	vertical-align: bottom
}

.grid--narrow {
	margin-left: -1rem
}

.grid--narrow>.grid__item {
	padding-left: 1rem
}

.grid--wide {
	margin-left: -4rem
}

.grid--wide>.grid__item {
	padding-left: 4rem
}

.one-whole {
	width: 100%
}

.one-half, .two-quarters, .three-sixths, .four-eighths, .five-tenths, .six-twelfths {
	width: 50%
}

.one-third, .two-sixths, .four-twelfths {
	width: 33.333%
}

.two-thirds, .four-sixths, .eight-twelfths {
	width: 66.666%
}

.one-quarter, .two-eighths, .three-twelfths {
	width: 25%
}

.three-quarters, .six-eighths, .nine-twelfths {
	width: 75%
}

.one-fifth, .two-tenths {
	width: 20%
}

.two-fifths, .four-tenths {
	width: 40%
}

.three-fifths, .six-tenths {
	width: 60%
}

.four-fifths, .eight-tenths {
	width: 80%
}

.one-sixth, .two-twelfths {
	width: 16.666%
}

.five-sixths, .ten-twelfths {
	width: 83.333%
}

.one-eighth {
	width: 12.5%
}

.three-eighths {
	width: 37.5%
}

.five-eighths {
	width: 62.5%
}

.seven-eighths {
	width: 87.5%
}

.one-tenth {
	width: 10%
}

.three-tenths {
	width: 30%
}

.seven-tenths {
	width: 70%
}

.nine-tenths {
	width: 90%
}

.one-twelfth {
	width: 8.333%
}

.five-twelfths {
	width: 41.666%
}

.seven-twelfths {
	width: 58.333%
}

.eleven-twelfths {
	width: 91.666%
}
	
	@media only screen and (min-width: 30.0625em) {
	.medium--one-whole {
		width: 100%
	}
	
	.medium--one-half, .medium--two-quarters, .medium--three-sixths, .medium--four-eighths, .medium--five-tenths, .medium--six-twelfths {
		width: 50%
	}
	
	.medium--one-third, .medium--two-sixths, .medium--four-twelfths {
		width: 33.333%
	}
	
	.medium--two-thirds, .medium--four-sixths, .medium--eight-twelfths {
		width: 66.666%
	}
	
	.medium--one-quarter, .medium--two-eighths, .medium--three-twelfths {
		width: 25%
	}
	
	.medium--three-quarters, .medium--six-eighths, .medium--nine-twelfths {
		width: 75%
	}
	
	.medium--one-fifth, .medium--two-tenths {
		width: 20%
	}
	
	.medium--two-fifths, .medium--four-tenths {
		width: 40%
	}
	
	.medium--three-fifths, .medium--six-tenths {
		width: 60%
	}
	
	.medium--four-fifths, .medium--eight-tenths {
		width: 80%
	}
	
	.medium--one-sixth, .medium--two-twelfths {
		width: 16.666%
	}
	
	.medium--five-sixths, .medium--ten-twelfths {
		width: 83.333%
	}
	
	.medium--one-eighth {
		width: 12.5%
	}
	
	.medium--three-eighths {
		width: 37.5%
	}
	
	.medium--five-eighths {
		width: 62.5%
	}
	
	.medium--seven-eighths {
		width: 87.5%
	}
	
	.medium--one-tenth {
		width: 10%
	}
	
	.medium--three-tenths {
		width: 30%
	}
	
	.medium--seven-tenths {
		width: 70%
	}
	
	.medium--nine-tenths {
		width: 90%
	}
	
	.medium--one-twelfth {
		width: 8.333%
	}
	
	.medium--five-twelfths {
		width: 41.666%
	}
	
	.medium--seven-twelfths {
		width: 58.333%
	}
	
	.medium--eleven-twelfths {
		width: 91.666%
	}
}@media only screen and (min-width: 48.0625em) {
	.large--one-whole {
		width: 100%
	}
	
	.large--one-half, .large--two-quarters, .large--three-sixths, .large--four-eighths, .large--five-tenths, .large--six-twelfths {
		width: 50%
	}
	
	.large--one-third, .large--two-sixths, .large--four-twelfths {
		width: 33.333%
	}
	
	.large--two-thirds, .large--four-sixths, .large--eight-twelfths {
		width: 66.666%
	}
	
	.large--one-quarter, .large--two-eighths, .large--three-twelfths {
		width: 25%
	}
	
	.large--three-quarters, .large--six-eighths, .large--nine-twelfths {
		width: 75%
	}
	
	.large--one-fifth, .large--two-tenths {
		width: 20%
	}
	
	.large--two-fifths, .large--four-tenths {
		width: 40%
	}
	
	.large--three-fifths, .large--six-tenths {
		width: 60%
	}
	
	.large--four-fifths, .large--eight-tenths {
		width: 80%
	}
	
	.large--one-sixth, .large--two-twelfths {
		width: 16.666%
	}
	
	.large--five-sixths, .large--ten-twelfths {
		width: 83.333%
	}
	
	.large--one-eighth {
		width: 12.5%
	}
	
	.large--three-eighths {
		width: 37.5%
	}
	
	.large--five-eighths {
		width: 62.5%
	}
	
	.large--seven-eighths {
		width: 87.5%
	}
	
	.large--one-tenth {
		width: 10%
	}
	
	.large--three-tenths {
		width: 30%
	}
	
	.large--seven-tenths {
		width: 70%
	}
	
	.large--nine-tenths {
		width: 90%
	}
	
	.large--one-twelfth {
		width: 8.333%
	}
	
	.large--five-twelfths {
		width: 41.666%
	}
	
	.large--seven-twelfths {
		width: 58.333%
	}
	
	.large--eleven-twelfths {
		width: 91.666%
	}
}@media only screen and (min-width: 60em) {
	.wide--one-whole {
		width: 100%
	}
	
	.wide--one-half, .wide--two-quarters, .wide--three-sixths, .wide--four-eighths, .wide--five-tenths, .wide--six-twelfths {
		width: 50%
	}
	
	.wide--one-third, .wide--two-sixths, .wide--four-twelfths {
		width: 33.333%
	}
	
	.wide--two-thirds, .wide--four-sixths, .wide--eight-twelfths {
		width: 66.666%
	}
	
	.wide--one-quarter, .wide--two-eighths, .wide--three-twelfths {
		width: 25%
	}
	
	.wide--three-quarters, .wide--six-eighths, .wide--nine-twelfths {
		width: 75%
	}
	
	.wide--one-fifth, .wide--two-tenths {
		width: 20%
	}
	
	.wide--two-fifths, .wide--four-tenths {
		width: 40%
	}
	
	.wide--three-fifths, .wide--six-tenths {
		width: 60%
	}
	
	.wide--four-fifths, .wide--eight-tenths {
		width: 80%
	}
	
	.wide--one-sixth, .wide--two-twelfths {
		width: 16.666%
	}
	
	.wide--five-sixths, .wide--ten-twelfths {
		width: 83.333%
	}
	
	.wide--one-eighth {
		width: 12.5%
	}
	
	.wide--three-eighths {
		width: 37.5%
	}
	
	.wide--five-eighths {
		width: 62.5%
	}
	
	.wide--seven-eighths {
		width: 87.5%
	}
	
	.wide--one-tenth {
		width: 10%
	}
	
	.wide--three-tenths {
		width: 30%
	}
	
	.wide--seven-tenths {
		width: 70%
	}
	
	.wide--nine-tenths {
		width: 90%
	}
	
	.wide--one-twelfth {
		width: 8.333%
	}
	
	.wide--five-twelfths {
		width: 41.666%
	}
	
	.wide--seven-twelfths {
		width: 58.333%
	}
	
	.wide--eleven-twelfths {
		width: 91.666%
	}
}.notebook__listing__title:first-child, .inlinefootnote .footnoteBackLink {
	display: none
}
	
	@media only screen and (max-width: 30em) {
	.brands, .portfolio__meta, .portfolio__section--style-guide {
		display: none
	}
}@media only screen and (max-width: 48em) {
	.notebook__categories__list, .inlinefootnote {
		display: none
	}
}.label--hidden, .branding__wordmark {
	height: 0;
	left: -9999%;
	margin: 0;
	opacity: 0;
	padding: 0;
	position: absolute
}

.js .hide-animation {
	opacity: 0
}

.btn, .entry__avatar, .intro__work__img, .portfolio__nav__img {
	border-radius: 2px
}

.dragdealer .handle, .portfolio__meta__nav a, .portfolio__loupe__mockup, .portfolio__browser:after {
	border-radius: 50%
}

.style-guide__description, .team__member {
	margin-bottom: 3.75rem
}

.fieldset__description, .values__item {
	margin-bottom: 3rem
}

.page-header--portfolio .page-header__subtitle, .style-guide__title {
	margin-bottom: 2.25rem
}

.brands__title, .team__title, .team__social {
	margin-bottom: 2rem
}

.page-header--home .page-header__subtitle, .page-header__cta, .notebook__categories, .notebook__listing__title, .notebook__listing__nav, .intro__work__img, .intro__work__title, .team__img, .values__list {
	margin-bottom: 1.5rem
}

.field, .page-header__title, .referrals-footer__title, .notebook__jobs__title, .notebook__jobs__img, .notebook__jobs__item, .notebook__item__title--entry, .style-guide__img, .portfolio__nav__img {
	margin-bottom: 1rem
}

.legend, .notebook__categories__item, .portfolio__meta__role, .team__name, .team__details p, .values__title {
	margin-bottom: 0.5rem
}

.cta__container, .team__container {
	padding-top: 3rem;
	padding-bottom: 3rem
}

.intro__work, .intro__team, .jobs {
	padding-top: 2.25rem;
	padding-bottom: 2.25rem
}

.branding__logo {
	padding-top: 1rem;
	padding-bottom: 1rem
}

.btn, .referral {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem
}

.team__social a {
	margin-left: 1rem;
	margin-right: 1rem
}

.btn {
	padding-left: 2.25rem;
	padding-right: 2.25rem
}

.referral {
	padding-left: 0.5rem;
	padding-right: 0.5rem
}

p {
	margin-bottom: 1em
}

blockquote {
	border-left: 3px solid #d1d5d7;
	margin: 2.5em 0;
	padding-left: 2rem
}

blockquote p:last-of-type {
	margin-bottom: 0
}

blockquote cite {
	display: block;
	font-size: 0.875rem;
	font-style: normal;
	margin-top: .5em
}
	
	@media (min-width: 30.0625em) {
	blockquote cite {
		font-size: 1rem
	}
}blockquote cite:before {
	content: '— '
}

ul, ol {
	margin-bottom: 1em;
	margin-left: 3rem;
	padding-left: 0
}

ul ul, ul ol, ol ul, ol ol {
	margin-top: .5em
}

li {
	margin-bottom: .5em
}

hr {
	border: 0;
	border-top: 1px solid #ccc;
	display: block;
	height: 1px;
	margin: 1em 0;
	padding: 0
}

a {
	text-decoration: none;
	-webkit-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out
}

a:link, a:visited {
	color: #ad823e
}

a:hover, a:focus {
	color: #c6a87b
}

a:active {
	color: #b79157
}

.link--alt {
	text-decoration: underline
}

.link--alt:link, .link--alt:visited {
	color: #f9f9f9
}

.link--alt:hover, .link--alt:focus {
	color: #ad823e;
	text-decoration: none
}

.link--alt:active {
	color: #c49b5a
}

.link--plain:link, .link--plain:visited {
	color: #f9f9f9
}

.link--plain:hover, .link--plain:focus {
	color: #838d94
}

.link--plain:active {
	color: #9ea6ac
}

.link--gray:link, .figure__caption a:link, .entry__notes a:link, .inlinefootnote a:link, sup[id^="fnref"] a:link, .link--gray:visited, .figure__caption a:visited, .entry__notes a:visited, .inlinefootnote a:visited, sup[id^="fnref"] a:visited {
	color: #838d94;
	text-decoration: underline
}

.link--gray:hover, .figure__caption a:hover, .entry__notes a:hover, .inlinefootnote a:hover, sup[id^="fnref"] a:hover, .link--gray:focus, .figure__caption a:focus, .entry__notes a:focus, .inlinefootnote a:focus, sup[id^="fnref"] a:focus, .link--gray:active, .figure__caption a:active, .entry__notes a:active, .inlinefootnote a:active, sup[id^="fnref"] a:active {
	color: #616c74;
	text-decoration: none
}

.link--dark:link, .notebook__jobs__item a:link, .link--dark:visited, .notebook__jobs__item a:visited {
	color: #2d3138
}

.link--dark:hover, .notebook__jobs__item a:hover, .link--dark:focus, .notebook__jobs__item a:focus, .link--dark:active, .notebook__jobs__item a:active {
	color: #ad823e
}

body {
	-webkit-tap-highlight-color: rgba(173,130,62,0.35)
}

::-moz-selection {
	background: rgba(173,130,62,0.25)
}

::selection {
	background: rgba(173,130,62,0.25)
}

::-moz-selection {
	background: rgba(173,130,62,0.25)
}

.more:after {
	content: ' »'
}

img {
	height: auto;
	max-width: 100%;
	vertical-align: middle;
	width: 100%
}

.img--natural {
	width: auto
}

.img--title {
	height: 1em;
	width: auto;
	vertical-align: top
}

.img--right {
	float: right;
	margin-bottom: 2.25rem;
	margin-left: 2.25rem;
	width: auto
}

.img--left {
	float: left;
	margin-right: 2.25rem;
	margin-bottom: 2.25rem;
	width: auto
}

.img--center {
	display: block;
	margin-right: auto;
	margin-bottom: 2.25rem;
	margin-left: auto;
	width: auto
}

.img--right img, .img--left img, .img--center img {
	width: auto
}

form {
	text-align: left
}

#preferredPlacement {
	display: none
}

fieldset {
	border: none;
	border-top: 1px solid #d1d5d7;
	margin: 0 0 0.5rem 0;
	padding: 1.5rem 0 0
}
	
	@media (min-width: 30.0625em) {
	fieldset {
		margin: 0 0 1.5rem 0;
		padding: 2rem 2.25rem 0
	}
}@media (min-width: 48.0625em) {
	fieldset {
		margin: 0 0 2.25rem 0;
		padding: 3rem 5.25rem 0
	}
}@media (min-width: 30.0625em) {
	.legend {
		margin: 0 0 1rem 0
	}
}@media (min-width: 48.0625em) {
	.legend {
		padding-top: 0.25rem
	}
}@media (min-width: 48.0625em) {
	.fieldset__container {
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-flex-wrap: nowrap;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap
	}
}@media (min-width: 48.0625em) {
	.fieldset__info {
		-webkit-flex: 0 1 33.3333%;
		-moz-box-flex: 0;
		-ms-flex: 0 1 33.3333%;
		flex: 0 1 33.3333%;
		padding-right: 2rem
	}
}.fieldset__description {
	line-height: 1.7142857143
}
	
	@media (min-width: 48.0625em) {
	.fieldset__fields {
		-webkit-flex: 1 0 66.6666%;
		-moz-box-flex: 1;
		-ms-flex: 1 0 66.6666%;
		flex: 1 0 66.6666%
	}
}input[type=text], input[type=password], input[type=email], input[type=url], input[type=number], input[type=datetime], input[type=date], input[type=tel], input[type=month], input[type=week], input[type=search], textarea, select {
	-webkit-appearance: none;
	border: 1px solid #d1d5d7;
	border-radius: 4px;
	color: #616c74;
	padding: 0.75rem;
	-webkit-tap-highlight-color: transparent;
	width: 100%
}

input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=url]:focus, input[type=number]:focus, input[type=datetime]:focus, input[type=date]:focus, input[type=tel]:focus, input[type=month]:focus, input[type=week]:focus, input[type=search]:focus, textarea:focus, select:focus {
	border-color: #838d94;
	outline: none
}
	
	@media (max-width: 30em) {
	input[type=text], input[type=password], input[type=email], input[type=url], input[type=number], input[type=datetime], input[type=date], input[type=tel], input[type=month], input[type=week], input[type=search], textarea, select {
		font-size: 1em
	}
}textarea {
	height: 8.375rem
}

.input--check {
	display: block;
	position: relative
}

.input--check label {
	cursor: pointer;
	display: inline-block;
	padding-left: 1.75rem;
	padding-bottom: 0.5rem;
	position: relative;
	-webkit-tap-highlight-color: transparent
}

.input--check input[type="radio"], .input--check input[type="checkbox"] {
	height: 1.125rem;
	position: absolute;
	opacity: 0.01;
	width: 1.125rem;
	vertical-align: middle;
	z-index: 4;
	top: -20px
}

.input--check input[type="radio"]+label:before, .input--check input[type="checkbox"]+label:before {
	background-color: #fff;
	background-image: -webkit-linear-gradient(#fff, #f9f9f9);
	background-image: linear-gradient(#fff, #f9f9f9);
	border: 1px solid #d1d5d7;
	border-radius: 2px;
	box-shadow: 0 1px 0 rgba(0,0,0,0.06);
	content: '';
	display: inline-block;
	height: 1.125rem;
	left: 0;
	margin-right: 7px;
	overflow: hidden;
	position: absolute;
	vertical-align: middle;
	width: 1.125rem;
	z-index: 5
}

.input--check input[type="radio"]:hover+label:before, .input--check input[type="radio"]:focus+label:before, .input--check input[type="checkbox"]:hover+label:before, .input--check input[type="checkbox"]:focus+label:before {
	border-color: #838d94
}

.input--check input[type="radio"]:checked+label:after, .input--check input[type="checkbox"]:checked+label:after {
	content: '';
	position: absolute;
	z-index: 6
}

.input--check input[type="radio"]+label:before {
	border-radius: 50%
}

.input--check input[type="radio"]:checked+label:after {
	background: #616c74;
	border-radius: 50%;
	height: 0.375rem;
	left: 0.375rem;
	top: 0.375rem;
	width: 0.375rem
}

.input--check input[type="checkbox"]:checked+label:after {
	background: url(/web/20221206075906im_/https://31three.com/img/icon-check.svg) 50% 50% no-repeat;
	background-size: contain;
	height: 0.625rem;
	left: 0.25rem;
	top: 0.25rem;
	width: 0.625rem
}

.field__select {
	background-image: url(/web/20221206075906im_/https://31three.com/img/icon-arrow.svg);
	background-repeat: no-repeat;
	background-size: auto 0.5rem;
	background-position: 90% 50%;
	background-position: right 1rem top 50%;
	border: 1px solid #d1d5d7;
	border-radius: 4px;
	display: inline-block;
	max-width: 100%;
	min-width: 14.875rem;
	overflow: hidden;
	position: relative
}

.field__select select {
	-moz-appearance: window;
	background: transparent;
	border: 0;
	border-radius: 0;
	cursor: pointer;
	max-width: 100%;
	min-width: 14.875rem;
	padding-right: 3rem;
	width: auto
}

.field__select select:-moz-focusring {
	color: transparent;
	text-shadow: 0 0 0 #000
}

.field__select select::-ms-expand {
	display: none
}

.field__select--full {
	min-width: 0;
	width: 100%
}

.field__select--full select {
	width: 100%
}

.dragdealer {
	border-radius: 3px;
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.25);
	margin: 1.125rem 0;
	position: relative;
	height: 0.4375rem
}
	
	@media (max-width: 30em) {
	.dragdealer {
		margin-bottom: 3rem
	}
}.dragdealer .handle {
	background-image: -webkit-linear-gradient(#fff, #f9f9f9);
	background-image: linear-gradient(#fff, #f9f9f9);
	border: 1px solid #d1d5d7;
	box-shadow: 0 1px 0 rgba(0,0,0,0.06);
	cursor: pointer;
	height: 1.5rem;
	left: 0;
	margin-top: -0.75rem;
	position: absolute;
	top: 50%;
	width: 1.5rem
}
	
	@media (max-width: 30em) {
	.dragdealer .handle {
		height: 2.75rem;
		margin-top: -1.375rem;
		width: 2.75rem
	}
}.dragdealer .value {
	left: 50%;
	margin-top: 0.375rem;
	position: absolute;
	top: 100%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	white-space: nowrap
}

.field__select--slider--init {
	display: none
}

.input--toggle {
	max-height: 6.25rem;
	overflow: hidden;
	-webkit-transition: max-height .3s ease-in-out;
	transition: max-height .3s ease-in-out
}

.input--toggle--off {
	max-height: 0
}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
	color: #838d94
}

input:-moz-placeholder, textarea:-moz-placeholder {
	color: #838d94
}

input::-moz-placeholder, textarea::-moz-placeholder {
	color: #838d94
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
	color: #838d94
}

input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder {
	opacity: .5
}

input:focus:-moz-placeholder, textarea:focus:-moz-placeholder {
	opacity: .5
}

input:focus::-moz-placeholder, textarea:focus::-moz-placeholder {
	opacity: .5
}

input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder {
	opacity: .5
}
	
	@media (min-width: 30.0625em) {
	.field {
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: flex-end;
		-moz-box-pack: end;
		-ms-flex-pack: end;
		justify-content: flex-end
	}
}.field__label {
	margin-bottom: 0.25rem
}
	
	@media (min-width: 30.0625em) {
	.field__label {
		padding-top: 0.625rem;
		padding-right: 1rem;
		text-align: right
	}
}@media (min-width: 30.0625em) {
	.field__input {
		-webkit-flex: 0 0 66.6666%;
		-moz-box-flex: 0;
		-ms-flex: 0 0 66.6666%;
		flex: 0 0 66.6666%;
		padding-left: 1rem
	}
}@media (min-width: 48.0625em) {
	.field__input {
		-webkit-flex: 0 0 75%;
		-moz-box-flex: 0;
		-ms-flex: 0 0 75%;
		flex: 0 0 75%
	}
}.field__input--checks {
	padding-top: 0.625rem
}
	
	@media (min-width: 23.75em) {
	.field__input--cols {
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
		-webkit-column-gap: 1.5rem;
		-moz-column-gap: 1.5rem;
		column-gap: 1.5rem
	}
}@media (min-width: 30.0625em) {
	.field__input--cols {
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1
	}
}@media (min-width: 42.5em) {
	.field__input--cols {
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2
	}
}@media (min-width: 48.0625em) {
	.field__input--cols {
		-webkit-column-count: 1;
		-moz-column-count: 1;
		column-count: 1
	}
}@media (min-width: 60em) {
	.field__input--cols {
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2
	}
}.field__feedback {
	display: block;
	min-height: 1rem;
	margin-top: 6px
}

.field.is-error .field__feedback {
	color: #9e0b0f
}

.field.is-error input {
	border: 1px solid #c5540f
}

.field.is-error .input--check label:before {
	border-color: #c5540f
}

.input--inset {
	display: block;
	padding-left: 1.75rem
}

.action {
	border-top: 1px solid #d1d5d7;
	padding: 2rem 0 3rem;
	text-align: right
}
	
	@media (min-width: 30.0625em) {
	.action {
		padding: 3rem 2.25rem 4.5rem;
		text-align: left
	}
	
	.action .btn {
		left: 1rem;
		margin-left: 33.3333%;
		position: relative
	}
}@media (min-width: 48.0625em) {
	.action {
		padding: 3.75rem 5.25rem 7.5rem
	}
	
	.action .btn {
		margin-left: 50%
	}
}.nav {
	list-style: none;
	margin-left: 0
}

.nav>li, .nav>li>a {
	display: inline-block
}

.nav-label {
	background: transparent;
	border: none;
	display: none;
	height: 3.4375rem;
	margin-top: -1.75rem;
	outline: 0;
	position: absolute;
	right: 1rem;
	top: 50%;
	-webkit-tap-highlight-color: transparent;
	width: 3.25rem
}
	
	@media screen and (max-width: 48em) {
	.nav-label {
		display: block
	}
}@media screen and (max-width: 30em) {
	.nav-label {
		right: 0
	}
}.nav-label .top-bar, .nav-label .middle-bar, .nav-label .bottom-bar {
	background: #ad823e;
	border-radius: 1px;
	height: 0.1875rem;
	left: 1rem;
	position: absolute;
	-webkit-transition: -webkit-transform 0.2s ease-in-out;
	transition: transform 0.2s ease-in-out;
	-webkit-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	top: 1.3125rem;
	width: 1rem
}

.nav-label .middle-bar {
	top: 1.6875rem
}

.nav-label .bottom-bar {
	top: 2.0625rem
}

.nav-label.is-active .top-bar, .nav-label.is-active .bottom-bar {
	-webkit-transition: -webkit-transform 0.2s ease-in-out;
	transition: transform 0.2s ease-in-out
}

.nav-label.is-active .top-bar {
	-webkit-transform: translate(0, -0.1875rem);
	-ms-transform: translate(0, -0.1875rem);
	transform: translate(0, -0.1875rem)
}

.nav-label.is-active .bottom-bar {
	-webkit-transform: translate(0, 0.1875rem);
	-ms-transform: translate(0, 0.1875rem);
	transform: translate(0, 0.1875rem)
}

.btn {
	background: #b79157;
	border: none;
	display: inline-block;
	vertical-align: middle
}

.btn, .btn:link, .btn:visited {
	color: #fff
}

.btn:hover, .btn:focus {
	background: #bd9a65
}

.btn.is-active, .btn:active {
	background: #ad823e
}

.btn--wide {
	padding-left: 5.25rem;
	padding-right: 5.25rem
}
	
	@media (max-width: 30em) {
	.btn--mobile-block {
		display: block;
		padding-left: 1rem;
		padding-right: 1rem;
		text-align: center
	}
}.btn__note {
	display: block;
	margin: 0.5rem 0 2.25rem;
	text-align: center
}

.icon {
	padding-left: 1.1875rem;
	position: relative
}

.icon:before {
	background-position: 50% 0;
	background-repeat: no-repeat;
	background-size: contain;
	content: '';
	height: 1rem;
	left: 0;
	position: absolute;
	top: 1px;
	width: 1rem
}

.icon--pin:before {
	background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMCA0MCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMzAgNDAiPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBmaWxsPSIjNGQ1NjVkIiBkPSJNMTUgMGMtOC4zIDAtMTUgNi44LTE1IDE1LjIgMCAxMC43IDEwLjggMjEuNCAxNCAyNC40LjUuNSAxLjQuNSAxLjkgMCAzLjMtMyAxNC0xMy43IDE0LTI0LjQuMS04LjQtNi42LTE1LjItMTQuOS0xNS4yem0wIDIyLjVjLTQuMSAwLTcuNC0zLjQtNy40LTcuNXMzLjMtNy41IDcuNC03LjVjNC4xIDAgNy40IDMuNCA3LjQgNy41cy0zLjMgNy41LTcuNCA3LjV6Ii8+PC9zdmc+);
	background-position: 0 0
}

.icon--twitter {
	padding-left: 1.625rem
}

.icon--twitter:before {
	background-image: url(/web/20221206075906im_/https://31three.com/img/icon-twitter.svg);
	height: 1.125rem;
	top: 1px;
	width: 1.125rem
}

.icon--dribbble {
	padding-left: 1.625rem
}

.icon--dribbble:before {
	background-image: url(/web/20221206075906im_/https://31three.com/img/icon-dribbble.svg);
	height: 1.125rem;
	top: 0;
	width: 1.125rem
}

.icon--pinterest {
	padding-left: 1.625rem
}

.icon--pinterest:before {
	background-image: url(/web/20221206075906im_/https://31three.com/img/icon-pinterest.svg);
	height: 1.125rem;
	top: 0;
	width: 1.125rem
}

.figure {
	position: relative;
	margin-bottom: 1em
}
	
	@media (min-width: 30.0625em) {
	.figure--small {
		float: left;
		margin-right: 1rem;
		padding-right: 1rem;
		width: 60%
	}
}@media (min-width: 48.0625em) {
	.figure--small {
		width: 50%
	}
}.figure img {
	margin-bottom: 0.5rem !important
}
	
	@media (min-width: 48.0625em) {
	.figure img {
		margin-bottom: 0 !important
	}
}.figure__caption {
	font-size: 0.875rem;
	text-align: center
}
	
	@media (min-width: 48.0625em) {
	.figure__caption {
		bottom: 0;
		line-height: 1.6875rem;
		padding-right: 2rem;
		position: absolute;
		right: 100%;
		text-align: right;
		width: 30%
	}
	
	.figure--small .figure__caption {
		width: 60%
	}
}.media {
	display: block;
	margin-bottom: 1rem
}

.media__left {
	float: left;
	margin-right: 1rem
}

.media__right {
	float: right;
	margin-left: 1rem
}

.media__left img, .media__right img {
	display: block
}

.media__body {
	overflow: hidden
}

.media__body, .media__body>:last-child {
	margin-bottom: 0
}

.multimedia {
	height: 0;
	margin: 2.5em auto;
	padding-bottom: 56.25%;
	position: relative
}

.multimedia embed, .multimedia object, .multimedia video, .multimedia iframe {
	height: 100%;
	margin: 0 !important;
	padding: 0;
	width: 100%
}

.multimedia--standard {
	padding-bottom: 75%
}

body {
	background: #f9f9f9;
	color: #616c74;
	font-size: 1em;
	line-height: 1.5
}

.site-header {
	text-align: center
}
	
	@media (min-width: 48.0625em) {
	.site-header {
		min-height: 105px
	}
}.site-header>.container {
	position: relative
}

.site-header a:link, .site-header a:visited {
	color: #838d94
}

.site-header a:hover, .site-header a:focus {
	color: #2d3138
}

.site-header a:active {
	color: #22262c
}

.site-header a.is-active {
	color: #2d3138
}

.branding {
	display: inline-block;
	width: 5.8125rem
}
	
	@media (min-width: 48.0625em) {
	.branding {
		min-height: 105px
	}
}@media (min-width: 30.0625em) {
	.branding {
		width: 8.0625rem
	}
}@media (min-width: 30.0625em) {
	.branding__logo {
		padding: 2rem 0
	}
}@media (min-width: 48.0625em) {
	.branding__logo {
		padding: 2.25rem 0
	}
}.site-nav {
	margin-top: -0.8125rem;
	position: absolute;
	top: 50%;
	z-index: 500
}
	
	@media screen and (max-width: 48em) {
	.site-nav {
		font-size: 1em;
		left: 0;
		margin: 0;
		max-height: 0;
		overflow: hidden;
		right: 0;
		top: 100%;
		-webkit-transition: max-height .2s ease-in-out;
		transition: max-height .2s ease-in-out
	}
	
	.site-nav.is-active {
		max-height: 13.6875rem
	}
}.site-nav__item {
	margin-right: 1.5rem
}
	
	@media screen and (max-width: 48em) {
	.site-nav__item {
		background: #2d3138;
		display: block !important;
		margin: 0;
		text-align: center
	}
	
	.site-nav__item a {
		border-top: 1px solid #4a5258;
		display: block !important;
		padding: 1rem 0
	}
	
	.site-nav__item a:link, .site-nav__item a:visited {
		color: #ad823e
	}
	
	.site-nav__item a:hover, .site-nav__item a:focus {
		background: #22262c;
		color: #ad823e
	}
	
	.site-nav__item a:active {
		color: #b79157
	}
	
	.site-nav__item a.is-active {
		background: #22262c;
		color: #838d94
	}
	
	.site-nav__item:first-child a {
		border-top: none
	}
}@media (min-width: 48.0625em) {
	.site-nav__contact {
		display: none !important
	}
}.site-cta {
	margin-top: -0.8125rem;
	position: absolute;
	right: 2rem;
	top: 50%
}
	
	@media screen and (max-width: 48em) {
	.site-cta {
		display: none
	}
}.site-cta span {
	margin-right: 0.5rem
}

.site-cta a:link, .site-cta a:visited {
	background-color: whitesmoke;
	border-radius: 3px;
	padding: 6px 12px
}

.site-cta a:hover, .site-cta a:focus, .site-cta a:active {
	-webkit-animation: none;
	animation: none;
	background-color: #ad823e;
	color: #fff
}

.site-main {
	background: #f9f9f9 url(https://piovesan.ca/assets/img/body-bg-s.jpg) 50% 0 no-repeat;
	background-size: 100% auto
}
	
	@media (min-width: 30.0625em) {
	.site-main {
		background-image: url(https://piovesan.ca/assets/img/body-bg-m.jpg)
	}
}@media (min-width: 48.0625em) {
	.site-main {
		background-image: url(https://piovesan.ca/assets/img/body-bg-l.jpg);
		background-size: auto
	}
}@media (min-width: 1750px) {
	.site-main {
		background-size: 100% auto
	}
}.site-main--portfolio {
	background-image: none;
	overflow: hidden
}

.site-footer {
	background: #2d3138 url(https://piovesan.ca/assets/img/footer-bg-s.jpg) 50% 0 no-repeat;
	position: relative
}

.site-footer:before {
	background: -webkit-linear-gradient(rgba(45,49,56,0), #2d3138);
	background: linear-gradient(rgba(45,49,56,0), #2d3138);
	bottom: 0;
	content: '';
	height: 5.25rem;
	left: 0;
	position: absolute;
	right: 0
}
	
	@media (min-width: 30.0625em) {
	.site-footer {
		background-image: url(https://piovesan.ca/assetsimg/footer-bg-m.jpg)
	}
}@media (min-width: 48.0625em) {
	.site-footer {
		background-image: url(https://piovesan.ca/assets/img/footer-bg-l.jpg)
	}
}@media (min-width: 80em) {
	.site-footer {
		background-size: 100% auto
	}
}.site-credits {
	padding-top: 3rem;
	padding-bottom: 4.5rem;
	position: relative;
	text-align: center
}

.site-credits__copyright {
	display: block
}
	
	@media (min-width: 30.0625em) {
	.site-credits__copyright {
		display: inline
	}
	
	.site-credits__copyright:after {
		content: ' —'
	}
}.page-header {
	padding: 3rem 0;
	text-align: center
}
	
	@media (min-width: 30.0625em) {
	.page-header {
		padding: 3.75rem 0
	}
}@media (min-width: 48.0625em) {
	.page-header {
		padding: 5.25rem 0
	}
}.page-header--home {
	overflow: hidden;
	padding: 3rem 0 0 0;
	-webkit-transition-property: padding;
	transition-property: padding;
	-webkit-transition-duration: .5s;
	transition-duration: .5s;
	-webkit-transition-timing-function: linear;
	transition-timing-function: linear
}
	
	@media (min-width: 30.0625em) {
	.page-header--home {
		outline: none
	}
}@media (min-height: 38.75em) and (min-width: 48.0625em) {
	.page-header--home {
		padding: 6.25rem 0 0 0
	}
}@media (min-height: 43.75em) and (min-width: 48.0625em) {
	.page-header--home {
		padding: 9rem 0 0 0
	}
}.page-header--referrals {
	padding-bottom: 2rem
}
	
	@media (min-width: 30.0625em) {
	.page-header--referrals {
		padding-bottom: 2rem 0
	}
}@media (min-width: 48.0625em) {
	.page-header--referrals {
		padding-bottom: 2.25rem
	}
}.page-header--notebook {
	padding-bottom: 1.5rem
}
	
	@media (min-width: 30.0625em) {
	.page-header--notebook {
		padding-bottom: 2rem
	}
}.page-header--portfolio {
	padding-bottom: 1rem;
	position: relative;
	z-index: 1
}
	
	@media (min-width: 30.0625em) {
	.page-header--portfolio {
		padding-bottom: 2.25rem
	}
}.page-header--portfolio:before {
	background: #2d3138 url(https://piovesan.ca/assets/img/portfolio-bg-s.jpg) 50% 0 no-repeat;
	bottom: -9.375rem;
	content: '';
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	z-index: -1
}
	
	@media (min-width: 30.0625em) {
	.page-header--portfolio:before {
		background-image: url(https://piovesan.ca/assets/img/portfolio-bg-m.jpg);
		bottom: -12.5rem
	}
}@media (min-width: 48.0625em) {
	.page-header--portfolio:before {
		background-image: url(/https://piovesan.ca/assetsimg/portfolio-bg-l.jpg);
		bottom: -18.75rem
	}
}@media (min-width: 60em) {
	.page-header--portfolio:before {
		bottom: -25rem
	}
}@media (min-width: 80em) {
	.page-header--portfolio:before {
		background-size: 100% auto
	}
}.page-header--portfolio+* {
	position: relative;
	z-index: 2
}

.page-header__title, .referrals-footer__title {
	margin-left: auto;
	margin-right: auto;
	margin-bottom: .25em;
	max-width: 57.5rem
}

.page-header--home .page-header__subtitle {
	-webkit-transition-property: margin;
	transition-property: margin;
	-webkit-transition-duration: .5s;
	transition-duration: .5s;
	-webkit-transition-timing-function: linear;
	transition-timing-function: linear
}
	
	@media (min-height: 0) and (min-width: 48.0625em) {
	.page-header--home .page-header__subtitle {
		margin-bottom: 1em
	}
}@media (min-height: 38.75em) and (min-width: 48.0625em) {
	.page-header--home .page-header__subtitle {
		margin-bottom: 1em
	}
}@media (min-height: 43.75em) and (min-width: 48.0625em) {
	.page-header--home .page-header__subtitle {
		margin-bottom: 1.5em
	}
}.page-header__description {
	margin: 0 auto;
	max-width: 30rem
}

.page-header__img {
	background: url(https://piovesan.ca/assets/img/biciworld-head.png) 50% 50% no-repeat;
	background-size: 120% auto;
	width: 120%;
	margin-left: -10%;
	position: relative;
	height: 0;
	overflow: hidden;
	padding-bottom: 41%
}

html[data-useragent*="Firefox"] .page-header__img {
	-webkit-transition: none;
	transition: none
}

.page-header__img img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%
}

html[data-useragent*="Firefox"] .page-header__img img {
	-webkit-transition: none;
	transition: none
}
	
	@media (max-width: 30em) {
	.page-header__img {
		background-size: 140% auto
	}
	
	.page-header__img img {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%
	}
}.fourOHfour {
	overflow: hidden;
	padding: 2rem 0
}
	
	@media (min-width: 30.0625em) {
	.fourOHfour {
		padding: 2.25rem 0
	}
}@media (min-width: 48.0625em) {
	.fourOHfour {
		padding: 4.5rem 0
	}
}@media (min-width: 30.0625em) {
	.fourOHfour__img {
		left: 50%;
		max-width: none;
		position: relative;
		-webkit-transform: translate(-50%, 0);
		-ms-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
		width: 160%
	}
}@media (min-width: 48.0625em) {
	.fourOHfour__img {
		width: auto
	}
}.notebook {
	padding-bottom: 1.5rem
}
	
	@media (min-width: 30.0625em) {
	.notebook {
		padding-bottom: 2rem
	}
}@media (min-width: 48.0625em) {
	.notebook {
		padding: 5.25rem 0 2.25rem
	}
}.notebook__container {
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}
	
	@media (min-width: 48.0625em) {
	.notebook__container {
		display: block;
		padding-left: 33.3333%
	}
}@media (min-width: 60em) {
	.notebook__container {
		padding-left: 25%
	}
}.notebook__header, .notebook__categories, .notebook__jobs {
	-webkit-flex: 0 0 100%;
	-moz-box-flex: 0;
	-ms-flex: 0 0 100%;
	flex: 0 0 100%
}
	
	@media (min-width: 48.0625em) {
	.notebook__header, .notebook__categories, .notebook__jobs {
		clear: left;
		float: left;
		margin-left: -50%;
		width: 38%;
		width: calc(50% - 4rem)
	}
}@media (min-width: 60em) {
	.notebook__header, .notebook__categories, .notebook__jobs {
		margin-left: -33.3333%;
		width: 25%;
		width: calc(33.3333% - 4rem)
	}
}.notebook__header {
	-webkit-order: 1;
	-moz-box-ordinal-group: 2;
	-ms-flex-order: 1;
	order: 1
}
	
	@media (min-width: 48.0625em) {
	.notebook__header {
		padding-top: 0;
		padding-bottom: 1.5rem;
		text-align: left
	}
	
	.notebook__header .page-header__title, .notebook__header .referrals-footer__title {
		font-family: "Yantramanav","Helvetica Neue",Helvetica,Arial,sans-serif;
		font-style: normal;
		font-weight: 400;
		font-size: 1.5em
	}
	
	.notebook__header .page-header__description {
		font-size: 0.875em
	}
}.notebook__categories {
	-webkit-order: 3;
	-moz-box-ordinal-group: 4;
	-ms-flex-order: 3;
	order: 3
}
	
	@media (min-width: 48.0625em) {
	.notebook__categories {
		margin-bottom: 3rem
	}
}.notebook__categories__list {
	list-style: none;
	margin: 0
}
	
	@media (min-width: 48.0625em) {
	.notebook__categories__select {
		display: none
	}
}.notebook__categories .field__input {
	padding: 0
}

.notebook__categories .field__select {
	min-width: 0
}

.notebook__jobs {
	-webkit-order: 4;
	-moz-box-ordinal-group: 5;
	-ms-flex-order: 4;
	order: 4
}

.notebook__jobs__title {
	border-top: 1px solid #bec4c7;
	font-size: 1em;
	padding-top: 1.5rem;
	text-transform: uppercase
}
	
	@media (min-width: 48.0625em) {
	.notebook__jobs__title {
		padding-top: 2rem
	}
}.notebook__jobs__img {
	width: 51px
}
	
	@media (min-width: 48.0625em) {
	.notebook__jobs__img {
		width: 60px
	}
}.notebook__jobs__list {
	font-size: 1em;
	list-style: none;
	margin: 0
}
	
	@media (min-width: 48.0625em) {
	.notebook__jobs__list {
		font-size: 0.875em
	}
}.notebook__jobs__item span {
	display: block
}

.notebook__listing {
	-webkit-flex: 0 0 100%;
	-moz-box-flex: 0;
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	-webkit-order: 2;
	-moz-box-ordinal-group: 3;
	-ms-flex-order: 2;
	order: 2
}

.notebook__listing__title {
	border-bottom: 1px solid #bec4c7;
	margin-top: 2rem;
	padding-bottom: 0.5rem
}
	
	@media (min-width: 48.0625em) {
	.notebook__listing__title {
		margin-top: 3rem;
		margin-bottom: 2rem
	}
}.notebook__listing__title span {
	font-size: 1rem
}
	
	@media (min-width: 48.0625em) {
	.notebook__listing__title span {
		font-size: 1.125rem
	}
}@media (max-width: 37.5em) {
	.notebook__listing__grid {
		margin-left: -1rem
	}
}.notebook__listing__item {
	padding-bottom: 2rem
}
	
	@media (max-width: 37.5em) {
	.notebook__listing__item {
		padding-left: 1rem;
		padding-bottom: 1rem
	}
}.notebook__listing__nav {
	border-top: 1px solid #bec4c7;
	padding-top: 1.5rem
}
	
	@media (min-width: 48.0625em) {
	.notebook__listing__nav {
		margin-bottom: 0;
		padding-top: 2rem
	}
}a.notebook__item {
	cursor: pointer
}

.notebook__item {
	border-radius: 3px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.33);
	display: block;
	overflow: hidden
}

.notebook__item__category {
	float: left;
	margin: 1rem 0.5rem 0.625rem 0.625rem;
	width: 1.875rem
}

.notebook__item__meta {
	overflow: hidden;
	margin: 0.75rem
}

.notebook__item__meta--entry {
	padding: 1rem 1rem
}

.notebook__item__desc {
	overflow: hidden;
	border-top: 1px solid rgba(0,0,0,0.0902);
	padding: 0.75rem;
	font-size: 0.875rem
}

.notebook__item__desc--author {
	color: #838d94
}

.notebook__item__title {
	font-size: 0.875rem;
	line-height: 1.5
}

.notebook__item__title--entry {
	font-size: 1.125em;
	line-height: 1.5
}

.notebook__item__details {
	line-height: 1.1428571429
}

.notebook__item__excerpt {
	line-height: 1.7142857143;
	margin-bottom: 0
}

.notebook__item blockquote {
	border: none;
	margin: 0;
	padding: 1rem 1rem
}

.notebook__item blockquote p:last-of-type {
	margin-bottom: 1em
}

.notebook__item blockquote cite {
	margin-bottom: 1rem
}

.notebook__item blockquote cite:before {
	content: none
}

.notebook__item:hover, .notebook__item:focus, .notebook__item:active {
	box-shadow: 0 0 3px rgba(0,0,0,0.15)
}

.notebook__item:hover .notebook__item__more, .notebook__item:focus .notebook__item__more, .notebook__item:active .notebook__item__more {
	color: #c6a87b
}

.notebook__prev {
	float: left
}

.notebook__next {
	float: right
}

.entry {
	padding: 1.5rem 0
}
	
	@media (min-width: 30.0625em) {
	.entry {
		padding: 3.75rem 0
	}
}@media (min-width: 48.0625em) {
	.entry {
		padding: 7.5rem 0
	}
}.entry__container {
	position: relative
}

.entry__avatar {
	float: left;
	margin-right: 1rem;
	width: 5.625rem
}
	
	@media (min-width: 48.0625em) {
	.entry__avatar {
		float: none;
		margin: 0 0 1rem;
		width: 3.75rem
	}
}.entry__date, .entry__category {
	white-space: nowrap
}

.entry__title {
	font-size: 1.875em;
	line-height: 1.2;
	margin-bottom: 0.66667em
}
	
	@media (min-width: 30.0625em) {
	.entry__title {
		font-size: 2.66667em;
		line-height: 1.1458333333
	}
}.entry__content {
	text-rendering: optimizelegibility;
	font-size: 1.1em;
	margin: 0 auto;
	line-height: 1.6
}
	
	@media (min-width: 30.0625em) {
	.entry__content {
		font-size: 1.2em
	}
}@media (min-width: 48.0625em) {
	.entry__content {
		width: 62.5%
	}
}.entry__content img {
	display: block;
	margin-bottom: 1em;
	padding: .25em
}

.entry__content h2 {
	font-size: 1.66667em;
	line-height: 1.2;
	margin-top: 1.2em;
	margin-bottom: 0.7em
}

.entry__content h3 {
	font-size: 1.3em;
	line-height: 1.6;
	margin-bottom: 1em;
	margin-top: 1.5em
}

.entry__content h4 {
	font-size: 1.1em;
	line-height: 1.6;
	margin-bottom: 1em;
	margin-top: 1em
}

.entry__notes {
	border-top: 1px solid #bec4c7;
	font-size: 1rem;
	padding-top: 1.5rem
}
	
	@media (min-width: 48.0625em) {
	.js .entry__notes {
		display: none
	}
}.inlinefootnote {
	font-size: 0.875rem;
	line-height: 1.6875rem;
	vertical-align: middle
}
	
	@media (min-width: 48.0625em) {
	.inlinefootnote {
		margin-top: 0.125rem;
		padding-right: 2rem;
		position: absolute;
		right: 100%;
		text-align: right;
		width: 30%
	}
}@media (min-width: 48.0625em) {
	.js sup[id^="fnref"] {
		display: none
	}
}#disqus_thread {
	margin-top: 2em
}
	
	@media (min-width: 48.0625em) {
	.entry__meta {
		position: absolute;
		right: 0;
		top: 0;
		width: 18.75%
	}
}.entry__meta__container {
	border-top: 1px solid #bec4c7;
	padding-top: 1.5rem
}
	
	@media (min-width: 48.0625em) {
	.entry__meta__container {
		margin-left: 2rem
	}
}.image__description {
	margin: 1.5rem 0
}

.image__category {
	width: 2rem
}

.image__pin {
	float: right;
	height: 1.5rem;
	margin-top: 0.25rem;
	width: auto
}
	
	@media (min-width: 48.0625em) {
	.image__meta {
		position: absolute;
		right: 0;
		top: 0;
		width: 18.75%
	}
}@media (min-width: 48.0625em) {
	.image__meta__container {
		margin-left: 2rem
	}
}.brands {
	padding: 3rem 0 1.5rem;
	text-align: center
}

.brands__list {
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-left: -1.75rem
}
	
	@media (min-width: 56.25em) {
	.brands__list {
		-webkit-flex-wrap: nowrap;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap
	}
}.brands__item {
	-webkit-flex: 1 0 33.333333%;
	-moz-box-flex: 1;
	-ms-flex: 1 0 33.333333%;
	flex: 1 0 33.333333%;
	padding-left: 1.75rem;
	padding-bottom: 1.75rem
}
	
	@media (min-width: 30.0625em) {
	.brands__item {
		-webkit-flex: 1 0 16.666666667%;
		-moz-box-flex: 1;
		-ms-flex: 1 0 16.666666667%;
		flex: 1 0 16.666666667%
	}
}@media (min-width: 56.25em) {
	.brands__item {
		-webkit-flex: 1;
		-moz-box-flex: 1;
		-ms-flex: 1;
		flex: 1
	}
}.brand {
	border-radius: 4px;
	height: 0px;
	padding-top: 100%;
	position: relative;
	-webkit-transition: background-color .2s ease-in-out;
	transition: background-color .2s ease-in-out;
	width: 100%
}

.brand:hover {
	background: #393e47
}

.brand:hover .brand__title {
	opacity: 1;
	-webkit-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
	z-index: 5
}

.brand__title {
	border: 1px solid #3f434b;
	border-radius: 2px;
	bottom: 100%;
	left: 50%;
	margin-bottom: 0.75rem;
	opacity: 0;
	padding: 0.25rem 1.5rem;
	position: absolute;
	-webkit-transform: translate(-50%, -100%);
	-ms-transform: translate(-50%, -100%);
	transform: translate(-50%, -100%);
	-webkit-transition: all .25s ease-in-out;
	transition: all .25s ease-in-out;
	white-space: nowrap;
	z-index: -1
}

.brand__title:before, .brand__title:after {
	height: 0;
	width: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 6px;
	border-top-color: #2d3138;
	content: " ";
	pointer-events: none;
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -6px
}

.brand__title:before {
	height: 0;
	width: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 7px;
	border-top-color: #3f434b;
	margin-top: 0.5px;
	margin-left: -7px
}

.brand__img {
	left: 50%;
	position: absolute;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 60%
}

.cta {
	border-top: 3px solid #b79157;
	text-align: center
}
	
	@media (min-width: 30.0625em) {
	.cta__container {
		border-bottom: 1px solid #3f434b;
		padding: 4.5rem 0
	}
}.cta__teaser {
	font-size: 2em;
	line-height: 1.3125;
	margin: 0 auto 2rem
}
	
	@media (min-width: 30.0625em) {
	.cta__teaser {
		font-size: 2.625em;
		line-height: 1.2272727273;
		margin-bottom: 1.5rem;
		max-width: 15.71429em
	}
}.gallery {
	overflow: hidden;
	padding-bottom: 3rem;
	position: relative
}

.gallery__control-operator {
	display: none
}

.gallery__item {
	float: left;
	margin-right: -100%;
	opacity: 0;
	overflow: hidden;
	pointer-events: none;
	position: relative;
	-webkit-transition: opacity .5s;
	transition: opacity .5s;
	width: 100%
}

.gallery__item:first-of-type, .gallery__control-operator:nth-of-type(1):target ~ .gallery__item:nth-of-type(1),.gallery__control-operator:nth-of-type(1).is-targeted ~ .gallery__item:nth-of-type(1),.gallery__control-operator:nth-of-type(2):target ~ .gallery__item:nth-of-type(2),.gallery__control-operator:nth-of-type(2).is-targeted ~ .gallery__item:nth-of-type(2),.gallery__control-operator:nth-of-type(3):target ~ .gallery__item:nth-of-type(3),.gallery__control-operator:nth-of-type(3).is-targeted ~ .gallery__item:nth-of-type(3),.gallery__control-operator:nth-of-type(4):target ~ .gallery__item:nth-of-type(4),.gallery__control-operator:nth-of-type(4).is-targeted ~ .gallery__item:nth-of-type(4),.gallery__control-operator:nth-of-type(5):target ~ .gallery__item:nth-of-type(5),.gallery__control-operator:nth-of-type(5).is-targeted ~ .gallery__item:nth-of-type(5) {
	opacity: 1;
	pointer-events: auto
}

.gallery__control-operator:target ~ .gallery__item, .gallery__control-operator.is-targeted ~ .gallery__item {
	opacity: 0;
	pointer-events: none
}

.gallery__controls {
	bottom: 0;
	position: absolute;
	text-align: center;
	width: 100%
}

.gallery__control-button {
	background: #616c74;
	border-radius: 50%;
	box-shadow: 0 0 0 2px #2d3138;
	display: inline-block;
	height: 0.625rem;
	line-height: 1;
	overflow: hidden;
	margin: 0 0.5rem;
	-webkit-tap-highlight-color: transparent;
	text-indent: 100%;
	width: 0.625rem
}

.gallery__control-button:hover, .gallery__control-button:focus {
	background: #bec4c7
}

.gallery__control-button:first-of-type, .gallery__control-operator:nth-of-type(1):target ~ .gallery__controls .gallery__control-button:nth-of-type(1),.gallery__control-operator:nth-of-type(1).is-targeted ~ .gallery__controls .gallery__control-button:nth-of-type(1),.gallery__control-operator:nth-of-type(2):target ~ .gallery__controls .gallery__control-button:nth-of-type(2),.gallery__control-operator:nth-of-type(2).is-targeted ~ .gallery__controls .gallery__control-button:nth-of-type(2),.gallery__control-operator:nth-of-type(3):target ~ .gallery__controls .gallery__control-button:nth-of-type(3),.gallery__control-operator:nth-of-type(3).is-targeted ~ .gallery__controls .gallery__control-button:nth-of-type(3),.gallery__control-operator:nth-of-type(4):target ~ .gallery__controls .gallery__control-button:nth-of-type(4),.gallery__control-operator:nth-of-type(4).is-targeted ~ .gallery__controls .gallery__control-button:nth-of-type(4),.gallery__control-operator:nth-of-type(5):target ~ .gallery__controls .gallery__control-button:nth-of-type(5),.gallery__control-operator:nth-of-type(5).is-targeted ~ .gallery__controls .gallery__control-button:nth-of-type(5) {
	background: #2d3138;
	box-shadow: 0 0 0 2px #616c74
}

.gallery__control-operator:target ~ .gallery__controls .gallery__control-button, .gallery__control-operator.is-targeted ~ .gallery__controls .gallery__control-button {
	background: #616c74;
	box-shadow: 0 0 0 2px #2d3138
}

.intro {
	border-top: 3px solid #b79157
}
	
	@media (min-width: 48.0625em) {
	.intro {
		padding: 2.25rem 0 3rem
	}
}.intro__title {
	margin-bottom: 1rem;
	text-transform: uppercase
}
	
	@media (min-width: 30.0625em) {
	.intro__title {
		margin-bottom: 1.5rem
	}
}.intro .page-header__title, .intro .referrals-footer__title, .intro .page-header__subtitle {
	visibility: hidden
}
	
	@media (min-width: 48.0625em) {
	.intro__work {
		padding-right: 2rem
	}
}@media (min-width: 60em) {
	.intro__work {
		padding-right: 5.25rem
	}
}.intro__work__img {
	float: left;
	overflow: hidden;
	padding: 1.5rem;
	text-align: center;
	width: 5.8125rem
}
	
	@media (min-width: 30.0625em) {
	.intro__work__img {
		border-radius: 4px;
		padding: 2.25rem;
		width: 8.3125rem
	}
}@media (min-width: 48.0625em) {
	.intro__work__img {
		width: 9.375rem
	}
}.intro__work__content {
	clear: both
}
	
	@media (min-width: 48.0625em) {
	.intro__work__content {
		clear: none
	}
}.intro__team {
	position: relative
}

.intro__team:after {
	background: #4a5258;
	content: '';
	height: 1px;
	left: 2rem;
	position: absolute;
	right: 0;
	top: 0
}
	
	@media (min-width: 48.0625em) {
	.intro__team:after {
		content: none
	}
}.intro__team__members {
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin-left: -2rem;
	position: relative
}
	
	@media (min-width: 48.0625em) {
	.intro__team__members:after {
		bottom: 2rem;
		background: #4a5258;
		content: '';
		left: 0;
		position: absolute;
		top: 0;
		width: 1px
	}
}.intro__team__member {
	-webkit-align-items: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex: 0 0 100%;
	-moz-box-flex: 0;
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	padding-left: 2rem
}
	
	@media (min-width: 38.75em) {
	.intro__team__member {
		-webkit-flex: 0 0 50%;
		-moz-box-flex: 0;
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		margin-bottom: 2.25rem
	}
}@media (min-width: 48.0625em) {
	.intro__team__member {
		-webkit-flex: 0 0 100%;
		-moz-box-flex: 0;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		margin-bottom: 2rem
	}
}.intro__team__img {
	-webkit-flex-shrink: 0;
	-ms-flex-negative: 0;
	flex-shrink: 0;
	width: 5.8125rem
}
	
	@media (min-width: 38.75em) {
	.intro__team__img {
		width: 4.5rem
	}
}@media (min-width: 48.0625em) {
	.intro__team__img {
		margin-right: 1.3125rem;
		width: 4.5rem
	}
}.intro__team__name {
	font-size: 1em;
	line-height: 1.5;
	margin-bottom: 0.125rem
}
	
	@media (min-width: 26.25em) {
	.intro__team__name {
		font-size: 1.3125em;
		line-height: 1.4285714286
	}
}@media (min-width: 38.75em) {
	.intro__team__name {
		font-size: 1em;
		line-height: 1.5
	}
}@media (min-width: 47.5em) {
	.intro__team__name {
		font-size: 1.3125em;
		line-height: 1.4285714286
	}
}@media (min-width: 48.0625em) {
	.intro__team__name {
		font-size: 1em;
		line-height: 1.5
	}
}@media (min-width: 60em) {
	.intro__team__name {
		font-size: 1.3125em;
		line-height: 1.4285714286
	}
}.intro__team__title {
	margin-bottom: 0.25rem
}

.intro__team__location {
	margin-bottom: 0
}

.portfolio__meta {
	border-top: 1px solid #616c74;
	padding-top: 1.5rem;
	padding-right: 6.75rem;
	position: relative;
	text-align: left
}

.portfolio__meta__role em:after {
	content: "/";
	display: inline-block;
	padding: 0 6px
}

.portfolio__meta__role em:last-child:after {
	content: ""
}

.portfolio__meta__nav {
	position: absolute;
	right: 1rem;
	top: 2rem
}

.portfolio__meta__nav a {
	background: transparent url(https://piovesan.ca/assets/img/nav-arrow-left.svg) 50% 50% no-repeat;
	background-size: 50% auto;
	border: 1px solid #616c74;
	color: transparent;
	color: transparent;
	display: inline-block;
	height: 1.875rem;
	width: 1.875rem
}

.portfolio__meta__nav a:hover, .portfolio__meta__nav a:focus, .portfolio__meta__nav a:active {
	background-color: #393e47;
	border-color: #393e47
}

.portfolio__meta__next {
	background-image: url(https://piovesan.ca/assets/img/nav-arrow-right.svg) !important;
	margin-left: 1rem
}

.portfolio__section {
	padding: 1.5rem 0
}
	
	@media (min-width: 30.0625em) {
	.portfolio__section {
		padding: 3.75rem 0
	}
}@media (min-width: 48.0625em) {
	.portfolio__section {
		padding: 5.25rem 0
	}
}.portfolio__section:last-child {
	margin-bottom: 0
}

.portfolio__section--white {
	border-top: 1px solid #d1d5d7;
	border-bottom: 1px solid #d1d5d7
}

.portfolio__section--fade {
	background: -webkit-linear-gradient(#fff, rgba(255,255,255,0));
	background: linear-gradient(#fff, rgba(255,255,255,0));
	border-top: 1px solid #d1d5d7
}

.portfolio__section--flush-top {
	padding-top: 0
}

.portfolio__section--flush-bottom {
	padding-bottom: 0
}

.portfolio__section--style-guide {
	position: relative
}

.portfolio__section--style-guide:before {
	background-image: url(https://piovesan.ca/assetsimg/portfolio/ou/style-bg.jpg);
	background-position: 0 0;
	background-repeat: no-repeat;
	background-size: cover;
	bottom: 0;
	content: '';
	left: 75%;
	position: absolute;
	right: 0;
	top: 5.25rem
}
	
	@media (min-width: 75em) {
	.portfolio__section--style-guide:before {
		left: 66.6666%
	}
}.style-guide__container {
	padding-right: 33.3333%;
	position: relative
}

.style-guide__img--palette {
	width: 75%
}
	
	@media (min-width: 48.0625em) {
	.style-guide__img--body {
		width: 80%
	}
	
	.style-guide__img--palette {
		width: 50%
	}
}.portfolio__device {
	height: 0;
	position: relative
}

.portfolio__device:after {
	background-position: 50% 0;
	background-repeat: no-repeat;
	background-size: 100% auto;
	bottom: 0;
	content: '';
	left: 50%;
	position: absolute;
	top: 0;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%)
}

.portfolio__device__mockup {
	background: #000;
	overflow: hidden;
	position: absolute
}

.portfolio__device--imac {
	margin-bottom: 1.5rem;
	padding-bottom: 82.791586998%
}
	
	@media (min-width: 30.0625em) {
	.portfolio__device--imac {
		margin-bottom: 3rem
	}
}@media (min-width: 48.0625em) {
	.portfolio__device--imac {
		margin-bottom: 4.5rem
	}
}.portfolio__device--imac:after {
	background-image: url(https://piovesan.ca/assets/img/device-imac.png);
	margin-left: -1px;
	width: 129.06309751%
}

.portfolio__device--imac .portfolio__device__mockup {
	bottom: 23.55658%;
	left: 2.77247%;
	right: 2.77247%;
	top: 3.34873%;
	padding: 1.912045889%
}

.portfolio__device--macbook {
	margin-bottom: 1.5rem;
	padding-bottom: 74.0952381%;
	z-index: 10
}
	
	@media (min-width: 30.0625em) {
	.portfolio__device--macbook {
		margin-bottom: 3rem
	}
}@media (min-width: 48.0625em) {
	.portfolio__device--macbook {
		margin-bottom: 4.5rem
	}
}.portfolio__device--macbook:after {
	background-image: url(https://piovesan.ca/assets/img/device-macbook.png);
	width: 122.85714286%
}

.portfolio__device--macbook .portfolio__device__mockup {
	bottom: 13.06018%;
	left: 1.52381%;
	right: 1.52381%;
	top: 3.07298%;
	padding: 1.904761905%
}

.portfolio__device--iphone {
	margin-bottom: 0;
	padding-bottom: 234.35013263%
}

.portfolio__device--iphone:after {
	background-image: url(https://piovesan.ca/assets/img/device-iphone-white.png);
	margin-left: 1.326259947%;
	width: 134.8806366%
}

.portfolio__device--iphone .portfolio__device__mockup {
	background: #252527;
	bottom: 21.16582%;
	left: 4.77454%;
	right: 5.03979%;
	top: 12.33729%;
	padding: 2.652519894%
}

.portfolio__device--iphone--gold:after {
	background-image: url(https://piovesan.ca/assets/img/device-iphone-gold.png)
}

.portfolio__device--flush-bottom {
	margin-bottom: 0
}

.portfolio__loupe {
	left: 50%;
	position: absolute;
	top: 50%;
	width: 261px
}
	
	@media (max-width: 50em) {
	.portfolio__loupe {
		width: 32.625%
	}
}.portfolio__loupe__container {
	position: relative
}

.portfolio__loupe:after {
	background: url(https://piovesan.ca/assets/img/loupe.png) 50% 0 no-repeat;
	background-size: 100% auto;
	content: '';
	left: 0;
	padding-bottom: 100.76628352%;
	position: absolute;
	top: 0;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100%
}

.portfolio__loupe__mockup {
	overflow: hidden;
	position: absolute;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 91.18773946%
}

.portfolio__browser {
	margin-top: 2.25rem;
	position: relative
}
	
	@media (max-width: 30em) {
	.portfolio__browser {
		margin-top: 1.75rem
	}
}.portfolio__browser:before {
	background: -webkit-linear-gradient(#f9f9f9, #e5e5e5);
	background: linear-gradient(#f9f9f9, #e5e5e5);
	border: 1px solid #d1d5d7;
	border-bottom: none;
	border-radius: 4px 4px 0 0;
	bottom: 100%;
	box-shadow: inset 0 1px 1px #fff;
	content: '';
	height: 2.25rem;
	position: absolute;
	width: 100%
}
	
	@media (max-width: 30em) {
	.portfolio__browser:before {
		height: 1.75rem
	}
}.portfolio__browser:after {
	background: #d1d5d7;
	box-shadow: 0.9375rem 0 0 0 #d1d5d7,1.875rem 0 0 0 #d1d5d7;
	content: '';
	height: 0.625rem;
	left: 1rem;
	margin-top: -1.375rem;
	position: absolute;
	top: 0;
	width: 0.625rem
}
	
	@media (max-width: 30em) {
	.portfolio__browser:after {
		margin-top: -1.125rem
	}
}.portfolio__img {
	margin-bottom: 1rem
}
	
	@media (min-width: 30.0625em) {
	.portfolio__img {
		margin-bottom: 2rem
	}
}.portfolio__img--flush {
	margin-bottom: 0
}
	
	@media (min-width: 48.0625em) and (max-width: 59.9375em) {
	.portfolio__img--full--large {
		margin-left: -2rem;
		max-width: none;
		width: calc(100% + 4rem)
	}
}@media (min-width: 30.0625em) and (max-width: 48em) {
	.portfolio__img--full--medium {
		margin-left: -2rem;
		max-width: none;
		width: calc(100% + 4rem)
	}
}@media (max-width: 30em) {
	.portfolio__img--full--small {
		margin-left: -1rem;
		max-width: none;
		width: calc(100% + 2rem)
	}
}.portfolio__cols {
	margin: 0 -1rem;
	text-align: center
}

.portfolio__cols__item {
	display: inline-block;
	margin: 0 1rem;
	vertical-align: middle
}

.portfolio__cols img {
	box-shadow: 0 1px 3px rgba(0,0,0,0.33);
	display: block;
	width: auto
}

.portfolio__nav {
	border-top: 1px solid #d1d5d7;
	padding: 1.5rem 0 0.5rem
}
	
	@media (min-width: 30.0625em) {
	.portfolio__nav {
		padding: 3.75rem 0 1.5rem
	}
}@media (min-width: 48.0625em) {
	.portfolio__nav {
		padding: 4.5rem 0 4.5rem
	}
}.portfolio__nav__img {
	opacity: .8;
	-webkit-transition: all .1s linear;
	transition: all .1s linear
}
	
	@media (max-width: 30em) {
	.portfolio__nav__img {
		margin-bottom: 0.5rem
	}
}.portfolio__nav__main-title {
	font-size: 1.5em;
	margin: 1.5rem auto 3rem;
	text-align: center
}

.portfolio__nav__title {
	font-size: 1em;
	line-height: 1.3125;
	margin-bottom: 0.1875rem
}

.portfolio__nav__role {
	font-size: 0.8125em;
	line-height: 1.2727272727
}
	
	@media (max-width: 30em) {
	.portfolio__nav__grid {
		margin-left: -1rem;
		margin-bottom: 4.5rem
	}
}.portfolio__nav__item {
	margin-bottom: 2rem;
	text-align: center
}
	
	@media (max-width: 30em) {
	.portfolio__nav__item {
		margin-bottom: 1rem;
		padding-left: 1rem
	}
}.portfolio__nav__item:hover .portfolio__nav__img, .portfolio__nav__item:focus .portfolio__nav__img, .portfolio__nav__item:active .portfolio__nav__img {
	box-shadow: 0 0 3px rgba(0,0,0,0.5);
	opacity: 1;
	-webkit-transition: all .1s linear;
	transition: all .1s linear
}

.portfolio__nav__item.is-active {
	cursor: default;
	opacity: .3;
}

.portfolio__nav__item.is-active .portfolio__nav__img {
	opacity: 1
}

.referrals {
	padding-bottom: 1rem;
	text-align: center
}
	
	@media (min-width: 30.0625em) {
	.referrals {
		padding-bottom: 0rem
	}
}@media (min-width: 48.0625em) {
	.referrals {
		padding-bottom: 0.25rem
	}
}.referrals__list {
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}

.referrals__item {
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	margin-bottom: 1rem
}
	
	@media (min-width: 30.0625em) {
	.referrals__item {
		margin-bottom: 2rem
	}
}.referral {
	-webkit-align-items: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	text-align: left;
	width: 100%
}

.referral__img {
	-webkit-flex: 0 0 38%;
	-moz-box-flex: 0;
	-ms-flex: 0 0 38%;
	flex: 0 0 38%;
	margin-right: 1rem
}

.referral__name {
	display: inline-block;
	line-height: 1.125
}

.referral__expertise {
	display: block;
	line-height: 1.125;
	margin-bottom: 0.5rem
}

.referral__link, .referral__twitter {
	display: block
}
	
	@media (min-width: 30.0625em) {
	.referral {
		display: inline-block
	}
	
	.referral__img {
		margin: 0 0 0.5rem
	}
	
	.referral__name {
		font-size: 0.875em
	}
	
	.referral__expertise {
		display: inline;
		font-size: 0.875em
	}
}@media (min-width: 41.25em) {
	.referral {
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex
	}
	
	.referral__img {
		margin: 0 1rem 0 0
	}
	
	.referral__name {
		font-size: 1em
	}
	
	.referral__expertise {
		display: block;
		font-size: 1em
	}
}@media (min-width: 48.0625em) {
	.referral {
		display: inline-block
	}
	
	.referral__img {
		margin: 0 0 0.5rem
	}
	
	.referral__name {
		font-size: 0.875em
	}
	
	.referral__expertise {
		display: inline;
		font-size: 0.875em
	}
}.referrals-footer {
	padding-bottom: 3rem;
	text-align: center
}
	
	@media (min-width: 30.0625em) {
	.referrals-footer {
		padding-bottom: 3.75rem
	}
}@media (min-width: 30.0625em) {
	.referrals-footer__title {
		margin-bottom: 2.25rem
	}
}@media (min-width: 48.0625em) {
	.referrals-footer__title {
		margin-bottom: 3rem
	}
}.referrals-footer__content {
	margin: 0 auto 2rem
}
	
	@media (min-width: 30.0625em) {
	.referrals-footer__content {
		margin-bottom: 2.25rem;
		max-width: 28.57143em
	}
}@media (min-width: 48.0625em) {
	.referrals-footer__content {
		margin-bottom: 3rem
	}
}.referrals-footer__img {
	width: 51px
}
	
	@media (min-width: 30.0625em) {
	.referrals-footer__img {
		width: auto
	}
}.team__container {
	border-top: 1px solid #3f434b;
	border-bottom: 1px solid #3f434b
}
	
	@media (min-width: 30.0625em) {
	.team__container {
		padding: 4.5rem 0
	}
}.team__member {
	position: relative;
	text-align: center
}

.team__member:last-child {
	margin-bottom: 0
}
	
	@media (min-width: 30.0625em) {
	.team__member {
		text-align: left
	}
}@media (min-width: 48.0625em) {
	.team__member {
		margin-bottom: 0
	}
}@media (min-width: 30.0625em) {
	.team__img {
		float: left;
		margin-right: 2rem;
		width: 150px
	}
}.team__content {
	overflow: hidden
}

.team__name {
	font-size: 1.625em;
	line-height: 1.2307692308
}
	
	@media (min-width: 30.0625em) {
	.team__name {
		font-size: 1.5em;
		line-height: 1.25
	}
}@media (min-width: 30.0625em) {
	.team__social {
		left: 2rem;
		position: absolute;
		top: 212px
	}
	
	.team__social a {
		display: block;
		margin: 0 0 0.5rem
	}
}.team__details {
	text-align: left
}
	
	@media (min-width: 30.0625em) {
	.team__details p {
		margin-bottom: 1rem
	}
}.values {
	text-align: center
}

.values__list {
	margin-left: -5.25rem
}

.values__item {
	padding-left: 5.25rem
}

.values__item--wrap {
	position: relative;
	padding-bottom: 40%;
	height: 0;
	overflow: hidden
}
	
	@media (min-width: 48.0625em) {
	.values__item--wrap {
		padding-bottom: 60%
	}
}.values__img {
	margin: 0 auto 1rem;
	width: auto;
	position: absolute;
	top: 0;
	left: 15%;
	width: 70%
}
	
	@media (min-width: 48.0625em) {
	.values__img {
		width: 100%;
		left: 0
	}
}.values__title {
	font-size: 1.875em;
	line-height: 1.2
}

.values__description {
	margin: 0 auto;
	max-width: 28em
}

.endorsements {
	padding: 2.25rem 0 1.5rem;
	position: relative;
	text-align: center
}

.endorsements:after {
	height: 0;
	width: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 0.5625rem;
	border-top-color: #f9f9f9;
	content: "";
	left: 50%;
	margin-left: -0.5625rem;
	pointer-events: none;
	position: absolute;
	top: 0
}
	
	@media (min-width: 30.0625em) {
	.endorsements {
		padding: 4.5rem 0 2rem
	}
	
	.endorsements:after {
		height: 0;
		width: 0;
		border-color: transparent;
		border-style: solid;
		border-width: 1.125rem;
		border-top-color: #f9f9f9;
		margin-left: -1.125rem
	}
}.endorsement {
	border: none;
	margin: 0;
	padding-left: 0
}

.endorsement cite {
	display: block;
	margin-top: 1.5rem
}

.endorsement cite:before {
	content: none
}

.jobs {
	text-align: center
}
	
	@media (min-width: 30.0625em) {
	.jobs {
		padding: 3.75rem 0
	}
}