	html
{
	color:#000;
	background:#fff
}
	body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,select,p,blockquote,th,td
{
	margin:0;
	padding:0
}
	table
{
	border-collapse:collapse;
	border-spacing:0
}
	fieldset,img
{
	border:0
}
	address,button,caption,cite,code,dfn,em,input,optgroup,option,select,strong,textarea,th,var
{
	font:inherit
}
	del,ins
{
	text-decoration:none
}
	li
{
	list-style:none
}
	caption,th
{
	text-align:left
}
	h1,h2,h3,h4,h5,h6
{
	font-size:100%;
	font-weight:normal
}
	q:before,q:after
{
	content:''
}
	abbr,acronym
{
	border:0;
	font-variant:normal
}
	sup
{
	vertical-align:baseline
}
	sub
{
	vertical-align:baseline
}
	legend
{
	color:#000
}
.column
{
	float:left
}
.group
{
	float:left;
	*zoom:1
}
.group:after
{
	content:"";
	display:table;
	clear:both
}
.guide
{
	position:absolute;
	z-index:999999;
	height:1000px;
	width:100%
}
	@media only screen and (min-width:960px)
{
.guide
{
	background:-webkit-linear-gradient(left,#f00 1%,rgba(255,0,0,0.2) 1%,rgba(255,0,0,0.2) 11.799999999999999%,transparent 11.799999999999999%,transparent 89.2%,rgba(255,0,0,0.2) 89.2%);
	background-size:8.333333333333334%
}

}
	@media only screen and (min-width:768px) and (max-width:959px)
{
.guide
{
	background:-webkit-linear-gradient(left,#f00 1%,rgba(255,0,0,0.2) 1%,rgba(255,0,0,0.2) 6.3999999999999995%,transparent 6.3999999999999995%,transparent 94.6%,rgba(255,0,0,0.2) 94.6%);
	background-size:16.666666666666668%
}

}
	@media only screen and (max-width:767px)
{
.guide
{
	background:-webkit-linear-gradient(left,#f00 1%,rgba(255,0,0,0.2) 1%,rgba(255,0,0,0.2) 2.8%,transparent 2.8%,transparent 98.2%,rgba(255,0,0,0.2) 98.2%);
	background-size:50%
}

}
.icon
{
	font-size:23px
}
.icon:before
{
	display:block;
	content:attr(data-icon);
	font-family:"teehanlaxregular"
}
.icon span
{
	display:none
}
.gpu
{
	-webkit-transform:translateZ(0);
	-moz-transform:translateZ(0);
	-o-transform:translateZ(0);
	transform:translateZ(0)
}
.vertical-center
{
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:box;
	-webkit-box-orient:vertical;
	-moz-box-orient:vertical;
	-ms-box-orient:vertical;
	box-orient:vertical;
	-webkit-box-pack:center;
	-moz-box-pack:center;
	-ms-box-pack:center;
	box-pack:center
}
.clearfix
{
	*zoom:1
}
.clearfix:before,.clearfix:after
{
	display:table;
	content:"";
	line-height:0
}
.clearfix:after
{
	clear:both
}
	@font-face
{
	font-family:'teehanlaxregular';
	src:url('/resources/fonts/teehanlax-webfont-v2.eot');
	src:url('/resources/fonts/teehanlax-webfont-v2.eot?#iefix') format('embedded-opentype'),url('/resources/fonts/teehanlax-webfont-v2.woff') format('woff'),url('/resources/fonts/teehanlax-webfont-v2.ttf') format('truetype'),url('/resources/fonts/teehanlax-webfont-v2.svg#teehanlaxregular') format('svg');
	font-weight:normal;
	font-style:normal
}
	@font-face
{
	font-family:'sheltermeregular';
	src:url('/resources/fonts/shelter-me-webfont.eot');
	src:url('/resources/fonts/shelter-me-webfont.eot?#iefix') format('embedded-opentype'),url('/resources/fonts/shelter-me-webfont.woff') format('woff'),url('/resources/fonts/shelter-me-webfont.ttf') format('truetype'),url('/resources/fonts/shelter-me-webfont.svg#shelter_meregular') format('svg');
	font-weight:normal;
	font-style:normal
}
	@font-face
{
	font-family:'nanumpenscript';
	src:url('/resources/fonts/nanumpenscriptregular.eot');
	src:url('/resources/fonts/nanumpenscriptregular.eot?#iefix') format('embedded-opentype'),url('/resources/fonts/nanumpenscriptregular.woff') format('woff'),url('/resources/fonts/nanumpenscriptregular.ttf') format('truetype'),url('/resources/fonts/nanumpenscriptregular.svg#nanumpenscriptregular') format('svg');
	font-weight:normal;
	font-style:normal
}
	html.wf-loading .wf,html.wf-loading h5,html.wf-loading h6,html.wf-loading p,html.wf-loading li,html.wf-loading blockquote,html.wf-loading .button
{
	visibility:hidden
}
	body
{
	text-rendering:optimizeLegibility;
	-webkit-font-smoothing:antialiased
}
.tl-site h1
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:79px;
	line-height:82px;
	font-weight:700;
	letter-spacing:-0.04em;
	margin-bottom:75px
}
.tl-site h2
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:66px;
	line-height:73px;
	font-weight:700;
	letter-spacing:-0.04em;
	margin:130px 0 65px
}
.tl-site h3
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:28px;
	line-height:32px;
	font-weight:700;
	letter-spacing:-0.05em;
	margin:60px 0 40px
}
.tl-site h4
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:24px;
	line-height:29px;
	font-weight:700;
	letter-spacing:-0.05em;
	margin:30px 0 20px
}
.tl-site h4.list-title
{
	margin-bottom:-25px
}
.tl-site h5
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:13px;
	line-height:23px;
	letter-spacing:.1em;
	margin-top:85px;
	text-transform:uppercase
}
.tl-site h6
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:13px;
	line-height:13px;
	letter-spacing:.2em;
	text-transform:uppercase
}
	p
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:26px;
	line-height:39px;
	font-weight:400;
	margin-bottom:40px
}
	p.italic
{
	font-style:italic
}
	strong
{
	font-weight:700
}
	em
{
	font-style:italic
}
	ol,ul.checklist
{
	border-top:1px solid #c5c9c9;
	margin:50px 0 80px
}
	ol li,ul.checklist li
{
	border-bottom:1px solid #c5c9c9;
	padding:20px 20px 20px 75px;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:24px;
	line-height:30px;
	color:#323232
}
	ol
{
	counter-reset:ordered-list
}
	ol li:before
{
	content:counter(ordered-list);
	counter-increment:ordered-list;
	display:block;
	margin-left:-83px;
	padding:0 30px;
	float:left;
	color:#03a2ca;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-weight:700;
	font-size:28px
}
	ul.checklist li:before
{
	content:"O";
	display:block;
	margin-left:-83px;
	padding:0 30px;
	float:left;
	color:#03a2ca;
	font-family:"teehanlaxregular";
	font-size:23px;
	line-height:24px
}
	ul.normal
{
	margin-bottom:40px
}
	ul.normal li
{
	list-style-type:none;
	background:url('/resources/img/ui/bullet.png') no-repeat left 13px;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:26px;
	line-height:39px;
	margin-bottom:15px;
	padding-left:30px
}
	dt
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:26px;
	font-weight:700;
	line-height:39px;
	margin-bottom:5px
}
	dd
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:26px;
	line-height:39px;
	margin-bottom:50px
}
	a
{
	color:#3ea5ce;
	text-decoration:none;
	-webkit-transition:color .2s;
	-moz-transition:color .2s;
	-o-transition:color .2s;
	transition:color .2s
}
	a:hover
{
	color:#279
}
	blockquote
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:92px;
	line-height:98px;
	text-align:center;
	margin:100px 0 150px;
	letter-spacing:-0.02em
}
	small
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:16px;
	margin-bottom:40px;
	display:block
}
	sup
{
	position:relative;
	font-size:.5em;
	top:-0.8em
}
.dl-button
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:17px;
	font-weight:400;
	color:#0a95b5;
	padding:17px 21px 14px;
	background:#fff;
	border:0;
	-webkit-border-radius:9px;
	-moz-border-radius:9px;
	border-radius:9px;
	text-decoration:none;
	white-space:nowrap;
	margin-right:5px;
	-webkit-transition:background .4s;
	-moz-transition:background .4s;
	-o-transition:background .4s;
	transition:background .4s
}
.dl-button:hover
{
	color:#0a95b5;
	background:#aad4dd
}
.dl-button span

{
	font-family:"teehanlaxregular";
	font-size:23px;
	vertical-align:middle;
	margin:5px 5px 0 -5px;
	height:24px
}
.button
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:17px;
	font-weight:400;
	color:#fff;
	padding:15px 21px;
	border:1px solid rgba(255,255,255,0.4);
	background:transparent;
	-webkit-border-radius:9px;
	-moz-border-radius:9px;
	border-radius:9px;
	text-decoration:none;
	white-space:nowrap;
	-webkit-transition:border-color .4s;
	-moz-transition:border-color .4s;
	-o-transition:border-color .4s;
	transition:border-color .4s
}
.button:hover
{
	color:#fff;
	border-color:#fff
}
	@media all and (max-width:1000px) and (min-width:500px)
{
.tl-site h1
{
	font-size:60px;
	line-height:66px;
	margin-bottom:75px
}
.tl-site h2
{
	font-size:50px;
	line-height:57px;
	margin-bottom:45px
}
	p
{
	font-size:23px;
	line-height:34px;
	margin-bottom:40px
}
	dt
{
	font-size:23px;
	line-height:34px;
	margin-bottom:5px
}
	dd
{
	font-size:23px;
	line-height:34px;
	margin-bottom:40px
}
	blockquote
{
	font-size:60px;
	line-height:67px;
	margin:75px 0 125px
}

}
	@media all and (max-width:500px) and (min-width:0)
{
.tl-site h1
{
	font-size:38px;
	line-height:42px;
	margin-bottom:48px
}
.tl-site h2
{
	font-size:31px;
	line-height:35px;
	margin:5px 0 30px
}
.tl-site h3
{
	font-size:25px;
	line-height:28px;
	margin:60px 0 25px
}
.tl-site h4
{
	font-size:20px;
	line-height:24px
}
.tl-site h5
{
	font-size:11px;
	margin-top:40px
}
.tl-site h6
{
	font-size:12px
}
	p
{
	font-size:19px;
	line-height:29px;
	margin-bottom:30px
}
	dt
{
	font-size:19px;
	line-height:29px;
	margin-bottom:5px
}
	dd
{
	font-size:19px;
	line-height:29px;
	margin-bottom:30px
}
	ul.normal li
{
	font-size:19px;
	line-height:29px
}
	ul.checklist
{
	margin-bottom:65px
}
	ul.checklist li
{
	font-size:20px;
	line-height:26px;
	padding:10px 10px 10px 42px
}
	ul.checklist li:before
{
	font-size:15px;
	margin-left:-42px;
	padding:0 10px
}
	ol.checklist
{
	margin-bottom:65px
}
	ol.checklist li
{
	font-size:20px;
	line-height:26px;
	padding:10px 10px 10px 65px
}
	ol.checklist li:before
{
	font-size:20px;
	margin-left:-56px;
	padding:0 10px
}
	blockquote
{
	font-size:37px;
	line-height:42px;
	margin:50px 0 75px
}
.button
{
	font-size:15px;
	color:#fff;
	padding:14px 17px;
	-webkit-border-radius:7px;
	-moz-border-radius:7px;
	border-radius:7px
}
.dl-button span
{
	margin:-2px 5px -4px -5px
}

}
	body
{
	height:100%
}
.content
{
	max-width:1000px;
	margin:0 auto
}
	#page-container,.page-content
{
	height:100%
}
.copy-width
{
	float:left;
	width:81.53333333333335%;
	margin:0 .8999999999999999%;
	margin-left:9.233333333333334%;
	clear:left;
	float:none
}
.site-width
{
	*zoom:1;
	max-width:1000px;
	width:90%;
	margin:0 auto;
	clear:left
}
.site-width:before,.site-width:after
{
	display:table;
	content:"";
	line-height:0
}
.site-width:after
{
	clear:both
}
.debug
{
	display:none;
	position:absolute;
	top:0;
	left:0;
	z-index:3;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:11px;
	color:#666
}
	@media all and (max-width:1000px) and (min-width:500px)
{
.copy-width
{
	width:100%;
	margin-left:0
}
.site-width
{
	width:80%
}

}
	@media all and (max-width:500px) and (min-width:0)
{
.copy-width
{
	width:100%;
	margin-left:0
}
.site-width
{
	width:85%
}

}
.blog-nav #main-nav.detached
{
	position:relative
}
.blog-nav #main-nav
{
	margin:0 auto
}
.blog-nav #main-nav-drop
{
	margin-top:0
}
.blog-nav .site-width
{
	width:90%
}
	#main-nav
{
	position:absolute;
	top:0;
	left:0;
	z-index:900;
	width:100%;
	-webkit-transform:translate(0,0);
	-moz-transform:translate(0,0);
	-ms-transform:translate(0,0);
	-o-transform:translate(0,0);
	transform:translate(0,0);
	-webkit-transition:-webkit-transform .5s .5s,background .5s,color .1s;
	-moz-transition:-moz-transform .5s .5s,background .5s,color .1s;
	-o-transition:-o-transform .5s .5s,background .5s,color .1s;
	transition:transform .5s .5s,background .5s,color .1s;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	-o-user-select:none;
	user-select:none
}
	#main-nav.detached,#main-nav.solid-nav
{
	position:fixed;
	background:#fff;
	color:#299bc9;
	-webkit-transition:-webkit-transform .1s,background .1s,color .1s;
	-moz-transition:-moz-transform .1s,background .1s,color .1s;
	-o-transition:-o-transform .1s,background .1s,color .1s;
	transition:transform .1s,background .1s,color .1s
}
	#main-nav.detached .logo,#main-nav.solid-nav .logo,#main-nav.detached .hamburger,#main-nav.solid-nav .hamburger,#main-nav.detached .menu,#main-nav.solid-nav .menu
{
	color:#3ea5ce
}
	#main-nav.detached:hover,#main-nav.solid-nav:hover
{
	background:#fff
}
	#main-nav.visible
{
	opacity:1;
	-webkit-transform:translate(0,0);
	-moz-transform:translate(0,0);
	-ms-transform:translate(0,0);
	-o-transform:translate(0,0);
	transform:translate(0,0);
	-webkit-transition:-webkit-transform .2s,background .3s,color .3s;
	-moz-transition:-moz-transform .2s,background .3s,color .3s;
	-o-transition:-o-transform .2s,background .3s,color .3s;
	transition:transform .2s,background .3s,color .3s
}
	#main-nav.hidden
{
	opacity:0;
	-webkit-transform:translate(0,-60px);
	-moz-transform:translate(0,-60px);
	-ms-transform:translate(0,-60px);
	-o-transform:translate(0,-60px);
	transform:translate(0,-60px);
	-webkit-transition:-webkit-transform .2s,background .3s,color .3s,opacity 0 .3s;
	-moz-transition:-moz-transform .2s,background .3s,color .3s,opacity 0 .3s;
	-o-transition:-o-transform .2s,background .3s,color .3s,opacity 0 .3s;
	transition:transform .2s,background .3s,color .3s,opacity 0 .3s
}
	#main-nav.off-screen
{
	-webkit-transform:translate(0,-60px);
	-moz-transform:translate(0,-60px);
	-ms-transform:translate(0,-60px);
	-o-transform:translate(0,-60px);
	transform:translate(0,-60px)
}
	#main-nav:hover
{
	background:rgba(255,255,255,0.2);
	cursor:pointer
}
	#main-nav .content
{
	*zoom:1;
	padding:18px 0;
	box-sizing:border-box
}
	#main-nav .content:before,#main-nav .content:after
{
	display:table;
	content:"";
	line-height:0
}
	#main-nav .content:after
{
	clear:both
}
	#main-nav .site-width
{
	position:relative
}
	#main-nav .logo
{
	display:inline-block;
	font-weight:400;
	color:#fff;
	text-decoration:none
}
	#main-nav .hamburger
{
	position:absolute;
	margin-top:19px;
	top:0;
	right:0;
	color:#fff
}
	#main-nav .menu
{
	position:absolute;
	top:24px;
	right:36px;
	color:#fff;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-weight:bold;
	font-size:13px;
	text-transform:uppercase
}
	#main-nav-drop
{
	position:fixed;
	opacity:0;
	z-index:800;
	height:100%;
	width:100%;
	-webkit-transform:translate(0,-127%);
	-moz-transform:translate(0,-127%);
	-ms-transform:translate(0,-127%);
	-o-transform:translate(0,-127%);
	transform:translate(0,-127%);
	margin-top:60px;
	background-color:#f4fafc;
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position:center center;
	-webkit-transition:-webkit-transform .5s,opacity 0 .6s;
	-moz-transition:-moz-transform .5s,opacity 0 .6s;
	-o-transition:-o-transform .5s,opacity 0 .6s;
	transition:transform .5s,opacity 0 .6s;
	overflow-y:scroll;
	padding-right:100px
}
	#main-nav-drop a
{
	-webkit-transition:color .2s;
	-moz-transition:color .2s;
	-o-transition:color .2s;
	transition:color .2s
}
	#main-nav-drop.shipwire
{
	background-image:url(/resources/img/ui/nav-bg/shipwire.jpg)
}
	#main-nav-drop.readability
{
	background-image:url(/resources/img/ui/nav-bg/readability.jpg)
}
	#main-nav-drop.globe
{
	background-image:url(/resources/img/ui/nav-bg/globe.jpg)
}
	#main-nav-drop.stackup
{
	background-image:url(/resources/img/ui/nav-bg/stackup.jpg)
}
	#main-nav-drop.teehan-lax
{
	background-image:url(/resources/img/ui/nav-bg/teehan-lax.jpg)
}
	#main-nav-drop.medium
{
	background-image:url(/resources/img/ui/nav-bg/medium.jpg)
}
	#main-nav-drop.social-portrait
{
	background-image:url(/resources/img/ui/nav-bg/social-portrait.jpg)
}
	#main-nav-drop.prismatic
{
	background-image:url(/resources/img/ui/nav-bg/prismatic.jpg)
}
	#main-nav-drop.krush
{
	background-image:url(/resources/img/ui/nav-bg/krush.jpg)
}
	#main-nav-drop .contents
{
	position:relative;
	z-index:801
}
	#main-nav-drop .sections
{
	text-align:center;
	margin-top:65px
}
	#main-nav-drop .sections li
{
	display:inline-block;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	padding:0 30px;
	font-size:20px
}
	#main-nav-drop .sections li a
{
	color:#0b5472;
	font-weight:400;
	text-decoration:none
}
	#main-nav-drop .sections li a:hover
{
	color:#299bc9
}
	#main-nav-drop .sections li:before
{
	content:"â€¢";
	font-size:8px;
	color:#299bc9;
	margin-left:-30px;
	margin-right:30px
}
	#main-nav-drop .sections li:first-child
{
	padding-left:0
}
	#main-nav-drop .sections li:first-child:before
{
	display:none
}
	#main-nav-drop .sections li:last-child
{
	padding-right:0
}
	#main-nav-drop .group-title
{
	width:100%;
	border-top:1px solid #b7dded;
	text-align:center;
	margin-top:80px
}
	#main-nav-drop .group-title h6
{
	display:inline-block;
	position:relative;
	top:-20px;
	border:1px solid #b7dded;
	background:#f4fafc;
	color:#0b5472;
	padding:13px 60px 10px
}
	#main-nav-drop .stories
{
	-webkit-transform:translateZ(0);
	-moz-transform:translateZ(0);
	-o-transform:translateZ(0);
	transform:translateZ(0);
	text-align:center;
	margin-top:50px
}
	#main-nav-drop .stories .nav-item
{
	margin-bottom:100px
}
	#main-nav-drop .stories .nav-item h6
{
	color:#3ea5ce
}
	#main-nav-drop .stories .nav-item a
{
	text-decoration:none
}
	#main-nav-drop .social
{
	text-align:center;
	padding-bottom:100px;
	border-top:1px solid #b7dded;
	padding-top:40px
}
	#main-nav-drop .social li
{
	display:inline-block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:11px;
	font-weight:700;
	padding:0 18px
}
	#main-nav-drop .social a
{
	color:#0b5472;
	text-decoration:none
}
	#main-nav-drop .social a:hover
{
	color:#299bc9
}
	#main-nav-drop .social .icon
{
	display:block;
	font-weight:400;
	margin-bottom:6px
}
.nav-open
{
	overflow:hidden
}
.nav-open #main-nav
{
	position:fixed;
	background:#fff;
	color:#299bc9;
	-webkit-transform:translate(0,0);
	-moz-transform:translate(0,0);
	-ms-transform:translate(0,0);
	-o-transform:translate(0,0);
	transform:translate(0,0);
	opacity:1
}
.nav-open #main-nav .logo,.nav-open #main-nav .hamburger,.nav-open #main-nav .menu
{
	color:#3ea5ce
}
.nav-open #main-nav .hamburger
{
	-webkit-transition:opacity .2s;
	-moz-transition:opacity .2s;
	-o-transition:opacity .2s;
	transition:opacity .2s
}
.nav-open #main-nav .hamburger:before
{
	content:"D"
}
.nav-open #main-nav:hover .hamburger
{
	color:#279
}
.nav-open #main-nav-drop
{
	-webkit-transform:translate(0,0);
	-moz-transform:translate(0,0);
	-ms-transform:translate(0,0);
	-o-transform:translate(0,0);
	transform:translate(0,0);
	opacity:1;
	-webkit-overflow-scrolling:touch;
	-webkit-transition:-webkit-transform .5s,opacity 0;
	-moz-transition:-moz-transform .5s,opacity 0;
	-o-transition:-o-transform .5s,opacity 0;
	transition:transform .5s,opacity 0
}
	@media all and (max-width:1000px) and (min-width:500px)
{
	#main-nav-drop .sections li
{
	font-size:15px;
	padding:0 13px
}
	#main-nav-drop .sections li:before
{
	margin-left:-13px;
	margin-right:13px
}

}
	@media all and (max-width:600px) and (min-width:500px)
{
	#main-nav-drop .sections li
{
	padding:0 9px
}
	#main-nav-drop .sections li:before
{
	margin-left:-9px;
	margin-right:-9px;
	content:none
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#main-nav .content
{
	padding:15px 0
}
	#main-nav .hamburger
{
	margin-top:14px
}
	#main-nav .menu
{
	display:none
}
	#main-nav-drop
{
	margin-top:55px
}
	#main-nav-drop .sections
{
	margin-top:45px
}
	#main-nav-drop .sections li
{
	font-size:15px;
	padding:0 9px
}
	#main-nav-drop .sections li:before
{
	display:none
}
	#main-nav-drop .sections li.mobile
{
	display:none
}
	#main-nav-drop .sections a
{
	background:transparent url('data:image/gif;
	base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==') no-repeat
}
	#main-nav-drop .sections a span
{
	display:none
}
	#main-nav-drop .sections a:before
{
	content:attr(data-short)
}
	#main-nav-drop .group-title
{
	margin-top:50px
}
	#main-nav-drop .group-title h6
{
	font-size:11px
}
	#main-nav-drop .stories
{
	margin-top:25px
}
	#main-nav-drop .stories .nav-item
{
	margin-bottom:65px
}
	#main-nav-drop .social li
{
	display:inline-block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:9px;
	font-weight:700;
	padding:0 7px
}
	#main-nav-drop .social .icon
{
	font-size:20px;
	margin:0 6px 6px
}

}
.error-404
{
	width:100%;
	height:100%;
	background:#000;
	cursor:pointer
}
.error-404 .background
{
	background-repeat:no-repeat;
	background-position:center center;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
	width:100%;
	height:100%;
	opacity:0;
	-webkit-transition:opacity 1.5s;
	-moz-transition:opacity 1.5s;
	-o-transition:opacity 1.5s;
	transition:opacity 1.5s
}
.error-404 .vignette
{
	position:absolute;
	top:10px;
	right:60px;
	z-index:10;
	background-repeat:no-repeat;
	background-position:top center;
	-webkit-background-size:contain;
	-moz-background-size:contain;
	-o-background-size:contain;
	background-size:contain;
	width:30%;
	height:100%;
	opacity:0;
	-webkit-transition:opacity 1.5s;
	-moz-transition:opacity 1.5s;
	-o-transition:opacity 1.5s;
	transition:opacity 1.5s
}
.error-404 .copy
{
	position:absolute;
	left:0;
	bottom:0;
	padding:60px;
	color:#fff
}
.error-404 .copy h1
{
	text-align:left
}
.error-404 .button .icon
{
	display:inline-block;
	font-size:9px;
	line-height:9px;
	margin-right:10px
}
.error-404 .something
{
	opacity:0;
	-webkit-transition:opacity 1s 1.5s;
	-moz-transition:opacity 1s 1.5s;
	-o-transition:opacity 1s 1.5s;
	transition:opacity 1s 1.5s
}
.error-404 .very-1
{
	visibility:hidden;
	-webkit-transition:visibility 0s 2.8s;
	-moz-transition:visibility 0s 2.8s;
	-o-transition:visibility 0s 2.8s;
	transition:visibility 0s 2.8s
}
.error-404 .very-2
{
	visibility:hidden;
	-webkit-transition:visibility 0s 3.4s;
	-moz-transition:visibility 0s 3.4s;
	-o-transition:visibility 0s 3.4s;
	transition:visibility 0s 3.4s
}
.error-404 .very-3
{
	visibility:hidden;
	-webkit-transition:visibility 0s 4s;
	-moz-transition:visibility 0s 4s;
	-o-transition:visibility 0s 4s;
	transition:visibility 0s 4s
}
.error-404.animate .background
{
	opacity:.6
}
.error-404.animate .vignette
{
	opacity:1
}
.error-404.text .something
{
	opacity:1
}
.error-404.text .very-1,.error-404.text .very-2,.error-404.text .very-3
{
	visibility:visible
}
.error-404.andy .background
{
	background-image:url(/resources/img/404/backgrounds/andy.jpg)
}
.error-404.andy .vignette
{
	background-image:url(/resources/img/404/vignettes/andy.png)
}
.error-404.brendan .background
{
	background-image:url(/resources/img/404/backgrounds/brendan.jpg)
}
.error-404.brendan .vignette
{
	background-image:url(/resources/img/404/vignettes/brendan.png)
}
.error-404.erwin .background
{
	background-image:url(/resources/img/404/backgrounds/erwin.jpg)
}
.error-404.erwin .vignette
{
	background-image:url(/resources/img/404/vignettes/erwin.png)
}
.error-404.geoff .background
{
	background-image:url(/resources/img/404/backgrounds/geoff.jpg)
}
.error-404.geoff .vignette
{
	background-image:url(/resources/img/404/vignettes/geoff.png)
}
.error-404.hui .background
{
	background-image:url(/resources/img/404/backgrounds/hui.jpg)
}
.error-404.hui .vignette
{
	background-image:url(/resources/img/404/vignettes/hui.png)
}
.error-404.jonas .background
{
	background-image:url(/resources/img/404/backgrounds/jonas.jpg)
}
.error-404.jonas .vignette
{
	background-image:url(/resources/img/404/vignettes/jonas.png)
}
.error-404.johnk .background
{
	background-image:url(/resources/img/404/backgrounds/johnk.jpg)
}
.error-404.johnk .vignette
{
	background-image:url(/resources/img/404/vignettes/johnk.png)
}
.error-404.lax .background
{
	background-image:url(/resources/img/404/backgrounds/lax.jpg)
}
.error-404.lax .vignette
{
	background-image:url(/resources/img/404/vignettes/lax.png)
}
.error-404.matt .background
{
	background-image:url(/resources/img/404/backgrounds/matt.jpg)
}
.error-404.matt .vignette
{
	background-image:url(/resources/img/404/vignettes/matt.png)
}
.error-404.nels .background
{
	background-image:url(/resources/img/404/backgrounds/nels.jpg)
}
.error-404.nels .vignette
{
	background-image:url(/resources/img/404/vignettes/nels.png)
}
.error-404.paul .background
{
	background-image:url(/resources/img/404/backgrounds/paul.jpg)
}
.error-404.paul .vignette
{
	background-image:url(/resources/img/404/vignettes/paul.png)
}
.error-404.pete .background
{
	background-image:url(/resources/img/404/backgrounds/pete.jpg)
}
.error-404.pete .vignette
{
	background-image:url(/resources/img/404/vignettes/pete.png)
}
.error-404.pierre .background
{
	background-image:url(/resources/img/404/backgrounds/pierre.jpg)
}
.error-404.pierre .vignette
{
	background-image:url(/resources/img/404/vignettes/pierre.png)
}
.error-404.simon .background
{
	background-image:url(/resources/img/404/backgrounds/simon.jpg)
}
.error-404.simon .vignette
{
	background-image:url(/resources/img/404/vignettes/simon.png)
}
.error-404.steph .background
{
	background-image:url(/resources/img/404/backgrounds/steph.jpg)
}
.error-404.steph .vignette
{
	background-image:url(/resources/img/404/vignettes/steph.png)
}
.error-404.steve .background
{
	background-image:url(/resources/img/404/backgrounds/steve.jpg)
}
.error-404.steve .vignette
{
	background-image:url(/resources/img/404/vignettes/steve.png)
}
.error-404.tanner .background
{
	background-image:url(/resources/img/404/backgrounds/tanner.jpg)
}
.error-404.tanner .vignette
{
	background-image:url(/resources/img/404/vignettes/tanner.png)
}
	@media all and (max-width:500px) and (min-width:0)
{
.error-404 .vignette
{
	display:none
}
.error-404 .copy
{
	padding:20px 20px 40px
}
.error-404 .copy h1
{
	font-size:26px;
	line-height:26px;
	margin-bottom:36px
}

}
.story-container
{
	position:relative;
	z-index:200;
	height:100%
}
.story-container a
{
	color:inherit;
	text-decoration:underline;
	font-weight:700
}
.story-container a:hover
{
	text-decoration:none
}
.story-container h1,.story-container h2
{
	text-align:center
}
.story-container section h2
{
	margin:100px 0 65px
}
.story-container span.underline
{
	background:url(/resources/img/ui/text-underline-1.png) no-repeat left 91px
}
.story-container span.underline.alt
{
	background:url(/resources/img/ui/text-underline-2.png) no-repeat left 91px
}
.story-container span.scratched
{
	background:url(/resources/img/ui/text-scratchout-1.png) no-repeat left 31px;
	padding:0 0 6px 6px;
	background-size:236%
}
.story-container .callout
{
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif
}
.story-container .icon.tl-guys
{
	display:block;
	text-align:center;
	font-size:35px;
	margin:100px 0 -80px
}
.story-container .icon.interaction
{
	display:block;
	text-align:center;
	font-size:30px;
	margin:40px 0 40px
}
.story-container .interaction-info
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:16px;
	font-style:italic
}
	@-webkit-keyframes pulser
{
	0%,100%
{
	opacity:.4
}
	50%
{
	opacity:.7
}

}
	@-moz-keyframes pulser
{
	0%,100%
{

	opacity:.4
}
	50%
{
	opacity:.7
}

}
	@-o-keyframes pulser
{
	0%,100%
{
	opacity:.4
}
	50%
{
	opacity:.7
}

}
	@keyframes pulser
{
	0%,100%
{
	opacity:.4
}
	50%
{
	opacity:.7
}

}
.story-container .interaction-wrap
{
	text-align:center
}
.story-container .interaction-wrap .icon.interaction,.story-container .interaction-wrap .interaction-info
{
	display:inline-block;
	vertical-align:middle;
	-webkit-transition:opacity .3s;
	-moz-transition:opacity .3s;
	-o-transition:opacity .3s;
	transition:opacity .3s
}
.story-container .interaction-wrap .icon.interaction
{
	margin:0 10px;
	opacity:.7;
	-webkit-animation:pulser 3s ease infinite;
	-moz-animation:pulser 3s ease infinite;
	-o-animation:pulser 3s ease infinite;
	animation:pulser 3s ease infinite
}
.story-container .interaction-wrap .icon.interaction:hover
{
	opacity:1;
	cursor:pointer;
	-webkit-animation:none;
	-moz-animation:none;
	-o-animation:none;
	animation:none
}
.story-container .interaction-wrap .interaction-info
{
	opacity:0
}
.story-container .interaction-wrap.hover .interaction-info,.story-container .interaction-wrap.hover .icon.interaction
{
	opacity:1;
	-webkit-animation:none;
	-moz-animation:none;
	-o-animation:none;
	animation:none
}
.story-container .story-content
{
	margin:0 auto
}
.story-container .story-content section
{
	padding-bottom:50px
}
.story-container .story-content section.what-we-learned
{
	padding-bottom:130px
}
.story-container .intro
{
	text-align:center
}
.story-container .intro p
{
	text-align:left
}
.story-container .intro .logo
{
	margin:4px 0 50px
}
.story-container .what-we-learned
{
	background:#eee
}
.story-container .what-we-learned .tl-guys
{
	color:#333;
	margin-bottom:20px
}
.story-container .what-we-learned h3
{
	display:block;
	text-align:center;
	color:#333;
	margin:15px 0 -50px
}
.story-container .what-we-learned p
{
	color:#404040
}
.story-container .what-we-learned blockquote
{
	font-size:82px;
	line-height:88px;
	color:#888;
	margin:150px 0 50px
}
.story-container .what-we-learned .employee
{
	text-align:center;
	margin:-20px 0 35px
}
.story-container .what-we-learned .employee span
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:13px;
	color:#b3b3b1;
	margin-top:5px
}
.story-container .what-we-learned .employee strong
{
	font-weight:700
}
.story-container .sharing-tools
{
	text-align:center
}
.story-container .sharing-tools .network
{
	display:inline-block;
	width:100px;
	height:20px;
	-webkit-transition:background-color .5s;
	-moz-transition:background-color .5s;
	-o-transition:background-color .5s;
	transition:background-color .5s;
	cursor:pointer
}
.story-container .sharing-tools div.fb-like
{
	float:left
}
.story-container .sharing-tools .cta
{
	text-align:center;
	margin-top:40px;
	padding-top:60px;
	border-top:1px #ddd solid
}
.story-container .sharing-tools .cta a
{
	color:#3ea5ce;
	text-decoration:none
}
.story-container .sharing-tools .cta a:hover
{
	color:#279
}
	@media all and (max-width:1000px) and (min-width:500px)
{
.story-container .icon.tl-guys
{
	font-size:17px
}
.story-container .story-content
{
	margin:0 auto
}
.story-container .story-content section
{
	padding-bottom:50px
}
.story-container span.underline,.story-container span.underline.alt
{
	padding-bottom:6px;
	background-size:400px 6px;
	background-position:left 80px
}
.story-container span.scratched
{
	background-size:340px 47px;
	background-position:left 28px
}
.story-container .what-we-learned blockquote
{
	font-size:72px;
	line-height:82px
}
.story-container .what-we-learned h3
{
	margin-bottom:-40px
}

}
	@media all and (max-width:500px) and (min-width:0)
{
.story-container section h2
{
	margin:5px 0 30px
}
.story-container .icon.tl-guys
{
	font-size:19px;
	margin:10px 0 10px
}
.story-container .intro .logo
{
	margin-bottom:55px
}
.story-container span.underline,.story-container span.underline.alt
{
	padding-bottom:4px;
	background-size:350px 4px;
	background-position:left 42px
}
.story-container span.scratched
{
	background-size:200px 44px
}
.story-container .story-content section
{
	padding:50px 0 0
}
.story-container .story-content section.what-we-learned
{
	padding-bottom:70px
}
.story-container .story-content section.what-we-learned blockquote
{
	font-size:36px;
	line-height:42px;
	margin:50px 0
}
.story-container .story-content section.what-we-learned h3
{
	margin-bottom:10px
}

}
.story-container
{
	margin-bottom:450px
}
.footer-card
{
	position:fixed;
	bottom:0;
	left:0;
	z-index:100;
	height:450px;
	width:100%;
	text-align:center;
	color:#fff
}
.footer-card h2
{
	margin:60px 0 40px
}
.shipwire-footer
{
	background:#126c85 url(/resources/img/story/shipwire/footer-card-bg.png) no-repeat bottom center
}
.readability-footer
{
	background:#aeaa9f url(/resources/img/story/readability/footer-card-bg.png) no-repeat bottom center
}
.globe-and-mail-footer
{
	background:#b7c9d2 url('/resources/img/story/globe-and-mail/footer-card-bg.jpg') no-repeat bottom center
}
.teehan-lax-footer
{
	background:url('/resources/img/story/teehan-lax/footer-card-bg.png') no-repeat bottom center,url('/resources/img/story/teehan-lax/footer-card-gradient.png') repeat-x bottom left
}
.our-next-act-footer
{
	background:#fff url(/resources/img/story/our-next-act/footer-card-bg.png) no-repeat bottom center;
	color:#0a0a0a
}
.our-next-act-footer h2
{
	font-size:50px
}
.our-next-act-footer p a
{
	margin:0 10px
}
.stackup-footer
{
	background:#fff url(/resources/img/story/stackup/footer-card-bg.png) no-repeat bottom center
}
.stackup-footer h2,.stackup-footer .button
{
	color:#0066a4
}
.stackup-footer .button
{
	border-color:rgba(0,102,164,0.4)
}
.stackup-footer .button:hover
{
	border-color:#0066a4
}
.social-portrait-footer
{
	background:#fff url(/resources/img/story/socialportrait/social-portrait-footer-bg.jpg) no-repeat bottom center
}
.social-portrait-footer h2,.social-portrait-footer .button
{
	color:#0066a4
}
.social-portrait-footer .button
{
	border-color:rgba(0,102,164,0.4)
}
.social-portrait-footer .button:hover
{
	border-color:#0066a4
}
.prismatic-footer
{
	background:#ef4f34 url(/resources/img/story/prismatic/footer-card-bg.jpg) no-repeat bottom center
}
	@media all and (max-width:1000px) and (min-width:500px)
{
.story-container
{
	margin-bottom:0
}
.footer-card
{
	position:static;
	height:350px;
	background-size:70%
}

}
	@media all and (max-width:500px) and (min-width:0)
{
.story-container
{
	margin-bottom:0
}
.footer-card
{
	position:static;
	height:300px;
	background-size:80%
}
.our-next-act-footer h2
{
	font-size:30px;
	margin:40px 0 20px
}
.our-next-act-footer p
{
	font-size:14px;
	line-height:16px
}
.our-next-act-footer p a
{
	margin:5px
}

}
	#story-shipwire .intro
{
	color:#fff;
	background:#126c85;
	padding-top:50px
}
	#story-shipwire .hero-image
{
	max-width:100%;
	margin-top:9%;
	margin-bottom:10%
}
	#story-shipwire .client-intro
{
	background:#eaeeef url(/resources/img/story/shipwire/bg-map.png) no-repeat center center;
	background-attachment:fixed;
	background-size:contain
}
	#story-shipwire .client-intro h2,#story-shipwire .client-intro blockquote,#story-shipwire .client-intro .tl-guys
{
	color:#03a2ca
}
	#story-shipwire .client-intro blockquote
{
	clear:left
}
	#story-shipwire .client-intro p
{
	color:#333
}
	#story-shipwire .summing-up-shipwire
{
	clear:left;
	text-align:center;
	margin:75px 0 90px
}
	#story-shipwire .summing-up-shipwire li
{
	position:relative;
	display:inline-block;
	width:20%;
	padding-top:16%;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-style:italic;
	font-size:15px;
	line-height:18px;
	background-size:contain;
	background-repeat:no-repeat;
	margin-right:10%;
	vertical-align:top;
	margin-bottom:20px
}
	#story-shipwire .summing-up-shipwire li:after
{
	position:absolute;
	right:-35%;
	top:32%;
	content:".";
	text-indent:-1000000px;
	display:block;
	width:17%;
	height:11%;
	background:url(/resources/img/story/shipwire/summing-shipwire-arrow.png) no-repeat left top;
	background-size:contain
}
	#story-shipwire .summing-up-shipwire li:last-child
{
	margin-right:0
}
	#story-shipwire .summing-up-shipwire li:last-child:after
{
	display:none
}
	#story-shipwire .summing-up-shipwire .cart
{
	background-image:url('/resources/img/story/shipwire/summing-shipwire-cart.png')
}
	#story-shipwire .summing-up-shipwire .warehouse
{
	background-image:url('/resources/img/story/shipwire/summing-shipwire-warehouse.png')
}
	#story-shipwire .summing-up-shipwire .customer
{
	background-image:url('/resources/img/story/shipwire/summing-shipwire-customer.png')
}
	#story-shipwire .design-principles
{
	background:#3bad56 url('/resources/img/story/shipwire/principles-desktop.png') no-repeat right center;
	background-attachment:fixed;
	background-size:20%;
	color:#fff
}
	#story-shipwire .design-principles .list
{
	margin:90px 0
}
	#story-shipwire .design-principles .principle
{
	*zoom:1;
	margin-top:30px
}
	#story-shipwire .design-principles .principle:before,#story-shipwire .design-principles .principle:after
{
	display:table;
	content:"";
	line-height:0
}
	#story-shipwire .design-principles .principle:after
{
	clear:both
}
	#story-shipwire .design-principles .principle .number
{
	float:left;
	position:relative;
	width:140px;
	height:120px;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:83px;
	color:#c1e0c7;
	text-align:center;
	line-height:120px
}
	#story-shipwire .design-principles .principle .circle
{
	position:absolute;
	width:140px;
	height:120px;
	opacity:0;
	background:url('/resources/img/story/shipwire/number-circle.png') no-repeat left top
}
	#story-shipwire .design-principles .principle .copy
{
	float:left;
	width:70%;
	margin-left:50px
}
	#story-shipwire .design-principles .principle .copy .title
{
	display:block;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:39px;
	font-weight:700;
	color:#154c22
}
	#story-shipwire .design-principles .principle .copy p
{
	color:#154c22
}
	#story-shipwire .design-principles.animate .circle
{
	opacity:1
}
	#story-shipwire .design-principles.animate .one .circle
{
	-webkit-transition:opacity .7s 0;
	-moz-transition:opacity .7s 0;
	-o-transition:opacity .7s 0;
	transition:opacity .7s 0
}
	#story-shipwire .design-principles.animate .two .circle
{
	-webkit-transition:opacity .7s .7s;
	-moz-transition:opacity .7s .7s;
	-o-transition:opacity .7s .7s;
	transition:opacity .7s .7s
}
	#story-shipwire .design-principles.animate .three .circle
{
	-webkit-transition:opacity .7s 1.4s;
	-moz-transition:opacity .7s 1.4s;
	-o-transition:opacity .7s 1.4s;
	transition:opacity .7s 1.4s
}
	#story-shipwire .design-principles.animate .four .circle
{
	-webkit-transition:opacity .7s 2.1s;
	-moz-transition:opacity .7s 2.1s;
	-o-transition:opacity .7s 2.1s;
	transition:opacity .7s 2.1s
}
	#story-shipwire .deep-dive
{
	background:#283f45 url(/resources/img/story/shipwire/bg-team.jpg) no-repeat center top;
	background-size:100%
}
	#story-shipwire .deep-dive h2,#story-shipwire .deep-dive h4,#story-shipwire .deep-dive ol,#story-shipwire .deep-dive .tl-guys
{
	color:#fff
}
	#story-shipwire .deep-dive blockquote
{
	clear:left;
	color:#81be5e
}
	#story-shipwire .deep-dive p
{
	color:#c3cbcd
}
	#story-shipwire .deep-dive ul
{
	border-top:1px solid #53656a
}
	#story-shipwire .deep-dive ul li
{
	border-bottom:1px solid #53656a;
	color:#fff
}
	#story-shipwire .deep-dive ul li:before
{
	color:#81be5e
}
	#story-shipwire .tandem-work
{
	background:#eaeeef
}
	#story-shipwire .tandem-work h2,#story-shipwire .tandem-work .tl-guys
{
	color:#283f45
}
	#story-shipwire .tandem-work p
{
	color:#333
}
	#story-shipwire .tandem-work .ia-and-design
{
	background:url(/resources/img/story/shipwire/tandem-laptops.jpg) no-repeat top center;
	background-size:cover;
	height:595px;
	max-width:1807px;
	margin:50px auto 130px;
	text-align:center
}
	#story-shipwire .tandem-work .ia-and-design p
{
	background:url(/resources/img/story/shipwire/squiggly-doublearrow.png) no-repeat top center;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	width:250px;
	position:relative;
	display:inline-block;
	margin-top:600px;
	padding:0 140px
}
	#story-shipwire .tandem-work .lightbulb
{
	margin-bottom:-11px
}
	#story-shipwire .tandem-work .first-concept
{
	position:relative;
	margin-bottom:-54px
}
	#story-shipwire .tandem-work .first-concept .scratch
{
	position:absolute;
	left:0;
	top:36%;
	width:100%;
	height:100%;
	overflow:hidden
}
	#story-shipwire .tandem-work .first-concept .scratch img
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	opacity:0
}
	#story-shipwire .tandem-work .first-concept .scratch.animate .scratch-1
{
	opacity:1;
	-webkit-transition:opacity .1s 0;
	-moz-transition:opacity .1s 0;
	-o-transition:opacity .1s 0;
	transition:opacity .1s 0
}
	#story-shipwire .tandem-work .first-concept .scratch.animate .scratch-2
{
	opacity:1;
	-webkit-transition:opacity .2s .1s;
	-moz-transition:opacity .2s .1s;
	-o-transition:opacity .2s .1s;
	transition:opacity .2s .1s
}
	#story-shipwire .tandem-work .first-concept .scratch.animate .scratch-3
{
	opacity:1;
	-webkit-transition:opacity .1s .3s;
	-moz-transition:opacity .1s .3s;
	-o-transition:opacity .1s .3s;
	transition:opacity .1s .3s
}
	#story-shipwire .tandem-work .first-concept .scratch.animate .scratch-4
{
	opacity:1;
	-webkit-transition:opacity .2s .4s;
	-moz-transition:opacity .2s .4s;
	-o-transition:opacity .2s .4s;
	transition:opacity .2s .4s
}
	#story-shipwire .tandem-work .first-concept .scratch.animate .scratch-5
{
	opacity:1;
	-webkit-transition:opacity .1s .6s;
	-moz-transition:opacity .1s .6s;
	-o-transition:opacity .1s .6s;
	transition:opacity .1s .6s
}
	#story-shipwire .tandem-work .first-concept .scratch.animate .scratch-6
{
	opacity:1;
	-webkit-transition:opacity .2s .7s;
	-moz-transition:opacity .2s .7s;
	-o-transition:opacity .2s .7s;
	transition:opacity .2s .7s
}
	#story-shipwire .tandem-work .first-concept .scratch.animate .scratch-7
{
	opacity:1;
	-webkit-transition:opacity .1s .9s;
	-moz-transition:opacity .1s .9s;
	-o-transition:opacity .1s .9s;
	transition:opacity .1s .9s
}
	#story-shipwire .tandem-work .first-concept img
{
	width:100%
}
	#story-shipwire .tandem-work blockquote
{
	color:#81be5e
}
	#story-shipwire .new-approach
{
	background:#283f45
}
	#story-shipwire .new-approach h2,#story-shipwire .new-approach .tl-guys,#story-shipwire .new-approach .interaction-wrap
{
	color:#fff
}
	#story-shipwire .new-approach p,#story-shipwire .new-approach a
{
	color:#c3cbcd
}
	#story-shipwire .new-approach strong
{
	color:#fff
}
	#story-shipwire .new-approach .screen
{
	clear:left
}
	#story-shipwire .shipwire-logo-box
{
	background:url(/resources/img/story/shipwire/logo-i-base.png) no-repeat center;
	max-width:1764px;
	width:100%;
	height:477px;
	margin:45px auto 50px
}
	#story-shipwire .shipwire-logo-box .reveal
{
	text-align:center;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:30px;
	color:#fff;
	opacity:0;
	-webkit-transition:opacity .5s;
	-moz-transition:opacity .5s;
	-o-transition:opacity .5s;
	transition:opacity .5s
}
	#story-shipwire .shipwire-logo-box .reveal img
{
	margin:-55px 0 0 -60px
}
	#story-shipwire .shipwire-logo-box .reveal span
{
	max-width:90%;
	display:block;
	text-align:center
}
	#story-shipwire .shipwire-logo-box.animate .reveal
{
	opacity:1
}
	#story-shipwire .more-than-box
{
	height:311px
}
	#story-shipwire .more-than-box .box
{
	position:absolute;
	left:50%;
	z-index:100;
	margin-left:-229px
}
	#story-shipwire .more-than-box .container
{
	position:relative;
	left:50%;
	overflow:hidden;
	width:4122px;
	margin-left:-2061px
}
	#story-shipwire .more-than-box .item
{
	position:relative;
	float:left;
	width:458px;
	height:311px;
	margin-right:0
}
	#story-shipwire .more-than-box .item img
{
	position:absolute;
	top:0;
	left:0;
	width:100%
}
	#story-shipwire .more-than-box .item .front
{
	z-index:101
}
	#story-shipwire .more-than-box .item .back
{
	z-index:99
}
	#story-shipwire #more-than-box-tagline
{
	display:block;
	text-align:center;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:24px;
	font-weight:bold;
	color:#fff;
	margin-top:30px;
	opacity:1;
	-webkit-transition:opacity .25s;
	-moz-transition:opacity .25s;
	-o-transition:opacity .25s;
	transition:opacity .25s
}
	#story-shipwire #more-than-box-tagline.hide
{
	opacity:0
}
	#story-shipwire .tagline-animation
{
	max-width:745px;
	width:70%;
	margin:40px auto 130px;
	display:block
}
	#story-shipwire .manifesto
{
	margin:50px auto 100px;
	border-top:1px solid #3e5358
}
	#story-shipwire .manifesto .wrapper
{
	height:259px
}
	#story-shipwire .manifesto .container
{
	width:2805px;
	margin-left:-1394px
}
	#story-shipwire .manifesto .title
{
	background:url(/resources/img/story/shipwire/manifesto-banner.png) no-repeat left top;
	width:210px;
	height:50px;
	text-indent:-1000000px;
	margin:-20px auto 25px
}
	#story-shipwire .manifesto .item
{
	width:240px
}
	#story-shipwire #cart-video .interaction
{
	cursor:pointer
}
	@media all and (max-width:1000px) and (min-width:500px)
{
	#story-shipwire .client-intro
{
	background-attachment:scroll
}
	#story-shipwire .design-principles .principle .copy
{
	width:50%
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-shipwire .hero-image
{
	margin-top:10%;
	margin-bottom:10%
}
	#story-shipwire .logo
{
	width:100px
}
	#story-shipwire .client-intro
{
	background-attachment:scroll
}
	#story-shipwire .summing-up-shipwire
{
	margin-top:40px
}
	#story-shipwire .summing-up-shipwire li
{
	display:block;
	width:60%;
	padding-top:44.4%;
	margin:0 auto 24%
}
	#story-shipwire .summing-up-shipwire li:after
{
	position:absolute;
	left:46%;
	top:auto;
	bottom:-28%;
	width:11%;
	height:17%;
	background:url(/resources/img/story/shipwire/summing-shipwire-arrow-down.png) no-repeat left top;
	background-size:contain
}
	#story-shipwire .summing-up-shipwire li:last-child
{
	margin:-7% auto 0
}
	#story-shipwire .design-principles
{
	padding-top:190px;
	background:#3bad56 url('/resources/img/story/shipwire/principles-mobile.png') no-repeat center 30px;
	background-attachment:none
}
	#story-shipwire .design-principles .principle .number
{
	width:80px;
	height:68px;
	font-size:47px;
	line-height:68px;
	left:50%;
	margin-left:-40px
}
	#story-shipwire .design-principles .principle .circle
{
	opacity:1;
	width:100%;
	height:100%;
	background-size:100%
}
	#story-shipwire .design-principles .principle .copy
{
	width:100%;
	margin-left:0;
	text-align:center
}
	#story-shipwire .design-principles .principle .copy .title
{
	margin:10px 0 5px;
	font-size:24px
}
	#story-shipwire .tandem-work .ia-and-design
{
	height:288px
}
	#story-shipwire .tandem-work .ia-and-design p
{
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	width:180px;
	margin-top:310px;
	padding:0 50px;
	background-size:contain
}
	#story-shipwire .tandem-work .first-concept
{
	margin-bottom:-4px
}
	#story-shipwire .tandem-work .first-concept .screenshot .callout
{
	left:5%;
	bottom:-36%
}
	#story-shipwire .shipwire-logo-box .reveal span
{
	font-size:25px;
	margin-left:15px
}
	#story-shipwire .more-than-box
{
	height:217px
}
	#story-shipwire .more-than-box .container
{
	width:2880px;
	margin-left:-1440px
}
	#story-shipwire .more-than-box .item,#story-shipwire .more-than-box .box
{
	width:320px;
	height:217px
}
	#story-shipwire .more-than-box .box
{
	margin-left:-160px
}
	#story-shipwire #more-than-box-tagline
{
	margin-bottom:50px
}
	#story-shipwire .tagline-animation
{
	width:100%;
	margin:-30px 0 60px 0
}

}
	#story-readability .intro
{
	color:#fff;
	background:#393635 url(/resources/img/story/readability/hero-image2.jpg) no-repeat top center;
	background-size:100%;
	padding-top:700px
}
	#story-readability .logo
{
	margin-top:10px
}
	#story-readability .old-to-new
{
	background:#f3f2f1;
	padding-bottom:0;
	overflow:hidden
}
	#story-readability .old-to-new .tl-guys
{
	color:#31302e
}
	#story-readability .old-to-new h2
{
	color:#31302e
}
	#story-readability .old-to-new p
{
	color:#51504c
}
	#story-readability .old-to-new .interaction-wrap
{
	color:#b7b7b7
}
	#story-readability .old-to-new .side-by-side
{
	margin-top:55px
}
	#story-readability .friends-before
{
	background:#d7d5d0
}
	#story-readability .friends-before h2
{
	color:#31302e
}
	#story-readability .friends-before p
{
	color:#51504c
}
	#story-readability .friends-before .interaction-wrap
{
	color:#9e9e9e
}
	#story-readability .friends-before #tweetmag-gallery-wrap
{
	background:url(/resources/img/story/readability/tweetmag-bg.png) no-repeat center 30%
}
	#story-readability .next-level
{
	background:#9f1e1d url(/resources/img/story/readability/rejected-stamp.jpg) repeat-x;
	background-size:contain;
	background-position:center center;
	background-attachment:fixed;
	color:#fff
}
	#story-readability .next-level p
{
	color:#dcbcbb
}
	#story-readability .the-journey
{
	background:#f3f2f1
}
	#story-readability .the-journey .tl-guys
{
	color:#31302e
}
	#story-readability .the-journey h2
{
	color:#31302e
}
	#story-readability .the-journey p
{
	color:#51504c
}
	#story-readability .the-journey blockquote
{
	color:#b13b35
}
	#story-readability .the-journey .kiss-rush
{
	position:relative;
	margin-bottom:50px
}
	#story-readability .the-journey .kiss-rush audio
{
	position:absolute;
	left:-1000000px
}
	#story-readability .the-journey .kiss-rush img
{
	width:100%
}
	#story-readability .the-journey .kiss-rush .copy
{
	position:absolute;
	left:0;
	bottom:0;
	padding:200px 40px 40px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	width:100%;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:50px;
	line-height:72px;
	text-align:center;
	color:#fff;
	background-color:rgba(0,0,0,0.34);
	background-image:-moz-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.85));
	background-image:-webkit-gradient(linear,0 0,0 100%,from(rgba(0,0,0,0)),to(rgba(0,0,0,0.85)));
	background-image:-webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.85));
	background-image:-o-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.85));
	background-image:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0.85));
	background-repeat:repeat-x;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000',endColorstr='#d9000000',GradientType=0);
	background-color:transparent
}
	#story-readability .the-journey .kiss-rush .interaction
{
	position:absolute;
	right:20px;
	bottom:-20px;
	color:#aeaa9f;
	z-index:2
}
	#story-readability .the-journey .kiss-rush .trigger
{
	position:absolute;
	left:0;
	top:0;
	z-index:3;
	width:50%;
	height:100%;
	cursor:url(/resources/img/story/readability/metal-fingers.png) 0 0,pointer
}
	#story-readability .the-journey .kiss-rush .rush
{
	left:50%
}
	#story-readability .working-product
{
	background:#dedcd8
}
	#story-readability .working-product h2
{
	color:#31302e
}
	#story-readability .working-product p
{
	color:#51504c
}
	#story-readability .working-product .iphoneipadwires
{
	background:url(/resources/img/story/readability/wireframes.jpg) center 120px no-repeat;
	margin-bottom:0;
	padding-top:35px;
	height:1180px;
	text-align:center
}
	#story-readability .working-product .iphoneipadwires p
{
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:18px;
	line-height:1em;
	background:url(/resources/img/story/readability/line.png) no-repeat center bottom;
	width:250px;
	height:100px;
	position:relative;
	display:inline-block
}
	#story-readability .working-product .bottomnote
{
	background:url(/resources/img/story/readability/squiggle-right.png) no-repeat center top;
	text-align:center
}
	#story-readability .working-product .bottomnote p
{
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	width:250px;
	font-size:18px;
	line-height:1em;
	position:relative;
	display:inline-block;
	margin-top:60px
}
	#story-readability .working-product .interaction-wrap
{
	color:#9e9e9e
}
	#story-readability .the-reward
{
	background:#aeaa9f
}
	#story-readability .the-reward .tl-guys
{
	color:#fff
}
	#story-readability .the-reward .interaction-wrap
{
	color:#fff
}
	#story-readability .the-reward h2
{
	color:#fff
}
	#story-readability .the-reward p
{
	color:#51504c
}
	#story-readability .the-reward blockquote
{
	color:#31302e
}
	#story-readability .the-reward .diverge-converge
{
	background:url(/resources/img/story/readability/diverge-converge.png) no-repeat top center;
	background-size:contain;
	max-width:100%;
	height:380px;
	margin:100px 0 100px
}
	#story-readability .the-reward .hfj-logo
{
	text-align:center;
	margin:50px 0
}
	#story-readability .the-reward .hfj-logo img
{
	max-width:95%
}
	#story-readability .the-reward .hfj-logo p
{
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1em;
	text-align:left;
	color:#fff;
	width:130px;
	position:absolute;
	display:inline;
	padding:0 0 0 40px;
	margin:40px 0 0 40px;
	height:80px;
	background:url(/resources/img/story/readability/squiggle-down-w.png) 50px bottom no-repeat
}
	#story-readability .the-reward .type-detail
{
	position:relative;
	text-align:center;
	font-size:20px;
	margin-bottom:175px
}
	#story-readability .the-reward .type-detail img
{
	max-width:70%
}
	#story-readability .the-reward .type-detail span
{
	background:url(/resources/img/story/readability/squiggle-palm-w.png) left 9px no-repeat;
	position:absolute;
	display:block;
	width:170px;
	bottom:140px;
	right:-20px;
	padding:0 0 0 63px;
	color:#fff;
	text-align:left
}
	#story-readability .the-reward .hfj-type
{
	text-align:center;
	margin:50px 0 80px 0
}
	#story-readability .the-reward .hfj-type img
{
	margin:5px 10px 5px 10px;
	opacity:1;
	-webkit-transition:opacity 250ms;
	-moz-transition:opacity 250ms;
	-o-transition:opacity 250ms;
	transition:opacity 250ms
}
	#story-readability .the-reward .hfj-type img:hover
{
	opacity:.5
}
	#story-readability .type-viewer
{
	display:inline-block;
	position:relative
}
	#story-readability .type-viewer .type-settings
{
	position:absolute;
	top:120px;
	right:-80px;
	z-index:300;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	width:240px;
	height:265px;
	background:rgba(0,0,0,0.8);
	-webkit-box-shadow:0 0 7px rgba(0,0,0,0.3);
	-moz-box-shadow:0 0 7px rgba(0,0,0,0.3);
	box-shadow:0 0 7px rgba(0,0,0,0.3)
}
	#story-readability .type-viewer .font
{
	position:absolute;
	width:238px;
	height:98px;
	left:1px;
	top:13px;
	background:pink;
	cursor:pointer
}
	#story-readability .type-viewer .sentinel
{
	background:url(/resources/img/story/readability/style-control/font-sentinel.png) no-repeat left top
}
	#story-readability .type-viewer .vitesse
{
	background:url(/resources/img/story/readability/style-control/font-vitesse.png) no-repeat left top
}
	#story-readability .type-viewer .mercury
{
	background:url(/resources/img/story/readability/style-control/font-mercury.png) no-repeat left top
}
	#story-readability .type-viewer .whitney
{
	background:url(/resources/img/story/readability/style-control/font-whitney.png) no-repeat left top
}
	#story-readability .type-viewer .gotham
{
	background:url(/resources/img/story/readability/style-control/font-gotham.png) no-repeat left top
}
	#story-readability .type-viewer .size
{
	position:absolute;
	width:240px;
	height:38px;
	left:0;
	top:133px;
	background:pink;
	cursor:pointer

}
	#story-readability .type-viewer .small
{
	background:url(/resources/img/story/readability/style-control/size-small.png) no-repeat left top
}
	#story-readability .type-viewer .medium
{
	background:url(/resources/img/story/readability/style-control/size-medium.png) no-repeat left top
}
	#story-readability .type-viewer .large
{
	background:url(/resources/img/story/readability/style-control/size-large.png) no-repeat left top
}
	#story-readability .type-viewer .colour
{
	position:absolute;
	width:240px;
	height:26px;
	left:0;
	top:206px;
	background:pink;
	cursor:pointer
}
	#story-readability .type-viewer .dark
{
	background:url(/resources/img/story/readability/style-control/colour-dark.png) no-repeat left top
}
	#story-readability .type-viewer .light
{
	background:url(/resources/img/story/readability/style-control/colour-light.png) no-repeat left top
}
	#story-readability .type-viewer .skin
{
	position:relative;
	max-width:100%;
	z-index:200
}
	#story-readability .type-viewer .screens
{
	position:absolute;
	top:9.3%;
	left:7.1%;
	width:86%;
	z-index:100
}
	#story-readability .type-viewer .screens img
{
	position:absolute;
	opacity:0;
	top:0;
	left:0;
	width:100%;
	-webkit-transition:opacity .4s .5s;
	-moz-transition:opacity .4s .5s;
	-o-transition:opacity .4s .5s;
	transition:opacity .4s .5s
}
	#story-readability .type-viewer .screens .active
{
	opacity:1;
	z-index:101;
	-webkit-transition:opacity .4s 0;
	-moz-transition:opacity .4s 0;
	-o-transition:opacity .4s 0;
	transition:opacity .4s 0
}
	#story-readability .type-viewer-simple
{
	visibility:hidden;
	display:none;
	position:relative
}
	#story-readability .type-viewer-simple .screens-simple
{
	position:absolute;
	top:12.3%;
	left:7.1%;
	width:86%;
	z-index:100;
	-webkit-transform:translateZ(0);
	-moz-transform:translateZ(0);
	-o-transform:translateZ(0);
	transform:translateZ(0)
}
	#story-readability .type-viewer-simple .screens-simple img
{
	position:absolute;
	opacity:0;
	top:0;
	left:0;
	width:100%;
	z-index:100;
	-webkit-transition:opacity 0 .5s;
	-moz-transition:opacity 0 .5s;
	-o-transition:opacity 0 .5s;
	transition:opacity 0 .5s
}
	#story-readability .type-viewer-simple .screens-simple .active
{
	opacity:1;
	z-index:101;
	-webkit-transition:opacity .4s 0;
	-moz-transition:opacity .4s 0;
	-o-transition:opacity .4s 0;
	transition:opacity .4s 0
}
	#story-readability .loupe-area
{
	text-align:center;
	margin:50px 0 100px
}
	#story-readability .loupe-area .interaction-wrap
{
	margin-bottom:50px
}
	#story-readability .loupe-area .zoom
{
	background-color:#aeaa9f
}
	#story-readability .loupe-tool.not-dragging .zoom
{
	background-image:url('/resources/img/story/readability/loupe-not-dragging.jpg')
}
	#story-readability .content-interface-gallery,#story-readability .final-product
{
	background:url(/resources/img/story/readability/bg-swoops.png) repeat-x center center
}
	#story-readability .type-tool
{
	background:url(/resources/img/story/readability/bg-type.png) no-repeat center center
}
	#story-readability .type-tool .interaction-wrap
{
	margin-bottom:40px
}
	#story-readability .type-tool .copy-width
{
	text-align:center
}
	@media all and (max-width:1000px) and (min-width:500px)
{
	#story-readability .intro
{
	padding-top:550px
}
	#story-readability .the-journey .kiss-rush .copy
{
	padding:200px 35px 35px;
	font-size:36px;
	line-height:49px
}
	#story-readability .friends-before #tweetmag-gallery-wrap
{
	background-size:150%
}
	#story-readability .the-reward .diverge-converge
{
	margin:60px 0 60px;
	height:300px
}
	#story-readability .the-reward .hfj-type img
{
	max-width:50%;
	margin:5px 5px 5px 5px
}
	#story-readability .the-reward .type-detail
{
	margin-bottom:125px
}
	#story-readability .the-reward .type-detail span
{
	background:url(/resources/img/story/readability/squiggle-down-w.png) left 9px no-repeat;
	position:relative;
	display:inline-block;
	width:380px;
	bottom:0;
	right:0;
	padding:50px 0 0 0;
	margin-right:50px
}
	#story-readability .type-viewer
{
	width:83%
}
	#story-readability .content-interface-gallery,#story-readability .final-product
{
	background-size:90%
}
	#story-readability .type-tool
{
	background-size:2500px auto
}
	#story-readability .loupe-area
{
	background:url(/resources/img/story/readability/loupe-lg.png) no-repeat top center;
	background-size:contain;
	height:800px;
	margin-bottom:40px
}
	#story-readability .loupe-area #readability-loupe
{
	visibility:hidden;
	display:none
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-readability .intro
{
	padding-top:200px
}
	#story-readability .the-journey .kiss-rush .copy
{
	padding:70px 20px 20px;
	font-size:20px;
	line-height:22px
}
	#story-readability .the-journey .kiss-rush .interaction
{
	right:10px;
	bottom:-30px;
	font-size:10px
}
	#story-readability .friends-before #tweetmag-gallery-wrap
{
	background-size:150%
}
	#story-readability .next-level
{
	background-size:500px;
	background-attachment:scroll;
	background-position:center 90px
}
	#story-readability .working-product .iphoneipadwires
{
	height:500px;
	background-size:240%;
	padding-top:10px
}
	#story-readability .the-reward .diverge-converge
{
	background:url(/resources/img/story/readability/diverge-converge-sm.png) no-repeat top center;
	margin:50px 0 0 0;
	height:260px
}
	#story-readability .the-reward .type-detail
{
	margin-bottom:55px
}
	#story-readability .the-reward .type-detail span
{
	background:url(/resources/img/story/readability/squiggle-down-w.png) 10px 9px no-repeat;
	position:relative;
	display:inline-block;
	width:280px;
	bottom:0;
	right:0;
	padding:50px 0 0 0;
	margin-right:0
}
	#story-readability .the-reward .hfj-logo p
{
	display:block
}
	#story-readability .the-reward .hfj-type
{
	margin:110px 0 40px 0
}
	#story-readability .type-viewer
{
	visibility:hidden;
	display:none;
	margin-bottom:310px
}
	#story-readability .type-viewer .type-settings
{
	top:auto;
	right:auto;
	left:50%;
	margin-left:-120px
}
	#story-readability .type-viewer-simple
{
	visibility:visible;
	display:inline-block;
	position:relative
}
	#story-readability .content-interface-gallery,#story-readability .final-product
{
	background-size:100%
}
	#story-readability .type-tool
{
	background-size:1100px auto
}
	#story-readability .loupe-area
{
	background:url(/resources/img/story/readability/loupe-sm.png) no-repeat top center;
	height:400px;
	margin-bottom:20px;
	background-size:contain
}
	#story-readability .loupe-area #readability-loupe
{
	visibility:hidden;
	display:none
}

}
	#story-globe-and-mail .loupe-area
{
	text-align:center
}
	#story-globe-and-mail .loupe-area .zoom
{
	background-color:#b7c9d2
}
	#story-globe-and-mail .loupe-tool.not-dragging .zoom
{
	background-image:url('/resources/img/story/globe-and-mail/loupe-not-dragging.jpg')
}
	#story-globe-and-mail .loupe-icon
{
	margin:100px 0 0
}
	#story-globe-and-mail .asf-chart-wrapper
{
	text-align:center
}
	#story-globe-and-mail .icon.tl-guys
{
	margin-top:0
}
	#story-globe-and-mail em
{
	font-style:italic
}
	#story-globe-and-mail .icon.tl-guys
{
	margin-top:0
}
	#story-globe-and-mail em
{
	font-style:italic
}
	#story-globe-and-mail .story-content section
{
	padding-top:120px;
	padding-bottom:130px
}
	#story-globe-and-mail .story-content section.intro
{
	background:#c9d7dd;
	padding-top:60px
}
	#story-globe-and-mail .story-content section.intro h1
{
	color:#394f59;
	margin-top:80px;
	margin-bottom:30px
}
	#story-globe-and-mail .story-content section.intro h5
{
	margin-top:100px;
	margin-bottom:10px;
	color:#394f59
}
	#story-globe-and-mail .story-content section.intro p
{
	color:#394f59
}
	#story-globe-and-mail .story-content section.intro #vector-chart
{
	margin:0 auto;
	width:99%;
	height:700px;
	overflow:hidden
}
	#story-globe-and-mail .story-content section.intro #vector-chart .tickLabel
{
	font-size:14px;
	color:#68818c;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif
}
	#story-globe-and-mail .story-content section.intro img.logo-globe
{
	max-width:100%;
	margin-bottom:0
}
	#story-globe-and-mail .story-content section.journalism
{
	background:#b7c9d2;
	padding-top:120px
}
	#story-globe-and-mail .story-content section.journalism h2
{
	color:#fff
}
	#story-globe-and-mail .story-content section.journalism p
{
	color:#394f59
}
	#story-globe-and-mail .story-content section.journalism blockquote
{
	color:#394f59
}
	#story-globe-and-mail .story-content section.journalism .icon
{
	color:#fff;
	margin-top:0
}
	#story-globe-and-mail .story-content section.journalism .newspapers
{
	text-align:center
}
	#story-globe-and-mail .story-content section.journalism .newspapers img
{
	max-width:100%
}
	#story-globe-and-mail .story-content section.readers
{
	background:url("/resources/img/story/globe-and-mail/bg-dear-readers.png") center top no-repeat,url("/resources/img/story/globe-and-mail/bg-dear-readers-bottom.jpg") center bottom no-repeat;
	background-size:contain,contain;
	background-color:#394f59;
	padding-top:140px;
	padding-bottom:500px
}
	#story-globe-and-mail .story-content section.readers h2
{
	color:#fff
}
	#story-globe-and-mail .story-content section.readers h2.title
{
	margin-bottom:70px
}
	#story-globe-and-mail .story-content section.readers p
{
	color:#b5bfc4
}
	#story-globe-and-mail .story-content section.readers blockquote
{
	color:#f36a22;
	margin:75px 0
}
	#story-globe-and-mail .story-content section.readers ol
{
	border-top:1px solid #61727a
}
	#story-globe-and-mail .story-content section.readers ol li
{
	color:#fff;
	font-size:22px;
	border-bottom:1px solid #61727a
}
	#story-globe-and-mail .story-content section.readers ol li span
{
	display:block;
	color:#f36a22
}
	#story-globe-and-mail .story-content section.readers ol li::before
{
	color:#f36a22;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-weight:700;
	font-size:28px;
	padding:10px 30px
}
	#story-globe-and-mail .story-content section.readers .icon
{
	color:#FFF
}
	#story-globe-and-mail .story-content section.unbury
{
	background:#c1c1b7;
	padding-top:90px
}
	#story-globe-and-mail .story-content section.unbury h2
{
	color:#fff;
	margin-top:0;
	margin-bottom:60px
}
	#story-globe-and-mail .story-content section.unbury p
{
	color:#394f59
}
	#story-globe-and-mail .story-content section.unbury p.center
{
	text-align:center
}
	#story-globe-and-mail .story-content section.unbury blockquote
{
	color:#394f59
}
	#story-globe-and-mail .story-content section.unbury .logo
{
	text-align:center
}
	#story-globe-and-mail .story-content section.unbury .logo.sketches
{
	margin-bottom:47px
}
	#story-globe-and-mail .story-content section.unbury .logo.sketches img
{
	max-width:100%
}
	#story-globe-and-mail .story-content section.unbury .venn
{
	position:relative;
	max-width:600px;
	max-height:600px;
	height:600px;
	margin:0 auto
}
	#story-globe-and-mail .story-content section.unbury .venn .base
{
	position:absolute;
	max-width:600px;
	max-height:600px;
	width:100%;
	height:50%
}
	#story-globe-and-mail .story-content section.unbury .venn .base img
{
	max-width:100%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles
{
	position:inherit;
	width:100%;
	height:100%;
	top:20px
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle
{
	-webkit-transition:opacity .1s linear;
	-moz-transition:opacity .1s linear;
	-ms-transition:opacity .1s linear;
	-o-transition:opacity .1s linear;
	transition:opacity .1s linear;
	opacity:1;
	position:absolute;
	max-width:300px;
	max-height:300px;
	width:50%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle>span
{
	color:#FFF;
	font-size:30px;
	font-weight:700;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	display:block;
	text-align:center;
	position:absolute;
	top:47%;
	width:100%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle img
{
	max-width:100%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle.red
{
	left:25%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle.blue
{
	top:30%;
	left:6%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle.orange
{
	top:30%;
	left:45%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle.fade
{
	opacity:.5
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes
{
	position:relative;
	width:100%;
	top:-600px;
	left:0;
	z-index:100
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes li
{
	display:none;
	position:absolute
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes li.note1
{
	left:460px;
	top:100px
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes li.note2
{
	top:175px;
	left:400px
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes li.note3
{
	top:170px;
	left:-110px
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes li.note4
{
	left:300px;
	top:380px
}
	#story-globe-and-mail .story-content section.awesome-formats
{
	background:url('/resources/img/story/globe-and-mail/bg-blue-grid.png') repeat top left;
	padding-top:80px;
	padding-bottom:286px;
	color:#84a4b3
}
	#story-globe-and-mail .story-content section.awesome-formats .bottom-container
{
	position:relative
}
	#story-globe-and-mail .story-content section.awesome-formats .bottom-container img.awesome-bottom
{
	position:absolute;
	bottom:-286px;
	text-align:center;
	max-width:100%
}
	#story-globe-and-mail .story-content section.awesome-formats h2
{
	margin-top:0;
	color:#FFF
}
	#story-globe-and-mail .story-content section.awesome-formats p
{
	color:#b7c9d2
}
	#story-globe-and-mail .story-content section.awesome-formats .clippings-container
{
	margin-bottom:50px;
	text-align:center;
	position:relative
}
	#story-globe-and-mail .story-content section.awesome-formats .clippings-container .scissors-container
{
	position:absolute;
	width:50%;
	height:100%;
	overflow:hidden;
	top:46%;
	left:50%
}
	#story-globe-and-mail .story-content section.awesome-formats .clippings-container .scissors-container .scissors
{
	position:absolute;
	top:0;
	left:0;
	opacity:0
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings
{
	margin-bottom:50px;
	width:99%;
	max-width:1530px;
	overflow:hidden;
	height:100%;
	max-height:637px;
	height:637px;
	text-align:center;
	margin:0 auto;
	position:relative
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings img
{
	position:absolute;
	max-width:100%;
	height:auto\9;
	top:0;
	left:0;
	opacity:0
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-01
{
	top:0;
	left:0
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-02
{
	top:0;
	left:380px;
	left:24.83660130719%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-03
{
	top:0;
	left:600px;
	left:39.21568627451%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-04
{
	top:0;
	left:1040px;
	left:67.97385620915%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-05
{
	left:1190px;
	left:77.777777777778%;
	top:20px;
	top:3.139717425432%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-06
{
	left:600px;
	left:39.21568627451%;
	top:80px;
	top:12.558869701727%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-07
{
	left:780px;
	left:50.980392156863%;
	top:90px;
	top:14.128728414443%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-08
{
	left:1185px;

	left:77.450980392157%;
	top:110px;
	top:17.268445839874%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-09
{
	left:1390px;
	left:90.849673202614%;
	top:110px;
	top:17.268445839874%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-10
{
	left:115px;
	left:7.516339869281%;
	top:305px;
	top:47.880690737834%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-11
{
	left:375px;
	left:24.509803921569%;
	top:235px;
	top:36.891679748823%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-12
{
	left:625px;
	left:41.503267973856%;
	top:240px;
	top:37.676609105181%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-13
{
	left:1025px;
	left:66.993464052288%;
	top:238px;
	top:37.676609105181%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-14
{
	left:1155px;
	left:75.490196078431%;
	top:235px;
	top:36.891679748823%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-15
{
	left:115px;
	left:7.516339869281%;
	top:368px;
	top:57.770800627943%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-16
{
	left:377px;
	left:24.640522875817%;
	top:377px;
	top:59.183673469388%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-17
{
	left:115px;
	left:7.516339869281%;
	top:425px;
	top:66.718995290424%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-18
{
	left:730px;
	left:47.712418300654%;
	top:425px;
	top:66.718995290424%
}
	#story-globe-and-mail .story-content section.awesome-formats .news-clippings #clipping-19
{
	left:730px;
	left:47.712418300654%;
	top:563px;
	top:88.383045525903%
}
	#story-globe-and-mail .story-content section.enriched-experience
{
	background-color:#b7c9d2
}
	#story-globe-and-mail .story-content section.enriched-experience .icon,#story-globe-and-mail .story-content section.enriched-experience h2
{
	color:#FFF
}
	#story-globe-and-mail .story-content section.enriched-experience h4
{
	text-align:center;
	color:#000;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif
}
	#story-globe-and-mail .story-content section.enriched-experience h5
{
	text-align:right;
	text-transform:none;
	color:#394f59;
	font-size:13px;
	line-height:15px;
	letter-spacing:0;
	margin-bottom:15px;
	margin-top:50px
}
	#story-globe-and-mail .story-content section.enriched-experience p,#story-globe-and-mail .story-content section.enriched-experience blockquote
{
	color:#394f59
}
	#story-globe-and-mail .story-content section.enriched-experience img.asf-chart
{
	margin:10px auto 70px auto;
	max-width:100%
}
	#story-globe-and-mail .story-content section.enriched-experience img.asf-chart-sm
{
	display:none
}
	#story-globe-and-mail .story-content section.enriched-experience .gallery
{
	margin-top:80px
}
	#story-globe-and-mail .story-content section.what-we-learned ol li::before
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-weight:700;
	font-size:28px
}
	#story-globe-and-mail .story-content section.what-we-learned blockquote
{
	font-size:82px;
	line-height:88px;
	color:#888;
	margin:150px 0 50px
}
	@media all and (max-width:1000px) and (min-width:500px)
{
	#story-globe-and-mail blockquote
{
	font-size:42px
}
	#story-globe-and-mail .story-content section
{
	padding-top:60px
}
	#story-globe-and-mail .story-content section.intro #vector-chart
{
	margin:0 auto;
	width:99%;
	height:450px;
	overflow:hidden
}
	#story-globe-and-mail .story-content section.intro #vector-chart .tickLabel
{
	font-size:13px;
	color:#68818c;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif
}
	#story-globe-and-mail .story-content section.journalism h2
{
	line-height:auto
}
	#story-globe-and-mail .story-content section.unbury .venn
{
	max-width:300px;
	max-height:400px;
	height:400px;
	margin:0 auto;
	width:50%;
	background:url(/resources/img/story/globe-and-mail/venn-diagram-sm.png) no-repeat center center
}
	#story-globe-and-mail .story-content section.unbury .venn .base
{
	display:none
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes
{
	display:none;
	position:relative;
	width:100%;
	top:-300px;
	left:0
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes li
{
	position:absolute
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes li.note1
{
	left:130px;
	top:110px
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes li.note2
{
	top:85px;
	left:180px
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes li.note3
{
	top:85px;
	left:-180px
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes li.note4
{
	left:150px;
	top:170px
}
	#story-globe-and-mail .story-content section.unbury .venn .circles
{
	display:none;
	position:inherit;
	width:100%;
	height:100%;
	top:20px
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle>span
{
	font-size:18px;
	top:45%
}
	#story-globe-and-mail .story-content section.readers
{
	padding-bottom:250px
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-globe-and-mail blockquote
{
	font-size:30px;
	line-height:34px;
	margin:55px 10px
}
	#story-globe-and-mail .story-content section
{
	padding-top:40px;
	padding-bottom:75px
}
	#story-globe-and-mail .icon.tl-guys
{
	display:block
}
	#story-globe-and-mail .story-content section.intro h1
{
	margin-top:40px;
	margin-bottom:40px
}
	#story-globe-and-mail .story-content section.intro #vector-chart
{
	margin:0 auto;
	width:99%;
	height:225px;
	overflow:hidden
}
	#story-globe-and-mail .story-content section.intro #vector-chart .tickLabel
{
	font-size:12px;
	color:#68818c;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif
}
	#story-globe-and-mail .story-content section.intro img.logo-globe
{
	margin-bottom:0
}
	#story-globe-and-mail .story-content section.journalism h2
{
	line-height:36px
}
	#story-globe-and-mail .story-content section.readers
{
	padding-bottom:150px
}
	#story-globe-and-mail .story-content section.readers h2.title
{
	margin-bottom:40px
}
	#story-globe-and-mail .story-content section.readers ol li
{
	font-size:20px
}
	#story-globe-and-mail .story-content section.unbury
{
	padding-bottom:50px
}
	#story-globe-and-mail .story-content section.unbury h2
{
	margin-bottom:40px
}
	#story-globe-and-mail .story-content section.unbury .venn
{
	background:url(/resources/img/story/globe-and-mail/venn-diagram-sm.png) no-repeat center center;
	max-height:400px
}
	#story-globe-and-mail .story-content section.unbury .venn ul.notes
{
	display:none
}
	#story-globe-and-mail .story-content section.unbury .venn .base
{
	display:none
}
	#story-globe-and-mail .story-content section.unbury .venn .circles
{
	display:none;
	position:inherit;
	width:100%;
	height:100%;
	top:20px
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle
{
	position:absolute;
	max-width:300px;
	max-height:300px;
	width:50%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle>span
{
	color:#FFF;
	font-size:30px;
	font-weight:700;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	display:block;
	text-align:center;
	position:absolute;
	top:47%;
	width:100%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle img
{
	max-width:100%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle.red
{
	left:25%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle.blue
{
	top:20%;
	left:6%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle.orange
{
	top:20%;
	left:45%
}
	#story-globe-and-mail .story-content section.unbury .venn .circles .circle.fade
{
	opacity:.5
}
	#story-globe-and-mail #rob-loupe
{
	margin-bottom:40px
}
	#story-globe-and-mail .loupe-area
{
	background:url(/resources/img/story/globe-and-mail/loupe-sm.png) no-repeat top center;
	background-size:contain;
	margin-bottom:60px
}
	#story-globe-and-mail .loupe-area #rob-loupe
{
	visibility:hidden
}
	#story-globe-and-mail .story-content section.awesome-formats
{
	padding-bottom:130px
}
	#story-globe-and-mail .story-content section.awesome-formats .bottom-container img.awesome-bottom
{
	bottom:-130px
}
	#story-globe-and-mail .story-content section.enriched-experience .asf-chart-wrapper
{
	text-align:center;
	margin-bottom:40px
}
	#story-globe-and-mail .story-content section.enriched-experience .asf-chart-wrapper img.asf-chart
{
	display:none
}
	#story-globe-and-mail .story-content section.enriched-experience .asf-chart-wrapper img.asf-chart-sm
{
	display:block;
	margin:0 auto
}
	#story-globe-and-mail .story-content section.enriched-experience .gallery
{
	margin-top:40px
}
	#story-globe-and-mail .story-content section.what-we-learned ol
{
	margin-bottom:50px
}
	#story-globe-and-mail .story-content section.what-we-learned ol li
{
	font-size:20px
}
	#story-globe-and-mail .story-content section.what-we-learned ol li::before
{
	line-height:62px
}
	#story-globe-and-mail .story-content section.what-we-learned blockquote
{
	font-size:37px;
	line-height:42px;
	margin:50px 0 75px
}

}
	#story-stackup .wrapper
{
	float:left;
	width:100%
}
	#story-stackup .simply-scroll-container
{
	position:relative
}
	#story-stackup .simply-scroll-clip
{
	position:relative;
	overflow:hidden
}
	#story-stackup .simply-scroll-list
{
	overflow:hidden;
	list-style:none
}
	#story-stackup .underline-light
{
	background:url('/resources/img/story/stackup/underline-light.png') bottom left transparent no-repeat
}
	#story-stackup .underline-dark
{
	background:url('/resources/img/story/stackup/underline-dark.png') bottom left transparent no-repeat
}
	#story-stackup .carousel .item
{
	display:none;
	cursor:pointer
}
	#story-stackup .carousel .item.active
{
	display:block
}
	#story-stackup .carousel .item h3
{
	text-align:center
}
	#story-stackup .carousel .item img
{
	display:block;
	margin:0 auto;
	max-width:370px;
	width:50%
}
	#story-stackup .intro
{
	background:url('/resources/img/story/stackup/intro/bg.jpg') center top #0066a4 no-repeat;
	background-size:contain;
	padding:600px 0 0 0;
	width:100%;
	color:#fff
}
	#story-stackup .intro .logo
{
	background:url('/resources/img/story/stackup/intro/logo.png') no-repeat;
	margin:10px auto 80px auto;
	width:70px;
	height:40px
}
	#story-stackup .superphones
{
	background-color:#f8f8f8;
	background-image:-moz-linear-gradient(top,#fff,#eee);
	background-image:-webkit-gradient(linear,0 0,0 100%,from(#fff),to(#eee));
	background-image:-webkit-linear-gradient(top,#fff,#eee);
	background-image:-o-linear-gradient(top,#fff,#eee);
	background-image:linear-gradient(to bottom,#fff,#eee);
	background-repeat:repeat-x;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffeeeeee',GradientType=0);
	color:#000
}
	#story-stackup .superphones .copy-width
{
	margin-bottom:275px
}
	#story-stackup .superphones .tl-guys
{
	color:#0066a4
}
	#story-stackup .evolution
{
	background:#fff
}
	#story-stackup .evolution .up-top
{
	margin-top:-140px
}
	#story-stackup .evolution .up-top .phones
{
	display:block;
	margin:0 auto 100px auto;
	max-width:950px;
	width:100%
}
	#story-stackup .evolution ul
{
	margin:0 0 120px 0;
	float:left;
	width:100%
}
	#story-stackup .evolution ul li
{
	text-align:center;
	font:16px "Shadows Into Light Two",Georgia,Times,"Times New Roman",serif;
	float:left;
	width:25%
}
	#story-stackup .evolution ul li .bell-icon
{
	margin:0 auto 40px auto;
	width:200px;
	height:200px
}
	#story-stackup .evolution ul li .bell-icon.cpu
{
	background:url('/resources/img/story/stackup/evolution/icons/cpu.png') no-repeat
}
	#story-stackup .evolution ul li .bell-icon.speed
{
	background:url('/resources/img/story/stackup/evolution/icons/speed.png') no-repeat
}
	#story-stackup .evolution ul li .bell-icon.camera
{
	background:url('/resources/img/story/stackup/evolution/icons/camera.png') no-repeat
}
	#story-stackup .evolution ul li .bell-icon.screen
{
	background:url('/resources/img/story/stackup/evolution/icons/screen.png') no-repeat
}
	#story-stackup .evolution blockquote
{
	color:#0066a4
}
	#story-stackup .doubt
{
	background:url('/resources/img/story/stackup/doubt/bg.jpg') #fff repeat-x;
	border-top:1px #ccc solid
}
	#story-stackup .doubt .tl-guys,#story-stackup .doubt blockquote
{
	color:#0066a4
}
	#story-stackup .doubt .phone
{
	display:block;
	margin:80px auto;
	max-width:970px;
	width:100%
}
	#story-stackup .exif
{
	background:#0066a4;
	color:#fff
}
	#story-stackup .exif .icon
{
	color:#80b3d2
}
	#story-stackup .exif h4
{
	background:url('/resources/img/story/stackup/ribbon.png') no-repeat;
	font:18px "Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	text-transform:uppercase;
	text-align:center;
	font-weight:bold;
	color:#e1edf4;
	margin:40px auto;
	padding:8px 0 0 0;
	width:160px;
	height:32px
}
	#story-stackup .exif .interaction-wrap
{
	margin-bottom:40px
}
	#story-stackup .db
{
	background:#fff
}
	#story-stackup .db .interaction-wrap
{
	margin-bottom:40px
}
	#story-stackup .db .side-story
{
	background:#3b3b3b;
	-webkit-box-shadow:0 0 10px #3b3b3b;
	-moz-box-shadow:0 0 10px #3b3b3b;
	box-shadow:0 0 10px #3b3b3b;
	margin:130px 0;
	float:left;
	width:100%;
	color:#fff
}
	#story-stackup .db .side-story .sub
{
	text-transform:uppercase
}
	#story-stackup .db .side-story .lining
{
	border-left:1px #797979 solid;
	padding:0 6%;
	width:88%
}
	#story-stackup .db .side-story img
{
	display:block;
	float:left;
	width:50%
}
	#story-stackup .db .side-story .copy
{
	background:#3b3b3b;
	float:left;
	padding:3% 0;
	width:50%
}
	#story-stackup .db .side-story .copy h3
{
	margin:0 0 20px 0;
	font:26px "PT Serif",Georgia,Times,"Times New Roman",serif
}
	#story-stackup .db .side-story .copy p
{
	font-size:15px;
	line-height:25px;
	margin:0 0 20px 0
}
	#story-stackup .db .scrollable
{
	margin:0 0 80px 0;
	overflow:hidden;
	position:relative;
	width:100%;
	height:270px
}
	#story-stackup .db .scrollable .items
{
	width:10000px
}
	#story-stackup .db .scrollable .items .item
{
	opacity:.25;
	filter:alpha(opacity=25);
	cursor:pointer;
	text-align:center;
	float:left;
	width:200px
}
	#story-stackup .db .specs
{
	font:20px "Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	margin-bottom:80px
}
	#story-stackup .db .specs ul
{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	font-weight:bold;
	margin:0 0 0 3%;
	float:left;
	width:50%
}
	#story-stackup .db .specs ul.labels
{
	border-right:1px #ccc solid;
	text-align:right;
	padding:0 3% 0 0;
	margin:0;
	width:47%;
	font-weight:normal
}
	#story-stackup .db .specs ul li
{
	margin:0 0 20px 0;
	float:left;
	width:100%
}
	#story-stackup .photo
{
	background:url('/resources/img/story/stackup/final/bg.jpg') center bottom #0066a4 no-repeat;
	background-size:cover;
	padding:350px 0 0 0;
	width:100%;
	min-height:700px;
	color:#fff
}
	#story-stackup .photo .site-width
{
	margin-top:-350px
}
	#story-stackup .final
{
	padding:100px 0 0 0;
	background:#fff
}
	#story-stackup .final .interaction-wrap
{
	color:#80b3d2
}
	#story-stackup .final .phone-wrapper
{
	margin:40px 0 0 0
}
	#story-stackup .final .phone-wrapper img
{
	position:relative;
	display:block;
	margin:0 auto;
	max-width:1020px;
	width:90%
}
	#story-stackup .final .phone-wrapper .info
{
	margin:-180px 0 0 43%;
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-o-transition:all .3s;
	transition:all .3s;
	float:left
}
	#story-stackup .final .phone-wrapper .info .stroke
{
	float:left;
	width:630px;
	height:90px
}
	#story-stackup .final .phone-wrapper .info .copy
{
	margin:20px 0 0 20px;
	font:18px "nanumpenscript",Helvetica,Arial,sans-serif;
	float:right;
	width:120px
}
	#story-stackup .final .gallery
{
	border:1px #ddd solid
}
	#story-stackup .what-we-learned
{
	background:#e6e6e6;
	color:#595959
}
	#story-stackup .what-we-learned h2
{
	color:#333
}
	#story-stackup .what-we-learned h2.handwritten
{
	color:#0066a4
}
	@media all and (max-width:1520px)
{
	#story-stackup .final .info
{
	display:none
}

}
	@media all and (max-width:1000px)
{
	#story-stackup .intro
{
	padding:320px 0 0 0
}
	#story-stackup .evolution ul
{
	margin:40px 0
}
	#story-stackup .evolution ul li
{
	margin:0 0 60px 0;
	width:50%
}
	#story-stackup .db .side-story img
{
	width:100%
}
	#story-stackup .db .side-story .lining
{
	border:0
}
	#story-stackup .db .side-story .copy
{
	width:100%
}
	#story-stackup .photo
{
	min-height:500px
}

}
	@media all and (max-width:500px)
{
	#story-stackup .intro
{
	padding:200px 0 0 0
}
	#story-stackup .superphones .copy-width
{
	margin-bottom:150px
}
	#story-stackup .evolution .phones
{
	margin-bottom:50px
}
	#story-stackup .evolution .up-top
{
	margin-top:-110px
}
	#story-stackup .evolution .up-top .phones
{
	margin-bottom:40px
}
	#story-stackup .evolution ul
{
	margin:0
}
	#story-stackup .evolution ul li
{
	margin:0 0 40px 0;
	width:100%
}
	#story-stackup .evolution ul li .bell-icon
{
	margin-bottom:20px
}
	#story-stackup .db .scrollable
{
	margin-bottom:50px;
	height:150px
}
	#story-stackup .db .scrollable .items .item
{
	width:100px
}
	#story-stackup .db .scrollable .items .item img
{
	width:100px
}
	#story-stackup .db .specs
{
	margin-bottom:50px
}
	#story-stackup .db .specs ul li
{
	font-size:14px
}
	#story-stackup .db .side-story
{
	margin:50px 0
}
	#story-stackup .doubt .phone
{
	margin:40px auto
}
	#story-stackup .photo
{
	background-size:contain;
	min-height:250px;
	margin:0
}
	#story-stackup .photo .site-width
{
	margin-top:-290px
}
	#story-stackup .final
{
	padding:50px 0
}
	#story-stackup .final .phone-wrapper
{
	margin:20px 0 0 0
}
	#story-stackup .final .phone-wrapper img
{
	margin-bottom:50px
}

}
	#making-tl .intro
{
	background:url(/resources/img/story/teehan-lax/hero.png) no-repeat center center,url(/resources/img/story/teehan-lax/hero-bg.jpg) repeat-x center bottom;
	background-color:#3ea5ce;
	background-size:contain;
	height:900px
}
	#making-tl .intro .copy-width
{
	margin-top:330px;
	color:#fff
}
	#making-tl .intro .author
{
	margin-top:130px;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:13px;
	text-transform:uppercase
}
	#making-tl .intro .author span
{
	display:block;
	text-align:center;
	font-size:13px
}
	#making-tl .its-over
{
	background:url(/resources/img/story/teehan-lax/jon-geoff-convo.jpg) no-repeat center bottom,url(/resources/img/story/teehan-lax/jon-geoff-convo-bg.jpg) repeat-x left bottom;
	background-color:#eee
}
	#making-tl .its-over h2
{
	color:#3ea5ce
}
	#making-tl .its-over p
{
	color:#000
}
	#making-tl .its-over .conversation
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:28px;
	line-height:32px;
	color:#3ea5ce;
	height:700px
}
	#making-tl .its-over .conversation .site-width
{
	position:relative
}
	#making-tl .its-over .bubble
{
	position:absolute;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box
}
	#making-tl .its-over .jon-1
{
	background:url(/resources/img/story/teehan-lax/bubble-1.png) no-repeat left top;
	width:512px;
	height:149px;
	padding:40px 10px 10px 50px;
	top:120px;
	left:180px
}
	#making-tl .its-over .jon-2
{
	background:url(/resources/img/story/teehan-lax/bubble-3.png) no-repeat left top;
	width:387px;
	height:125px;
	padding:30px 100px 10px 58px;
	top:320px;
	left:160px
}
	#making-tl .its-over .geoff-1
{
	background:url(/resources/img/story/teehan-lax/bubble-2.png) no-repeat left top;
	width:505px;
	height:248px;
	padding:55px 190px 10px 80px;
	top:160px;
	right:0
}
	#making-tl .its-over .geoff-2
{
	background:url(/resources/img/story/teehan-lax/bubble-4.png) no-repeat left top;
	width:403px;
	height:151px;
	padding:44px 10px 10px 40px;
	top:410px;
	right:130px
}
	#making-tl .whats-gonna-be
{
	background:#eee url(/resources/img/story/teehan-lax/fuuuu-chart.jpg) no-repeat right 270px
}
	#making-tl .whats-gonna-be blockquote
{
	color:#3fa6cc
}
	#making-tl .whats-gonna-be .time-split
{
	position:relative;
	height:65px;
	margin:60px 0 90px;
	overflow:hidden
}
	#making-tl .whats-gonna-be .time-split .before
{
	position:absolute;
	width:50%;
	height:65px;
	left:3px;
	top:0;
	background:url(/resources/img/story/teehan-lax/time-split-before.png) no-repeat right top;
	-webkit-transition:left .5s;
	-moz-transition:left .5s;
	-o-transition:left .5s;
	transition:left .5s
}
	#making-tl .whats-gonna-be .time-split .after
{
	position:absolute;
	width:50%;
	height:65px;
	left:50%;
	top:0;
	margin-left:-4px;
	background:url(/resources/img/story/teehan-lax/time-split-after.png) no-repeat left top;
	-webkit-transition:margin-left .5s;
	-moz-transition:margin-left .5s;
	-o-transition:margin-left .5s;
	transition:margin-left .5s
}
	#making-tl .whats-gonna-be .time-split.animate .before
{
	left:-40px
}
	#making-tl .whats-gonna-be .time-split.animate .after
{
	margin-left:40px
}
	#making-tl .whats-gonna-be .blue-phone
{
	display:block;
	margin:0 auto 50px;
	max-width:90%
}
	#making-tl .whats-gonna-be .naming-animation
{
	display:block;
	margin:0 auto 100px;
	max-width:70%
}
	#making-tl .whats-gonna-be .first-clients
{
	display:block;
	margin:0 auto 45px;
	text-align:center
}
	#making-tl .whats-gonna-be .first-clients img
{
	margin:0 20px;
	max-width:70%
}
	#making-tl .first-two-years
{
	background:#3ea5ce;
	color:#fff
}
	#making-tl .first-two-years .heat-quote
{
	background:url(/resources/img/story/teehan-lax/heat-screen.jpg) top right no-repeat;
	background-size:cover;
	position:relative;
	margin-bottom:50px;
	height:600px
}
	#making-tl .first-two-years .heat-quote img
{
	width:100%
}
	#making-tl .first-two-years .heat-quote .copy
{
	position:absolute;
	left:0;
	bottom:0;
	padding:200px 40px 40px;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	width:100%;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:50px;
	line-height:72px;
	text-align:center;
	color:#fff;
	background-color:rgba(0,0,0,0.34);
	background-image:-moz-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.85));
	background-image:-webkit-gradient(linear,0 0,0 100%,from(rgba(0,0,0,0)),to(rgba(0,0,0,0.85)));
	background-image:-webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.85));
	background-image:-o-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.85));
	background-image:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0.85));
	background-repeat:repeat-x;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000',endColorstr='#d9000000',GradientType=0);
	background-color:transparent
}
	#making-tl .first-two-years .heat-quote .interaction
{
	position:absolute;
	right:20px;
	bottom:-20px;
	color:#aeaa9f;
	z-index:2
}
	#making-tl .first-two-years .heat-quote .trigger
{
	position:absolute;
	left:0;
	top:0;
	z-index:3;
	width:100%;
	height:100%;
	cursor:pointer
}
	#making-tl .first-two-years .timeline-slider img
{
	margin-left:-903px
}
	#making-tl .growth
{
	background:#eee
}
	#making-tl .growth blockquote
{
	color:#99ca74
}
	#making-tl .growth .client-logos-2004
{
	max-width:100%;
	margin:30px 0 70px
}
	#making-tl .growth .timeline-slider img
{
	margin-left:-1072px
}
	#making-tl .growth .program-options
{
	overflow:hidden;
	margin:70px 0 40px
}
	#making-tl .growth .program-options .option
{
	float:left;
	width:45%;
	margin-right:10%;
	text-align:center
}
	#making-tl .growth .program-options .option .stacked-letters
{
	display:inline-block;
	position:relative;
	max-width:70%
}
	#making-tl .growth .program-options .option .stacked-letters img
{
	max-width:100%
}
	#making-tl .growth .program-options .option .stacked-letters .stacked
{
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	opacity:0;
	-webkit-transition:opacity .6s;
	-moz-transition:opacity .6s;
	-o-transition:opacity .6s;
	transition:opacity .6s
}
	#making-tl .growth .program-options .option img
{
	max-width:70%
}
	#making-tl .growth .program-options .option .title
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:24px;
	font-weight:700;
	margin:30px 0 20px
}
	#making-tl .growth .program-options .option p
{
	font-size:18px;
	line-height:30px;
	font-style:italic
}
	#making-tl .growth .program-options .option:last-child
{
	margin-right:0
}
	#making-tl .growth .program-options .option-a img
{
	margin:10px 0 8px
}
	#making-tl .growth .program-options.animate .option .stacked-letters .stacked
{
	opacity:1
}
	#making-tl .growth .lizard
{
	position:relative;
	width:100%;
	height:365px;
	overflow:hidden
}
	#making-tl .growth .lizard .site-width
{
	position:relative;
	height:100%
}
	#making-tl .growth .lizard .colour
{
	position:absolute;
	top:0;
	left:0;
	width:1330px;
	height:100%
}
	#making-tl .growth .lizard .green
{
	background:url(/resources/img/story/teehan-lax/lizard-green.jpg) no-repeat center top;
	opacity:0;
	z-index:2;
	-webkit-transition:opacity 4s;
	-moz-transition:opacity 4s;
	-o-transition:opacity 4s;
	transition:opacity 4s
}
	#making-tl .growth .lizard .blue
{
	background:url(/resources/img/story/teehan-lax/lizard-blue.jpg) no-repeat center top;
	z-index:1
}
	#making-tl .growth .lizard.animate .green
{
	opacity:1
}
	#making-tl .tough-times
{
	background:#3ea5ce;
	color:#fff
}
	#making-tl .tough-times blockquote
{
	color:#3284a5
}
	#making-tl .tough-times .tl-guys
{
	color:#3284a5
}
	#making-tl .tough-times .booklet
{
	max-width:100%
}
	#making-tl .tough-times .timeline-slider
{
	margin-top:50px
}
	#making-tl .tough-times .timeline-slider img
{
	margin-left:-1313px
}
	#making-tl .tis-the-season
{
	background:#eee;
	padding-bottom:0
}
	#making-tl .tis-the-season .row
{
	*zoom:1;
	width:100%;
	margin-bottom:30px
}
	#making-tl .tis-the-season .row:before,#making-tl .tis-the-season .row:after
{
	display:table;
	content:"";
	line-height:0
}
	#making-tl .tis-the-season .row:after
{
	clear:both
}
	#making-tl .tis-the-season .left,#making-tl .tis-the-season .right
{
	float:left;
	width:48.2%;
	margin:0 .8999999999999999%
}
	#making-tl .tis-the-season .left-copy
{
	float:left;
	width:39.866666666666674%;
	margin:0 .8999999999999999%;
	margin-left:9.233333333333334%
}
	#making-tl .tis-the-season .right-copy
{
	float:left;
	width:39.866666666666674%;
	margin:0 .8999999999999999%
}
	#making-tl .tis-the-season .inset
{
	float:left;
	width:75.68%;
	margin:0 2.1599999999999997%;
	margin-left:17.28%
}
	#making-tl .tis-the-season .interaction-wrap
{
	color:#b7baba;
	margin-bottom:40px
}
	#making-tl .tis-the-season .cosby
{
	margin:60px 0
}
	#making-tl .card
{
	-webkit-perspective:1500px;
	position:relative;
	cursor:pointer;
	width:100%
}
	#making-tl .card .tile
{
	width:100%;
	height:100%;
	position:absolute
}
	#making-tl .card .front
{
	-webkit-transition-duration:.75s;
	-moz-transition-duration:.75s;
	-o-transition-duration:.75s;
	transition-duration:.75s;
	-webkit-transform-origin:8px 8px;
	-moz-transform-origin:8px 8px;
	-o-transform-origin:8px 8px;
	transform-origin:8px 8px;
	-webkit-transform-style:preserve-3d;
	-moz-transform-style:preserve-3d;
	-o-transform-style:preserve-3d;
	transform-style:preserve-3d;
	z-index:2
}
	#making-tl .card .front .outside,#making-tl .card .front .inside
{
	position:absolute;
	background-size:100%;
	background-repeat:no-repeat;
	-webkit-backface-visibility:hidden;
	-moz-backface-visibility:hidden;
	-o-backface-visibility:hidden;
	backface-visibility:hidden
}
	#making-tl .card .front .inside
{
	-webkit-transform:rotateX(180deg);
	-moz-transform:rotateX(180deg);
	-o-transform:rotateX(180deg);
	transform:rotateX(180deg)
}
	#making-tl .card .front:hover
{
	-webkit-transform:rotateX(10deg);
	-moz-transform:rotateX(10deg);
	-o-transform:rotateX(10deg);
	transform:rotateX(10deg)
}
	#making-tl .card .bottom
{
	position:static;
	z-index:1;
	width:100%;
	height:auto
}
	#making-tl .card.open .front
{
	-webkit-transform:rotateX(180deg);
	-moz-transform:rotateX(180deg);
	-o-transform:rotateX(180deg);
	transform:rotateX(180deg)
}
	#making-tl .holiday-2002 .outside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2002-front.png)
}
	#making-tl .holiday-2002 .inside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2002-inside.png)
}
	#making-tl .holiday-2005 .outside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2005-front.png)
}
	#making-tl .holiday-2005 .inside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2005-inside.png)
}
	#making-tl .holiday-2006 .outside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2006-front.png)
}
	#making-tl .holiday-2006 .inside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2006-inside.png)
}
	#making-tl .holiday-2007 .outside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2007-front.png)
}
	#making-tl .holiday-2007 .inside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2007-inside.png)
}
	#making-tl .holiday-2008 .front .inside
{
	-webkit-transform:rotateY(180deg);
	-moz-transform:rotateY(180deg);
	-o-transform:rotateY(180deg);
	transform:rotateY(180deg)
}
	#making-tl .holiday-2008:hover .front
{
	-webkit-transform:rotateY(-10deg);
	-moz-transform:rotateY(-10deg);
	-o-transform:rotateY(-10deg);
	transform:rotateY(-10deg)
}
	#making-tl .holiday-2008 .outside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2008-front.png)
}
	#making-tl .holiday-2008 .inside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2008-inside.png)
}
	#making-tl .holiday-2008.open .front
{
	-webkit-transform:rotateY(-180deg);
	-moz-transform:rotateY(-180deg);
	-o-transform:rotateY(-180deg);
	transform:rotateY(-180deg)
}
	#making-tl .holiday-2009 .outside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2009-front.png)
}
	#making-tl .holiday-2009 .inside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2009-inside.png)
}
	#making-tl .holiday-2010 .outside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2010-front.png)
}
	#making-tl .holiday-2010 .inside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2010-inside.png)
}
	#making-tl .holiday-2011 .outside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2011-front.png)
}
	#making-tl .holiday-2011 .inside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2011-inside.png)
}
	#making-tl .holiday-2012 .outside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2012-front.png)
}
	#making-tl .holiday-2012 .inside
{
	background:url(/resources/img/story/teehan-lax/xmas-cards/2012-inside.png)
}
	#making-tl .timeline-slider
{
	position:relative;
	overflow:hidden;
	margin-bottom:-50px
}
	#making-tl .timeline-slider .dates
{
	position:absolute;
	bottom:-0.23em;
	width:100%;
	z-index:0;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:300px;
	letter-spacing:-0.03em;
	font-weight:700;
	text-align:center;
	color:rgba(0,0,0,0.2)
}
	#making-tl .timeline-slider .slider-wrap
{
	position:relative;
	z-index:2;
	width:100%;
	overflow:hidden
}
	#making-tl .timeline-slider .slider-wrap img
{
	position:relative;
	display:block;
	left:50%;
	cursor:hand;
	cursor:grab;
	cursor:-moz-grab;
	cursor:-webkit-grab
}
	#making-tl .timeline-slider .slider-wrap img.grabbing
{
	cursor:hand;
	cursor:grabbing;
	cursor:-moz-grabbing;
	cursor:-webkit-grabbing
}
	#making-tl .timeline-slider .slider-wrap img.no-grab
{
	cursor:default
}
	#making-tl .sites-gallery
{
	margin:70px 0 0;
	height:747px;
	background:#3894b9 url('/resources/img/story/teehan-lax/sites-on-monitors-bg.png') repeat-x bottom left;
	-webkit-transition:all 1s;
	-moz-transition:all 1s;
	-o-transition:all 1s;
	transition:all 1s
}
	#making-tl .sites-gallery .slider-wrap
{
	height:100%;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-transition:all 1s;
	-moz-transition:all 1s;
	-o-transition:all 1s;
	transition:all 1s
}
	#making-tl .sites-gallery img
{
	-webkit-transition:all 1s;
	-moz-transition:all 1s;
	-o-transition:all 1s;
	transition:all 1s;
	height:100%;
	opacity:1;
	filter:alpha(opacity=100);
	margin-left:-2722px
}
	#making-tl .sites-gallery img.grabbing
{
	-webkit-transition:none;
	-moz-transition:none;
	-o-transition:none;
	transition:none
}
	#making-tl .sites-gallery.closed
{
	height:200px;
	cursor:pointer
}
	#making-tl .sites-gallery.closed .slider-wrap
{
	padding:20px 0
}
	#making-tl .sites-gallery.closed .copy
{
	opacity:1;
	filter:alpha(opacity=100)
}
	#making-tl .sites-gallery.closed .close-button
{
	opacity:0;
	filter:alpha(opacity=0)
}
	#making-tl .sites-gallery.closed img
{
	-webkit-filter:grayscale(1);
	opacity:.2;
	filter:alpha(opacity=20);
	margin-left:-470px
}
	#making-tl .sites-gallery.opened img
{
	-webkit-transition:all 0;
	-moz-transition:all 0;
	-o-transition:all 0;
	transition:all 0
}
	#making-tl .sites-gallery .copy
{
	width:100%;
	top:70px;
	position:absolute;
	z-index:3;
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transition:opacity 1s;
	-moz-transition:opacity 1s;
	-o-transition:opacity 1s;
	transition:opacity 1s
}
	#making-tl .sites-gallery .copy h3,#making-tl .sites-gallery .copy h5
{
	color:#fff;
	text-align:center;
	margin:0
}
	#making-tl .sites-gallery .close-button
{
	position:absolute;
	top:13px;
	right:20px;
	z-index:3;
	color:#fff;
	opacity:1;
	filter:alpha(opacity=100);
	-webkit-transition:opacity 1s;
	-moz-transition:opacity 1s;
	-o-transition:opacity 1s;
	transition:opacity 1s;
	cursor:pointer
}
	#making-tl .iphone-psd
{
	margin:70px 0;
	position:relative;
	text-align:center
}
	#making-tl .iphone-psd img
{
	max-width:100%
}
	#making-tl .iphone-psd .elements
{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:2;
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transition:opacity 1s;
	-moz-transition:opacity 1s;
	-o-transition:opacity 1s;
	transition:opacity 1s
}
	#making-tl .iphone-psd.animate .elements
{
	opacity:1;
	filter:alpha(opacity=100)
}
	#making-tl .four-twenty
{
	text-align:center
}
	#making-tl .four-twenty img
{
	max-width:100%;
	margin-bottom:70px
}
	#making-tl .paying-it-forward
{
	background:#f3f3f3;
	color:#404040
}
	#making-tl .what-we-learned
{
	background-color:#ddd
}
	#making-tl .what-we-learned .number
{
	display:block;
	text-align:center;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:230px;
	font-weight:bold;
	color:#f3f3f3;
	margin-bottom:-320px
}
	#making-tl .what-we-learned .year
{
	display:block;
	text-align:center;
	font-size:24px;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	margin:-50px 0 40px 0
}
	@media all and (max-width:1000px) and (min-width:500px)
{
	#making-tl .its-over
{
	background:url(/resources/img/story/teehan-lax/jon-geoff-convo-bg.jpg) repeat-x left bottom;
	background-color:#eee
}
	#making-tl .its-over .jon-1
{
	top:70px;
	left:60px
}
	#making-tl .its-over .jon-2
{
	top:395px;
	left:30px
}
	#making-tl .its-over .geoff-1
{
	width:375px;
	padding:55px 70px 10px 60px;
	top:170px;
	right:0
}
	#making-tl .its-over .geoff-2
{
	top:510px;
	right:0
}
	#making-tl .first-two-years .heat-quote
{
	height:400px
}
	#making-tl .first-two-years .heat-quote .copy
{
	padding:80px 25px 25px;
	font-size:30px;
	line-height:36px
}
	#making-tl .growth .program-options .option .title
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:22px;
	font-weight:700;
	margin:15px 0 10px
}
	#making-tl .growth .program-options .option p
{
	font-size:15px;
	line-height:27px;
	font-style:italic
}
	#making-tl .intro
{
	height:700px
}
	#making-tl .intro .copy-width
{
	margin-top:230px
}
	#making-tl .intro .author
{
	margin-top:110px
}
	#making-tl .timeline-slider
{
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center bottom;
	height:530px
}
	#making-tl .timeline-slider .dates,#making-tl .timeline-slider img,#making-tl .timeline-slider .slider-wrap
{
	display:none
}
	#making-tl .timeline-slider-1
{
	background-image:url(/resources/img/story/teehan-lax/timeline-2002-2004-static.png)
}
	#making-tl .timeline-slider-2
{
	background-image:url(/resources/img/story/teehan-lax/timeline-2004-2009-static.png)
}
	#making-tl .timeline-slider-3
{
	background-image:url(/resources/img/story/teehan-lax/timeline-2009-2012-static.png)
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#making-tl .its-over
{
	background:url(/resources/img/story/teehan-lax/jon-geoff-convo-bg.jpg) repeat-x left bottom;
	background-color:#eee
}
	#making-tl .its-over .conversation
{
	font-size:20px;
	line-height:23px
}
	#making-tl .its-over .bubble
{
	width:80%;
	background-size:contain
}
	#making-tl .its-over .jon-1
{
	padding:11% 0 0 15%;
	top:60px;
	left:20px
}
	#making-tl .its-over .jon-2
{
	padding:10% 0 0 20%;
	top:388px;
	left:0
}
	#making-tl .its-over .geoff-1
{
	padding:14% 1% 0 10%;
	top:190px;
	right:0
}
	#making-tl .its-over .geoff-2
{
	padding:12% 0 0 13%;
	top:508px;
	right:0
}
	#making-tl .whats-gonna-be .first-clients
{
	max-width:90%
}
	#making-tl #pvr-report
{
	display:none
}
	#making-tl .timeline-slider
{
	margin-bottom:0
}
	#making-tl .first-two-years .heat-quote
{
	height:300px
}
	#making-tl .first-two-years .heat-quote .copy
{
	padding:70px 20px 20px;
	font-size:20px;
	line-height:22px
}
	#making-tl .first-two-years .heat-quote .interaction
{
	right:10px;
	bottom:-30px;
	font-size:10px
}
	#making-tl .growth .program-options .option .title
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:20px;
	font-weight:700;
	margin:15px 0 10px
}
	#making-tl .growth .program-options .option p
{
	font-size:13px;
	line-height:20px;
	font-style:italic
}
	#making-tl .tis-the-season .row
{
	margin-bottom:0
}
	#making-tl .tis-the-season .left,#making-tl .tis-the-season .right
{
	float:left;
	width:98.2%;
	margin:0 .8999999999999999%
}
	#making-tl .tis-the-season .left-copy
{
	float:left;
	width:98.2%;
	margin:0 .8999999999999999%;
	margin-left:.8999999999999999%
}
	#making-tl .tis-the-season .right-copy
{
	float:left;
	width:98.2%;
	margin:0 .8999999999999999%
}
	#making-tl .tis-the-season .inset
{
	float:left;
	width:95.68%;
	margin:0 2.1599999999999997%;
	margin-left:0
}
	#making-tl .tis-the-season .interaction,#making-tl .tis-the-season .holiday-2002,#making-tl .tis-the-season .holiday-2005,#making-tl .tis-the-season .holiday-2006,#making-tl .tis-the-season .holiday-2007,#making-tl .tis-the-season .cosby
{
	display:none
}
	#making-tl .tis-the-season .holiday-2010,#making-tl .tis-the-season .holiday-2012
{
	margin-bottom:20px
}
	#making-tl .intro
{
	height:410px
}
	#making-tl .intro .copy-width
{
	margin-top:80px
}
	#making-tl .intro .author
{
	margin-top:50px;
	font-size:14px
}
	#making-tl .intro .author img
{
	width:70px
}
	#making-tl .sites-gallery
{
	display:none
}
	#making-tl .what-we-learned .number
{
	font-size:140px;
	margin-bottom:-165px
}
	#making-tl .what-we-learned .year
{
	font-size:17px;
	margin-top:-30px
}
	#making-tl .timeline-slider
{
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center bottom;
	height:320px
}
	#making-tl .timeline-slider .dates,#making-tl .timeline-slider img,#making-tl .timeline-slider .slider-wrap
{
	display:none
}
	#making-tl .timeline-slider-1
{
	background-image:url(/resources/img/story/teehan-lax/timeline-2002-2004-static.png)
}
	#making-tl .timeline-slider-2
{
	background-image:url(/resources/img/story/teehan-lax/timeline-2004-2009-static.png)
}
	#making-tl .timeline-slider-3
{
	background-image:url(/resources/img/story/teehan-lax/timeline-2009-2012-static.png)
}

}
.medium-image-pop
{
	position:fixed;
	width:100%;
	height:100%;
	z-index:900;
	background:rgba(0,0,0,0.5) url(/resources/img/ui/loader.gif) no-repeat center center;
	text-align:center;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:box;
	-webkit-box-orient:vertical;
	-moz-box-orient:vertical;
	-ms-box-orient:vertical;
	box-orient:vertical;
	-webkit-box-pack:center;
	-moz-box-pack:center;
	-ms-box-pack:center;
	box-pack:center;
	opacity:0;
	top:-1000%;
	-webkit-transition:opacity .5s,top 0 .5s;
	-moz-transition:opacity .5s,top 0 .5s;
	-o-transition:opacity .5s,top 0 .5s;
	transition:opacity .5s,top 0 .5s;
	cursor:pointer
}
.medium-image-pop.active
{
	opacity:1;
	top:0;
	-webkit-transition:opacity .5s,top 0 0;
	-moz-transition:opacity .5s,top 0 0;
	-o-transition:opacity .5s,top 0 0;
	transition:opacity .5s,top 0 0
}
.medium-image-pop img
{
	max-height:90%;
	max-width:90%;
	opacity:0;
	-webkit-box-shadow:2px 2px 3px rgba(0,0,0,0.2);
	-moz-box-shadow:2px 2px 3px rgba(0,0,0,0.2);
	box-shadow:2px 2px 3px rgba(0,0,0,0.2);
	-webkit-transition:opacity .5s;
	-moz-transition:opacity .5s;
	-o-transition:opacity .5s;
	transition:opacity .5s
}
.medium-image-pop img.active
{
	opacity:1
}
.medium-prototype-pop
{
	position:fixed;
	width:100%;
	height:100%;
	z-index:900;
	background:rgba(0,0,0,0.5);
	text-align:center;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:box;
	-webkit-box-orient:vertical;
	-moz-box-orient:vertical;
	-ms-box-orient:vertical;
	box-orient:vertical;
	-webkit-box-pack:center;
	-moz-box-pack:center;
	-ms-box-pack:center;
	box-pack:center;
	opacity:0;
	top:-1000%;
	-webkit-transition:opacity .5s,top 0 .5s;
	-moz-transition:opacity .5s,top 0 .5s;
	-o-transition:opacity .5s,top 0 .5s;
	transition:opacity .5s,top 0 .5s;
	cursor:pointer
}
.medium-prototype-pop.active
{
	opacity:1;
	top:0;
	-webkit-transition:opacity .5s,top 0 0;
	-moz-transition:opacity .5s,top 0 0;
	-o-transition:opacity .5s,top 0 0;
	transition:opacity .5s,top 0 0
}
.medium-prototype-pop video
{
	display:none;
	max-width:90%
}
.medium-prototype-pop video.active
{
	display:inline-block
}
	#story-medium .full-width
{
	max-width:100%
}
	#story-medium ul.checklist li:before
{
	color:#5cb86e
}
	#story-medium .intro-video
{
	width:100%;
	height:894px;
	text-align:center;
	background:url(/resources/img/story/medium/header-bg.jpg) no-repeat top center
}
	#story-medium .intro-video .wrap
{
	position:relative;
	display:inline-block;
	width:1000px;
	max-width:100%;
	height:622px;
	margin-top:269px;
	margin-left:-5px
}
	#story-medium .intro-video .force-bg
{
	position:absolute;
	left:-1000000px;
	top:-1000000px
}
	#story-medium .intro-video #intro-video
{
	position:absolute;
	top:0;
	left:0;
	z-index:2;
	height:100%;
	width:100%
}
	#story-medium .intro
{
	background:#eee;
	background-size:100%
}
	#story-medium .intro .site-width
{
	position:relative;
	z-index:1
}
	#story-medium .intro p
{
	font-style:italic
}
	#story-medium .intro .author
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif
}
	#story-medium .intro .author span
{
	display:block;
	text-align:center;
	font-size:13px
}
	#story-medium .the-beginning
{
	background:#e4e4e4
}
	#story-medium .the-beginning .side-story .fade
{
	position:absolute;
	right:0;
	bottom:0;
	z-index:1;
	width:40%;
	height:75px;
	background:url(/resources/img/story/medium/story-fade.png) repeat-x left bottom
}
	#story-medium .the-beginning .twitter-dm
{
	width:90%;
	margin:60px auto
}
	#story-medium .the-beginning .twitter-dm .bubble
{
	position:relative;
	top:40px;
	opacity:0;
	background:#e2edf3;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
	padding:40px;
	border:1px solid #c2dcea;
	-webkit-transition:all .5s;
	-moz-transition:all .5s;
	-o-transition:all .5s;
	transition:all .5s
}
	#story-medium .the-beginning .twitter-dm.animate .bubble
{
	top:0;
	opacity:1
}
	#story-medium .the-beginning .twitter-dm .point
{
	position:absolute;
	width:35px;
	height:20px;
	background:url(/resources/img/story/medium/dm-point.png) no-repeat left top;
	bottom:-19px;
	left:50%;
	margin-left:-17px
}
	#story-medium .the-beginning .twitter-dm .message
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:20px;
	line-height:30px;
	color:#51504c
}
	#story-medium .the-beginning .twitter-dm .timestamp
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:14px;
	color:#979797;
	margin-top:15px
}
	#story-medium .the-beginning .twitter-dm .timestamp a
{
	color:#1073a9;
	text-decoration:none;
	font-weight:400
}
	#story-medium .the-beginning .twitter-dm .user
{
	margin:40px auto 0;
	width:205px;
	overflow:hidden
}
	#story-medium .the-beginning .twitter-dm .user img
{
	float:left
}
	#story-medium .the-beginning .twitter-dm .user .info
{
	float:left;
	margin-left:25px;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif
}
	#story-medium .the-beginning .twitter-dm .user .info .username
{
	font-size:21px;
	font-weight:700px;
	color:#000;
	text-decoration:none
}
	#story-medium .the-beginning .twitter-dm .user .info .name
{
	font-size:19px;
	color:#a3abad;
	display:block
}
	#story-medium .the-beginning .map
{
	position:relative
}
	#story-medium .the-beginning .map .stats
{
	position:absolute;
	left:50%;
	bottom:150px;
	margin-left:-450px;
	border:1px solid #e5e5e5;
	background:#fff;
	padding:30px 40px
}
	#story-medium .the-beginning .map .stats span
{
	display:block;
	text-align:center
}
	#story-medium .the-beginning .map .stats .count
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:48px;
	font-weight:700;
	color:#343434;
	letter-spacing:-0.05em
}
	#story-medium .the-beginning .map .stats .label
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:27px;
	font-weight:700;
	color:#bbbbba;
	letter-spacing:-0.05em
}
	#story-medium .the-beginning .map .stats .or
{
	position:relative;
	border-top:2px solid #e5e5e5;
	margin:30px 0
}
	#story-medium .the-beginning .map .stats .or span
{
	position:absolute;
	left:50%;
	top:-7px;
	margin-left:-20px;
	margin-top:-10px;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-style:italic;
	font-size:21px;
	font-weight:700;
	color:#343434;
	text-align:center;
	background:#fff;
	padding:0 10px
}
	#story-medium .the-beginning .yyz-sfo-map
{
	display:block;
	margin:0 auto;
	max-width:90%;
	padding-left:90px
}
	#story-medium .medium-team
{
	background:#eee
}
	#story-medium .welcome-to-medium
{
	background-color:#e4e4e4;
	background-image:url(/resources/img/story/medium/tear.png),url(/resources/img/story/medium/tear-bottom.png);
	background-repeat:repeat-x;
	background-position:top center,bottom center;
	padding:50px 0 100px
}
	#story-medium .welcome-to-medium h4
{
	text-align:center
}
	#story-medium .welcome-to-medium .ev-talking
{
	font-style:italic
}
	#story-medium .welcome-to-medium .content-editable-sample
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:150px;
	line-height:130px;
	font-weight:700;
	letter-spacing:-0.05em;
	color:#bebebe;
	text-align:center;
	outline:0;
	margin:50px 0 100px;
	-ms-word-break:break-all;
	word-break:break-all;
	word-break:break-word
}
	#story-medium .welcome-to-medium .post-wrapper
{
	position:relative;
	height:290px;
	margin:50px 0 60px;
	overflow:hidden;
	padding-bottom:5px
}
	#story-medium .welcome-to-medium .posts-container
{
	position:absolute;
	left:50%;
	top:0;
	width:915px;
	height:292px;
	margin-left:-425px
}
	#story-medium .welcome-to-medium .posts-container .post
{
	float:left;
	width:240px;
	height:290px;
	margin-right:65px;
	margin-top:2px;
	background:#fff url(/resources/img/story/medium/post-fake-copy.png) no-repeat 35px 160px;
	-webkit-box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	-moz-box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-o-transition:all .3s;
	transition:all .3s
}
	#story-medium .welcome-to-medium .posts-container .post:hover
{
	-webkit-transform:translate(-2px,-2px);
	-moz-transform:translate(-2px,-2px);
	-ms-transform:translate(-2px,-2px);
	-o-transform:translate(-2px,-2px);
	transform:translate(-2px,-2px);
	-webkit-box-shadow:3px 3px 4px rgba(0,0,0,0.1);
	-moz-box-shadow:3px 3px 4px rgba(0,0,0,0.1);
	box-shadow:3px 3px 4px rgba(0,0,0,0.1)
}
	#story-medium .welcome-to-medium .posts-container .post .title
{
	display:block;
	width:170px;
	margin:0 auto;
	text-align:center;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-weight:700;
	font-size:23px;
	line-height:30px;
	color:#5cb86e;
	margin-top:40px
}
	#story-medium .welcome-to-medium .posts-container .post .author
{
	display:block;
	width:170px;
	margin:5px auto;
	text-align:center;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:15px;
	color:#000
}
	#story-medium .welcome-to-medium .collections-wrapper
{
	position:relative;
	margin:50px 0;
	height:350px;
	width:100%;
	overflow:hidden;
	padding-bottom:60px
}
	#story-medium .welcome-to-medium .collections-wrapper .direction
{
	width:16px;
	height:25px;
	bottom:0;
	top:auto;
	background:lime;
	opacity:.6;
	-webkit-transition:opacity .2s;
	-moz-transition:opacity .2s;
	-o-transition:opacity .2s;
	transition:opacity .2s;
	cursor:pointer
}
	#story-medium .welcome-to-medium .collections-wrapper .direction:hover
{
	opacity:1
}
	#story-medium .welcome-to-medium .collections-wrapper .next
{
	left:50%;
	margin-left:20px;
	background:url(/resources/img/ui/right-arrow.png) no-repeat left top
}
	#story-medium .welcome-to-medium .collections-wrapper .prev
{
	left:50%;
	margin-left:-36px;
	background:url(/resources/img/ui/left-arrow.png) no-repeat left top
}
	#story-medium .welcome-to-medium .collections-wrapper .container
{
	position:absolute;
	top:0;
	left:50%;
	width:2520px;
	margin-left:-1240px;
	height:352px
}
	#story-medium .welcome-to-medium .collections-wrapper .container .item
{
	margin-right:0
}
	#story-medium .welcome-to-medium .collections-wrapper .container .collection
{
	position:relative;
	float:left;
	width:240px;
	height:350px;
	margin-right:40px;
	margin-top:2px;
	-webkit-box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	-moz-box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-o-transition:all .3s;
	transition:all .3s
}
	#story-medium .welcome-to-medium .collections-wrapper .container .collection:hover
{
	-webkit-transform:translate(-2px,-2px);
	-moz-transform:translate(-2px,-2px);
	-ms-transform:translate(-2px,-2px);
	-o-transform:translate(-2px,-2px);
	transform:translate(-2px,-2px);
	-webkit-box-shadow:3px 3px 4px rgba(0,0,0,0.1);
	-moz-box-shadow:3px 3px 4px rgba(0,0,0,0.1);
	box-shadow:3px 3px 4px rgba(0,0,0,0.1)
}
	#story-medium .welcome-to-medium .collections-wrapper .container .collection .copy
{
	position:absolute;
	width:190px;
	left:25px;
	bottom:25px;
	text-shadow:0 1px 2px rgba(0,0,0,0.5)
}
	#story-medium .welcome-to-medium .collections-wrapper .container .collection .title
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:22px;
	font-weight:700;
	line-height:24px;
	color:#fff
}
	#story-medium .welcome-to-medium .collections-wrapper .container .collection .post-count
{
	display:block;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:16px;
	color:#fff
}
	#story-medium .welcome-to-medium .collections-wrapper .container .editors-picks
{
	background:url(/resources/img/story/medium/collections/editors-picks.jpg) no-repeat left top
}
	#story-medium .welcome-to-medium .collections-wrapper .container .i-heart-video-games
{
	background:url(/resources/img/story/medium/collections/i-heart-video-games.jpg) no-repeat left top
}
	#story-medium .welcome-to-medium .collections-wrapper .container .tech-talk
{
	background:url(/resources/img/story/medium/collections/tech-talk.jpg) no-repeat left top
}
	#story-medium .welcome-to-medium .collections-wrapper .container .look-what-i-made
{
	background:url(/resources/img/story/medium/collections/look-what-i-made.jpg) no-repeat left top
}
	#story-medium .welcome-to-medium .collections-wrapper .container .we-live-in-the-future
{
	background:url(/resources/img/story/medium/collections/we-live-in-the-future.jpg) no-repeat left top
}
	#story-medium .welcome-to-medium .collections-wrapper .container .what-i-learned-today
{
	background:url(/resources/img/story/medium/collections/what-i-learned-today.jpg) no-repeat left top
}
	#story-medium .welcome-to-medium .collections-wrapper .container .imho
{
	background:url(/resources/img/story/medium/collections/imho.jpg) no-repeat left top
}
	#story-medium .welcome-to-medium .collections-wrapper .container .design-ux
{
	background:url(/resources/img/story/medium/collections/design-ux.jpg) no-repeat left top
}
	#story-medium .welcome-to-medium .collections-wrapper .container .on-startups
{
	background:url(/resources/img/story/medium/collections/on-startups.jpg) no-repeat left top
}
	#story-medium .the-journey
{
	background:#eee
}
	#story-medium .the-journey h4
{
	text-align:center
}
	#story-medium .the-journey .two-paths
{
	background:url(/resources/img/story/medium/or-circle.png) no-repeat center 100px;
	overflow:hidden;
	margin:70px 0 40px
}
	#story-medium .the-journey .two-paths .option
{
	float:left;
	width:45%;
	margin-right:10%;
	text-align:center;
	-webkit-transition:opacity 1s;
	-moz-transition:opacity 1s;
	-o-transition:opacity 1s;
	transition:opacity 1s
}
	#story-medium .the-journey .two-paths .option:last-child
{
	margin-right:0
}
	#story-medium .the-journey .two-paths .option.writing img
{
	margin:5px 0 0
}
	#story-medium .the-journey .two-paths .option.fade
{
	opacity:.4
}
	#story-medium .the-journey .two-paths img
{
	max-width:100%
}
	#story-medium .the-journey .two-paths .title
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:24px;
	font-weight:700;
	margin:30px 0 20px
}
	#story-medium .the-journey .two-paths p
{
	font-size:18px;
	line-height:30px;
	font-style:italic
}
	#story-medium .the-journey .prototype-wrapper
{
	padding-top:20px
}
	#story-medium .the-journey .prototype-wrapper .row
{
	*zoom:1
}
	#story-medium .the-journey .prototype-wrapper .row:before,#story-medium .the-journey .prototype-wrapper .row:after
{
	display:table;
	content:"";
	line-height:0
}
	#story-medium .the-journey .prototype-wrapper .row:after
{
	clear:both
}
	#story-medium .the-journey .prototype-wrapper .prototype
{
	position:relative;
	float:left;
	width:32%;
	margin:1%;
	background:#000;
	overflow:hidden;
	cursor:pointer
}
	#story-medium .the-journey .prototype-wrapper .prototype:first-child
{
	margin-left:0
}
	#story-medium .the-journey .prototype-wrapper .prototype:last-child
{
	margin-right:0
}
	#story-medium .the-journey .prototype-wrapper .prototype:hover img
{
	opacity:.6
}
	#story-medium .the-journey .prototype-wrapper .prototype img
{
	position:relative;
	top:0;
	left:0;
	width:100%;
	z-index:0;
	opacity:.4;
	-webkit-transition:opacity .3s;
	-moz-transition:opacity .3s;
	-o-transition:opacity .3s;
	transition:opacity .3s
}
	#story-medium .the-journey .prototype-wrapper .prototype span
{
	position:absolute;
	top:50%;
	margin-top:-10px;
	left:0;
	z-index:1;
	width:100%;
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:24px;
	font-weight:bold;
	color:#fff;
	text-align:center
}
	#story-medium .the-journey .initial-build
{
	margin-bottom:50px;
	margin-top:50px
}
	#story-medium .what-we-made
{
	background:#e4e4e4
}
	#story-medium .what-we-made h3
{
	text-align:center
}
	#story-medium .what-we-made .download
{
	border-top:1px solid #d5d5d4;
	border-bottom:1px solid #d5d5d4;
	padding:40px 0;
	margin-top:50px
}
	#story-medium .what-we-made .download p
{
	font-size:24px;
	line-height:39px;
	color:#b3b3b1;
	text-align:center;
	margin-bottom:0
}
	#story-medium .what-we-made .download a
{
	color:#3ea5ce;
	font-weight:400;
	text-decoration:none
}
	#story-medium .what-we-made .download a:hover
{
	color:#2887ac
}
	#story-medium .what-we-made .branding
{
	position:relative;
	overflow:hidden
}
	#story-medium .what-we-made .branding .spacer
{
	width:100%
}
	#story-medium .what-we-made .branding .backgrounds
{
	position:relative;
	top:0;
	left:0;
	z-index:0;
	width:100%;
	height:100%
}
	#story-medium .what-we-made .branding .backgrounds img
{
	position:absolute;
	top:0;
	left:0;
	width:100%
}
	#story-medium .what-we-made .branding .backgrounds .confetti
{
	width:110%;
	left:-5%
}
	#story-medium .what-we-made .branding.animate .backgrounds .natives
{
	-webkit-transition:width 4s linear 0,left 4s linear 0s,opacity 1s linear 3.5s;
	-moz-transition:width 4s linear 0,left 4s linear 0s,opacity 1s linear 3.5s;
	-o-transition:width 4s linear 0,left 4s linear 0s,opacity 1s linear 3.5s;
	transition:width 4s linear 0,left 4s linear 0s,opacity 1s linear 3.5s;
	width:110%;
	opacity:0;
	left:-10%
}
	#story-medium .what-we-made .branding.animate .backgrounds .clay
{
	-webkit-transition:width 4s linear 4s,opacity 1s linear 7.5s;
	-moz-transition:width 4s linear 4s,opacity 1s linear 7.5s;
	-o-transition:width 4s linear 4s,opacity 1s linear 7.5s;
	transition:width 4s linear 4s,opacity 1s linear 7.5s;
	width:110%;
	opacity:0
}
	#story-medium .what-we-made .branding.animate .backgrounds .confetti
{
	-webkit-transition:width 4s linear 8s,left 4s linear 8s,opacity 1s linear 11.5s;
	-moz-transition:width 4s linear 8s,left 4s linear 8s,opacity 1s linear 11.5s;
	-o-transition:width 4s linear 8s,left 4s linear 8s,opacity 1s linear 11.5s;
	transition:width 4s linear 8s,left 4s linear 8s,opacity 1s linear 11.5s;
	width:100%;
	opacity:0;
	left:0
}
	#story-medium .what-we-made .branding.animate .backgrounds .polo
{
	-webkit-transition:width 4s linear 12s,top 4s linear 12s,opacity 1s linear 15.5s;
	-moz-transition:width 4s linear 12s,top 4s linear 12s,opacity 1s linear 15.5s;
	-o-transition:width 4s linear 12s,top 4s linear 12s,opacity 1s linear 15.5s;
	transition:width 4s linear 12s,top 4s linear 12s,opacity 1s linear 15.5s;
	width:110%;
	opacity:0;
	top:-10%
}
	#story-medium .what-we-made .branding.animate .backgrounds .papers
{
	-webkit-transition:width 4s linear 16s,left 4s linear 16s,top 4s linear 16s,opacity 1s linear 19.5s;
	-moz-transition:width 4s linear 16s,left 4s linear 16s,top 4s linear 16s,opacity 1s linear 19.5s;
	-o-transition:width 4s linear 16s,left 4s linear 16s,top 4s linear 16s,opacity 1s linear 19.5s;
	transition:width 4s linear 16s,left 4s linear 16s,top 4s linear 16s,opacity 1s linear 19.5s;
	width:110%;
	opacity:0;
	left:-10%;
	top:-10%
}
	#story-medium .what-we-made .branding.animate .backgrounds .mountains
{
	-webkit-transition:width 4s linear 20s,left 4s linear 20s,top 4s linear 20s,opacity 1s linear 23.5s;
	-moz-transition:width 4s linear 20s,left 4s linear 20s,top 4s linear 20s,opacity 1s linear 23.5s;
	-o-transition:width 4s linear 20s,left 4s linear 20s,top 4s linear 20s,opacity 1s linear 23.5s;
	transition:width 4s linear 20s,left 4s linear 20s,top 4s linear 20s,opacity 1s linear 23.5s;
	width:110%;
	opacity:0;
	left:-5%;
	top:-5%
}
	#story-medium .what-we-made .branding.animate .backgrounds .fight
{
	-webkit-transition:width 4s linear 24s,left 4s linear 24s;
	-moz-transition:width 4s linear 24s,left 4s linear 24s;
	-o-transition:width 4s linear 24s,left 4s linear 24s;
	transition:width 4s linear 24s,left 4s linear 24s;
	width:110%;
	top:-5%
}
	#story-medium .what-we-made .branding .logo
{
	background:url(/resources/img/story/medium/medium-branding-guts.png) no-repeat left top;
	position:absolute;
	left:50%;
	top:50%;
	z-index:1;
	margin-left:-110px;
	margin-top:-110px;
	width:516px;
	height:363px
}
	#story-medium .what-we-made .style-guide .mobile
{
	display:none
}
	#story-medium .what-we-made .style-guide .desktop
{
	display:inline
}
	#story-medium .what-we-made .style-guide img
{
	max-width:100%
}
	#story-medium .what-we-made .style-guide .sample
{
	text-align:center
}
	#story-medium .what-we-made .template-wrapper .row
{
	*zoom:1;
	margin-bottom:100px
}
	#story-medium .what-we-made .template-wrapper .row:before,#story-medium .what-we-made .template-wrapper .row:after
{
	display:table;
	content:"";
	line-height:0
}
	#story-medium .what-we-made .template-wrapper .row:after
{
	clear:both
}
	#story-medium .what-we-made .template-wrapper .template
{
	float:left;
	width:28%;
	margin-right:8%;
	cursor:pointer
}
	#story-medium .what-we-made .template-wrapper .template:last-child
{
	margin-right:0
}
	#story-medium .what-we-made .template-wrapper .template:hover img
{
	-webkit-transform:translate(-2px,-2px);
	-moz-transform:translate(-2px,-2px);
	-ms-transform:translate(-2px,-2px);
	-o-transform:translate(-2px,-2px);
	transform:translate(-2px,-2px);
	-webkit-box-shadow:3px 3px 4px rgba(0,0,0,0.1);
	-moz-box-shadow:3px 3px 4px rgba(0,0,0,0.1);
	box-shadow:3px 3px 4px rgba(0,0,0,0.1)
}
	#story-medium .what-we-made .template-wrapper .template img
{
	width:100%;
	-webkit-box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	-moz-box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-o-transition:all .3s;
	transition:all .3s
}
	#story-medium .what-we-made .template-wrapper .template .name
{
	display:block;
	text-align:center;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:20px;
	color:#767676
}
	@media all and (max-width:1000px) and (min-width:500px)
{
	#story-medium .intro-video
{
	height:600px;
	background-size:cover
}
	#story-medium .intro-video #intro-video
{
	display:none
}
	#story-medium .the-beginning .map .stats
{
	margin:-55px auto 0 auto;
	padding:22px 0;
	width:400px;
	position:relative;
	left:auto;
	bottom:auto;
	*zoom:1
}
	#story-medium .the-beginning .map .stats:before,#story-medium .the-beginning .map .stats:after
{
	display:table;
	content:"";
	line-height:0
}
	#story-medium .the-beginning .map .stats:after
{
	clear:both
}
	#story-medium .the-beginning .map .stats .count
{
	font-size:28px
}
	#story-medium .the-beginning .map .stats .label
{
	font-size:18px
}
	#story-medium .the-beginning .map .stats .wrap
{
	float:left;
	width:200px
}
	#story-medium .the-beginning .map .stats .wrap:last-child
{
	border-left:2px solid #e5e5e5;
	width:198px
}
	#story-medium .the-beginning .map .stats .or
{
	border-top:0;
	margin:0;
	position:absolute;
	width:30px;
	top:39px;
	left:50%;
	margin-left:-15px
}
	#story-medium .the-beginning .map .stats .or span
{
	left:auto;
	top:auto;
	margin-top:auto;
	margin-left:auto;
	position:static;
	padding:0;
	font-size:15px
}
	#story-medium .the-beginning .yyz-sfo-map
{
	padding-left:0
}
	#story-medium .the-journey .two-paths .option .title
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:22px;
	font-weight:700;
	margin:15px 0 10px
}
	#story-medium .the-journey .two-paths .option p
{
	font-size:15px;
	line-height:27px;
	font-style:italic
}
	#story-medium .what-we-made .branding .logo
{
	background:url(/resources/img/story/medium/medium-branding-guts-tablet.png) no-repeat left top;
	margin-left:-240px;
	margin-top:-145px
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-medium .intro
{
	padding-top:0
}
	#story-medium .intro-video
{
	height:294px;
	background-size:cover
}
	#story-medium .intro-video #intro-video
{
	display:none
}
	#story-medium .side-story
{
	display:none
}
	#story-medium .the-beginning
{
	padding-bottom:50px
}
	#story-medium .the-beginning .map .stats
{
	margin:-55px auto 0 auto;
	padding:18px 0;
	width:280px;
	position:relative;
	left:auto;
	bottom:auto;
	*zoom:1
}
	#story-medium .the-beginning .map .stats:before,#story-medium .the-beginning .map .stats:after
{
	display:table;
	content:"";
	line-height:0
}
	#story-medium .the-beginning .map .stats:after
{
	clear:both
}
	#story-medium .the-beginning .map .stats .count
{
	font-size:24px
}
	#story-medium .the-beginning .map .stats .label
{
	font-size:16px
}
	#story-medium .the-beginning .map .stats .wrap
{
	float:left;
	width:140px
}
	#story-medium .the-beginning .map .stats .wrap:last-child
{
	border-left:2px solid #e5e5e5;
	width:138px
}
	#story-medium .the-beginning .map .stats .or
{
	border-top:0;
	margin:0;
	position:absolute;
	width:30px;
	top:31px;
	left:50%;
	margin-left:-15px
}
	#story-medium .the-beginning .map .stats .or span
{
	left:auto;
	top:auto;
	margin-top:auto;
	margin-left:auto;
	position:static;
	padding:0;
	font-size:15px
}
	#story-medium .the-beginning .yyz-sfo-map
{
	padding-left:0
}
	#story-medium .welcome-to-medium .content-editable-sample
{
	font-size:58px;
	line-height:62px;
	margin:30px 0 80px
}
	#story-medium .the-journey .prototype-wrapper
{
	margin-bottom:50px
}
	#story-medium .the-journey .prototype-wrapper .prototype
{
	width:100%;
	margin:10px 0
}
	#story-medium .the-journey .two-paths
{
	background-size:15%
}
	#story-medium .the-journey .two-paths .option .title
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:20px;
	font-weight:700;
	margin:15px 0 10px
}
	#story-medium .the-journey .two-paths .option p
{
	font-size:13px;
	line-height:20px;
	font-style:italic
}
	#story-medium .the-journey .two-paths .option.writing img
{
	margin:25px 0 9px
}
	#story-medium .what-we-made .download
{
	display:none
}
	#story-medium .what-we-made .recommend-button
{
	margin-bottom:60px
}
	#story-medium .what-we-made .responsive-example
{
	margin:10px 0 60px
}
	#story-medium .what-we-made .branding .logo
{
	width:117px;
	height:118px;
	background:url(/resources/img/story/medium/medium-branding-guts-mobile.png) no-repeat left top;
	margin-left:-58px;
	margin-top:-58px
}
	#story-medium .what-we-made .style-guide
{
	margin-bottom:50px
}
	#story-medium .what-we-made .style-guide .mobile
{
	display:inline
}
	#story-medium .what-we-made .style-guide .desktop
{
	display:none
}
	#story-medium .what-we-made .template-finger
{
	display:none
}
	#story-medium .what-we-made .template-group
{
	margin:40px 0 70px
}
	#story-medium .what-we-made .template-group .row
{
	display:none
}
	#story-medium .what-we-made .template-group.group-1
{
	background:url(/resources/img/story/medium/template-group-1.jpg) no-repeat center;
	height:374px
}
	#story-medium .what-we-made .template-group.group-2
{
	background:url(/resources/img/story/medium/template-group-2.jpg) no-repeat center;
	height:431px
}
	#story-medium .what-we-made .template-group.group-3
{
	background:url(/resources/img/story/medium/template-group-3.jpg) no-repeat center;
	height:370px
}

}
	#story-social-portrait .canvas-intro
{
	background-color:#395a9d;
	background-image:-webkit-gradient(radial,center center,0,center center,460,from(#0061a2),to(#395a9d));
	background-image:-webkit-radial-gradient(circle,#0061a2,#395a9d);
	background-image:-moz-radial-gradient(circle,#0061a2,#395a9d);
	background-image:-o-radial-gradient(circle,#0061a2,#395a9d);
	background-repeat:no-repeat;
	color:white;
	height:1800px;
	padding-top:120px;
	position:relative;
	z-index:-1;
	text-align:center;
	overflow:hidden
}
	#story-social-portrait .canvas-intro .site-width
{
	z-index:10;
	position:relative
}
	#story-social-portrait .canvas-intro .site-width .copy-width
{
	opacity:1;
	-webkit-transition:all .5s;
	-moz-transition:all .5s;
	-o-transition:all .5s;
	transition:all .5s
}
	#story-social-portrait .canvas-intro .site-width .copy-width h5
{
	text-align:center;
	margin-top:0
}
	#story-social-portrait .canvas-intro .site-width .copy-width.animate
{
	margin-top:-20px;
	opacity:0
}
	#story-social-portrait .canvas-intro .logo
{
	background:url('/resources/img/story/stackup/intro/logo.png') no-repeat;
	margin:10px auto 30px auto;
	width:70px;
	height:40px
}
	#story-social-portrait .canvas-intro canvas,#story-social-portrait .canvas-intro #css-parallax
{
	margin:0 auto 0 -1000px;
	width:2000px;
	height:2000px;
	position:fixed;
	top:0;
	left:50%;
	overflow:hidden
}
	#story-social-portrait .canvas-intro canvas .mask,#story-social-portrait .canvas-intro #css-parallax .mask
{
	-webkit-transform:translateZ(0);
	-moz-transform:translateZ(0);
	-o-transform:translateZ(0);
	transform:translateZ(0);
	-webkit-transform:skew(0deg,20deg);
	-moz-transform:skew(0deg,20deg);
	-ms-transform:skewX(0deg) skewY(20deg);
	-o-transform:skew(0deg,20deg);
	transform:skew(0deg,20deg);
	-webkit-backface-visibility:hidden;
	position:absolute;
	width:1992px;
	height:2000px;
	margin-top:364px;
	border:solid 3px #fff;
	overflow:hidden
}
	#story-social-portrait .canvas-intro canvas .mask img,#story-social-portrait .canvas-intro #css-parallax .mask img
{
	-webkit-transform:translateZ(0);
	-moz-transform:translateZ(0);
	-o-transform:translateZ(0);
	transform:translateZ(0);
	-webkit-transform:skew(0deg,-20deg);
	-moz-transform:skew(0deg,-20deg);
	-ms-transform:skewX(0deg) skewY(-20deg);
	-o-transform:skew(0deg,-20deg);
	transform:skew(0deg,-20deg);
	-webkit-backface-visibility:hidden;
	width:2000px;
	height:2000px
}
	#story-social-portrait .canvas-intro canvas #clear,#story-social-portrait .canvas-intro #css-parallax #clear
{
	position:absolute;
	left:50%;
	overflow:hidden;
	margin:0 auto 0 -1000px;
	width:2000px;
	height:2000px;
	-webkit-transform:translate(0,190px);
	-moz-transform:translate(0,190px);
	-ms-transform:translate(0,190px);
	-o-transform:translate(0,190px);
	transform:translate(0,190px);
	z-index:1
}
	#story-social-portrait .canvas-intro canvas #clear .mask,#story-social-portrait .canvas-intro #css-parallax #clear .mask
{
	-webkit-transform:skew(0deg,20deg);
	-moz-transform:skew(0deg,20deg);
	-ms-transform:skewX(0deg) skewY(20deg);
	-o-transform:skew(0deg,20deg);
	transform:skew(0deg,20deg);
	-webkit-backface-visibility:hidden
}
	#story-social-portrait .canvas-intro canvas #clear .mask img,#story-social-portrait .canvas-intro #css-parallax #clear .mask img
{
	margin-top:-450px;
	-webkit-transform:skew(0deg,-20deg);
	-moz-transform:skew(0deg,-20deg);
	-ms-transform:skewX(0deg) skewY(-20deg);
	-o-transform:skew(0deg,-20deg);
	transform:skew(0deg,-20deg);
	-webkit-backface-visibility:hidden
}
	#story-social-portrait .canvas-intro canvas #pixelated,#story-social-portrait .canvas-intro #css-parallax #pixelated
{
	display:none;
	position:absolute;
	left:50%;
	overflow:hidden;
	margin:0 auto 0 -1000px;
	width:2000px;
	height:2000px;
	z-index:2
}
	#story-social-portrait .canvas-intro canvas #pixelated .mask,#story-social-portrait .canvas-intro #css-parallax #pixelated .mask
{
	-webkit-transform:skew(0deg,-20deg);
	-moz-transform:skew(0deg,-20deg);
	-ms-transform:skewX(0deg) skewY(-20deg);
	-o-transform:skew(0deg,-20deg);
	transform:skew(0deg,-20deg);
	-webkit-backface-visibility:hidden
}
	#story-social-portrait .canvas-intro canvas #pixelated .mask img,#story-social-portrait .canvas-intro #css-parallax #pixelated .mask img
{
	margin-top:-1250px;
	-webkit-transform:skew(0deg,20deg);
	-moz-transform:skew(0deg,20deg);
	-ms-transform:skewX(0deg) skewY(20deg);
	-o-transform:skew(0deg,20deg);
	transform:skew(0deg,20deg);
	-webkit-backface-visibility:hidden
}
	#story-social-portrait .canvas-intro canvas #ascii,#story-social-portrait .canvas-intro #css-parallax #ascii
{
	display:none;
	position:absolute;
	left:50%;
	overflow:hidden;
	margin:0 auto 0 -1000px;
	width:2000px;
	height:2000px;
	z-index:3
}
	#story-social-portrait .canvas-intro canvas #ascii .mask,#story-social-portrait .canvas-intro #css-parallax #ascii .mask
{
	-webkit-transform:skew(0deg,20deg);
	-moz-transform:skew(0deg,20deg);
	-ms-transform:skewX(0deg) skewY(20deg);
	-o-transform:skew(0deg,20deg);
	transform:skew(0deg,20deg);
	-webkit-backface-visibility:hidden
}
	#story-social-portrait .canvas-intro canvas #ascii .mask img,#story-social-portrait .canvas-intro #css-parallax #ascii .mask img
{
	margin-top:-1050px;
	-webkit-transform:skew(0deg,-20deg);
	-moz-transform:skew(0deg,-20deg);
	-ms-transform:skewX(0deg) skewY(-20deg);
	-o-transform:skew(0deg,-20deg);
	transform:skew(0deg,-20deg);
	-webkit-backface-visibility:hidden
}
	#story-social-portrait h1
{
	text-shadow:-1px 2px 2px rgba(1,72,130,0.3)
}
	#story-social-portrait .intro
{
	background:#fff url('/resources/img/story/socialportrait/thumbs-up.jpg') center 112% no-repeat;
	color:#0064a5;
	padding-bottom:60px;
	z-index:5;
	-webkit-transition:all 2s;
	-moz-transition:all 2s;
	-o-transition:all 2s;
	transition:all 2s
}
	#story-social-portrait .intro.animate
{
	background-position:center 105%
}
	#story-social-portrait .intro .head
{
	margin-bottom:65px;
	background-color:#004f8f;
	background-image:-webkit-gradient(radial,center center,0,center center,460,from(#0061a2),to(#004f8f));
	background-image:-webkit-radial-gradient(circle,#0061a2,#004f8f);
	background-image:-moz-radial-gradient(circle,#0061a2,#004f8f);
	background-image:-o-radial-gradient(circle,#0061a2,#004f8f);
	background-repeat:no-repeat
}
	#story-social-portrait .intro .head .icon.tl-guys
{
	color:white;
	margin-top:60px
}
	#story-social-portrait .intro .head h2
{
	color:#fff
}
	#story-social-portrait .intro .typographic-example
{
	margin:0 auto 60px;
	width:100%
}
	#story-social-portrait .intro .typographic-example img
{
	display:block;
	text-align:center;
	width:100%
}
	#story-social-portrait .intro .typographic-example .attribute
{
	background-color:#ccc;
	color:#5f5f5f;
	padding:10px;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:12px
}
	#story-social-portrait .intro .facebook
{
	margin-bottom:50px
}
	#story-social-portrait .intro .facebook .facebook-profile
{
	text-align:center;
	margin:35px 0 90px 0;
	cursor:pointer
}
	#story-social-portrait .intro .facebook .facebook-profile img
{
	display:none;
	border:1px solid #395a9d
}
	#story-social-portrait .intro .facebook .facebook-profile img.active
{
	display:inline
}
	#story-social-portrait .the-right-canvas
{
	z-index:100;
	background:#395a9d;
	color:#FFF;
	overflow:visible;
	padding-bottom:10px
}
	#story-social-portrait .the-right-canvas .icon-wrapper
{
	text-align:center
}
	#story-social-portrait .the-right-canvas .icon-wrapper .icon.tl-guys
{
	background-color:#395a9d;
	display:inline-block;
	text-align:center;
	font-size:35px;
	margin:-100px auto 0 auto;
	border:5px solid;
	padding:20px
}
	#story-social-portrait .the-right-canvas .icon
{
	display:block;
	text-align:center;
	margin-bottom:100px
}
	#story-social-portrait .the-right-canvas h2.split
{
	font-family:Georgia,Times,"Times New Roman",serif;
	font-weight:normal;
	margin-bottom:0
}
	#story-social-portrait .the-right-canvas .octo-cat
{
	display:block;
	width:517px;
	margin:0 auto 75px
}
	#story-social-portrait .how-we-did-it-top
{
	background:#f3f2ee url('/resources/img/story/socialportrait/lightbulb-triangle.jpg') center bottom no-repeat;
	color:#395a9d;
	padding-bottom:600px
}
	#story-social-portrait .how-we-did-it-top h2
{
	margin-top:10px;
	font-weight:normal;
	font-family:Georgia,Times,"Times New Roman",serif
}
	#story-social-portrait .how-we-did-it
{
	color:#FFF;
	background-color:#232323;
	padding-bottom:0;
	z-index:0
}
	#story-social-portrait .how-we-did-it .icon-wrapper
{
	color:#232323;
	text-align:center;
	margin-top:-35px
}
	#story-social-portrait .how-we-did-it .icon-wrapper .icon
{
	background:#fff;
	display:inline-block;
	margin:0 auto;
	-webkit-border-radius:50px;
	-moz-border-radius:50px;
	border-radius:50px;
	padding:30px 0 0 0;
	width:100px;
	height:70px
}
	#story-social-portrait .how-we-did-it .phone
{
	display:block;
	margin:100px auto 0 auto;
	width:100%;
	padding-top:1px
}
	#story-social-portrait .how-we-did-it .phone img
{
	display:block;
	margin:0 auto;
	width:48%
}
	#story-social-portrait .how-we-did-it .pixelated-steps
{
	position:absolute;
	width:348px;
	height:348px;
	margin:-368px auto 800px -174px;
	left:50%;
	z-index:0;
	-webkit-transition:opacity .5s;
	-moz-transition:opacity .5s;
	-o-transition:opacity .5s;
	transition:opacity .5s
}
	#story-social-portrait .how-we-did-it .pixelated-steps.fixed
{
	position:fixed;
	top:100px;
	margin-top:244px;
	left:50%;
	margin-left:-174px;
	z-index:9999
}
	#story-social-portrait .how-we-did-it .pixelated-steps img
{
	position:absolute;
	top:0;
	left:0;
	-webkit-transition:opacity .5s;
	-moz-transition:opacity .5s;
	-o-transition:opacity .5s;
	transition:opacity .5s;
	opacity:0;
	filter:alpha(opacity=0)
}
	#story-social-portrait .how-we-did-it .pixelated-steps img.active
{
	opacity:1;
	filter:alpha(opacity=100)
}
	#story-social-portrait .how-we-did-it .lightbulb-cord
{
	padding-top:170px;
	padding-bottom:290px;
	background:url('/resources/img/story/socialportrait/lightbulb-cord.gif') center top repeat-y
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step
{
	margin-bottom:150px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div
{
	vertical-align:top;
	display:inline-block;
	width:324px;
	height:348px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.img
{
	width:348px;
	opacity:0;
	filter:alpha(opacity=0)
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.number
{
	-webkit-transition:opacity .5s;
	-moz-transition:opacity .5s;
	-o-transition:opacity .5s;
	transition:opacity .5s;
	opacity:0;
	filter:alpha(opacity=0);
	width:322px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.number p
{
	font-size:330px;
	line-height:300px;
	font-family:'Georgia'
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.copy
{
	-webkit-transition:opacity .5s;
	-moz-transition:opacity .5s;
	-o-transition:opacity .5s;
	transition:opacity .5s;
	opacity:0;
	filter:alpha(opacity=0);
	padding-left:60px;
	padding-top:100px;
	height:248px;
	width:260px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.active div.number,#story-social-portrait .how-we-did-it .lightbulb-cord .step.active div.copy,#story-social-portrait .how-we-did-it .lightbulb-cord .step.active div.img
{
	opacity:1;
	filter:alpha(opacity=100)
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.active div.mobile img
{
	display:none
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div.number,#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div.copy,#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div.img
{
	opacity:.2;
	filter:alpha(opacity=20)
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div img
{
	display:none
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.two div.number p
{
	line-height:380px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.four div.copy
{
	padding-top:20px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.four div.number p
{
	line-height:230px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last
{
	margin-bottom:0
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last div.copy
{
	padding-top:110px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last div.number p
{
	line-height:230px
}
	#story-social-portrait .how-we-did-it .lightbulb
{
	background:url('/resources/img/story/socialportrait/lightbulb-off.jpg') center top no-repeat;
	-webkit-transition:.1s;
	-moz-transition:.1s;
	-o-transition:.1s;
	transition:.1s
}
	#story-social-portrait .how-we-did-it .lightbulb h2
{
	margin-top:0;
	padding-top:240px;
	font-family:Georgia,Times,"Times New Roman",serif;
	font-weight:normal
}
	#story-social-portrait .how-we-did-it .lightbulb h2,#story-social-portrait .how-we-did-it .lightbulb p
{
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transition:.3s;
	-moz-transition:.3s;
	-o-transition:.3s;
	transition:.3s
}
	#story-social-portrait .how-we-did-it .lightbulb.animate
{
	background:url('/resources/img/story/socialportrait/lightbulb-on.jpg') center top no-repeat
}
	#story-social-portrait .how-we-did-it .lightbulb.animate h2,#story-social-portrait .how-we-did-it .lightbulb.animate p
{
	opacity:1;
	filter:alpha(opacity=100)
}
	#story-social-portrait .hourglass
{
	background:url('/resources/img/story/socialportrait/hourglass-top.jpg') center top no-repeat,url('/resources/img/story/socialportrait/hourglass-bottom.jpg') center bottom no-repeat;
	background-color:#FFF;
	padding-top:400px;
	padding-bottom:445px
}
	#story-social-portrait .hourglass .hourglass-clip
{
	height:855px;
	overflow:hidden
}
	#story-social-portrait .hourglass .hourglass-wrapper
{
	background:transparent url('/resources/img/story/socialportrait/hourglass-bg.png') center -20% no-repeat;
	background-size:100% auto;
	-webkit-transition:all 1s;
	-moz-transition:all 1s;
	-o-transition:all 1s;
	transition:all 1s;
	height:1000px;
	overflow:hidden
}
	#story-social-portrait .hourglass .hourglass-wrapper.animate
{
	background-position:center 92%
}
	#story-social-portrait .hourglass .hourglass-foreground
{
	height:1000px;
	background:transparent url('/resources/img/story/socialportrait/hourglass.png') center top no-repeat;
	background-size:100% auto
}
	#story-social-portrait .hourglass .hourglass-foreground p
{
	color:#FFF;
	text-align:center;
	padding:140px 290px;
	font-size:31px
}
	#story-social-portrait .hourglass .hourglass-foreground p.bot
{
	padding-top:150px
}
	#story-social-portrait .shifting
{
	background-color:#FFF;
	padding-bottom:0;
	height:605px;
	overflow:hidden
}
	#story-social-portrait .shifting .direction
{
	display:none
}
	#story-social-portrait .shifting .animation-wrapper
{
	height:605px;
	position:relative;
	width:100%
}
	#story-social-portrait .shifting .animation-wrapper .slide
{
	position:absolute;
	top:0;
	width:0;
	right:0;
	height:605px;
	overflow:hidden;
	-webkit-transition:background-color .5s;
	-moz-transition:background-color .5s;
	-o-transition:background-color .5s;
	transition:background-color .5s
}
	#story-social-portrait .shifting .animation-wrapper .slide>div.animate
{
	height:473px;
	position:absolute;
	right:0
}
	#story-social-portrait .shifting .animation-wrapper .slide.active
{
	background-color:#535353
}
	#story-social-portrait .shifting .animation-wrapper .slide.active .captions .copy-width
{
	opacity:1;
	filter:alpha(opacity=100)
}
	#story-social-portrait .shifting .animation-wrapper .slide.active .captions .copy-width.letsago
{
	background-color:#535353;
	color:#fff
}
	#story-social-portrait .shifting .animation-wrapper .slide .captions
{
	-webkit-transition:color .5s;

	-moz-transition:color .5s;
	-o-transition:color .5s;
	transition:color .5s;
	padding:510px 0 10px;
	position:absolute;
	right:0;
	max-width:none
}
	#story-social-portrait .shifting .animation-wrapper .slide .captions .copy-width
{
	-webkit-transition:.5s;
	-moz-transition:.5s;
	-o-transition:.5s;
	transition:.5s;
	opacity:0;
	filter:alpha(opacity=0);
	width:840px;
	position:absolute;
	left:50%;
	margin-left:-420px
}
	#story-social-portrait .shifting .animation-wrapper .slide .captions .copy-width p
{
	text-align:center
}
	#story-social-portrait .shifting .animation-wrapper .slide .captions .copy-width.letsago
{
	background-color:#fff;
	opacity:1;
	filter:alpha(opacity=100)
}
	#story-social-portrait .shifting .animation-wrapper .slide.one
{
	width:100%;
	z-index:1;
	-webkit-transition:all .5s linear;
	-moz-transition:all .5s linear;
	-o-transition:all .5s linear
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.captions .copy-width
{
	opacity:1;
	filter:alpha(opacity=100)
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate
{
	width:100%;
	background:#e5e5e5 url('/resources/img/story/socialportrait/slide1-bg.jpg') center center no-repeat
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .seconds
{
	background-color:transparent;
	height:174px;
	width:174px;
	top:50%;
	left:50%;
	margin:-87px 0 0 -87px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:1
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .seconds img
{
	display:block;
	margin:0;
	animation:a360_10 10s normal infinite steps(60,end);
	-webkit-animation:a360_10 10s normal infinite steps(60,end)
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .minutes
{
	background-color:transparent;
	height:225px;
	width:225px;
	top:50%;
	left:50%;
	margin:-113px 0 0 -113px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:2
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .minutes img
{
	display:block;
	margin:0;
	animation:a360 30s normal infinite;
	-webkit-animation:a360_10 30s normal infinite
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .hours
{
	background-color:transparent;
	height:174px;
	width:174px;
	top:50%;
	left:50%;
	margin:-87px 0 0 -87px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .hours img
{
	display:block;
	margin:0;
	animation:a36016 120s normal infinite;
	-webkit-animation:a36016 120s normal infinite
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .center-dot
{
	width:80px;
	height:80px;
	background:transparent url('/resources/img/story/socialportrait/slide1-center.png') center center no-repeat;
	position:absolute;
	top:50%;
	left:50%;
	margin:-40px 0 0 -40px;
	z-index:5
}
	#story-social-portrait .shifting .animation-wrapper .slide.two
{
	z-index:2
}
	#story-social-portrait .shifting .animation-wrapper .slide.two div.animate
{
	width:100%;
	background:#51b0ee url('/resources/img/story/socialportrait/slide2-bg.jpg') center center no-repeat
}
	#story-social-portrait .shifting .animation-wrapper .slide.two div.animate .blades
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:50%;
	left:50%;
	margin:-125px 0 0 -125px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.two div.animate .blades img
{
	display:block;
	margin:0;
	animation:a360_10 1s normal infinite;
	-webkit-animation:a360_10 1s linear infinite
}
	#story-social-portrait .shifting .animation-wrapper .slide.two div.animate .center-dot
{
	width:80px;
	height:80px;
	background:transparent url('/resources/img/story/socialportrait/slide2-center.png') center center no-repeat;
	position:absolute;
	top:50%;
	left:50%;
	margin:-42px 0 0 -40px;
	z-index:5
}
	#story-social-portrait .shifting .animation-wrapper .slide.three
{
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.three div.animate
{
	width:100%;
	background-color:#0064a5
}
	#story-social-portrait .shifting .animation-wrapper .slide.three div.animate .clip
{
	width:830px;
	height:473px;
	position:absolute;
	top:50%;
	left:50%;
	margin:-237px 0 0 -416px;
	overflow:hidden
}
	#story-social-portrait .shifting .animation-wrapper .slide.three div.animate .swirl
{
	background:transparent url('/resources/img/story/socialportrait/slide3-spiral.jpg') center center no-repeat;
	height:1445px;
	width:1600px;
	top:50%;
	left:50%;
	margin:-723px 0 0 -800px;
	padding:0;
	position:absolute;
	display:inline-block;
	animation:a360_back 1s linear infinite;
	-webkit-animation:a360_back 1s linear infinite;
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.three div.animate .swirl img
{
	display:block;
	margin:0
}
	#story-social-portrait .shifting .animation-wrapper .slide.three div.animate .drain
{
	width:831px;
	height:480px;
	background:transparent url('/resources/img/story/socialportrait/slide3-drain.png') center center no-repeat;
	position:absolute;
	top:50%;
	left:50%;
	margin:-239px 0 0 -415px;
	z-index:5
}
	#story-social-portrait .shifting .animation-wrapper .slide.four
{
	z-index:4
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate
{
	width:100%;
	background-color:#535353
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container
{
	margin:0 auto;
	width:800px;
	height:473px;
	position:relative
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .big-cog .cog-outer
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:50.3%;
	left:50%;
	margin:-200px 0 0 -194px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .big-cog .cog-outer img
{
	display:block;
	margin:0;
	animation:a360_10 5s normal infinite;
	-webkit-animation:a360_10 5s linear infinite
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .big-cog .shadow
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:50.3%;
	left:50%;
	margin:-191px 0 0 -203px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:2
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .big-cog .shadow img
{
	display:block;
	margin:0;
	animation:a360_10 5s normal infinite;
	-webkit-animation:a360_10 5s linear infinite
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .big-cog .cog-center
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:50.3%;
	left:50%;
	margin:-167px 0 0 -161px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:4
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .big-cog .cog-center img
{
	display:block;
	margin:0
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog .cog-outer
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:95%;
	left:28.3%;
	margin:-200px 0 0 -194px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog .cog-outer img
{
	display:block;
	margin:0;
	animation:a360_back 5s normal infinite;
	-webkit-animation:a360_back 5s linear infinite
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog .shadow
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:95%;
	left:28.3%;
	margin:-193px 0 0 -201px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:2
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog .shadow img
{
	display:block;
	margin:0;
	animation:a360_back 5s normal infinite;
	-webkit-animation:a360_back 5s linear infinite
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog .cog-center
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:95%;
	left:28.3%;
	margin:-173px 0 0 -168px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:4
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog .cog-center img
{
	display:block;
	margin:0
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.two .cog-outer
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:50.5%;
	left:98.1%;
	margin:-200px 0 0 -194px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.two .cog-outer img
{
	display:block;
	margin:0;
	animation:a360_back 5s normal infinite;
	-webkit-animation:a360_back 5s linear infinite
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.two .shadow
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:50.5%;
	left:98.1%;
	margin:-193px 0 0 -201px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:2
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.two .shadow img
{
	display:block;
	margin:0;
	animation:a360_back 5s normal infinite;
	-webkit-animation:a360_back 5s linear infinite
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.two .cog-center
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:50.5%;
	left:98.1%;
	margin:-173px 0 0 -168px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:4
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.two .cog-center img
{
	display:block;
	margin:0
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small .cog-outer
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:71.3%;
	left:36.7%;
	margin:-200px 0 0 -194px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small .cog-outer img
{
	display:block;
	margin:0;
	animation:a360_10 5s normal infinite;
	-webkit-animation:a360_10 5s linear infinite;
	width:97px
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small .shadow
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:71.3%;
	left:36.7%;
	margin:-193px 0 0 -201px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:2
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small .shadow img
{
	display:block;
	margin:0;
	animation:a360_10 5s normal infinite;
	-webkit-animation:a360_10 5s linear infinite;
	width:97px
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small .cog-center
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:71.3%;
	left:36.7%;
	margin:-185px 0 0 -179px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:4
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small .cog-center img
{
	display:block;
	margin:0;
	width:68px
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small-two .cog-outer
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:91.5%;
	left:99.4%;
	margin:-200px 0 0 -194px;

	padding:0;
	position:absolute;
	display:inline-block;
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small-two .cog-outer img
{
	display:block;
	margin:0;
	animation:a360_10 5s normal infinite;
	-webkit-animation:a360_10 5s linear infinite;
	width:97px
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small-two .shadow
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:91.5%;
	left:99.4%;
	margin:-193px 0 0 -201px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:2
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small-two .shadow img
{
	display:block;
	margin:0;
	animation:a360_10 5s normal infinite;
	-webkit-animation:a360_10 5s linear infinite;
	width:97px
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small-two .cog-center
{
	background-color:transparent;
	height:250px;
	width:250px;
	top:91.5%;
	left:99.4%;
	margin:-185px 0 0 -179px;
	padding:0;
	position:absolute;
	display:inline-block;
	z-index:4
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container .cog.small-two .cog-center img
{
	display:block;
	margin:0;
	width:68px
}
	@keyframes tick
{
	0%
{
	transform:rotate(0deg)
}
	12%
{
	transform:rotate(6deg)
}
	100%
{
	transform:rotate(6deg)
}

}
	@-webkit-keyframes tick
{
	0%
{
	-webkit-transform:rotate(0deg)
}
	12%
{
	-webkit-transform:rotate(0deg)
}
	100%
{
	-webkit-transform:rotate(0deg)
}

}
	@keyframes a360_back
{
	0%
{
	transform:rotate(0deg)
}
	100%
{
	transform:rotate(-360deg)
}

}
	@-webkit-keyframes a360_back
{
	0%
{
	-webkit-transform:rotate(0deg)
}
	100%
{
	-webkit-transform:rotate(-360deg)
}

}
	@keyframes a360_10
{
	0%
{
	transform:rotate(0deg)
}
	100%
{
	transform:rotate(360deg)
}

}
	@-webkit-keyframes a360_10
{
	0%
{
	-webkit-transform:rotate(0deg)
}
	100%
{
	-webkit-transform:rotate(360deg)
}

}
	@-webkit-keyframes a36016
{
	0%
{
	-webkit-transform:rotate(0deg)
}
	50%
{
	-webkit-transform:rotate(180deg)
}
	100%
{
	-webkit-transform:rotate(360deg)
}

}
	#story-social-portrait .paradigm
{
	color:#FFF;
	-webkit-transition:all .5s;
	-moz-transition:all .5s;
	-o-transition:all .5s;
	transition:all .5s;
	background-color:#FFF;
	padding-bottom:0
}
	#story-social-portrait .paradigm.active
{
	background-color:#535353
}
	#story-social-portrait .paradigm .center
{
	padding-top:100px;
	text-align:center;
	margin-bottom:240px
}
	#story-social-portrait .paradigm h2.alt
{
	margin-top:0;
	padding-top:90px;
	padding-bottom:30px;
	font-family:Georgia,Times,"Times New Roman",serif;
	font-weight:normal
}
	#story-social-portrait .server
{
	background:#fff url('/resources/img/story/socialportrait/computer.jpg') center center no-repeat;
	color:#FFF;
	height:1340px
}
	#story-social-portrait .server h2
{
	font-family:Georgia,Times,"Times New Roman",serif;
	font-weight:normal;
	padding:0 100px
}
	#story-social-portrait .server h2.first
{
	margin-top:140px;
	margin-bottom:735px
}
	#story-social-portrait .image-process
{
	padding-top:80px;
	background-color:#99d6ff;
	color:#0064a5;
	padding-bottom:0
}
	#story-social-portrait .image-process .step1
{
	width:432px;
	height:435px;
	position:relative;
	margin:120px auto 140px
}
	#story-social-portrait .image-process .step1 img
{
	position:absolute;
	width:432px;
	height:435px
}
	#story-social-portrait .image-process .step1 .normal
{
	opacity:1;
	filter:alpha(opacity=100)
}
	#story-social-portrait .image-process .step1 .normal.animate
{
	animation:fadeFirstImage 3s linear;
	animation-fill-mode:forwards;
	-webkit-animation:fadeFirstImage 3s linear;
	-webkit-animation-fill-mode:forwards
}
	#story-social-portrait .image-process .step1 .pixelated
{
	opacity:0;
	filter:alpha(opacity=0)
}
	#story-social-portrait .image-process .step1 .pixelated.animate
{
	animation:fadeSecondImage 5s linear;
	animation-fill-mode:forwards;
	-webkit-animation:fadeSecondImage 5s linear;
	-webkit-animation-fill-mode:forwards
}
	@keyframes fadeFirstImage
{
	0%
{
	opacity:1;
	filter:alpha(opacity=100)
}
	10%
{
	width:216px;
	height:217px;
	top:108px;
	left:108px;
	opacity:1;
	filter:alpha(opacity=100)
}
	60%
{
	width:216px;
	height:217px;
	opacity:.5;
	filter:alpha(opacity=50);
	top:108px;
	left:108px
}
	100%
{
	width:216px;
	height:217px;
	opacity:0;
	filter:alpha(opacity=0);
	top:108px;
	left:108px
}

}
	@-webkit-keyframes fadeFirstImage
{
	0%
{
	opacity:1;
	filter:alpha(opacity=100)
}
	10%
{
	width:216px;
	height:217px;
	top:108px;
	left:108px;
	opacity:1;
	filter:alpha(opacity=100)
}
	60%
{
	width:216px;
	height:217px;
	opacity:.5;
	filter:alpha(opacity=50);
	top:108px;
	left:108px
}
	100%
{
	width:216px;
	height:217px;
	opacity:0;
	filter:alpha(opacity=0);
	top:108px;
	left:108px
}

}
	@keyframes fadeSecondImage
{
	0%
{
	opacity:0;
	filter:alpha(opacity=0)
}
	10%
{
	width:216px;
	height:217px;
	top:108px;
	left:108px;
	opacity:0;
	filter:alpha(opacity=0)
}
	60%
{
	width:216px;
	height:217px;
	opacity:.5;
	filter:alpha(opacity=50);
	top:108px;
	left:108px
}
	100%
{
	width:432px;
	height:434px;
	opacity:1;
	filter:alpha(opacity=100);
	top:108px;
	left:108px
}

}
	@-webkit-keyframes fadeSecondImage
{
	0%
{
	opacity:0;
	filter:alpha(opacity=0)
}
	10%
{
	width:216px;
	height:217px;
	top:108px;
	left:108px;
	opacity:0;
	filter:alpha(opacity=0)
}
	15%
{
	width:216px;
	height:217px;
	top:108px;
	left:108px;
	opacity:.7;
	filter:alpha(opacity=70)
}
	20%
{
	width:432px;
	height:434px;
	opacity:1;
	filter:alpha(opacity=100);
	top:0;
	left:0
}
	100%
{
	width:432px;
	height:434px;
	opacity:1;
	filter:alpha(opacity=100);
	top:0;
	left:0
}

}
	#story-social-portrait .image-process .step4
{
	background:#0071ba;
	padding-top:130px;
	color:#FFF;
	height:auto;
	padding-bottom:150px
}
	#story-social-portrait .image-process .step4 .dials
{
	float:left;
	width:50%
}
	#story-social-portrait .grand-unveiling
{
	background-color:#40515d;
	color:#fff
}
	#story-social-portrait .grand-unveiling #demo-video
{
	margin:40px 0 40px
}
	#story-social-portrait .grand-unveiling #demo-video .interaction
{
	cursor:pointer
}
	#story-social-portrait .social-portrait-gallery
{
	background-color:#e4e4e4;
	padding-top:60px
}
	#story-social-portrait .collections-wrapper
{
	position:relative;
	margin:50px 0;
	height:350px;
	width:100%;
	overflow:hidden;
	padding-bottom:60px
}
	#story-social-portrait .collections-wrapper .direction
{
	width:16px;
	height:25px;
	bottom:0;
	top:auto;
	background:lime;
	opacity:.6;
	-webkit-transition:opacity .2s;
	-moz-transition:opacity .2s;
	-o-transition:opacity .2s;
	transition:opacity .2s;
	cursor:pointer
}
	#story-social-portrait .collections-wrapper .direction:hover
{
	opacity:1
}
	#story-social-portrait .collections-wrapper .next
{
	left:50%;
	margin-left:20px;
	background:url(/resources/img/ui/right-arrow.png) no-repeat left top
}
	#story-social-portrait .collections-wrapper .prev
{
	left:50%;
	margin-left:-36px;
	background:url(/resources/img/ui/left-arrow.png) no-repeat left top
}
	#story-social-portrait .collections-wrapper .container
{
	position:absolute;
	top:0;
	left:50%;
	width:5040px;
	margin-left:-1240px;
	height:352px
}
	#story-social-portrait .collections-wrapper .container .item
{
	margin-right:0
}
	#story-social-portrait .collections-wrapper .container .collection
{
	position:relative;
	float:left;
	width:240px;
	height:350px;
	margin-right:40px;
	margin-top:2px;
	-webkit-box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	-moz-box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-o-transition:all .3s;
	transition:all .3s
}
	#story-social-portrait .collections-wrapper .container .collection:hover
{
	-webkit-transform:translate(-2px,-2px);
	-moz-transform:translate(-2px,-2px);
	-ms-transform:translate(-2px,-2px);
	-o-transform:translate(-2px,-2px);
	transform:translate(-2px,-2px);
	-webkit-box-shadow:3px 3px 4px rgba(0,0,0,0.1);
	-moz-box-shadow:3px 3px 4px rgba(0,0,0,0.1);
	box-shadow:3px 3px 4px rgba(0,0,0,0.1)
}
	#story-social-portrait .collections-wrapper .container .collection .copy
{
	position:absolute;
	width:190px;
	left:25px;
	bottom:25px;
	text-shadow:0 1px 2px rgba(0,0,0,0.5)
}
	#story-social-portrait .collections-wrapper .container .collection .title
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:22px;
	font-weight:700;
	line-height:24px;
	color:#fff
}
	#story-social-portrait .collections-wrapper .container .collection .post-count
{
	display:block;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:16px;
	color:#fff
}
	@media all and (max-width:1024px) and (min-width:1000px)
{
	#story-social-portrait #css-parallax
{
	display:none;
	visibility:hidden
}
	#story-social-portrait .canvas-intro
{
	padding:100px 0 900px 0;
	background-image:url('/resources/img/story/socialportrait/intro-alt.png');
	background-position:center bottom;
	height:auto
}
	#story-social-portrait .intro
{
	background:#fff url('/resources/img/story/socialportrait/thumbs-up-tablet.jpg') center 104% no-repeat;
	background-size:134% auto;
	padding-bottom:90px
}
	#story-social-portrait .intro.animate
{
	background-position:center 101%
}
	#story-social-portrait .how-we-did-it-top
{
	padding-bottom:600px;
	background-position:center 100%
}
	#story-social-portrait .how-we-did-it
{
	padding-top:20px;
	padding-bottom:40px
}
	#story-social-portrait .how-we-did-it .icon-wrapper
{
	margin:-35px 0 20px 0
}
	#story-social-portrait .how-we-did-it .icon-wrapper .icon
{
	-webkit-border-radius:40px;
	-moz-border-radius:40px;
	border-radius:40px;
	padding:30px 0 0 0;
	width:80px;
	height:50px
}
	#story-social-portrait .how-we-did-it .phone
{
	display:block;
	margin:100px auto 0 auto;
	width:100%;
	padding-top:1px
}
	#story-social-portrait .how-we-did-it .phone img
{
	display:block;
	margin:0 auto;
	width:50%
}
	#story-social-portrait .how-we-did-it .pixelated-steps
{
	display:none
}
	#story-social-portrait .how-we-did-it .lightbulb-cord
{
	padding:0 0 50px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step
{
	margin-bottom:0
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div
{
	width:auto
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.number
{
	width:100%;
	opacity:1;
	filter:alpha(opacity=100)
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.number p
{
	font-size:190px;
	font-weight:bold;
	line-height:460px;
	color:#383838;
	margin-bottom:0;
	padding-left:31%
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.img
{
	opacity:1;
	filter:alpha(opacity=100);
	width:100%;
	height:auto;
	margin:0 auto
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.img img
{
	width:35%;
	display:block;
	margin:0 auto
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.img.mobile img
{
	display:block
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.copy
{
	opacity:1;
	filter:alpha(opacity=100);
	background:#232323;
	padding-left:0;
	padding-top:30px;
	padding-bottom:30px;
	height:auto;
	width:100%;
	text-align:center
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.copy p
{
	margin:0 auto;
	font-size:26px;
	line-height:38px;
	width:60%
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.two div.number p
{
	line-height:473px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.three div.number p
{
	line-height:400px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.four div.number p
{
	line-height:398px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last
{
	margin-bottom:150px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last div.copy
{
	padding-top:40px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last div.number p
{
	line-height:407px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last div.img img
{
	display:block
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div.number,#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div.copy,#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div.img
{
	opacity:1;
	filter:alpha(opacity=100)
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div img
{
	display:block
}
	#story-social-portrait .how-we-did-it .lightbulb h2
{
	padding:160px 0 0 0
}
	#story-social-portrait .hourglass
{
	background:#fff;
	padding:0
}
	#story-social-portrait .hourglass .site-width
{
	max-width:100%;
	width:100%
}
	#story-social-portrait .hourglass .site-width .copy-width
{
	margin:0;
	width:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip
{
	height:auto
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper
{
	background:#fff;
	height:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground
{
	background:transparent url('/resources/img/story/socialportrait/hourglass-tablet.png') no-repeat top center;
	background-size:100%;
	height:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p
{
	padding:45% 36% 30%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p.top
{
	color:#404040
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p.bot
{
	padding-top:0;
	padding-bottom:50.5%
}
	#story-social-portrait .shifting
{
	height:700px;
	padding-top:0;
	position:relative
}
	#story-social-portrait .shifting .direction
{
	display:block;
	width:35px;
	height:45px;
	bottom:30px;
	top:auto;
	position:absolute;
	opacity:.6;
	-webkit-transition:opacity .2s;
	-moz-transition:opacity .2s;
	-o-transition:opacity .2s;
	transition:opacity .2s;
	cursor:pointer
}
	#story-social-portrait .shifting .direction:hover
{
	opacity:1
}
	#story-social-portrait .shifting .direction.next
{
	left:50%;
	margin-left:20px;
	background:url(/resources/img/ui/right-arrow.png) no-repeat center
}
	#story-social-portrait .shifting .direction.prev
{
	left:50%;
	margin-left:-36px;
	background:url(/resources/img/ui/left-arrow.png) no-repeat center
}
	#story-social-portrait .shifting .animation-wrapper
{
	height:700px
}
	#story-social-portrait .shifting .animation-wrapper .slide
{
	-webkit-transition:all .8s;
	-moz-transition:all .8s;
	-o-transition:all .8s;
	transition:all .8s
}
	#story-social-portrait .shifting .animation-wrapper .slide.one .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.two .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.three .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.four .captions .copy-width
{
	position:relative;
	left:0;
	width:88%;
	margin:0 8%;
	height:100px
}
	#story-social-portrait .shifting .animation-wrapper .slide.active
{
	background-color:#fff
}
	#story-social-portrait .shifting .animation-wrapper .slide.active .captions
{
	color:#000
}
	#story-social-portrait .paradigm
{
	background-color:#535353
}

}
	@media all and (max-width:1000px) and (min-width:500px)
{
	#story-social-portrait #css-parallax
{
	display:none;
	visibility:hidden
}
	#story-social-portrait .canvas-intro
{
	padding:100px 0 900px 0;
	background-image:url('/resources/img/story/socialportrait/intro-alt.png');
	background-position:center bottom;
	height:auto
}
	#story-social-portrait .intro
{
	background:#fff url('/resources/img/story/socialportrait/thumbs-up-tablet.jpg') center 104% no-repeat
}
	#story-social-portrait .intro.animate
{
	background-position:center 101%
}
	#story-social-portrait .how-we-did-it-top
{
	background-position:center 100%;
	padding:0 0 480px 0
}
	#story-social-portrait .how-we-did-it-top .lightbulb-cord .step div
{
	width:135px
}
	#story-social-portrait .how-we-did-it-top .lightbulb-cord .step div.mobile img
{
	display:block
}
	#story-social-portrait .how-we-did-it-top .lightbulb-cord .step div.number p
{
	font-size:220px
}
	#story-social-portrait .how-we-did-it-top .lightbulb-cord .step div.img
{
	width:200px
}
	#story-social-portrait .how-we-did-it-top .lightbulb-cord .step div.img img
{
	width:200px
}
	#story-social-portrait .how-we-did-it
{
	padding-top:20px;
	padding-bottom:40px
}
	#story-social-portrait .how-we-did-it .icon-wrapper
{
	margin:-35px 0 20px 0
}
	#story-social-portrait .how-we-did-it .icon-wrapper .icon
{
	-webkit-border-radius:40px;
	-moz-border-radius:40px;
	border-radius:40px;
	padding:30px 0 0 0;
	width:80px;
	height:50px
}
	#story-social-portrait .how-we-did-it .phone
{
	display:block;
	margin:100px auto 0 auto;
	width:100%;
	padding-top:1px
}
	#story-social-portrait .how-we-did-it .phone img
{
	display:block;
	margin:0 auto;
	width:50%
}
	#story-social-portrait .how-we-did-it .pixelated-steps
{
	display:none
}
	#story-social-portrait .how-we-did-it .lightbulb-cord
{
	padding:0 0 50px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step
{
	margin-bottom:0
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div
{
	width:auto
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.number
{
	width:100%;
	opacity:1;
	filter:alpha(opacity=100)
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.number p
{
	font-size:190px;
	font-weight:bold;
	line-height:460px;
	color:#383838;
	margin-bottom:0;
	padding-left:25%
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.img
{
	opacity:1;
	filter:alpha(opacity=100);
	width:100%;
	height:auto;
	margin:0 auto
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.img img
{
	width:45%;
	display:block;
	margin:0 auto
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.img.mobile img
{
	display:block
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.copy
{
	opacity:1;
	filter:alpha(opacity=100);
	background:#232323;
	padding-left:0;
	padding-top:30px;
	padding-bottom:30px;
	height:auto;
	width:100%;
	text-align:center
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.copy p
{
	margin:0 auto;
	font-size:23px;
	line-height:38px;
	width:75%
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.two div.number p
{
	line-height:473px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.three div.number p
{
	line-height:400px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.four div.number p
{
	line-height:398px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last
{
	margin-bottom:150px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last div.copy
{
	padding-top:40px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last div.number p
{
	line-height:407px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last div.img img
{
	display:block
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div.number,#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div.copy,#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div.img
{
	opacity:1;
	filter:alpha(opacity=100)
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div img
{
	display:block
}
	#story-social-portrait .how-we-did-it .lightbulb h2
{
	padding:160px 0 0 0
}
	#story-social-portrait .hourglass
{
	padding:0
}
	#story-social-portrait .hourglass .site-width
{
	width:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip
{
	height:auto
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper
{
	background:#fff;
	height:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground
{
	background:transparent url('/resources/img/story/socialportrait/hourglass-tablet.png') no-repeat;
	background-size:100%;
	height:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p
{
	line-height:29px;
	padding:45% 33% 27%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p.top
{
	color:#404040
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p.bot
{
	padding-top:0;
	padding-bottom:47.5%
}
	#story-social-portrait .shifting
{
	height:700px;
	margin-bottom:50px;
	padding-top:0;
	position:relative
}
	#story-social-portrait .shifting .direction
{
	display:block;
	width:35px;
	height:45px;
	bottom:0;
	top:auto;
	position:absolute;
	opacity:.6;
	-webkit-transition:opacity .2s;
	-moz-transition:opacity .2s;
	-o-transition:opacity .2s;
	transition:opacity .2s;
	cursor:pointer
}
	#story-social-portrait .shifting .direction:hover
{
	opacity:1
}
	#story-social-portrait .shifting .direction.next
{
	left:50%;
	margin-left:20px;
	background:url(/resources/img/ui/right-arrow.png) no-repeat center
}
	#story-social-portrait .shifting .direction.prev
{
	left:50%;
	margin-left:-36px;
	background:url(/resources/img/ui/left-arrow.png) no-repeat center
}
	#story-social-portrait .shifting .animation-wrapper
{
	height:700px
}
	#story-social-portrait .shifting .animation-wrapper .slide
{
	-webkit-transition:all .8s;
	-moz-transition:all .8s;
	-o-transition:all .8s;
	transition:all .8s
}
	#story-social-portrait .shifting .animation-wrapper .slide.one .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.two .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.three .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.four .captions .copy-width
{
	position:relative;
	left:0;
	width:80%;
	margin:0 10%;
	height:100px
}
	#story-social-portrait .shifting .animation-wrapper .slide.active
{
	background-color:#fff
}
	#story-social-portrait .shifting .animation-wrapper .slide.active .captions
{
	color:#000
}
	#story-social-portrait .shifting .animation-wrapper .slide.three
{
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.four>div.animate .cog-container
{
	margin:0 auto;
	width:100%;
	height:473px;
	position:relative
}
	#story-social-portrait .paradigm
{
	background-color:#535353
}
	#story-social-portrait .server h2
{
	padding:0 80px
}
	#story-social-portrait .image-process
{
	padding-top:0
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-social-portrait #css-parallax
{
	display:none;
	visibility:hidden
}
	#story-social-portrait .canvas-intro
{
	padding:100px 0 680px 0;
	background-image:url('/resources/img/story/socialportrait/intro-alt.png');
	background-position:center bottom;
	background-size:200%;
	height:auto
}
	#story-social-portrait .intro
{
	background-size:134% auto;
	padding:0 0 20px 0
}
	#story-social-portrait .intro.animate
{
	background-position:center 100.8%
}
	#story-social-portrait .intro h2
{
	margin:0 0 50px 0
}
	#story-social-portrait .intro .facebook .facebook-profile
{
	margin:20px 0
}
	#story-social-portrait .intro .facebook .facebook-profile img
{
	width:100%
}
	#story-social-portrait .the-right-canvas .icon-wrapper .icon.tl-guys
{
	margin:0 0 40px 0
}
	#story-social-portrait .the-right-canvas .octo-cat
{
	margin:90px 0 40px 0;
	width:100%
}
	#story-social-portrait .the-right-canvas h2.split
{
	margin:0
}
	#story-social-portrait .how-we-did-it-top
{
	background-position:center 100%;
	padding:0 0 480px 0
}
	#story-social-portrait .how-we-did-it-top .lightbulb-cord .step div
{
	width:135px
}
	#story-social-portrait .how-we-did-it-top .lightbulb-cord .step div.mobile img
{
	display:block
}
	#story-social-portrait .how-we-did-it-top .lightbulb-cord .step div.number p
{
	font-size:220px
}
	#story-social-portrait .how-we-did-it-top .lightbulb-cord .step div.img
{
	width:200px
}
	#story-social-portrait .how-we-did-it-top .lightbulb-cord .step div.img img
{
	width:200px
}
	#story-social-portrait .how-we-did-it
{
	padding-top:20px;
	padding-bottom:40px
}
	#story-social-portrait .how-we-did-it .icon-wrapper
{
	margin:-35px 0 20px 0
}
	#story-social-portrait .how-we-did-it .icon-wrapper .icon
{
	-webkit-border-radius:40px;
	-moz-border-radius:40px;
	border-radius:40px;
	padding:30px 0 0 0;
	width:80px;
	height:50px
}
	#story-social-portrait .how-we-did-it .phone
{
	display:block;
	margin:100px auto 0 auto;
	width:100%;
	padding-top:1px
}
	#story-social-portrait .how-we-did-it .phone img
{
	display:block;
	margin:0 auto;
	width:100%
}
	#story-social-portrait .how-we-did-it .pixelated-steps
{
	display:none
}
	#story-social-portrait .how-we-did-it .lightbulb-cord
{
	padding:0 0 50px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step
{
	margin-bottom:0
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div
{
	width:auto
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.number
{
	opacity:1;
	filter:alpha(opacity=100);
	width:100%
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.number p
{
	font-size:215px;
	font-weight:bold;
	line-height:440px;
	color:#383838;
	margin-bottom:0
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.img
{
	opacity:1;
	filter:alpha(opacity=100);
	width:100%;
	height:auto;
	margin:0
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.img img
{
	width:100%;
	display:block
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.img.mobile img
{
	display:block
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.copy
{
	opacity:1;
	filter:alpha(opacity=100);
	background:#232323;
	padding-left:0;
	padding-top:40px;
	height:auto;
	width:auto;
	text-align:center
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.copy p
{
	font-size:26px;
	line-height:38px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.three div.number p
{
	line-height:390px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.three div.number p
{
	line-height:330px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.four div.number p
{
	line-height:310px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last
{
	margin-bottom:150px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last div.copy
{
	padding-top:40px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last div.number p
{
	line-height:330px
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.last div.img img
{
	display:block
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div.copy,#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div.img
{
	opacity:.2;
	filter:alpha(opacity=20)
}
	#story-social-portrait .how-we-did-it .lightbulb-cord .step.semi-active div img
{
	display:none
}
	#story-social-portrait .how-we-did-it .lightbulb h2
{
	padding:160px 0 0 0
}
	#story-social-portrait .hourglass
{
	padding:0
}
	#story-social-portrait .hourglass .site-width
{
	width:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip
{
	height:auto
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper
{
	background:#fff;
	height:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground
{
	background:transparent url('/resources/img/story/socialportrait/hourglass-mobile.png') no-repeat;
	background-size:100%;
	height:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p
{
	font-size:19px;
	line-height:29px;
	padding:20% 25%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p.top
{
	color:#404040
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p.bot
{
	padding-top:6%;
	padding-bottom:4%
}
	#story-social-portrait .shifting
{
	height:500px;
	margin-bottom:50px;
	padding-top:0;
	position:relative
}
	#story-social-portrait .shifting .direction
{
	display:block;
	width:35px;
	height:45px;
	bottom:0;
	top:auto;
	position:absolute;
	opacity:.6;
	-webkit-transition:opacity .2s;
	-moz-transition:opacity .2s;
	-o-transition:opacity .2s;
	transition:opacity .2s;
	cursor:pointer
}
	#story-social-portrait .shifting .direction:hover
{
	opacity:1
}
	#story-social-portrait .shifting .direction.next
{
	left:50%;
	margin-left:20px;
	background:url(/resources/img/ui/right-arrow.png) no-repeat center
}
	#story-social-portrait .shifting .direction.prev
{
	left:50%;
	margin-left:-36px;
	background:url(/resources/img/ui/left-arrow.png) no-repeat center
}
	#story-social-portrait .shifting .animation-wrapper .slide
{
	-webkit-transition:all .8s;
	-moz-transition:all .8s;
	-o-transition:all .8s;
	transition:all .8s
}
	#story-social-portrait .shifting .animation-wrapper .slide.one,#story-social-portrait .shifting .animation-wrapper .slide.two,#story-social-portrait .shifting .animation-wrapper .slide.three,#story-social-portrait .shifting .animation-wrapper .slide.four
{
	height:465px
}
	#story-social-portrait .shifting .animation-wrapper .slide.one div.animate,#story-social-portrait .shifting .animation-wrapper .slide.two div.animate,#story-social-portrait .shifting .animation-wrapper .slide.three div.animate,#story-social-portrait .shifting .animation-wrapper .slide.four div.animate
{
	background-size:80%;
	height:300px
}
	#story-social-portrait .shifting .animation-wrapper .slide.one .captions,#story-social-portrait .shifting .animation-wrapper .slide.two .captions,#story-social-portrait .shifting .animation-wrapper .slide.three .captions,#story-social-portrait .shifting .animation-wrapper .slide.four .captions
{
	padding-top:325px
}
	#story-social-portrait .shifting .animation-wrapper .slide.one .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.two .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.three .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.four .captions .copy-width
{
	position:relative;
	left:0;
	width:80%;
	margin:0 10%;
	height:140px
}
	#story-social-portrait .shifting .animation-wrapper .slide.active
{
	background-color:#fff
}
	#story-social-portrait .shifting .animation-wrapper .slide.active .captions
{
	color:#000
}
	#story-social-portrait .shifting .animation-wrapper .slide.one
{
	width:100%;
	z-index:1;
	-webkit-transition:all .5s linear;
	-moz-transition:all .5s linear;
	-o-transition:all .5s linear
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate
{
	width:100%;
	background:#e5e5e5 url('/resources/img/story/socialportrait/temp-slide1.jpg') center center no-repeat;
	background-size:312%;
	background-position:center top
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .seconds,#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .minutes,#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .hours,#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .center-dot
{
	display:none
}
	#story-social-portrait .shifting .animation-wrapper .slide.two
{
	z-index:2
}
	#story-social-portrait .shifting .animation-wrapper .slide.two div.animate
{
	width:100%;
	background:#51b0ee url('/resources/img/story/socialportrait/temp-slide2.jpg') center center no-repeat;
	background-size:312%;
	background-position:center top
}
	#story-social-portrait .shifting .animation-wrapper .slide.two div.animate .blades,#story-social-portrait .shifting .animation-wrapper .slide.two div.animate .center-dot
{
	display:none;
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.two div.animate .blades img,#story-social-portrait .shifting .animation-wrapper .slide.two div.animate .center-dot img
{
	display:none
}
	#story-social-portrait .shifting .animation-wrapper .slide.three
{
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.three div.animate
{
	width:100%;
	height:300px;
	background:#0064a5 url('/resources/img/story/socialportrait/temp-slide3.jpg') center top no-repeat;
	background-size:312%;
	background-position:center top
}
	#story-social-portrait .shifting .animation-wrapper .slide.three div.animate .clip,#story-social-portrait .shifting .animation-wrapper .slide.three div.animate .swirl,#story-social-portrait .shifting .animation-wrapper .slide.three div.animate .drain
{
	display:none
}
	#story-social-portrait .shifting .animation-wrapper .slide.four div.animate
{
	background:#51b0ee url('/resources/img/story/socialportrait/temp-slide4.jpg') center center no-repeat;
	background-size:312%;
	background-position:center top
}
	#story-social-portrait .shifting .animation-wrapper .slide.four div.animate .big-cog,#story-social-portrait .shifting .animation-wrapper .slide.four div.animate .cog
{
	display:none
}
	#story-social-portrait .server
{
	background:url("/resources/img/story/socialportrait/computer.jpg") top center #99d6ff no-repeat;
	background-size:150%;
	padding:0;
	height:auto
}
	#story-social-portrait .server h2,#story-social-portrait .server h2.first
{
	font-size:24px;
	padding:0 60px
}
	#story-social-portrait .server h2
{
	padding:120px 60px 0 60px;
	margin-bottom:0
}
	#story-social-portrait .server h2.first
{
	margin:20px 0 100px 0
}
	#story-social-portrait .paradigm
{
	background-color:#535353
}
	#story-social-portrait .paradigm h2.alt
{
	padding-top:30px
}
	#story-social-portrait .image-process
{
	padding:50px 0 0 0
}
	#story-social-portrait .image-process .step1
{
	width:327px;
	height:320px;
	margin:60px auto 70px
}
	#story-social-portrait .image-process .step1 img
{
	width:327px;
	height:320px
}
	@keyframes fadeFirstImage
{
	0%
{
	opacity:1;
	filter:alpha(opacity=100)
}
	10%
{
	width:163px;
	height:160px;
	top:108px;
	left:108px;
	opacity:1;
	filter:alpha(opacity=100)
}
	60%
{
	width:163px;
	height:160px;
	opacity:.5;
	filter:alpha(opacity=50);
	top:108px;
	left:108px
}
	100%
{
	width:163px;
	height:160px;
	opacity:0;
	filter:alpha(opacity=0);
	top:108px;
	left:108px
}

}
	@-webkit-keyframes fadeFirstImage
{
	0%
{
	opacity:1;
	filter:alpha(opacity=100)
}
	10%
{
	width:163px;
	height:160px;
	top:81px;
	left:81px;
	opacity:1;
	filter:alpha(opacity=100)
}
	60%
{
	width:163px;
	height:160px;
	opacity:.5;
	filter:alpha(opacity=50);
	top:81px;
	left:81px
}
	100%
{
	width:163px;
	height:160px;
	opacity:0;
	filter:alpha(opacity=0);
	top:81px;
	left:81px
}

}
	@keyframes fadeSecondImage
{
	0%
{
	opacity:0;
	filter:alpha(opacity=0)
}
	10%
{
	width:163px;
	height:160px;
	top:81px;
	left:81px;
	opacity:0;
	filter:alpha(opacity=0)
}
	60%
{
	width:163px;
	height:160px;
	opacity:.5;
	filter:alpha(opacity=50);
	top:81px;
	left:81px
}
	100%
{
	width:327px;
	height:320px;
	opacity:1;
	filter:alpha(opacity=100);
	top:81px;
	left:81px
}

}
	@-webkit-keyframes fadeSecondImage
{
	0%
{
	opacity:0;
	filter:alpha(opacity=0)
}
	10%
{
	width:163px;
	height:160px;
	top:81px;
	left:81px;
	opacity:0;
	filter:alpha(opacity=0)
}
	15%
{
	width:163px;
	height:160px;
	top:81px;
	left:81px;
	opacity:.7;
	filter:alpha(opacity=70)
}
	20%
{
	width:327px;
	height:320px;
	opacity:1;
	filter:alpha(opacity=100);
	top:0;
	left:0
}
	100%
{
	width:327px;
	height:320px;
	opacity:1;
	filter:alpha(opacity=100);
	top:0;
	left:0
}

}
	#story-social-portrait .image-process .step4
{
	padding:50px 0
}
	#story-social-portrait .image-process .step4 .dials
{
	width:100%
}
	#story-social-portrait .grand-unveiling #demo-video
{
	display:none
}
	#story-social-portrait .social-portrait-gallery
{
	padding-bottom:40px
}

}
	@media all and (max-width:500px) and (min-width:0) and screen and (max-width:384px) and (min-width:384px)
{
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p.bot
{
	padding-top:26%;
	padding-bottom:14%
}

}
	@media all and (max-width:384px) and (min-width:384px)
{
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p.bot
{
	padding-top:26%;
	padding-bottom:10%
}
	#story-social-portrait .shifting
{
	height:530px;
	margin-bottom:20px;
	padding-top:0;
	position:relative
}
	#story-social-portrait .shifting .direction
{
	display:block;
	width:35px;
	height:45px;
	bottom:0;
	top:auto;
	position:absolute;
	opacity:.6;
	-webkit-transition:opacity .2s;
	-moz-transition:opacity .2s;
	-o-transition:opacity .2s;
	transition:opacity .2s;
	cursor:pointer
}
	#story-social-portrait .shifting .direction:hover
{
	opacity:1
}
	#story-social-portrait .shifting .direction.next
{
	left:50%;
	margin-left:20px;
	background:url(/resources/img/ui/right-arrow.png) no-repeat center
}
	#story-social-portrait .shifting .direction.prev
{
	left:50%;
	margin-left:-36px;
	background:url(/resources/img/ui/left-arrow.png) no-repeat center
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate
{
	background-size:260%
}
	#story-social-portrait .shifting .animation-wrapper .slide.two div.animate
{
	background-size:260%
}
	#story-social-portrait .shifting .animation-wrapper .slide.three div.animate
{
	background-size:260%
}
	#story-social-portrait .shifting .animation-wrapper .slide.four div.animate
{
	background-size:260%
}

}
	@media all and (max-width:320px) and (min-width:320px)
{
	#story-social-portrait .canvas-intro
{
	padding-bottom:590px
}
	#story-social-portrait .image-process
{
	padding:50px 0 0 0
}
	#story-social-portrait .image-process .step1
{
	width:277px;
	height:270px;
	margin:60px auto 70px
}
	#story-social-portrait .image-process .step1 img
{
	width:277px;
	height:270px
}
	@-webkit-keyframes fadeFirstImage
{
	0%
{
	opacity:1;
	filter:alpha(opacity=100)
}
	10%
{
	width:163px;
	height:160px;
	top:62px;
	left:62px;
	opacity:1;
	filter:alpha(opacity=100)
}
	60%
{
	width:163px;
	height:160px;
	opacity:.5;
	filter:alpha(opacity=50);
	top:62px;
	left:62px
}
	100%
{
	width:163px;
	height:160px;
	opacity:0;
	filter:alpha(opacity=0);
	top:62px;
	left:62px
}

}
	@-webkit-keyframes fadeSecondImage
{
	0%
{
	opacity:0;
	filter:alpha(opacity=0)
}
	10%
{
	width:163px;
	height:160px;
	top:62px;
	left:62px;
	opacity:0;
	filter:alpha(opacity=0)
}
	15%
{
	width:163px;
	height:160px;
	top:62px;
	left:62px;
	opacity:.7;
	filter:alpha(opacity=70)
}
	20%
{
	width:277px;
	height:270px;
	opacity:1;
	filter:alpha(opacity=100);
	top:0;
	left:0
}
	100%
{
	width:277px;
	height:270px;
	opacity:1;
	filter:alpha(opacity=100);
	top:0;
	left:0
}

}
	#story-social-portrait .image-process .step4
{
	padding:50px 0
}
	#story-social-portrait .image-process .step4 .dials
{
	width:100%
}
	#story-social-portrait .shifting
{
	height:530px;
	margin-bottom:20px
}

}
	@media all and (max-width:601px) and (min-width:601px)
{
	#story-social-portrait .how-we-did-it .lightbulb-cord .step div.copy p
{
	margin:0 auto;
	font-size:23px;
	line-height:38px;
	width:95%
}
	#story-social-portrait .hourglass
{
	padding:0
}
	#story-social-portrait .hourglass .site-width
{
	width:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip
{
	height:auto
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper
{
	background:#fff;
	height:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground
{
	background:transparent url('/resources/img/story/socialportrait/hourglass-tablet.png') no-repeat;
	background-size:100%;
	height:100%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p
{
	line-height:29px;
	padding:44% 33% 18%
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p.top
{
	color:#404040
}
	#story-social-portrait .hourglass .site-width .hourglass-clip .hourglass-wrapper .hourglass-foreground p.bot
{
	padding-top:0;
	padding-bottom:43%
}
	#story-social-portrait .shifting
{
	height:530px;
	margin-bottom:20px;
	padding-top:0;
	position:relative
}
	#story-social-portrait .shifting .direction
{
	display:block;
	width:35px;
	height:45px;
	bottom:0;
	top:auto;
	position:absolute;
	opacity:.6;
	-webkit-transition:opacity .2s;
	-moz-transition:opacity .2s;
	-o-transition:opacity .2s;
	transition:opacity .2s;
	cursor:pointer
}
	#story-social-portrait .shifting .direction:hover
{
	opacity:1
}
	#story-social-portrait .shifting .direction.next
{
	left:50%;
	margin-left:20px;
	background:url(/resources/img/ui/right-arrow.png) no-repeat center
}
	#story-social-portrait .shifting .direction.prev
{
	left:50%;
	margin-left:-36px;
	background:url(/resources/img/ui/left-arrow.png) no-repeat center
}
	#story-social-portrait .shifting .animation-wrapper .slide
{
	-webkit-transition:all .8s;
	-moz-transition:all .8s;
	-o-transition:all .8s;
	transition:all .8s
}
	#story-social-portrait .shifting .animation-wrapper .slide.one,#story-social-portrait .shifting .animation-wrapper .slide.two,#story-social-portrait .shifting .animation-wrapper .slide.three,#story-social-portrait .shifting .animation-wrapper .slide.four
{
	height:465px
}
	#story-social-portrait .shifting .animation-wrapper .slide.one div.animate,#story-social-portrait .shifting .animation-wrapper .slide.two div.animate,#story-social-portrait .shifting .animation-wrapper .slide.three div.animate,#story-social-portrait .shifting .animation-wrapper .slide.four div.animate
{
	background-size:80%;
	height:300px
}
	#story-social-portrait .shifting .animation-wrapper .slide.one .captions,#story-social-portrait .shifting .animation-wrapper .slide.two .captions,#story-social-portrait .shifting .animation-wrapper .slide.three .captions,#story-social-portrait .shifting .animation-wrapper .slide.four .captions
{
	padding-top:325px
}
	#story-social-portrait .shifting .animation-wrapper .slide.one .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.two .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.three .captions .copy-width,#story-social-portrait .shifting .animation-wrapper .slide.four .captions .copy-width
{
	position:relative;
	left:0;
	width:80%;
	margin:0 10%;
	height:140px
}
	#story-social-portrait .shifting .animation-wrapper .slide.active
{
	background-color:#fff
}
	#story-social-portrait .shifting .animation-wrapper .slide.active .captions
{
	color:#000
}
	#story-social-portrait .shifting .animation-wrapper .slide.one
{
	width:100%;
	z-index:1;
	-webkit-transition:all .5s linear;
	-moz-transition:all .5s linear;
	-o-transition:all .5s linear
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate
{
	width:100%;
	background:#e5e5e5 url('/resources/img/story/socialportrait/temp-slide1.jpg') center center no-repeat;
	background-size:168%;
	background-position:center top
}
	#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .seconds,#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .minutes,#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .hours,#story-social-portrait .shifting .animation-wrapper .slide.one>div.animate .center-dot
{
	display:none
}
	#story-social-portrait .shifting .animation-wrapper .slide.two
{
	z-index:2
}
	#story-social-portrait .shifting .animation-wrapper .slide.two div.animate
{
	width:100%;
	background:#51b0ee url('/resources/img/story/socialportrait/temp-slide2.jpg') center center no-repeat;
	background-size:168%;
	background-position:center top
}
	#story-social-portrait .shifting .animation-wrapper .slide.two div.animate .blades,#story-social-portrait .shifting .animation-wrapper .slide.two div.animate .center-dot
{
	display:none;
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.two div.animate .blades img,#story-social-portrait .shifting .animation-wrapper .slide.two div.animate .center-dot img
{
	display:none
}
	#story-social-portrait .shifting .animation-wrapper .slide.three
{
	z-index:3
}
	#story-social-portrait .shifting .animation-wrapper .slide.three div.animate
{
	width:100%;
	height:300px;
	background:#0064a5 url('/resources/img/story/socialportrait/temp-slide3.jpg') center top no-repeat;
	background-size:168%;
	background-position:center top
}
	#story-social-portrait .shifting .animation-wrapper .slide.three div.animate .clip,#story-social-portrait .shifting .animation-wrapper .slide.three div.animate .swirl,#story-social-portrait .shifting .animation-wrapper .slide.three div.animate .drain
{
	display:none
}
	#story-social-portrait .shifting .animation-wrapper .slide.four div.animate
{
	background:#51b0ee url('/resources/img/story/socialportrait/temp-slide4.jpg') center center no-repeat;
	background-size:168%;
	background-position:center top
}
	#story-social-portrait .shifting .animation-wrapper .slide.four div.animate .big-cog,#story-social-portrait .shifting .animation-wrapper .slide.four div.animate .cog
{
	display:none
}
	#story-social-portrait .server h2
{
	padding:0 15px
}

}
	#story-prismatic .intro
{
	position:relative;
	background:#ef4f34;
	color:#fff;
	padding-top:650px
}
	#story-prismatic .intro .tiles
{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	z-index:5;
	opacity:.7
}
	#story-prismatic .intro .tiles .gradient
{
	width:100%;
	height:300px;
	position:absolute;
	left:0;
	bottom:-20px;
	z-index:20;
	background:-moz-linear-gradient(top,rgba(239,79,52,0) 0,#ef4f34 100%);
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(239,79,52,0)),color-stop(100%,#ef4f34));
	background:-webkit-linear-gradient(top,rgba(239,79,52,0) 0,#ef4f34 100%);
	background:-o-linear-gradient(top,rgba(239,79,52,0) 0,#ef4f34 100%);
	background:-ms-linear-gradient(top,rgba(239,79,52,0) 0,#ef4f34 100%);
	background:linear-gradient(to bottom,rgba(239,79,52,0) 0,#ef4f34 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ef4f34',endColorstr='#ef4f34',GradientType=0)
}
	#story-prismatic .intro .tile
{
	position:relative;
	width:16.6%;
	float:left;
	z-index:5;
	-webkit-perspective:1000px;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	border:2px solid transparent;
	box-sizing:border-box;
	cursor:pointer
}
	#story-prismatic .intro .tile:hover
{
	z-index:10
}
	#story-prismatic .intro .tile.movies .back
{
	background-image:url(/resources/img/story/prismatic/tiles/movies.jpg)
}
	#story-prismatic .intro .tile.gadgets .back
{
	background-image:url(/resources/img/story/prismatic/tiles/gadgets.jpg)
}
	#story-prismatic .intro .tile.typography .back
{
	background-image:url(/resources/img/story/prismatic/tiles/typography.jpg)
}
	#story-prismatic .intro .tile.exercise .back
{
	background-image:url(/resources/img/story/prismatic/tiles/exercise.jpg)
}
	#story-prismatic .intro .tile.photography .back
{
	background-image:url(/resources/img/story/prismatic/tiles/photography.jpg)
}
	#story-prismatic .intro .tile.indie-rock .back
{
	background-image:url(/resources/img/story/prismatic/tiles/indie-rock.jpg)
}
	#story-prismatic .intro .tile.burritos .back
{
	background-image:url(/resources/img/story/prismatic/tiles/burritos.jpg)
}
	#story-prismatic .intro .tile.twitter .back
{
	background-image:url(/resources/img/story/prismatic/tiles/twitter.jpg)
}
	#story-prismatic .intro .tile.ted .back
{
	background-image:url(/resources/img/story/prismatic/tiles/ted.jpg)
}
	#story-prismatic .intro .tile.architecture .back
{
	background-image:url(/resources/img/story/prismatic/tiles/architecture.jpg)
}
	#story-prismatic .intro .tile.el-salvador .back
{
	background-image:url(/resources/img/story/prismatic/tiles/el-salvador.jpg)
}
	#story-prismatic .intro .tile.bbc .back
{
	background-image:url(/resources/img/story/prismatic/tiles/bbc.jpg)
}
	#story-prismatic .intro .tile.vacation-homes .back
{
	background-image:url(/resources/img/story/prismatic/tiles/vacation-homes.jpg)
}
	#story-prismatic .intro .tile.hiking .back
{
	background-image:url(/resources/img/story/prismatic/tiles/hiking.jpg)
}
	#story-prismatic .intro .tile.yahoo .back
{
	background-image:url(/resources/img/story/prismatic/tiles/yahoo.jpg)
}
	#story-prismatic .intro .tile.books .back
{
	background-image:url(/resources/img/story/prismatic/tiles/books.jpg)
}
	#story-prismatic .intro .tile.advertising .back
{
	background-image:url(/resources/img/story/prismatic/tiles/advertising.jpg)
}
	#story-prismatic .intro .tile.netflix .back
{
	background-image:url(/resources/img/story/prismatic/tiles/netflix.jpg)
}
	#story-prismatic .intro .tile:hover .back
{
	-webkit-transform:rotateY(165deg);
	-moz-transform:rotateY(165deg);
	-o-transform:rotateY(165deg);
	transform:rotateY(165deg)
}
	#story-prismatic .intro .tile:hover .front
{
	-webkit-transform:rotateY(-15deg);
	-moz-transform:rotateY(-15deg);
	-o-transform:rotateY(-15deg);
	transform:rotateY(-15deg);
	background:#c9402a
}
	#story-prismatic .intro .tile.active .front
{
	-webkit-transform:rotateY(-180deg);
	-moz-transform:rotateY(-180deg);
	-o-transform:rotateY(-180deg);
	transform:rotateY(-180deg);
	-webkit-transform-origin:50% 50%
}
	#story-prismatic .intro .tile.active .back
{
	-webkit-transform:rotateY(0deg);
	-moz-transform:rotateY(0deg);
	-o-transform:rotateY(0deg);
	transform:rotateY(0deg);
	-webkit-transform-origin:50% 50%
}
	#story-prismatic .intro .tile img
{
	width:100%
}
	#story-prismatic .intro .tile .wrap
{
	position:relative;
	width:100%;
	height:100%
}
	#story-prismatic .intro .tile .front,#story-prismatic .intro .tile .back
{
	width:100%;
	height:100%;
	-webkit-backface-visibility:hidden;
	-moz-backface-visibility:hidden;
	-o-backface-visibility:hidden;
	backface-visibility:hidden;
	-webkit-transition-duration:.75s;
	-moz-transition-duration:.75s;
	-o-transition-duration:.75s;
	transition-duration:.75s;
	-webkit-transform-style:preserve-3d;
	-moz-transform-style:preserve-3d;
	-o-transform-style:preserve-3d;
	transform-style:preserve-3d;
	position:absolute;
	top:0;
	left:0;
	box-shadow:1px 1px 2px 0 rgba(50,50,50,0.17);
	-webkit-transform-origin:0 0
}
	#story-prismatic .intro .tile .front
{
	background:#d2452e;
	font-size:24px;
	color:rgba(0,0,0,0.2);
	-webkit-transform:rotateY(0deg);
	-moz-transform:rotateY(0deg);
	-o-transform:rotateY(0deg);
	transform:rotateY(0deg);
	z-index:2
}
	#story-prismatic .intro .tile .front span
{
	position:absolute;
	left:0;
	top:50%;
	width:100%;
	text-align:center;
	margin-top:-16px
}
	#story-prismatic .intro .tile .back
{
	-webkit-transform:rotateY(180deg);
	-moz-transform:rotateY(180deg);
	-o-transform:rotateY(180deg);
	transform:rotateY(180deg);
	background-position:left top;
	background-repeat:no-repeat;
	background-size:cover
}
	#story-prismatic .intro .tile .back span
{
	position:absolute;
	bottom:40px;
	left:0;
	width:100%;
	z-index:2;
	text-align:center;
	font-size:26px;
	font-weight:bold
}
	#story-prismatic .intro .tile .back .mask
{
	position:absolute;
	left:0;
	top:0;
	z-index:1;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.32)
}
	#story-prismatic .intro .site-width
{
	position:relative;
	z-index:10
}
	#story-prismatic .intro .logo
{
	display:inline-block;
	width:200px;
	height:40px;
	background:url(/resources/img/story/prismatic/logo.png) no-repeat left top;
	background-size:cover
}
	#story-prismatic .call-to-adventure
{
	background:#fff;
	color:#51504c
}
	#story-prismatic .call-to-adventure .tl-guys
{
	color:#cecece
}
	#story-prismatic .call-to-adventure h2
{
	color:#4b5959
}
	#story-prismatic .call-to-adventure blockquote
{
	color:#17b4a1
}
	#story-prismatic .call-to-adventure .initial-version
{
	text-align:center;
	margin-bottom:40px
}
	#story-prismatic .call-to-adventure .initial-version .wrap
{
	position:relative;
	display:inline-block;
	width:304px;
	height:633px
}
	#story-prismatic .call-to-adventure .initial-version .phone
{
	position:absolute;
	top:0;
	left:0;
	z-index:10;
	width:304px;
	height:633px;
	background:url(/resources/img/story/prismatic/old-version-phone.png) no-repeat left top;
	background-size:cover
}
	#story-prismatic .call-to-adventure .initial-version .menu
{
	position:absolute;
	top:105px;
	left:0;
	z-index:5;
	width:273px;
	height:462px;
	background:url(/resources/img/story/prismatic/old-version-menu.png) no-repeat left top;
	background-size:cover;
	-webkit-transition:-webkit-transform .5s;
	-moz-transition:-moz-transform .5s;
	-o-transition:-o-transform .5s;
	transition:transform .5s
}
	#story-prismatic .call-to-adventure .initial-version .article
{
	position:absolute;
	top:105px;
	right:0;
	z-index:5;
	width:273px;
	height:462px;
	background:url(/resources/img/story/prismatic/old-version-article.png) no-repeat left top;
	background-size:cover;
	-webkit-transition:-webkit-transform .5s;
	-moz-transition:-moz-transform .5s;
	-o-transition:-o-transform .5s;
	transition:transform .5s
}
	#story-prismatic .call-to-adventure .initial-version.animate .menu
{
	-webkit-transform:translate(-248px,0);
	-moz-transform:translate(-248px,0);
	-ms-transform:translate(-248px,0);
	-o-transform:translate(-248px,0);
	transform:translate(-248px,0)
}
	#story-prismatic .call-to-adventure .initial-version.animate .article
{
	-webkit-transform:translate(248px,0);
	-moz-transform:translate(248px,0);
	-ms-transform:translate(248px,0);
	-o-transform:translate(248px,0);
	transform:translate(248px,0)
}
	#story-prismatic .call-to-adventure #before-gallery
{
	margin-bottom:20px
}
	#story-prismatic .call-to-adventure .quote-head
{
	text-align:center;
	margin-top:100px
}
	#story-prismatic .call-to-adventure blockquote
{
	margin-top:60px
}
	#story-prismatic .beers-with-brad
{
	background:#4b5959 url(/resources/img/story/prismatic/beer-bg.jpg) no-repeat right top;
	background-size:cover;
	color:#b5bfc4
}
	#story-prismatic .beers-with-brad h2
{
	color:#fff
}
	#story-prismatic .good-fit
{
	background:#f1f0ee;
	color:#51504c;
	padding-bottom:0
}
	#story-prismatic .good-fit .tl-guys
{
	color:#cecece
}
	#story-prismatic .good-fit h2
{
	color:#4b5959
}
	#story-prismatic .good-fit .related-screenshots
{
	text-align:center;
	margin-top:50px;
	margin-bottom:50px
}
	#story-prismatic .good-fit .related-screenshots .screen
{
	-webkit-box-shadow:0 0 5px 0 rgba(0,0,0,0.2);
	-moz-box-shadow:0 0 5px 0 rgba(0,0,0,0.2);
	box-shadow:0 0 5px 0 rgba(0,0,0,0.2)
}
	#story-prismatic .good-fit .related-screenshots .wrap
{
	display:inline-block;
	position:relative;
	width:536px;
	height:560px
}
	#story-prismatic .good-fit .related-screenshots .tweetmag
{
	position:absolute;
	left:0;
	bottom:0;
	z-index:5;
	width:407px;
	height:463px;
	background:url(/resources/img/story/prismatic/tweetmag-screen.jpg) no-repeat left top;
	background-size:cover;
	-webkit-transition:-webkit-transform .5s;
	-moz-transition:-moz-transform .5s;
	-o-transition:-o-transform .5s;
	transition:transform .5s
}
	#story-prismatic .good-fit .related-screenshots .medium
{
	position:absolute;
	left:0;
	bottom:0;
	z-index:10;
	width:536px;
	height:560px;
	background:url(/resources/img/story/prismatic/medium-screen.jpg) no-repeat left top;
	background-size:cover
}
	#story-prismatic .good-fit .related-screenshots .readability
{
	position:absolute;
	right:0;
	bottom:0;
	z-index:5;
	width:419px;
	height:463px;
	background:url(/resources/img/story/prismatic/readability-screen.jpg) no-repeat left top;
	background-size:cover;
	-webkit-transition:-webkit-transform .5s;
	-moz-transition:-moz-transform .5s;
	-o-transition:-o-transform .5s;
	transition:transform .5s
}
	#story-prismatic .good-fit .related-screenshots.animate .tweetmag
{
	-webkit-transform:translate(-250px,0);
	-moz-transform:translate(-250px,0);
	-ms-transform:translate(-250px,0);
	-o-transform:translate(-250px,0);
	transform:translate(-250px,0)
}
	#story-prismatic .good-fit .related-screenshots.animate .readability
{
	-webkit-transform:translate(250px,0);
	-moz-transform:translate(250px,0);
	-ms-transform:translate(250px,0);
	-o-transform:translate(250px,0);
	transform:translate(250px,0)
}
	#story-prismatic .human-element
{
	background:#fff;
	color:#51504c
}
	#story-prismatic .human-element .tl-guys
{
	color:#cecece
}
	#story-prismatic .human-element h2
{
	color:#4b5959
}
	#story-prismatic .human-element .inspiration-gallery
{
	position:relative;
	width:100%;
	height:615px;
	overflow:hidden
}
	#story-prismatic .human-element .inspiration-gallery .wrap
{
	position:absolute;
	left:50%;
	width:2145px;
	height:615px;
	background:url(/resources/img/story/prismatic/inspiration.jpg) no-repeat center top;
	margin-left:-1072px
}
	#story-prismatic .focus
{
	background:#9e9d92;
	color:#fff;
	padding-bottom:0
}
	#story-prismatic .focus ol li:before
{
	color:#fff
}
	#story-prismatic .focus .circles
{
	position:relative;
	height:530px;
	overflow:hidden;
	margin-top:-70px
}
	#story-prismatic .focus .circles.animate .focus
{
	color:#fff;
	border-color:#b1b1a8
}
	#story-prismatic .focus .circles.animate .search
{
	-webkit-transform:translate(-430px,136px);
	-moz-transform:translate(-430px,136px);
	-ms-transform:translate(-430px,136px);
	-o-transform:translate(-430px,136px);
	transform:translate(-430px,136px)
}
	#story-prismatic .focus .circles.animate .explains
{
	-webkit-transform:translate(-140px,136px);
	-moz-transform:translate(-140px,136px);
	-ms-transform:translate(-140px,136px);
	-o-transform:translate(-140px,136px);
	transform:translate(-140px,136px)
}
	#story-prismatic .focus .circles.animate .discussion
{
	-webkit-transform:translate(150px,136px);
	-moz-transform:translate(150px,136px);
	-ms-transform:translate(150px,136px);
	-o-transform:translate(150px,136px);
	transform:translate(150px,136px)
}
	#story-prismatic .focus .circle
{
	position:absolute;
	left:50%;
	top:0;
	border-radius:10000px;
	border:3px solid #a3a396;
	color:#b1b1a8;
	background:#9e9d92;
	-webkit-transition:all 1s;
	-moz-transition:all 1s;
	-o-transition:all 1s;
	transition:all 1s;
	z-index:1
}
	#story-prismatic .focus .circle span
{
	display:block;
	position:absolute;
	top:50%;
	left:0;
	width:100%;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-weight:700;
	text-align:center
}
	#story-prismatic .focus .circle.focus
{
	z-index:10
}
	#story-prismatic .focus .circle.small
{
	width:85px;
	height:85px;
	font-size:12px
}
	#story-prismatic .focus .circle.small span
{
	margin-top:-9px
}
	#story-prismatic .focus .circle.medium
{
	width:165px;
	height:165px;
	font-size:20px
}
	#story-prismatic .focus .circle.medium span
{
	margin-top:-13px
}
	#story-prismatic .focus .circle.large
{
	width:280px;
	height:280px;
	font-size:30px
}
	#story-prismatic .focus .circle.large span
{
	margin-top:-19px
}
	#story-prismatic .focus .search
{
	-webkit-transform:translate(-486px,115px);
	-moz-transform:translate(-486px,115px);
	-ms-transform:translate(-486px,115px);
	-o-transform:translate(-486px,115px);
	transform:translate(-486px,115px)
}
	#story-prismatic .focus .explains
{
	-webkit-transform:translate(-127px,283px);
	-moz-transform:translate(-127px,283px);
	-ms-transform:translate(-127px,283px);
	-o-transform:translate(-127px,283px);
	transform:translate(-127px,283px)
}
	#story-prismatic .focus .discussion
{
	-webkit-transform:translate(368px,0px);
	-moz-transform:translate(368px,0px);
	-ms-transform:translate(368px,0px);
	-o-transform:translate(368px,0px);
	transform:translate(368px,0px)
}
	#story-prismatic .focus .sharing
{
	-webkit-transform:translate(-560px,91px);
	-moz-transform:translate(-560px,91px);
	-ms-transform:translate(-560px,91px);
	-o-transform:translate(-560px,91px);
	transform:translate(-560px,91px)
}
	#story-prismatic .focus .threads
{
	-webkit-transform:translate(-685px,202px);
	-moz-transform:translate(-685px,202px);
	-ms-transform:translate(-685px,202px);
	-o-transform:translate(-685px,202px);
	transform:translate(-685px,202px)
}
	#story-prismatic .focus .following
{
	-webkit-transform:translate(-642px,372px);
	-moz-transform:translate(-642px,372px);
	-ms-transform:translate(-642px,372px);
	-o-transform:translate(-642px,372px);
	transform:translate(-642px,372px)
}
	#story-prismatic .focus .image-upload
{
	-webkit-transform:translate(-210px,57px);
	-moz-transform:translate(-210px,57px);
	-ms-transform:translate(-210px,57px);
	-o-transform:translate(-210px,57px);
	transform:translate(-210px,57px)
}
	#story-prismatic .focus .iphone
{
	-webkit-transform:translate(-182px,259px);
	-moz-transform:translate(-182px,259px);
	-ms-transform:translate(-182px,259px);
	-o-transform:translate(-182px,259px);
	transform:translate(-182px,259px)
}
	#story-prismatic .focus .onboarding
{
	-webkit-transform:translate(-336px,407px);
	-moz-transform:translate(-336px,407px);
	-ms-transform:translate(-336px,407px);
	-o-transform:translate(-336px,407px);
	transform:translate(-336px,407px)
}
	#story-prismatic .focus .icons
{
	-webkit-transform:translate(-17px,91px);
	-moz-transform:translate(-17px,91px);
	-ms-transform:translate(-17px,91px);
	-o-transform:translate(-17px,91px);
	transform:translate(-17px,91px)
}
	#story-prismatic .focus .ipad
{
	-webkit-transform:translate(171px,131px);
	-moz-transform:translate(171px,131px);
	-ms-transform:translate(171px,131px);
	-o-transform:translate(171px,131px);
	transform:translate(171px,131px)
}
	#story-prismatic .focus .settings
{
	-webkit-transform:translate(323px,296px);
	-moz-transform:translate(323px,296px);
	-ms-transform:translate(323px,296px);
	-o-transform:translate(323px,296px);
	transform:translate(323px,296px)
}
	#story-prismatic .focus .composing
{
	-webkit-transform:translate(520px,320px);
	-moz-transform:translate(520px,320px);
	-ms-transform:translate(520px,320px);
	-o-transform:translate(520px,320px);
	transform:translate(520px,320px)
}
	#story-prismatic .focus .sign-up
{
	-webkit-transform:translate(481px,442px);
	-moz-transform:translate(481px,442px);
	-ms-transform:translate(481px,442px);
	-o-transform:translate(481px,442px);
	transform:translate(481px,442px)
}
	#story-prismatic .rapid-feedback
{
	background:#fff;
	color:#51504c;
	padding-bottom:0
}
	#story-prismatic .rapid-feedback .tl-guys
{
	color:#cecece
}
	#story-prismatic .rapid-feedback h2
{
	color:#4b5959
}
	#story-prismatic .rapid-feedback .icons
{
	text-align:center;
	margin-top:80px;
	margin-bottom:100px
}
	#story-prismatic .rapid-feedback .icons h3
{
	color:#18b3a1
}
	#story-prismatic .rapid-feedback .icons img
{
	max-width:90%
}
	#story-prismatic .rapid-feedback .testers
{
	width:100%;
	text-align:center;
	margin-bottom:80px
}
	#story-prismatic .rapid-feedback .testers img
{
	width:100%;
	max-width:2000px
}
	#story-prismatic .the-reward
{
	background:#f1f0ee;
	color:#51504c
}
	#story-prismatic .the-reward h2
{
	color:#4b5959
}
	#story-prismatic .the-reward h3
{
	color:#4b5959;
	text-align:center
}
	#story-prismatic .the-reward .grid-sample
{
	text-align:center;
	margin-bottom:110px
}
	#story-prismatic .the-reward .grid-sample .wrap
{
	display:inline-block;
	position:relative;
	width:427px;
	height:457px
}
	#story-prismatic .the-reward .grid-sample .grid
{
	position:absolute;
	top:102px;
	left:0;
	z-index:10
}
	#story-prismatic .the-reward .grid-sample .card
{
	position:absolute;
	top:0;
	left:30px;
	z-index:5;
	-webkit-transition:opacity .5s ease-in-out;
	-moz-transition:opacity .5s ease-in-out;
	-o-transition:opacity .5s ease-in-out;
	transition:opacity .5s ease-in-out;
	opacity:0
}
	#story-prismatic .the-reward .grid-sample .card.active
{
	opacity:1;
	z-index:6
}
	#story-prismatic .the-reward .grid-sample .note
{
	background:url(/resources/img/story/prismatic/grid-arrow.png) no-repeat left top;
	padding:70px 0 0 30px;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1em;
	color:#289093;
	position:absolute;
	z-index:15;
	left:450px;
	top:250px;
	width:200px
}
	#story-prismatic .the-reward .grid-sample .arrows
{
	text-align:center;
	position:absolute;
	left:0;
	bottom:-60px;
	width:100%
}
	#story-prismatic .the-reward .grid-sample .arrows span
{
	display:inline-block;
	width:16px;
	height:25px;
	margin:0 10px;
	opacity:.5;
	-webkit-transition:opacity .2s;
	-moz-transition:opacity .2s;
	-o-transition:opacity .2s;
	transition:opacity .2s
}
	#story-prismatic .the-reward .grid-sample .arrows span:hover
{
	opacity:.9;
	cursor:pointer
}
	#story-prismatic .the-reward .grid-sample .arrows .prev
{
	background:url(/resources/img/ui/left-arrow.png) no-repeat left top
}
	#story-prismatic .the-reward .grid-sample .arrows .next
{
	background:url(/resources/img/ui/right-arrow.png) no-repeat left top
}
	#story-prismatic .the-reward .align-headlines
{
	text-align:center;
	margin-bottom:110px
}
	#story-prismatic .the-reward .align-headlines .wrap
{
	display:inline-block;
	position:relative;
	width:1200px;
	max-width:93%;
	height:457px
}
	#story-prismatic .the-reward .align-headlines .card
{
	position:absolute;
	top:0;
	left:0;
	z-index:5;
	-webkit-transition:opacity .5s ease-in-out;
	-moz-transition:opacity .5s ease-in-out;
	-o-transition:opacity .5s ease-in-out;
	transition:opacity .5s ease-in-out;
	opacity:0;
	width:100%
}
	#story-prismatic .the-reward .align-headlines .card.active
{
	opacity:1;
	z-index:6
}
	#story-prismatic .the-reward .align-headlines .arrows
{
	text-align:center;
	position:absolute;
	left:0;
	bottom:-60px;
	width:100%
}
	#story-prismatic .the-reward .align-headlines .arrows span
{
	display:inline-block;
	width:16px;
	height:25px;
	margin:0 10px;
	opacity:.5;
	-webkit-transition:opacity .2s;
	-moz-transition:opacity .2s;
	-o-transition:opacity .2s;
	transition:opacity .2s
}
	#story-prismatic .the-reward .align-headlines .arrows span:hover
{
	opacity:.9;
	cursor:pointer
}
	#story-prismatic .the-reward .align-headlines .arrows .prev
{
	background:url(/resources/img/ui/left-arrow.png) no-repeat left top
}
	#story-prismatic .the-reward .align-headlines .arrows .next
{
	background:url(/resources/img/ui/right-arrow.png) no-repeat left top
}
	#story-prismatic .the-reward .explain .mobile
{
	display:none
}
	#story-prismatic .the-reward .sample
{
	position:relative;
	text-align:center;
	margin-bottom:30px
}
	#story-prismatic .the-reward .sample img
{
	display:inline-block
}
	#story-prismatic .the-reward .sample .note
{
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1em;
	color:#000;
	position:absolute;
	z-index:15
}
	#story-prismatic .the-reward .icons-avatars img
{
	max-width:100%
}
	#story-prismatic .the-reward .icons-avatars .note
{
	background:url(/resources/img/story/prismatic/explain-icon-arrow.png) no-repeat left 20px;
	padding:0 0 30px 60px;
	left:50%;
	top:0;
	width:150px;
	margin-left:140px
}
	#story-prismatic .the-reward .clarity img
{
	max-width:100%
}
	#story-prismatic .the-reward .clarity .note
{
	background:url(/resources/img/story/prismatic/explain-icon-arrow.png) no-repeat left 20px;
	padding:0 0 30px 60px;
	left:50%;
	top:-17px;
	width:150px;
	margin-left:90px
}
	#story-prismatic .the-reward .more-fails
{
	padding-top:43px
}
	#story-prismatic .the-reward .more-fails img
{
	max-width:100%
}
	#story-prismatic .the-reward .more-fails .note
{
	background:url(/resources/img/story/prismatic/explain-fails-arrow.png) no-repeat left 20px;
	padding:0 0 33px 0;
	left:50%;
	top:-17px;
	width:440px;
	margin-left:-215px
}
	#story-prismatic .the-reward .trimming-fat img
{
	max-width:100%
}
	#story-prismatic .the-reward .breather
{
	text-align:center;
	position:relative
}
	#story-prismatic .the-reward .breather .note
{
	background:url(/resources/img/story/prismatic/breather-arrow.png) no-repeat right 8px;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1em;
	color:#000;
	position:absolute;
	z-index:15;
	padding:0 33px 40px 0;
	left:-40px;
	top:173px;
	width:110px
}
	#story-prismatic .the-reward .breather img
{
	display:inline-block;
	max-width:90%
}
	#story-prismatic .external-vs-internal
{
	background:#fff;
	color:#51504c
}
	#story-prismatic .external-vs-internal h3
{
	text-align:center
}
	#story-prismatic .external-vs-internal .external-internal
{
	width:730px;
	margin:0 auto 40px;
	overflow:hidden
}
	#story-prismatic .external-vs-internal .external-internal .card
{
	float:left
}
	#story-prismatic .external-vs-internal .external-internal .card:first-child
{
	margin-right:80px
}
	#story-prismatic .external-vs-internal .external-internal .note
{
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1em;
	color:#289093;
	padding-top:50px
}
	#story-prismatic .external-vs-internal .external-internal .external .note
{
	width:200px;
	height:26px;
	background:url(/resources/img/story/prismatic/external-arrow.png) no-repeat 86px 0;
	margin-left:60px;
	margin-top:10px
}
	#story-prismatic .external-vs-internal .external-internal .internal .note
{
	width:200px;
	height:26px;
	background:url(/resources/img/story/prismatic/internal-arrow.png) no-repeat 86px 0;
	padding-top:50px;
	margin-left:60px;
	margin-top:36px
}
	@media all and (max-width:1000px) and (min-width:500px)
{
	#story-prismatic .intro
{
	padding-top:550px
}
	#story-prismatic .intro .tiles .tile
{
	width:25%
}
	#story-prismatic .intro .tiles .tile.vacation-homes
{
	display:none
}
	#story-prismatic .intro .tiles .tile.hiking
{
	display:none
}
	#story-prismatic .intro .tiles .tile.yahoo
{
	display:none
}
	#story-prismatic .intro .tiles .tile.books
{
	display:none
}
	#story-prismatic .intro .tiles .tile.advertising
{
	display:none
}
	#story-prismatic .intro .tiles .tile.netflix
{
	display:none
}
	#story-prismatic .intro .tiles .tile .front
{
	font-size:18px
}
	#story-prismatic .intro .tiles .tile .front span
{
	margin-top:-10px
}
	#story-prismatic .intro .tiles .tile .back span
{
	font-size:20px;
	bottom:20px
}
	#story-prismatic .intro .tiles .gradient
{
	height:190px
}
	#story-prismatic .focus .circles.animate .search
{
	-webkit-transform:translate(-340px,136px);
	-moz-transform:translate(-340px,136px);
	-ms-transform:translate(-340px,136px);
	-o-transform:translate(-340px,136px);
	transform:translate(-340px,136px)
}
	#story-prismatic .focus .circles.animate .explains
{
	-webkit-transform:translate(-110px,136px);
	-moz-transform:translate(-110px,136px);
	-ms-transform:translate(-110px,136px);
	-o-transform:translate(-110px,136px);
	transform:translate(-110px,136px)
}
	#story-prismatic .focus .circles.animate .discussion
{
	-webkit-transform:translate(120px,136px);
	-moz-transform:translate(120px,136px);
	-ms-transform:translate(120px,136px);
	-o-transform:translate(120px,136px);
	transform:translate(120px,136px)
}
	#story-prismatic .focus .circle.large
{
	width:220px;
	height:220px
}
	#story-prismatic .the-reward .grid-sample .note
{
	display:none
}
	#story-prismatic .the-reward .align-headlines .wrap
{
	height:285px
}
	#story-prismatic .external-vs-internal .external-internal
{
	width:590px
}
	#story-prismatic .external-vs-internal .external-internal .card
{
	width:270px
}
	#story-prismatic .external-vs-internal .external-internal .card:first-child
{
	margin-right:50px
}
	#story-prismatic .external-vs-internal .external-internal .card img
{
	width:100%
}
	#story-prismatic .external-vs-internal .external-internal .external .note
{
	margin-left:40px
}
	#story-prismatic .external-vs-internal .external-internal .internal .note
{
	margin-left:30px
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-prismatic .intro
{
	padding-top:240px
}
	#story-prismatic .intro .tiles .tile
{
	width:33.333%
}
	#story-prismatic .intro .tiles .tile.architecture
{
	display:none
}
	#story-prismatic .intro .tiles .tile.el-salvador
{
	display:none
}
	#story-prismatic .intro .tiles .tile.bbc
{
	display:none
}
	#story-prismatic .intro .tiles .tile.vacation-homes
{
	display:none
}
	#story-prismatic .intro .tiles .tile.hiking
{
	display:none
}
	#story-prismatic .intro .tiles .tile.yahoo
{
	display:none
}
	#story-prismatic .intro .tiles .tile.books
{
	display:none
}
	#story-prismatic .intro .tiles .tile.advertising
{
	display:none
}
	#story-prismatic .intro .tiles .tile.netflix
{
	display:none
}
	#story-prismatic .intro .tiles .tile .front
{
	font-size:12px
}
	#story-prismatic .intro .tiles .tile .front span
{
	margin-top:-7px
}
	#story-prismatic .intro .tiles .tile .back span
{
	font-size:13px;
	bottom:13px
}
	#story-prismatic .intro .tiles .gradient
{
	height:110px
}
	#story-prismatic .call-to-adventure .initial-version .wrap
{
	width:120px;
	height:250px
}
	#story-prismatic .call-to-adventure .initial-version .phone
{
	width:120px;
	height:250px
}
	#story-prismatic .call-to-adventure .initial-version .menu
{
	width:100px;
	height:169px;
	top:55px
}
	#story-prismatic .call-to-adventure .initial-version .article
{
	width:100px;
	height:169px;
	top:55px
}
	#story-prismatic .call-to-adventure .initial-version.animate .menu
{
	-webkit-transform:translate(-91px,0);
	-moz-transform:translate(-91px,0);
	-ms-transform:translate(-91px,0);
	-o-transform:translate(-91px,0);
	transform:translate(-91px,0)
}
	#story-prismatic .call-to-adventure .initial-version.animate .article
{
	-webkit-transform:translate(91px,0);
	-moz-transform:translate(91px,0);
	-ms-transform:translate(91px,0);
	-o-transform:translate(91px,0);
	transform:translate(91px,0)
}
	#story-prismatic .call-to-adventure .quote-head
{
	margin-top:50px
}
	#story-prismatic .good-fit .related-screenshots .wrap
{
	width:200px;
	height:209px
}
	#story-prismatic .good-fit .related-screenshots .tweetmag
{
	width:165px;
	height:188px
}
	#story-prismatic .good-fit .related-screenshots .medium
{
	width:200px;
	height:209px
}
	#story-prismatic .good-fit .related-screenshots .readability
{
	width:170px;
	height:188px
}
	#story-prismatic .good-fit .related-screenshots.animate .tweetmag
{
	-webkit-transform:translate(-43px,0);
	-moz-transform:translate(-43px,0);
	-ms-transform:translate(-43px,0);
	-o-transform:translate(-43px,0);
	transform:translate(-43px,0)
}
	#story-prismatic .good-fit .related-screenshots.animate .readability
{
	-webkit-transform:translate(43px,0);
	-moz-transform:translate(43px,0);
	-ms-transform:translate(43px,0);
	-o-transform:translate(43px,0);
	transform:translate(43px,0)
}
	#story-prismatic .human-element .inspiration-gallery
{
	height:315px
}
	#story-prismatic .human-element .inspiration-gallery .wrap
{
	height:275px;
	background-size:contain
}
	#story-prismatic .rapid-feedback .icons
{
	margin-bottom:40px
}
	#story-prismatic .rapid-feedback .testers
{
	margin-bottom:30px
}
	#story-prismatic .focus .circle.large
{
	width:160px;
	height:160px;
	font-size:20px
}
	#story-prismatic .focus .circle.large span
{
	margin-top:-12px
}
	#story-prismatic .focus .circles.animate .search
{
	-webkit-transform:translate(-90px,56px);
	-moz-transform:translate(-90px,56px);
	-ms-transform:translate(-90px,56px);
	-o-transform:translate(-90px,56px);
	transform:translate(-90px,56px)
}
	#story-prismatic .focus .circles.animate .explains
{
	-webkit-transform:translate(-90px,190px);
	-moz-transform:translate(-90px,190px);
	-ms-transform:translate(-90px,190px);
	-o-transform:translate(-90px,190px);
	transform:translate(-90px,190px)
}
	#story-prismatic .focus .circles.animate .discussion
{
	-webkit-transform:translate(-90px,330px);
	-moz-transform:translate(-90px,330px);
	-ms-transform:translate(-90px,330px);
	-o-transform:translate(-90px,330px);
	transform:translate(-90px,330px)
}
	#story-prismatic .the-reward .grid-sample .wrap
{
	width:259px;
	height:317px
}
	#story-prismatic .the-reward .grid-sample .grid
{
	width:115%;
	top:71px;
	margin-left:-19px
}
	#story-prismatic .the-reward .grid-sample .card
{
	width:100%;
	left:0
}
	#story-prismatic .the-reward .grid-sample .note
{
	display:none
}
	#story-prismatic .the-reward .align-headlines
{
	width:310px;
	height:307px;
	background:url('/resources/img/story/prismatic/align-headlines-mobile.jpg') no-repeat center;
	background-size:contain;
	margin-bottom:60px
}
	#story-prismatic .the-reward .align-headlines .wrap
{
	display:none
}
	#story-prismatic .the-reward .explain .desktop
{
	display:none
}
	#story-prismatic .the-reward .explain .mobile
{
	display:block
}
	#story-prismatic .the-reward .explain .note
{
	display:none
}
	#story-prismatic .the-reward .icons-avatars
{
	padding-top:0
}
	#story-prismatic .the-reward .clarity
{
	padding-top:0
}
	#story-prismatic .the-reward .more-fails
{
	padding-top:0
}
	#story-prismatic .the-reward .breather .note
{
	top:3px
}
	#story-prismatic .external-vs-internal .external-internal
{
	width:270px
}
	#story-prismatic .external-vs-internal .external-internal .card
{
	float:none;
	width:270px;
	margin:0 auto 30px
}
	#story-prismatic .external-vs-internal .external-internal .card:first-child
{
	margin-right:auto
}
	#story-prismatic .external-vs-internal .external-internal .card img
{
	width:100%
}
	#story-prismatic .external-vs-internal .external-internal .external .note
{
	margin-left:40px
}
	#story-prismatic .external-vs-internal .external-internal .internal .note
{
	margin-left:30px;
	margin-top:10px
}

}
	#story-krush .intro
{
	background:#23509d url('/resources/img/story/krush/bg-products.jpg') center center no-repeat;
	background-size:cover;
	color:#fff;
	padding-top:50px
}
	#story-krush .intro h1
{
	margin-top:440px
}
	#story-krush .intro .logo
{
	margin:30px auto 50px;
	width:79px;
	height:78px;
	background:url('/resources/img/story/krush/krush-logo-k.png') center center no-repeat
}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-krush .intro h1
{
	margin-top:200px
}

}
	#story-krush .the-call
{
	background:#fff;
	color:#51504c;
	position:relative;
	overflow:hidden
}
	#story-krush .the-call .sunglasses
{
	z-index:0;
	position:absolute;
	left:-200px;
	top:0;
	width:471px;
	height:279px;
	background:url('/resources/img/story/krush/floating-sunglasses.jpg') no-repeat
}
	#story-krush .the-call .shoes
{
	z-index:0;
	position:absolute;
	right:-350px;
	top:480px;
	width:720px;
	height:877px;
	background:url('/resources/img/story/krush/floating-shoes.jpg') no-repeat
}
	#story-krush .the-call .the-call__content
{
	position:relative;
	z-index:1
}
	#story-krush .the-call .tl-guys
{
	color:#31302e
}
	#story-krush .the-call h2
{
	color:#31302e
}
	#story-krush .the-call blockquote
{
	font-size:24px;
	line-height:39px;
	color:#b2b2b2;
	font-style:italic;
	margin:30px 0;
	padding:0 20px;
	text-align:left
}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-krush .the-call .sunglasses,#story-krush .the-call .shoes
{
	display:none
}
	#story-krush .the-call blockquote
{
	font-size:18px;
	line-height:30px
}

}
	@media all and (max-width:1000px) and (min-width:0)
{
	#story-krush .the-call .sunglasses,#story-krush .the-call .shoes
{
	display:none
}

}
	#story-krush .the-problem
{
	background:#fff url('/resources/img/story/krush/bg-skater.jpg') center top no-repeat;
	background-attachment:fixed;
	background-size:cover;
	color:#fff
}
	#story-krush .the-problem .headline
{
	margin-bottom:75px
}
	#story-krush .the-problem #krush-side-story .images
{
	background-color:#15d280
}
	#story-krush .the-problem #krush-side-story .story
{
	padding-top:30px;
	background-color:#fff;
	color:#333
}
	#story-krush .the-problem #krush-side-story .story p
{
	color:#545454
}
	#story-krush .the-problem .photo-credit
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	display:block;
	text-align:center;
	font-size:.75em
}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-krush .the-problem #krush-side-story
{
	display:none
}

}
	@media all and (max-width:550px) and (min-width:0)
{
	#story-krush .the-problem
{
	background:#3a373e
}
	#story-krush .the-problem .photo-credit
{
	display:none
}

}
	#story-krush .the-process
{
	background:#fff;
	color:#666;
	overflow:hidden
}
	#story-krush .the-process h2,#story-krush .the-process h3
{
	color:#31302e;
	text-align:center
}
	#story-krush .the-process figure
{
	text-align:center;
	padding-top:50px;
	margin:0
}
	#story-krush .the-process figure img
{
	max-width:100%
}
	#story-krush .the-process figure .popIn
{
	animation-name:popIn;
	-webkit-animation-name:popIn;
	animation-duration:.4s;
	-moz-animation-duration:.4s;
	-webkit-animation-duration:.4s;
	animation-timing-function:ease;
	-moz-animation-timing-function:ease;
	-webkit-animation-timing-function:ease
}
	@keyframes popIn
{
	0%
{
	transform:scale(0.8,0.8);
	opacity:0
}
	25%
{
	opacity:1
}
	50%
{
	transform:scale(1.25,1.25)
}
	100%
{
	transform:scale(1,1);
	opacity:1
}

}
	@-moz-keyframes popIn
{
	0%
{
	transform:scale(0.8,0.8)
}
	25%
{
	opacity:1
}
	50%
{
	-moz-transform:scale(1.25,1.25)
}
	100%
{
	-moz-transform:scale(1,1);
	opacity:1
}

}
	@-webkit-keyframes popIn
{
	0%
{
	transform:scale(0.8,0.8)
}
	25%
{
	opacity:1
}
	50%
{
	-webkit-transform:scale(1.25,1.25)
}
	100%
{
	-webkit-transform:scale(1,1);
	opacity:1
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-krush .the-process figure
{
	padding-top:25px
}

}
	#story-krush .the-product
{
	background:#470895;
	color:#fff
}
	#story-krush .the-product .item-carousel
{
	overflow:hidden
}
	#story-krush .the-product .wrapper
{
	position:relative;
	margin:50px 0;
	height:540px;
	width:100%;
	padding-bottom:130px
}
	#story-krush .the-product .wrapper .container
{
	position:absolute;
	top:0;
	height:670px;
	width:100%;
	overflow:hidden
}
	#story-krush .the-product .wrapper .container .item
{
	margin-right:100px;
	position:relative
}
	#story-krush .the-product .wrapper .container .item .explainer
{
	position:absolute;
	padding-left:110px;
	bottom:-95px;
	left:220px
}
	#story-krush .the-product .wrapper .container .item .explainer p
{
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	width:400px;
	font-size:18px;
	line-height:1em;
	position:relative;
	display:inline-block;
	margin-top:20px;
	margin-bottom:0
}
	#story-krush .the-product .wrapper .container .item .explainer.moodboard-2
{
	background:url(/resources/img/story/krush/concepts/arrow-left-flat.png) no-repeat left top;
	padding-left:105px
}
	#story-krush .the-product .wrapper .container .item .explainer.iphone-3
{
	background:url(/resources/img/story/krush/concepts/arrow-left-flat.png) no-repeat left top;
	left:-70px;
	bottom:-125px;
	width:365px
}
	#story-krush .the-product .wrapper .container .item .explainer.iphone-3 p
{

	width:250px;
	margin-top:30px;
	float:left;
	text-align:center
}
	#story-krush .the-product .wrapper .container .item .explainer.iphone-3 .arrow-right
{
	background:url(/resources/img/story/krush/concepts/arrow-right-flat.png) no-repeat left top;
	width:79px;
	height:31px;
	float:left;
	margin-top:8px;
	margin-left:30px
}
	#story-krush .the-product .wrapper .container .item .explainer.icons
{
	background:url(/resources/img/story/krush/concepts/arrow-left.png) no-repeat left top;
	left:90px;
	bottom:-100px;
	padding-left:80px
}
	#story-krush .the-product .wrapper .container .item .explainer.icons p
{
	margin-top:35px
}
	#story-krush .the-product .wrapper .container .item .explainer.slides
{
	background:url(/resources/img/story/krush/concepts/arrow-left.png) no-repeat left top;
	left:150px;
	padding-left:80px;
	bottom:-105px
}
	#story-krush .the-product .wrapper .container .item .explainer.slides p
{
	margin-top:40px
}
	#story-krush .the-product .wrapper .container .item .explainer.logos
{
	background:url(/resources/img/story/krush/concepts/arrow-left.png) no-repeat left top;
	padding-left:80px
}
	#story-krush .the-product .wrapper .container .item .explainer.logos p
{
	margin-top:35px
}
	#story-krush .the-product .wrapper .container .collection
{
	position:relative;
	float:left;
	width:809px;
	height:540px;
	margin-right:40px;
	margin-top:2px;
	-webkit-box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	-moz-box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	box-shadow:1px 1px 2px rgba(0,0,0,0.1);
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-o-transition:all .3s;
	transition:all .3s
}
	#story-krush .the-product .pillars-animation
{
	margin:0 auto
}
	#story-krush .the-product .pillars-animation .kineticjs-content
{
	margin:0 auto;
	display:block!important
}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-krush .the-product figure
{
	padding:15px 0
}
	#story-krush .the-product .item-carousel
{
	display:none
}

}
	#story-krush .the-features
{
	background:#23509d;
	color:#fff;
	padding-top:100px
}
	#story-krush .the-features .device-feature .device-feature-title
{
	text-align:left
}
	#story-krush .the-features .device-feature .device-feature-left
{
	float:left;
	margin-right:40px
}
	#story-krush .the-features .device-feature .device-feature-right
{
	float:right;
	margin-left:40px
}
	#story-krush .the-features .device-video
{
	position:relative;
	background:url('/resources/img/story/krush/iphone-blank.png') top center no-repeat;
	background-size:contain;
	width:338px;
	height:749px;
	margin-bottom:80px
}
	#story-krush .the-features .device-video video
{
	margin-top:31%;
	margin-left:7%;
	width:89%;
	height:71%;
	max-width:298px
}
	#story-krush .the-features .endorse-title
{
	margin-top:40px
}
	#story-krush .the-features .endorse-carousel
{
	margin:175px 0 235px 0;
	width:100%;
	height:427px;
	background:url('/resources/img/story/krush/bg-endorsement-variations.jpg') repeat-x;
	position:relative;
	animation-name:scrolling-images;
	animation-duration:50s;
	animation-timing-function:linear;
	animation-iteration-count:infinite;
	animation-direction:normal;
	animation-play-state:running;
	-moz-animation-name:scrolling-images;
	-moz-animation-duration:50s;
	-moz-animation-timing-function:linear;
	-moz-animation-iteration-count:infinite;
	-moz-animation-direction:normal;
	-moz-animation-play-state:running;
	-webkit-animation-name:scrolling-images;
	-webkit-animation-duration:50s;
	-webkit-animation-timing-function:linear;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-direction:normal;
	-webkit-animation-play-state:running
}
	@keyframes scrolling-images
{
	0%
{
	background-position:0 0
}
	100%
{
	background-position:-2284px 0
}

}
	@-moz-keyframes scrolling-images
{
	0%
{
	background-position:0 0
}
	100%
{
	background-position:-2284px 0
}

}
	@-webkit-keyframes scrolling-images
{
	0%
{
	background-position:0 0
}
	100%
{
	background-position:-2284px 0
}

}
	#story-krush .the-features .endorse-carousel .device-endorse
{
	position:absolute;
	left:0;
	right:0;
	top:-165px;
	margin:auto;
	z-index:1
}
	@media all and (max-width:825px) and (min-width:750px)
{
	#story-krush .the-features .device-feature-title
{
	font-size:44px;
	margin-bottom:35px;
	line-height:50px
}
	#story-krush .the-features .device-video
{
	margin-bottom:30px
}

}
	@media all and (max-width:749px) and (min-width:0)
{
	#story-krush .the-features .device-feature .device-feature-left,#story-krush .the-features .device-feature .device-feature-right
{
	float:none;
	margin:0 auto 50px auto
}
	#story-krush .the-features .device-feature .device-feature-title
{
	text-align:center;
	margin-bottom:44px
}
	#story-krush .the-features .device-video
{
	width:272px;
	height:603px
}
	#story-krush .the-features .endorse-carousel
{
	background:0
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#story-krush .the-features .endorse-title
{
	margin-bottom:40px
}
	#story-krush .the-features .endorse-carousel
{
	margin:175px 0 40px 0
}

}
	#story-krush .improvements
{
	background-color:#2f2f2f;
	color:#fff
}
	#story-krush .improvements .grid
{
	margin-left:-23px
}
	#story-krush .improvements .grid .grid-item
{
	margin:0 0 23px 23px;
	width:100%;
	max-width:310px;
	min-height:375px;
	float:left
}
	#story-krush .improvements .grid .grid-item .title
{
	font-size:21px
}
	#story-krush .improvements .grid .grid-item .description
{
	font-size:16px;
	line-height:21px
}
	#story-krush .improvements .grid .grid-item .description a
{
	color:#15d280
}
	#story-krush .improvements .improvement-image,#story-krush .improvements .improvement-animation
{
	min-height:165px;
	width:100%;
	background-position:center center;
	background-repeat:no-repeat
}
	#story-krush .improvements .improvement-onboarding-cards
{
	background-image:url('/resources/img/story/krush/improvement-onboarding-cards.png')
}
	#story-krush .improvements .improvement-onboarding-cards .improvement-animation.active
{
	background-image:url('/resources/img/story/krush/improvement-onboarding-cards.gif')
}
	#story-krush .improvements .improvement-endorsement-tweaks
{
	background-image:url('/resources/img/story/krush/improvement-endorsement-tweaks.png')
}
	#story-krush .improvements .improvement-endorsement-tweaks .improvement-animation.active
{
	background-image:url('/resources/img/story/krush/improvement-endorsement-tweaks.gif')
}
	#story-krush .improvements .improvement-background-threading
{
	background-image:url('/resources/img/story/krush/improvement-background-threading.png')
}
	#story-krush .improvements .improvement-background-threading .improvement-animation.active
{
	background-image:url('/resources/img/story/krush/improvement-background-threading.gif')
}
	#story-krush .improvements .improvement-demo-mode
{
	background-image:url('/resources/img/story/krush/improvement-demo-mode.png')
}
	#story-krush .improvements .improvement-demo-mode .improvement-animation.active
{
	background-image:url('/resources/img/story/krush/improvement-demo-mode.gif')
}
	#story-krush .improvements .improvement-private-saves
{
	background-image:url('/resources/img/story/krush/improvement-private-saves.png')
}
	#story-krush .improvements .improvement-homepage-refresh
{
	background-image:url('/resources/img/story/krush/improvement-homepage-refresh.png')
}
	#story-krush .improvements .improvement-email-sign-in
{
	background-image:url('/resources/img/story/krush/improvement-email-sign-in.png')
}
	#story-krush .improvements .improvement-better-brand-support
{
	background-image:url('/resources/img/story/krush/improvement-better-brand-support.png')
}
	#story-krush .improvements .improvement-backlog-items
{
	background-image:url('/resources/img/story/krush/improvement-backlog-items.png')
}
	@media all and (max-width:725px) and (min-width:0)
{
	#story-krush .improvements .grid
{
	margin-left:0
}
	#story-krush .improvements .grid .grid-item
{
	margin:0 auto;
	min-height:0;
	float:none;
	padding:30px 0
}
	#story-krush .improvements .improvement-image
{
	min-height:110px
}

}
	@media all and (max-width:1100px) and (min-width:750px)
{
	#story-krush .improvements .grid
{
	width:100%;
	margin:0 auto
}
	#story-krush .improvements .grid .grid-item
{
	box-sizing:border-box;
	display:inline-block;
	width:50%;
	max-width:50%;
	margin:0;
	padding:0 20px
}

}
	#story-krush .learn-more
{
	background-color:#333;
	color:#fff;
	text-align:center
}
	#story-krush .learn-more a
{
	color:#15d280;
	text-decoration:none
}
	#story-krush .learn-more hr
{
	border:0;
	height:1px;
	background-color:#444;
	margin-top:70px
}
	#story-krush .learn-more .try-it
{
	display:inline-block;
	margin-right:30px
}
	#story-krush .learn-more .cta-appstore img
{
	padding:0 0 50px 0;
	vertical-align:middle
}
	#our-next-act
{
	margin-bottom:150px
}
	#our-next-act .intro
{
	padding-bottom:0
}
	#our-next-act .chairs
{
	max-width:70%;
	margin:200px 0 80px
}
	#our-next-act .date
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-weight:700;
	display:block;
	text-align:center;
	font-size:24px;
	color:#299bc9;
	margin-bottom:7px
}
	#our-next-act hr
{
	width:150px;
	margin:100px auto 0;
	border:0;
	border-top:1px solid #ddd
}
	#our-next-act h1
{
	font-size:50px;
	line-height:59px;
	margin-bottom:55px
}
	#our-next-act h2
{
	font-size:50px;
	line-height:59px;
	margin:65px 0 55px
}
	#our-next-act p
{
	font-size:22px;
	line-height:35px;
	margin-bottom:35px
}
	#our-next-act p.center
{
	text-align:center
}
	#our-next-act p sup
{
	font-weight:bold;
	color:#3ea5ce;
	padding-left:4px;
	font-size:.6em
}
	#our-next-act ol
{
	border-top:0;
	margin:0 0 35px 30px
}
	#our-next-act ol li
{
	list-style-type:decimal;
	border-bottom:0;
	font-size:22px;
	line-height:35px;
	padding:0 0 0 5px
}
	#our-next-act ol li:before
{
	display:none
}
	#our-next-act ul
{
	border-top:0;
	margin:0 0 35px 20px
}
	#our-next-act ul li
{
	list-style-type:disc;
	border-bottom:0;
	font-size:22px;
	line-height:35px;
	padding:0 0 0 5px;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif
}
	#our-next-act ul li:before
{
	display:none
}
	#our-next-act blockquote
{
	font-size:37px;
	line-height:54px;
	margin:50px 0;
	color:#3ea5ce
}
	#our-next-act blockquote:before
{
	content:"";
	display:block;
	width:150px;
	margin:0 auto 50px;
	border-top:1px solid #ddd
}
	#our-next-act blockquote:after
{
	content:"";
	display:block;
	width:150px;
	margin:50px auto 0;
	border-top:1px solid #ddd
}
	#our-next-act .employee-photos
{
	overflow:hidden
}
	#our-next-act .employee-photos li
{
	display:block;
	float:left;
	margin:0 3px 20px 3px;
	text-align:center;
	width:13.6%;
	height:195px
}
	#our-next-act .employee-photos img
{
	display:block;
	margin:0 auto 10px;
	max-width:90%
}
	#our-next-act .employee-photos .name
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:17px;
	font-weight:700
}
	#our-next-act .employee-photos .date
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:14px;
	font-weight:300;
	color:#9b9b9b
}
	#our-next-act .past-employees
{
	overflow:hidden
}
	#our-next-act .employee-list
{
	float:left;
	width:33.3%
}
	#our-next-act .employee-list li
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:22px;
	text-align:center
}
	#our-next-act .signatures
{
	width:750px;
	height:175px;
	margin:70px auto 0;
	text-align:center
}
	#our-next-act .signatures div
{
	position:relative;
	width:250px;
	height:100%;
	float:left
}
	#our-next-act .signatures .info
{
	position:absolute;
	bottom:0;
	height:50px
}
	#our-next-act .signatures .name
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:17px;
	font-weight:700
}
	#our-next-act .signatures .title
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:14px;
	font-weight:300;
	color:#9b9b9b
}
	#our-next-act .tl-guys
{
	margin-bottom:-20px
}
	#our-next-act .footnote
{
	border-top:1px solid #ddd;
	padding-top:20px;
	margin-top:80px
}
	#our-next-act .footnote p
{
	font-size:14px;
	line-height:20px
}
	#our-next-act .footnote sup
{
	font-size:.8em
}
	@media all and (max-width:500px) and (min-width:0)
{
	#our-next-act
{
	margin-bottom:60px
}
	#our-next-act .chairs
{
	margin:90px 0 80px
}
	#our-next-act .date
{
	font-size:18px;
	margin-bottom:7px
}
	#our-next-act hr
{
	width:60px;
	margin:60px auto 0
}
	#our-next-act h1
{
	font-size:32px;
	line-height:37px;
	margin-bottom:32px
}
	#our-next-act h2
{
	font-size:32px;
	line-height:37px;
	margin:40px 0 32px
}
	#our-next-act p
{
	font-size:16px;
	line-height:23px;
	margin-bottom:20px
}
	#our-next-act ol,#our-next-act ul
{
	margin:0 0 20px 22px
}
	#our-next-act ol li,#our-next-act ul li
{
	font-size:16px;
	line-height:23px;
	padding:0 0 0 5px
}
	#our-next-act blockquote
{
	font-size:21px;
	line-height:30px;
	margin:40px 10px
}
	#our-next-act blockquote:before
{
	width:60px;
	margin:0 auto 40px
}
	#our-next-act blockquote:after
{
	width:60px;
	margin:40px auto 0
}
	#our-next-act .employee-photos li
{
	margin:0 7px 20px 7px;
	width:76px;
	height:143px
}
	#our-next-act .employee-photos img
{
	width:100%;
	margin:0 auto 10px
}
	#our-next-act .employee-photos .name
{
	font-size:12px
}
	#our-next-act .employee-photos .date
{
	font-size:12px
}
	#our-next-act .employee-list
{
	float:none;
	width:90%;
	margin:0 auto
}
	#our-next-act .employee-list li
{
	font-size:16px;
	line-height:23px
}
	#our-next-act .signatures
{
	width:90%;
	height:auto;
	margin:50px auto 0;
	text-align:center
}
	#our-next-act .signatures div
{
	position:relative;
	width:100%;
	height:auto;
	float:none;
	padding-bottom:10px
}
	#our-next-act .signatures div img
{
	width:60%
}
	#our-next-act .signatures .info
{
	position:static
}
	#our-next-act .signatures .name
{
	font-size:12px
}
	#our-next-act .signatures .title
{
	font-size:12px
}

}
.gallery
{
	position:relative;
	width:100%;
	clear:left;
	-webkit-transform:translateZ(0);
	-moz-transform:translateZ(0);
	-o-transform:translateZ(0);
	transform:translateZ(0);
	background:#000;
	margin:45px 0 100px;
	box-sizing:border-box
}
.gallery.desktop
{
	padding:0;
	background:0
}
.gallery.desktop .interaction
{
	left:10.1%;
	top:5.2%;
	width:80.2%;
	height:69.3%
}
.gallery.desktop .contents
{
	position:absolute;
	left:10.1%;
	top:5.2%;
	width:80.2%;
	height:69.3%
}
.gallery.desktop .caption
{
	display:none
}
.gallery.laptop
{
	padding:0;
	background:0
}
.gallery.laptop .interaction
{
	left:10.1%;
	top:5.8%;
	width:80.2%;
	height:76.6%
}
.gallery.laptop .contents
{
	position:absolute;
	left:10.1%;
	top:5.8%;
	width:80.2%;
	height:76.6%
}
.gallery.laptop .caption
{
	display:none
}
.gallery.ipad
{
	padding:0;
	background:0;
	width:538px;
	max-width:80%;
	margin:25px auto 0
}
.gallery.ipad .interaction
{
	left:5.2%;
	top:9.1%;
	width:89.6%;
	height:73.6%
}
.gallery.ipad .contents
{
	position:absolute;
	left:5.2%;
	top:9.1%;
	width:89.6%;
	height:73.6%
}
.gallery.ipad .caption
{
	display:none
}
.gallery .interaction
{
	position:absolute;
	left:0;
	top:0;
	z-index:300;
	width:100%;
	height:100%
}
.gallery .interaction.next
{
	cursor:url(/resources/img/ui/gallery-arrow-next.png) 15 9,e-resize
}
.gallery .interaction.prev
{
	cursor:url(/resources/img/ui/gallery-arrow-previous.png) 0 9,w-resize
}
.gallery .skin
{
	position:relative;
	top:0;
	left:0;
	z-index:200
}
.gallery .skin img
{
	max-width:100%
}
.gallery .contents
{
	position:relative;
	left:0;
	top:0;
	width:100%;
	overflow:hidden;
	background:#000;
	z-index:100
}
.gallery .contents img
{
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	max-width:100%;
	-webkit-transform:translate(-100%,0);
	-moz-transform:translate(-100%,0);
	-ms-transform:translate(-100%,0);
	-o-transform:translate(-100%,0);
	transform:translate(-100%,0)
}
.gallery .contents video
{
	position:absolute;
	width:100%;
	height:100%
}
.gallery .contents .spacer
{
	position:static;
	width:100%
}
.gallery .contents .prev
{
	-webkit-transform:translate(100%,0);
	-moz-transform:translate(100%,0);
	-ms-transform:translate(100%,0);
	-o-transform:translate(100%,0);
	transform:translate(100%,0);
	-webkit-transition:-webkit-transform 0;
	-moz-transition:-moz-transform 0;
	-o-transition:-o-transform 0;
	transition:transform 0
}
.gallery .contents .next
{
	-webkit-transform:translate(-100%,0);
	-moz-transform:translate(-100%,0);
	-ms-transform:translate(-100%,0);
	-o-transform:translate(-100%,0);
	transform:translate(-100%,0);
	-webkit-transition:-webkit-transform 0;
	-moz-transition:-moz-transform 0;
	-o-transition:-o-transform 0;
	transition:transform 0
}
.gallery .contents .super
{
	z-index:2
}
.gallery .contents .active
{
	-webkit-transform:translate(0,0);
	-moz-transform:translate(0,0);
	-ms-transform:translate(0,0);
	-o-transform:translate(0,0);
	transform:translate(0,0);
	-webkit-transition:-webkit-transform .5s cubic-bezier(0.645,0.045,0.355,1);
	-moz-transition:-moz-transform .5s cubic-bezier(0.645,0.045,0.355,1);
	-o-transition:-o-transform .5s cubic-bezier(0.645,0.045,0.355,1);
	transition:transform .5s cubic-bezier(0.645,0.045,0.355,1)
}
.gallery .caption
{
	position:relative;
	padding:2.0%;
	z-index:400
}
.gallery .caption .text
{
	display:inline-block;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-style:italic;
	font-size:14px;
	color:#d9d9d9;
	-webkit-transition:opacity .2s;
	-moz-transition:opacity .2s;
	-o-transition:opacity .2s;
	transition:opacity .2s;
	max-width:78%;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis
}
.gallery .caption .text.hide
{
	opacity:0
}
.gallery .caption .text strong
{
	font-weight:700
}
.gallery .caption .count
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:14px;
	color:#999;
	margin-right:10px;
	float:left;
	line-height:18px
}
.gallery .caption .fullscreen
{
	float:right;
	color:#fff;
	opacity:.2;
	cursor:pointer;
	margin-top:-1px;
	-webkit-transition:opacity .3s;
	-moz-transition:opacity .3s;
	-o-transition:opacity .3s;
	transition:opacity .3s
}
.gallery .caption .fullscreen:hover
{
	opacity:.9
}
	#gallery-fullscreen
{
	opacity:0;
	position:absolute;
	top:-100%;
	left:0;
	z-index:1000;
	width:100%;
	height:100%;
	background:#212121;
	overflow:hidden;
	-webkit-transition:opacity .6s,top 0 .6s;
	-moz-transition:opacity .6s,top 0 .6s;
	-o-transition:opacity .6s,top 0 .6s;
	transition:opacity .6s,top 0 .6s
}
	#gallery-fullscreen .center
{
	display:table;
	width:100%;
	height:100%
}
	#gallery-fullscreen .contents
{
	-webkit-transform:translateZ(0);
	-moz-transform:translateZ(0);
	-o-transform:translateZ(0);
	transform:translateZ(0);
	display:table-cell;
	text-align:center;
	vertical-align:middle;
	height:100%;
	width:100%;
	-webkit-transition:opacity .4s;
	-moz-transition:opacity .4s;
	-o-transition:opacity .4s;
	transition:opacity .4s
}
	#gallery-fullscreen .contents img
{
	display:none;
	max-width:100%
}
	#gallery-fullscreen .contents .active
{
	display:inline
}
	#gallery-fullscreen .caption
{
	-webkit-transform:translateZ(0);
	-moz-transform:translateZ(0);
	-o-transform:translateZ(0);
	transform:translateZ(0);
	position:fixed;
	bottom:0;
	left:0;
	width:100%;
	background:rgba(0,0,0,0.8)
}
	#gallery-fullscreen .caption .text
{
	display:inline-block;
	width:100%;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	padding:20px 60px 12px;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:14px;
	line-height:18px;
	color:#fff;
	text-align:left;
	-webkit-transition:opacity .4s;
	-moz-transition:opacity .4s;
	-o-transition:opacity .4s;
	transition:opacity .4s
}
	#gallery-fullscreen .caption .count
{
	display:inline-block;
	position:absolute;
	left:20px;
	top:20px;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:14px;
	color:#888;
	margin-right:15px
}
	#gallery-fullscreen .caption .fullscreen
{
	position:absolute;
	right:15px;
	top:15px;
	color:#fff;
	cursor:pointer
}
	#gallery-fullscreen.animating .contents,#gallery-fullscreen.animating .text
{
	opacity:0
}
.fullscreen-gallery
{
	overflow:hidden
}
.fullscreen-gallery #gallery-fullscreen
{
	opacity:1;
	top:0;
	overflow-y:scroll;
	-webkit-transition:opacity .6s,top 0 0;
	-moz-transition:opacity .6s,top 0 0;
	-o-transition:opacity .6s,top 0 0;
	transition:opacity .6s,top 0 0
}
.fullscreen-gallery #gallery-fullscreen.next
{
	cursor:url(/resources/img/ui/gallery-arrow-next.png) 15 9,e-resize
}
.fullscreen-gallery #gallery-fullscreen.prev
{
	cursor:url(/resources/img/ui/gallery-arrow-previous.png) 0 9,w-resize
}
	@media all and (max-width:1000px) and (min-width:500px)
{
.gallery .caption .text
{
	max-width:85%
}
.gallery.ipad
{
	margin:10px auto 0
}
.fullscreen-gallery #gallery-fullscreen
{
	position:fixed;
	top:0!important;
	-webkit-overflow-scrolling:touch
}
.fullscreen-gallery #gallery-fullscreen .icon
{
	font-size:19px;
	top:17px
}

}
	@media all and (max-width:500px) and (min-width:0)
{
.gallery
{
	font-size:12px;
	margin:40px 0 75px
}
.gallery .caption .text
{
	font-size:12px;
	max-width:75%
}
.gallery .caption .count
{
	font-size:12px;
	margin-right:4px
}
.gallery .caption .fullscreen
{
	font-size:19px;
	margin-top:-2px
}
.gallery.ipad
{
	margin:5px auto 40px
}
.fullscreen-gallery #gallery-fullscreen
{
	position:fixed;
	top:0!important;
	-webkit-overflow-scrolling:touch
}
.fullscreen-gallery #gallery-fullscreen .icon
{
	font-size:19px;
	top:18px
}

}
.side-by-side
{
	position:relative;
	max-width:100%;
	cursor:col-resize
}
.side-by-side .left
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:20px;
	font-weight:700;
	color:#4c4c4c;
	position:absolute;
	left:0;
	top:-35px;
	width:50%;
	height:100%;
	padding-top:35px;
	border-right:1px solid rgba(0,0,0,0.5);
	-webkit-transform:translateZ(0);
	-moz-transform:translateZ(0);
	-o-transform:translateZ(0);
	transform:translateZ(0)
}
.side-by-side .left.animate
{
	-webkit-transition:width 1s cubic-bezier(0.455,0.03,0.515,0.955);
	-moz-transition:width 1s cubic-bezier(0.455,0.03,0.515,0.955);
	-o-transition:width 1s cubic-bezier(0.455,0.03,0.515,0.955);
	transition:width 1s cubic-bezier(0.455,0.03,0.515,0.955)
}
.side-by-side .mask
{
	width:100%;
	height:100%;
	overflow:hidden
}
.side-by-side .right
{
	width:100%;
	vertical-align:top;
	-webkit-box-shadow:0 0 15px rgba(0,0,0,0.2);
	-moz-box-shadow:0 0 15px rgba(0,0,0,0.2);
	box-shadow:0 0 15px rgba(0,0,0,0.2)
}
.side-by-side .left-label,.side-by-side .right-label
{
	position:absolute;
	top:0;
	right:15px;
	opacity:.3;
	-webkit-transition:opacity .4s;
	-moz-transition:opacity .4s;
	-o-transition:opacity .4s;
	transition:opacity .4s
}
.side-by-side .active
{
	opacity:1
}
	@media all and (max-width:500px) and (min-width:0)
{
.side-by-side .left
{
	font-size:13px;
	top:-25px;
	padding-top:25px
}

}
.loupe-tool
{
	position:relative;
	display:inline-block
}
.loupe-tool .small-image
{
	position:relative;
	z-index:100;
	max-width:100%
}
.loupe-tool .loupe
{
	position:absolute;
	top:0;
	left:0;
	z-index:400;
	margin:-245px 0 0 -245px;
	opacity:0;
	-webkit-transition:opacity .7s;
	-moz-transition:opacity .7s;
	-o-transition:opacity .7s;
	transition:opacity .7s;
	cursor:none
}
.loupe-tool .loupe .skin
{
	position:relative;
	z-index:300
}
.loupe-tool .loupe .zoom
{
	position:absolute;
	top:58px;
	left:63px;
	width:392px;
	height:392px;
	-webkit-border-radius:200px;
	-moz-border-radius:200px;
	border-radius:200px;
	background-repeat:no-repeat;
	background-color:#666;
	z-index:200
}
.loupe-tool.loaded .loupe
{
	opacity:1
}
.loupe-tool.not-dragging .loupe
{
	cursor:pointer
}
.loupe-tool.animate .loupe
{
	-webkit-transition:left 1s,top 1s;
	-moz-transition:left 1s,top 1s;
	-o-transition:left 1s,top 1s;
	transition:left 1s,top 1s
}
.loupe-tool.animate .zoom
{
	-webkit-transition:background-position 1s;
	-moz-transition:background-position 1s;
	-o-transition:background-position 1s;
	transition:background-position 1s
}
	@media all and (max-width:500px) and (min-width:0)
{
.loupe
{
	display:none
}

}
.looping-carousel,.item-carousel
{
	width:auto
}
.looping-carousel .wrapper,.item-carousel .wrapper
{
	position:relative;
	width:100%;
	overflow:hidden
}
.looping-carousel .container,.item-carousel .container
{
	position:absolute;
	left:50%
}
.looping-carousel .item,.item-carousel .item
{
	margin-right:15px;
	float:left
}
.looping-carousel .direction,.item-carousel .direction
{
	position:absolute;
	left:0;
	top:0;
	z-index:200;
	width:50%;
	height:100%
}
.looping-carousel .next,.item-carousel .next
{
	left:50%;
	cursor:url(/resources/img/ui/gallery-arrow-next.png) 15 9,e-resize
}
.looping-carousel .prev,.item-carousel .prev
{
	cursor:url(/resources/img/ui/gallery-arrow-previous.png) 0 9,w-resize
}
.item-carousel .next,.item-carousel .prev
{
	height:100%;
	width:50%;
	background:transparent
}
.side-story,.story-container .side-story
{
	position:relative;
	overflow:hidden;
	margin:60px 0
}
.side-story h5,.story-container .side-story h5
{
	margin:0
}
.side-story h2,.story-container .side-story h2
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:24px;
	line-height:29px;
	margin:0 0 25px 0;
	text-align:left;
	letter-spacing:0
}
.side-story p,.story-container .side-story p
{
	font-size:15px;
	line-height:21px;
	margin-bottom:20px
}
.side-story .images,.story-container .side-story .images
{
	display:fixed;
	width:60%;
	left:0;
	top:0
}
.side-story .images img,.story-container .side-story .images img
{
	width:100%
}
.side-story .story,.story-container .side-story .story
{
	position:absolute;
	right:-50px;
	top:0;
	width:40%;
	height:100%;
	overflow-y:scroll;
	padding-right:50px
}
.side-story .fade,.story-container .side-story .fade
{
	position:absolute;
	right:0;
	bottom:0;
	z-index:1;
	width:40%;
	height:75px;
	background:url(/resources/img/story/teehan-lax/story-fade.png) repeat-x left bottom
}
.side-story .copy,.story-container .side-story .copy
{
	padding:0 20px 130px 45px
}
	#homepage .card
{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:100px
}
	#homepage .site-width
{
	height:100%
}
	#homepage .vert-center
{
	position:relative;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:box;
	-webkit-box-orient:vertical;
	-moz-box-orient:vertical;
	-ms-box-orient:vertical;
	box-orient:vertical;
	-webkit-box-pack:center;
	-moz-box-pack:center;
	-ms-box-pack:center;
	box-pack:center;
	height:100%;
	z-index:200
}
	#homepage .background
{
	position:absolute;
	z-index:100;
	max-width:1000px;
	width:100%;
	height:100%
}
	#homepage .copy
{
	float:left;
	width:48.2%;
	margin:0 .8999999999999999%;
	margin:0;
	float:none
}
	#homepage .copy h1,#homepage .copy h2
{
	text-align:left;
	margin-top:0
}
	#homepage .tagline
{
	position:fixed;
	bottom:0;
	left:0;
	z-index:500;
	width:100%;
	height:100px;
	background:#fff;
	text-align:left
}
	#homepage .tagline #latest-post-title,#homepage .tagline .cta
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:20px;
	line-height:100px;
	color:#676769;
	font-weight:700;
	float:left
}
	#homepage .tagline #latest-post-title span::before,#homepage .tagline .cta span::before
{
	content:'From our blog: '
}
	#homepage .tagline #latest-post-title
{
	overflow:hidden;
	white-space:nowrap;
	width:48%;
	text-overflow:ellipsis
}
	#homepage .about-tl
{
	background:#3b383c url(/resources/img/home/bg-about-tl.jpg) no-repeat;
	background-position:bottom center;
	background-size:cover;
	color:#fff
}
	#homepage .about-tl .copy
{
	width:68%
}
	#homepage .shipwire
{
	background:#126c85;
	color:#fff;
	overflow:hidden
}
	#homepage .shipwire .background img
{
	position:absolute;
	right:-200px;
	bottom:0;
	max-width:100%;
	max-height:90%
}
	#homepage .dribbble
{
	background:#000;
	color:#fff
}
	#homepage .dribbble .background img
{
	position:absolute;
	right:0;
	bottom:0;
	max-width:60%;
	max-height:95%
}
	#homepage .readability
{
	background:#393635 url(/resources/img/home/bg-readability.jpg) no-repeat;
	background-position:top center;
	background-size:cover;
	color:#fff
}
	#homepage .medium
{
	background:#eee url(/resources/img/home/bg-medium-tile.jpg) repeat-x left top;
	color:#000
}
	#homepage .medium .button
{
	color:#404040;
	border:1px solid rgba(0,0,0,0.7)
}
	#homepage .medium .stuff
{
	position:absolute;
	right:0;
	bottom:0
}
	#homepage .medium a
{
	color:#404040
}
	#homepage .medium h2
{
	font-size:62px
}
	#homepage .bellstackup
{
	background-color:#137dbd;
	background-image:-moz-linear-gradient(top,#208ccd,#0066a4);
	background-image:-webkit-gradient(linear,0 0,0 100%,from(#208ccd),to(#0066a4));
	background-image:-webkit-linear-gradient(top,#208ccd,#0066a4);
	background-image:-o-linear-gradient(top,#208ccd,#0066a4);
	background-image:linear-gradient(to bottom,#208ccd,#0066a4);
	background-repeat:repeat-x;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff208ccd',endColorstr='#ff0066a4',GradientType=0);
	color:#fff;
	overflow:hidden
}
	#homepage .bellstackup h2
{
	font-size:63px
}
	#homepage .bellstackup .background img
{
	position:relative;
	bottom:-15%;
	left:50%;
	max-height:80%
}
	#homepage .bellstackup .background-small
{
	display:none
}
	#homepage .bellstackup .background-small img
{
	position:absolute;
	bottom:40px;
	left:60px;
	height:440px
}
	#homepage .makingoftl
{
	background:#3ba2cf url(/resources/img/story/teehan-lax/hero-bg.jpg) repeat-x center bottom;
	color:#fff;
	overflow:hidden
}
	#homepage .makingoftl .background img
{
	position:absolute;
	left:440px;
	bottom:5%;
	max-width:100%;
	max-height:90%
}
	#homepage .hyperlapse
{
	background:#000 url(/resources/img/home/hyperlapse/hyperlapse.jpg) no-repeat center center;
	background-size:cover
}
	#homepage .hyperlapse .labs
{
	font-size:68px;
	margin-bottom:15px;
	display:block
}
	#homepage .hyperlapse .vert-center
{
	width:78%;
	color:#fff
}
	#homepage .social-portrait
{
	background:#03649b url(/resources/img/home/bg-social-portrait.jpg) repeat-x left top;
	background-size:cover;
	color:#40515d
}
	#homepage .social-portrait .button
{
	border:1px solid rgba(0,0,0,0.4)
}
	#homepage .social-portrait a
{
	color:#40515d
}
	#homepage .social-portrait h2
{
	font-size:62px;
	width:420px
}
	#homepage .anniversary
{
	background:#00a0c6;
	color:#fff;
	overflow:hidden
}
	#homepage .anniversary h2
{
	margin-bottom:30px
}
	#homepage .anniversary p
{
	font-size:24px;
	line-height:26px;
	margin-bottom:50px;
	color:#b9ecf8
}
	#homepage .anniversary .background img
{
	position:absolute;
	right:0;
	bottom:0;
	max-width:100%;
	max-height:90%
}
	#homepage .prismatic
{
	background:#ee5126;
	color:#fff
}
	#homepage .prismatic .site-width
{
	position:relative
}
	#homepage .prismatic .copy-wrapper
{
	float:left;
	width:45%;
	height:100%
}
	#homepage .prismatic .copy-wrapper .copy
{
	width:100%
}
	#homepage .prismatic .logo-wrapper
{
	margin:0 -55px 0 0;
	float:right;
	width:530px;
	height:100%
}
	#homepage .prismatic .logo
{
	display:inline-block;
	width:530px;
	height:460px
}
	#homepage .prismatic .logo.type
{
	background:url('/resources/img/home/prismatic/logos.jpg') left bottom no-repeat
}
	#homepage .prismatic .logo.space
{
	background:url('/resources/img/home/prismatic/logos.jpg') right -460px no-repeat
}
	#homepage .prismatic .logo.design
{
	background:url('/resources/img/home/prismatic/logos.jpg') right -920px no-repeat
}
	#homepage .prismatic .logo.sports
{
	background:url('/resources/img/home/prismatic/logos.jpg') left -460px no-repeat
}
	#homepage .prismatic .logo.music
{
	background:url('/resources/img/home/prismatic/logos.jpg') left -920px no-repeat
}
	#homepage .prismatic .logo.art
{
	background:url('/resources/img/home/prismatic/logos.jpg') left top no-repeat
}
	#homepage .prismatic .logo.surf
{
	background:url('/resources/img/home/prismatic/logos.jpg') right top no-repeat
}
	@media all and (max-width:1000px) and (min-width:0)
{
	#homepage .copy
{
	display:block;
	float:left;
	width:81.53333333333335%;
	margin:0 .8999999999999999%;
	margin-left:9.233333333333334%;
	height:auto;
	text-align:center;
	margin-top:140px
}
	#homepage .copy h1,#homepage .copy h2
{
	text-align:center;
	margin-top:0;
	margin-bottom:45px
}
	#homepage .card
{
	bottom:80px
}
	#homepage .site-width
{
	position:relative
}
	#homepage .tagline
{
	height:auto
}
	#homepage .tagline #latest-post-title,#homepage .tagline .cta
{
	text-align:center;
	width:100%;
	margin:30px 0;
	line-height:26px
}
	#homepage .tagline #latest-post-title
{
	font-size:20px
}
	#homepage .about-tl .copy
{
	width:81.53333333333335%
}
	#homepage .shipwire .background img
{
	right:auto;
	max-width:105%;
	max-height:100%;
	margin-left:-2.5%
}
	#homepage .dribbble .background img
{
	right:auto;
	max-width:70%;
	max-height:100%;
	margin-left:15%
}
	#homepage .readability
{
	background-position:71% 0;
	background-size:200%
}
	#homepage .medium
{
	background:#eee url(/resources/img/home/bg-medium-sml.jpg) no-repeat;
	background-position:bottom center;
	background-size:cover
}
	#homepage .medium .stuff
{
	display:none
}
	#homepage .bellstackup h2
{
	font-size:50px
}
	#homepage .bellstackup .background
{
	display:none
}
	#homepage .bellstackup .background-small
{
	display:inline
}
	#homepage .makingoftl .background img
{
	position:absolute;
	left:50px;
	bottom:5%
}
	#homepage .careers
{
	background-position:68% 100px;
	background-size:200%
}
	#homepage .careers .note
{
	background-position:30px bottom;
	position:absolute;
	height:160px;
	width:110px;
	bottom:30px;
	left:-10px
}
	#homepage .social-portrait
{
	background:#03649b url(/resources/img/home/bg-social-portrait-sml.jpg) repeat-x left top;
	background-size:cover;
	color:#fff
}
	#homepage .social-portrait .button
{
	border:1px solid rgba(255,255,255,0.4)
}
	#homepage .social-portrait a
{
	color:#fff
}
	#homepage .social-portrait h2
{
	width:auto
}
	#homepage .anniversary h2
{
	margin-bottom:30px
}
	#homepage .anniversary p
{
	font-size:21px;
	line-height:23px
}
	#homepage .anniversary .background img
{
	left:50%;
	width:265px;
	margin-left:-132px
}
	#homepage .prismatic
{
	text-align:center
}
	#homepage .prismatic .copy-wrapper
{
	float:none;
	width:auto;
	height:auto
}
	#homepage .prismatic .copy-wrapper .copy
{
	margin-left:0;
	width:100%
}
	#homepage .prismatic .logo-wrapper
{
	margin:0;
	float:none;
	width:auto;
	height:auto
}
	#homepage .prismatic .logo-wrapper .vert-center
{
	display:block;
	width:100%
}
	#homepage .prismatic .logo
{
	position:relative;
	top:auto;
	right:auto;
	float:none;
	margin:70px 0 0 0;
	width:400px;
	height:347px
}
	#homepage .prismatic .logo.type,#homepage .prismatic .logo.space,#homepage .prismatic .logo.design,#homepage .prismatic .logo.sports,#homepage .prismatic .logo.art,#homepage .prismatic .logo.music,#homepage .prismatic .logo.surf
{
	background-size:800px auto
}
	#homepage .prismatic .logo.space
{
	background:url('/resources/img/home/prismatic/logos.jpg') right -348px no-repeat;
	background-size:800px auto
}
	#homepage .prismatic .logo.design
{
	background:url('/resources/img/home/prismatic/logos.jpg') right -694px no-repeat;
	background-size:800px auto
}
	#homepage .prismatic .logo.sports
{
	background:url('/resources/img/home/prismatic/logos.jpg') left -348px no-repeat;
	background-size:800px auto
}
	#homepage .prismatic .logo.music
{
	background:url('/resources/img/home/prismatic/logos.jpg') left -694px no-repeat;
	background-size:800px auto
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#homepage .vert-center
{
	width:85%
}
	#homepage .copy
{
	margin-top:65px;
	margin-left:8.233333%
}
	#homepage .copy h1,#homepage .copy h2
{
	text-align:center;
	font-size:32px;
	line-height:36px
}
	#homepage .copy h2
{
	margin-bottom:35px
}
	#homepage .card
{
	height:100%;
	bottom:60px
}
	#homepage .tagline #latest-post-title,#homepage .tagline .cta
{
	margin:15px 0;
	font-size:14px;
	line-height:18px
}
	#homepage .tagline #latest-post-title span::before,#homepage .tagline .cta span::before
{
	content:'Blog: '
}
	#homepage .about-tl
{
	background:#3b383c url(/resources/img/home/bg-about-tl-sml.jpg) no-repeat;
	background-position:bottom center;
	background-size:cover
}
	#homepage .about-tl .copy
{
	width:85%
}
	#homepage .about-tl .copy h2
{
	font-size:25px;
	line-height:31px
}
	#homepage .shipwire .copy
{
	margin-left:8.233333%
}
	#homepage .shipwire .background img
{
	max-width:100%;
	max-height:100%;
	margin:0 auto
}
	#homepage .readability
{
	background-position:65% 0;
	background-size:300%
}
	#homepage .social-portrait
{
	background-position:left 60px
}
	#homepage .social-portrait .button
{
	margin-left:-15px
}
	#homepage .medium
{
	background-size:100%;
	background-color:#cfcfcf
}
	#homepage .medium .stuff
{
	display:none
}
	#homepage .hyperlapse .copy
{
	width:85%;
	margin-left:8.233333%
}
	#homepage .hyperlapse .copy h2
{
	font-size:26px;
	line-height:32px
}
	#homepage .hyperlapse .labs
{
	font-size:36px;
	margin-bottom:0;
	display:block
}
	#homepage .bellstackup h2
{
	font-size:32px;
	line-height:32px
}
	#homepage .bellstackup .background-small img
{
	position:absolute;
	bottom:-80px;
	left:0;
	height:250px
}
	#homepage .makingoftl .background img
{
	position:absolute;
	left:15px;
	bottom:10px
}
	#homepage .careers .note
{
	display:none
}
	#homepage .anniversary h2
{
	margin-bottom:35px
}
	#homepage .anniversary p
{
	display:none;
	font-size:17px;
	line-height:19px;
	margin-bottom:32px
}
	#homepage .anniversary .background img
{
	bottom:50px;
	width:115px;
	left:50%;
	margin-left:-57px
}
	#homepage .prismatic
{
	position:relative;
	padding:0 0 40px 0
}
	#homepage .prismatic .logo
{
	margin:40px 0 0 0;
	width:220px;
	height:190px
}
	#homepage .prismatic .logo.type,#homepage .prismatic .logo.space,#homepage .prismatic .logo.design,#homepage .prismatic .logo.sports,#homepage .prismatic .logo.art,#homepage .prismatic .logo.music,#homepage .prismatic .logo.surf
{
	background-size:440px auto
}
	#homepage .prismatic .logo.space
{
	background:url('/resources/img/home/prismatic/logos.jpg') right -192px no-repeat;
	background-size:440px auto
}
	#homepage .prismatic .logo.design
{
	background:url('/resources/img/home/prismatic/logos.jpg') right -382px no-repeat;
	background-size:440px auto
}
	#homepage .prismatic .logo.sports
{
	background:url('/resources/img/home/prismatic/logos.jpg') left -192px no-repeat;
	background-size:440px auto
}
	#homepage .prismatic .logo.music
{
	background:url('/resources/img/home/prismatic/logos.jpg') left -382px no-repeat;
	background-size:440px auto
}

}
	#goodbye
{
	overflow:hidden
}
	#goodbye .header
{
	margin-top:150px;
	margin-bottom:70px;
	text-align:center
}
	#goodbye .header h1
{
	font-size:50px;
	line-height:55px;
	margin-bottom:15px
}
	#goodbye .header p
{
	font-size:22px;
	line-height:33px;
	color:#858585
}
	#goodbye .outro
{
	text-align:center;
	margin-bottom:100px;
	border-top:1px solid #EEE
}
	#goodbye .outro .tl-guys
{
	color:#3ea5ce;
	display:inline-block;
	margin-bottom:40px;
	margin-top:-44px;
	background:#FFF;
	padding:30px
}
	#goodbye .outro .heading
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:17px;
	font-weight:bold;
	margin-bottom:12px
}
	#goodbye .outro p
{
	font-size:22px;
	line-height:33px;
	margin-bottom:5px;
	color:#858585
}
	#goodbye .wave
{
	display:inline-block;
	width:66px;
	height:68px;
	background-image:url(/resources/img/goodbye/wave-emoji.png);
	background-repeat:no-repeat;
	background-position:center;
	background-size:66px 68px;
	cursor:pointer
}
	#goodbye .wave:hover
{
	-webkit-animation:wave 500ms infinite;
	-webkit-transform-origin:bottom right;
	-moz-animation:wave 500ms infinite;
	-moz-transform-origin:bottom right;
	-ms-animation:wave 500ms infinite;
	-ms-transform-origin:bottom right;
	animation:wave 500ms infinite;
	transform-origin:bottom right
}
	@-webkit-keyframes wave
{
	0%
{
	-webkit-transform:rotate(3deg)
}
	50%
{
	-webkit-transform:rotate(-3deg)
}
	100%
{
	-webkit-transform:rotate(3deg)
}

}
	@-moz-keyframes wave
{
	0%
{
	-moz-transform:rotate(3deg)
}
	50%
{
	-moz-transform:rotate(-3deg)
}
	100%
{
	-moz-transform:rotate(3deg)
}

}
	@-ms-keyframes wave
{
	0%
{
	-ms-transform:rotate(3deg)
}
	50%
{
	-ms-transform:rotate(-3deg)
}
	100%
{
	-ms-transform:rotate(3deg)
}

}
	@keyframes wave
{
	0%
{
	transform:rotate(3deg)
}
	50%
{
	transform:rotate(-3deg)
}
	100%
{
	transform:rotate(3deg)
}

}
	#goodbye audio
{
	position:absolute;
	bottom:10px;
	right:10px;
	z-index:50;
	opacity:0
}
	#goodbye .cards
{
	perspective:1000;
	padding-bottom:60px;
	*zoom:1
}
	#goodbye .cards:before,#goodbye .cards:after
{
	display:table;
	content:"";
	line-height:0
}
	#goodbye .cards:after
{
	clear:both
}
	#goodbye .card
{
	width:100%;
	height:auto;
	margin-bottom:20px;
	-webkit-transition-duration:600ms;
	-moz-transition-duration:600ms;
	-o-transition-duration:600ms;
	transition-duration:600ms;
	-webkit-transition-delay:150ms;
	-moz-transition-delay:150ms;
	-o-transition-delay:150ms;
	transition-delay:150ms;
	-webkit-transform-style:preserve-3d;
	-moz-transform-style:preserve-3d;
	-ms-transform-style:preserve-3d;
	-o-transform-style:preserve-3d;
	transform-style:preserve-3d;
	position:relative
}
	#goodbye .card img
{
	width:100%
}
	#goodbye .front,#goodbye .back
{
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	border-radius:25px;
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
	outline:1px solid transparent
}
	#goodbye .front
{
	z-index:2;
	-webkit-transform:rotateY(0deg);
	-moz-transform:rotateY(0deg);
	-ms-transform:rotateY(0deg);
	-o-transform:rotateY(0deg);
	transform:rotateY(0deg)
}
	#goodbye .back
{
	-webkit-transform:rotateY(180deg);
	-moz-transform:rotateY(180deg);
	-ms-transform:rotateY(180deg);
	-o-transform:rotateY(180deg);
	transform:rotateY(180deg)
}
	#goodbye .person
{
	width:230px;
	float:left;
	text-align:center;
	margin-right:20px;
	margin-bottom:40px
}
	#goodbye .person .name
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:17px;
	font-weight:bold
}
	#goodbye .person .info
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:14px;
	color:#9b9b9b
}
	#goodbye .person:hover .card
{
	-webkit-transition-delay:0;
	-moz-transition-delay:0;
	-o-transition-delay:0;
	transition-delay:0
}
	#goodbye .paul:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-1.272011341061443deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-1.272011341061443deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-1.272011341061443deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-1.272011341061443deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-1.272011341061443deg) scale(1.07)
}
	#goodbye .paul .front
{
	background-image:url(/resources/img/goodbye/hey/paul.jpg)
}
	#goodbye .paul .back
{
	background-image:url(/resources/img/goodbye/whoa/paul.jpg)
}
	#goodbye .jdawg:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(1.462421431671828deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(1.462421431671828deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(1.462421431671828deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(1.462421431671828deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(1.462421431671828deg) scale(1.07)
}
	#goodbye .jdawg .front
{
	background-image:url(/resources/img/goodbye/hey/jdawg.jpg)
}
	#goodbye .jdawg .back
{
	background-image:url(/resources/img/goodbye/whoa/jdawg.jpg)
}
	#goodbye .kate:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-0.27078169863671064deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-0.27078169863671064deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-0.27078169863671064deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-0.27078169863671064deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-0.27078169863671064deg) scale(1.07)
}
	#goodbye .kate .front
{
	background-image:url(/resources/img/goodbye/hey/kate.jpg)
}
	#goodbye .kate .back
{
	background-image:url(/resources/img/goodbye/whoa/kate.jpg)
}
	#goodbye .erwin:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-0.07615584600716829deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-0.07615584600716829deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-0.07615584600716829deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-0.07615584600716829deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-0.07615584600716829deg) scale(1.07)
}
	#goodbye .erwin .front
{
	background-image:url(/resources/img/goodbye/hey/erwin.jpg)
}
	#goodbye .erwin .back
{
	background-image:url(/resources/img/goodbye/whoa/erwin.jpg)
}
	#goodbye .bobak:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-2.718833116348833deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-2.718833116348833deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-2.718833116348833deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-2.718833116348833deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-2.718833116348833deg) scale(1.07)
}
	#goodbye .bobak .front
{
	background-image:url(/resources/img/goodbye/hey/bobak.jpg)
}
	#goodbye .bobak .back
{
	background-image:url(/resources/img/goodbye/whoa/bobak.jpg)
}
	#goodbye .nelson:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-2.249293965753168deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-2.249293965753168deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-2.249293965753168deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-2.249293965753168deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-2.249293965753168deg) scale(1.07)
}
	#goodbye .nelson .front
{
	background-image:url(/resources/img/goodbye/hey/nelson.jpg)
}
	#goodbye .nelson .back
{
	background-image:url(/resources/img/goodbye/whoa/nelson.jpg)
}
	#goodbye .brendan:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(2.2846205849200487deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(2.2846205849200487deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(2.2846205849200487deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(2.2846205849200487deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(2.2846205849200487deg) scale(1.07)
}
	#goodbye .brendan .front
{
	background-image:url(/resources/img/goodbye/hey/brendan.jpg)
}
	#goodbye .brendan .back
{
	background-image:url(/resources/img/goodbye/whoa/brendan.jpg)
}
	#goodbye .tanner:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(0.05854036705568433deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(0.05854036705568433deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(0.05854036705568433deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(0.05854036705568433deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(0.05854036705568433deg) scale(1.07)
}
	#goodbye .tanner .front
{
	background-image:url(/resources/img/goodbye/hey/tanner.jpg)
}
	#goodbye .tanner .back
{
	background-image:url(/resources/img/goodbye/whoa/tanner.jpg)
}
	#goodbye .kyra:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-0.7893703440204263deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-0.7893703440204263deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-0.7893703440204263deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-0.7893703440204263deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-0.7893703440204263deg) scale(1.07)
}
	#goodbye .kyra .front
{
	background-image:url(/resources/img/goodbye/hey/kyra.jpg)
}
	#goodbye .kyra .back
{
	background-image:url(/resources/img/goodbye/whoa/kyra.jpg)
}
	#goodbye .matt:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(1.8915756256319582deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(1.8915756256319582deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(1.8915756256319582deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(1.8915756256319582deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(1.8915756256319582deg) scale(1.07)
}
	#goodbye .matt .front
{
	background-image:url(/resources/img/goodbye/hey/matt.jpg)
}
	#goodbye .matt .back
{
	background-image:url(/resources/img/goodbye/whoa/matt.jpg)
}
	#goodbye .simon:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(0.9387548798695207deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(0.9387548798695207deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(0.9387548798695207deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(0.9387548798695207deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(0.9387548798695207deg) scale(1.07)
}
	#goodbye .simon .front
{
	background-image:url(/resources/img/goodbye/hey/simon.jpg)
}
	#goodbye .simon .back
{
	background-image:url(/resources/img/goodbye/whoa/simon.jpg)
}
	#goodbye .john
{
	cursor:url(/resources/img/story/readability/metal-fingers.png) 0 0,default
}
	#goodbye .john:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(2.6316138496622443deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(2.6316138496622443deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(2.6316138496622443deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(2.6316138496622443deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(2.6316138496622443deg) scale(1.07)
}
	#goodbye .john .front
{
	background-image:url(/resources/img/goodbye/hey/john.jpg)
}
	#goodbye .john .back
{
	background-image:url(/resources/img/goodbye/whoa/john.jpg)
}
	#goodbye .pierre:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-0.18010405311360955deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-0.18010405311360955deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-0.18010405311360955deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-0.18010405311360955deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-0.18010405311360955deg) scale(1.07)
}
	#goodbye .pierre .front
{
	background-image:url(/resources/img/goodbye/hey/pierre.jpg)
}
	#goodbye .pierre .back
{
	background-image:url(/resources/img/goodbye/whoa/pierre.jpg)
}
	#goodbye .amanda:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(0.045246454887092113deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(0.045246454887092113deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(0.045246454887092113deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(0.045246454887092113deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(0.045246454887092113deg) scale(1.07)
}
	#goodbye .amanda .front
{
	background-image:url(/resources/img/goodbye/hey/amanda.jpg)
}
	#goodbye .amanda .back
{
	background-image:url(/resources/img/goodbye/whoa/amanda.jpg)
}
	#goodbye .steven:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(0.1292631276883185deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(0.1292631276883185deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(0.1292631276883185deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(0.1292631276883185deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(0.1292631276883185deg) scale(1.07)
}
	#goodbye .steven .front
{
	background-image:url(/resources/img/goodbye/hey/steven.jpg)
}
	#goodbye .steven .back
{
	background-image:url(/resources/img/goodbye/whoa/steven.jpg)
}
	#goodbye .kim:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(1.3533190554007888deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(1.3533190554007888deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(1.3533190554007888deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(1.3533190554007888deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(1.3533190554007888deg) scale(1.07)
}
	#goodbye .kim .front
{
	background-image:url(/resources/img/goodbye/hey/kim.jpg)
}
	#goodbye .kim .back
{
	background-image:url(/resources/img/goodbye/whoa/kim.jpg)
}
	#goodbye .michael:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-0.2106712837703526deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-0.2106712837703526deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-0.2106712837703526deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-0.2106712837703526deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-0.2106712837703526deg) scale(1.07)
}
	#goodbye .michael .front
{
	background-image:url(/resources/img/goodbye/hey/michael.jpg)
}
	#goodbye .michael .back
{
	background-image:url(/resources/img/goodbye/whoa/michael.jpg)
}
	#goodbye .derek:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(0.5986506692133844deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(0.5986506692133844deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(0.5986506692133844deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(0.5986506692133844deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(0.5986506692133844deg) scale(1.07)
}
	#goodbye .derek .front
{
	background-image:url(/resources/img/goodbye/hey/derek.jpg)
}
	#goodbye .derek .back
{
	background-image:url(/resources/img/goodbye/whoa/derek.jpg)
}
	#goodbye .steph:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-1.6835383255966008deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-1.6835383255966008deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-1.6835383255966008deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-1.6835383255966008deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-1.6835383255966008deg) scale(1.07)
}
	#goodbye .steph .front
{
	background-image:url(/resources/img/goodbye/hey/steph.jpg)
}
	#goodbye .steph .back
{
	background-image:url(/resources/img/goodbye/whoa/steph.jpg)
}
	#goodbye .justin:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(1.4885962517000735deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(1.4885962517000735deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(1.4885962517000735deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(1.4885962517000735deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(1.4885962517000735deg) scale(1.07)
}
	#goodbye .justin .front
{
	background-image:url(/resources/img/goodbye/hey/justin.jpg)
}
	#goodbye .justin .back
{
	background-image:url(/resources/img/goodbye/whoa/justin.jpg)
}
	#goodbye .steff:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(1.1485491106286645deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(1.1485491106286645deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(1.1485491106286645deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(1.1485491106286645deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(1.1485491106286645deg) scale(1.07)
}
	#goodbye .steff .front
{
	background-image:url(/resources/img/goodbye/hey/steff.jpg)
}
	#goodbye .steff .back
{
	background-image:url(/resources/img/goodbye/whoa/steff.jpg)
}
	#goodbye .nery:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(2.068266590125859deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(2.068266590125859deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(2.068266590125859deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(2.068266590125859deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(2.068266590125859deg) scale(1.07)
}
	#goodbye .nery .front
{
	background-image:url(/resources/img/goodbye/hey/nery.jpg)
}
	#goodbye .nery .back
{
	background-image:url(/resources/img/goodbye/whoa/nery.jpg)
}
	#goodbye .keely:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-1.6493704388849437deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-1.6493704388849437deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-1.6493704388849437deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-1.6493704388849437deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-1.6493704388849437deg) scale(1.07)
}
	#goodbye .keely .front
{
	background-image:url(/resources/img/goodbye/hey/keely.jpg)
}
	#goodbye .keely .back
{
	background-image:url(/resources/img/goodbye/whoa/keely.jpg)
}
	#goodbye .eugene:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(2.7426117584109306deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(2.7426117584109306deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(2.7426117584109306deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(2.7426117584109306deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(2.7426117584109306deg) scale(1.07)
}
	#goodbye .eugene .front
{
	background-image:url(/resources/img/goodbye/hey/eugene.jpg)
}
	#goodbye .eugene .back
{
	background-image:url(/resources/img/goodbye/whoa/eugene.jpg)
}
	#goodbye .eric:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-0.45798410614952445deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-0.45798410614952445deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-0.45798410614952445deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-0.45798410614952445deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-0.45798410614952445deg) scale(1.07)
}
	#goodbye .eric .front
{
	background-image:url(/resources/img/goodbye/hey/eric.jpg)
}
	#goodbye .eric .back
{
	background-image:url(/resources/img/goodbye/whoa/eric.jpg)
}
	#goodbye .jason:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-0.32489927764981985deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-0.32489927764981985deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-0.32489927764981985deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-0.32489927764981985deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-0.32489927764981985deg) scale(1.07)
}
	#goodbye .jason .front
{
	background-image:url(/resources/img/goodbye/hey/jason.jpg)
}
	#goodbye .jason .back
{
	background-image:url(/resources/img/goodbye/whoa/jason.jpg)
}
	#goodbye .stu:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-1.8305404745042324deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-1.8305404745042324deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-1.8305404745042324deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-1.8305404745042324deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-1.8305404745042324deg) scale(1.07)
}
	#goodbye .stu .front
{
	background-image:url(/resources/img/goodbye/hey/stu.jpg)
}
	#goodbye .stu .back
{
	background-image:url(/resources/img/goodbye/whoa/stu.jpg)
}
	#goodbye .kevin:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(0.24823354929685593deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(0.24823354929685593deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(0.24823354929685593deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(0.24823354929685593deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(0.24823354929685593deg) scale(1.07)
}
	#goodbye .kevin .front
{
	background-image:url(/resources/img/goodbye/hey/kevin.jpg)
}
	#goodbye .kevin .back
{
	background-image:url(/resources/img/goodbye/whoa/kevin.jpg)
}
	#goodbye .jeanette:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-2.9067260921001434deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-2.9067260921001434deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-2.9067260921001434deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-2.9067260921001434deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-2.9067260921001434deg) scale(1.07)
}
	#goodbye .jeanette .front
{
	background-image:url(/resources/img/goodbye/hey/jeanette.jpg)
}
	#goodbye .jeanette .back
{
	background-image:url(/resources/img/goodbye/whoa/jeanette.jpg)
}
	#goodbye .leigh:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(0.03424516227096319deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(0.03424516227096319deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(0.03424516227096319deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(0.03424516227096319deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(0.03424516227096319deg) scale(1.07)
}
	#goodbye .leigh .front
{
	background-image:url(/resources/img/goodbye/hey/leigh.jpg)
}
	#goodbye .leigh .back
{
	background-image:url(/resources/img/goodbye/whoa/leigh.jpg)
}
	#goodbye .marco:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(2.615775585640222deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(2.615775585640222deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(2.615775585640222deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(2.615775585640222deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(2.615775585640222deg) scale(1.07)
}
	#goodbye .marco .front
{
	background-image:url(/resources/img/goodbye/hey/marco.jpg)
}
	#goodbye .marco .back
{
	background-image:url(/resources/img/goodbye/whoa/marco.jpg)
}
	#goodbye .alex:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-1.4332754951901734deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-1.4332754951901734deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-1.4332754951901734deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-1.4332754951901734deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-1.4332754951901734deg) scale(1.07)
}
	#goodbye .alex .front
{
	background-image:url(/resources/img/goodbye/hey/alex.jpg)
}
	#goodbye .alex .back
{
	background-image:url(/resources/img/goodbye/whoa/alex.jpg)
}
	#goodbye .jessie:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-2.7860299316234887deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-2.7860299316234887deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-2.7860299316234887deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-2.7860299316234887deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-2.7860299316234887deg) scale(1.07)
}
	#goodbye .jessie .front
{
	background-image:url(/resources/img/goodbye/hey/jessie.jpg)
}
	#goodbye .jessie .back
{
	background-image:url(/resources/img/goodbye/whoa/jessie.jpg)
}
	#goodbye .jeff:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(0.4132471773773432deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(0.4132471773773432deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(0.4132471773773432deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(0.4132471773773432deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(0.4132471773773432deg) scale(1.07)
}
	#goodbye .jeff .front
{
	background-image:url(/resources/img/goodbye/hey/jeff.jpg)
}
	#goodbye .jeff .back
{
	background-image:url(/resources/img/goodbye/whoa/jeff.jpg)
}
	#goodbye .jayne:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-2.2026978456415236deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-2.2026978456415236deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-2.2026978456415236deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-2.2026978456415236deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-2.2026978456415236deg) scale(1.07)
}
	#goodbye .jayne .front
{
	background-image:url(/resources/img/goodbye/hey/jayne.jpg)
}
	#goodbye .jayne .back
{
	background-image:url(/resources/img/goodbye/whoa/jayne.jpg)
}
	#goodbye .sharon:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(1.0129619417712092deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(1.0129619417712092deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(1.0129619417712092deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(1.0129619417712092deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(1.0129619417712092deg) scale(1.07)
}
	#goodbye .sharon .front
{
	background-image:url(/resources/img/goodbye/hey/sharon.jpg)
}
	#goodbye .sharon .back
{
	background-image:url(/resources/img/goodbye/whoa/sharon.jpg)
}
	#goodbye .marc:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-2.7718566921539605deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-2.7718566921539605deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-2.7718566921539605deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-2.7718566921539605deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-2.7718566921539605deg) scale(1.07)
}
	#goodbye .marc .front
{
	background-image:url(/resources/img/goodbye/hey/marc.jpg)
}
	#goodbye .marc .back
{
	background-image:url(/resources/img/goodbye/whoa/marc.jpg)
}
	#goodbye .payam:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(1.9831777028739452deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(1.9831777028739452deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(1.9831777028739452deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(1.9831777028739452deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(1.9831777028739452deg) scale(1.07)
}
	#goodbye .payam .front
{
	background-image:url(/resources/img/goodbye/hey/payam.jpg)
}
	#goodbye .payam .back
{
	background-image:url(/resources/img/goodbye/whoa/payam.jpg)
}
	#goodbye .jessica:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-2.0703296517021954deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-2.0703296517021954deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-2.0703296517021954deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-2.0703296517021954deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-2.0703296517021954deg) scale(1.07)
}
	#goodbye .jessica .front
{
	background-image:url(/resources/img/goodbye/hey/jessica.jpg)
}
	#goodbye .jessica .back
{
	background-image:url(/resources/img/goodbye/whoa/jessica.jpg)
}
	#goodbye .emilia:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(-1.8009033710695803deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(-1.8009033710695803deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(-1.8009033710695803deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(-1.8009033710695803deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(-1.8009033710695803deg) scale(1.07)
}
	#goodbye .emilia .front
{
	background-image:url(/resources/img/goodbye/hey/emilia.jpg)
}
	#goodbye .emilia .back
{
	background-image:url(/resources/img/goodbye/whoa/emilia.jpg)
}
	#goodbye .jonas:hover .card
{
	-webkit-transform:rotateY(180deg) rotateZ(1.795420044567436deg) scale(1.07);
	-moz-transform:rotateY(180deg) rotateZ(1.795420044567436deg) scale(1.07);
	-ms-transform:rotateY(180deg) rotateZ(1.795420044567436deg) scale(1.07);
	-o-transform:rotateY(180deg) rotateZ(1.795420044567436deg) scale(1.07);
	transform:rotateY(180deg) rotateZ(1.795420044567436deg) scale(1.07)
}
	#goodbye .jonas .front
{
	background-image:url(/resources/img/goodbye/hey/jonas.jpg)
}
	#goodbye .jonas .back
{
	background-image:url(/resources/img/goodbye/whoa/jonas.jpg)
}
	@media all and (max-width:500px) and (min-width:0)
{
	#goodbye .header
{
	margin-top:90px;
	margin-bottom:50px
}
	#goodbye .header h1
{
	font-size:34px;
	line-height:38px
}
	#goodbye .header p
{
	font-size:16px;
	line-height:22px
}
	#goodbye .outro
{
	margin-bottom:70px
}
	#goodbye .outro .tl-guys
{
	margin-bottom:10px
}
	#goodbye .outro .heading
{
	font-size:12px;
	margin-bottom:12px
}
	#goodbye .outro p
{
	font-size:16px;
	line-height:22px;
	margin-bottom:5px
}
	#goodbye .card
{
	margin-bottom:10px
}
	#goodbye .front,#goodbye .back
{
	border-radius:15px
}
	#goodbye .person
{
	width:46%;
	margin-right:7%;
	margin-bottom:30px
}
	#goodbye .person:nth-child(even)
{
	margin-right:0
}
	#goodbye .person .name
{
	font-size:12px
}
	#goodbye .person .info
{
	font-size:10px
}

}
.tool-page .hero-bg
{
	position:fixed;
	top:0;
	left:0;
	z-index:100;
	width:100%;
	height:860px;
	background-color:#0585a3;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover
}
.tool-page .hero
{
	position:relative;
	z-index:200;
	height:860px;
	text-align:center
}
.tool-page .hero img
{
	margin:25px 0
}
.tool-page .hero h1,.tool-page .hero h5
{
	color:#fff;
	margin-bottom:0
}
.tool-page .hero h2
{
	margin:0 0 11px;
	color:#fff
}
.tool-page .hero h5
{
	font-size:17px;
	text-align:center;
	text-transform:uppercase;
	letter-spacing:.2em;
	margin-top:0
}
.tool-page .hero p
{
	width:80%;
	margin:0 auto 32px;
	font-size:26px;
	text-align:center;
	text-transform:none;
	letter-spacing:0;
	color:rgba(255,255,255,0.6)
}
.tool-page .hero p.date
{
	font-size:15px;
	line-height:19px;
	color:#fff;
	margin-top:30px;
	margin-bottom:0
}
.tool-page .hero .site-width,.tool-page .hero .copy-width,.tool-page .hero .vert-center
{
	height:100%
}
.tool-page .hero .vert-center
{
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:box;
	-webkit-box-orient:vertical;
	-moz-box-orient:vertical;
	-ms-box-orient:vertical;
	box-orient:vertical;
	-webkit-box-pack:center;
	-moz-box-pack:center;
	-ms-box-pack:center;
	box-pack:center
}
.tool-page .hero .dl-button
{
	display:inline-block
}
.tool-page .tools-wrap
{
	position:relative;
	z-index:200;
	padding-top:80px;
	background-color:#eee;
	text-align:left
}
.tool-page .tools-wrap p
{
	font-size:26px;
	line-height:39px
}
.tool-page .new
{
	float:left;
	margin-left:20px
}
.tool-page .new h3
{
	margin-bottom:10px
}
.tool-page .new li
{
	list-style:disc;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:20px;
	line-height:39px;
	margin-left:20px
}
.tool-page .license
{
	margin-bottom:40px;
	border-bottom:1px solid #e3e3e3
}
.tool-page .license .wrap
{
	padding-bottom:15px
}
.tool-page .license p
{
	margin-bottom:30px;
	font-size:26px;
	line-height:39px;
	color:#000
}
.tool-page .how-to-use
{
	background-color:#3ea5ce;
	text-align:center
}
.tool-page .how-to-use h2
{
	color:#fff
}
.tool-page .how-to-use p
{
	color:#99e3f5;
	text-align:left
}
.tool-page .how-to-use a
{
	color:#fff
}
.tool-page .how-to-use img
{
	margin-bottom:50px
}
.tool-page .twitter.divided .copy-width
{
	border-top:1px solid #e3e3e3
}
.tool-page .twitter p
{
	margin-bottom:0;
	padding:70px 0;
	text-align:center
}
.tool-page .twitter .copy-width
{
	margin-bottom:0
}
.tool-page .reveal
{
	position:relative;
	text-align:center
}
.tool-page .reveal p.sub
{
	margin-bottom:0;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:14px;
	line-height:1em;
	font-weight:bold;
	color:#fff
}
	@media all and (max-width:1000px) and (min-width:500px)
{
.tool-page .hero-bg
{
	position:absolute;
	height:700px
}
.tool-page .hero
{
	height:700px
}

}
	@media all and (max-width:500px) and (min-width:0)
{
.tool-page .hero-bg
{
	position:absolute;
	height:420px
}
.tool-page .hero
{
	height:420px
}
.tool-page .hero p
{
	width:auto;
	font-size:20px
}
.tool-page .hero img,.tool-page .hero .dl-button
{
	display:none
}
.tool-page .tools-wrap
{
	padding-top:50px
}

.tool-page .tools-wrap p
{
	font-size:20px;
	line-height:30px
}
.tool-page .new
{
	float:none;
	width:auto;
	margin-bottom:50px
}
.tool-page .new h3
{
	margin-left:0
}
.tool-page .new li
{
	font-size:20px;
	line-height:36px;
	margin-left:22px
}
.tool-page .license
{
	border-bottom:0
}
.tool-page .license .wrap
{
	padding:35px 0 40px
}
.tool-page .how-to-use
{
	padding-top:70px;
	background-color:#00a0c6;
	text-align:center
}
.tool-page .how-to-use h2
{
	margin-bottom:50px
}
.tool-page .how-to-use p
{
	color:#99e3f5;
	text-align:left
}
.tool-page .how-to-use a
{
	color:#fff
}
.tool-page .how-to-use img
{
	margin-bottom:50px;
	width:100%
}

}
.expired-tool
{
	background:#eee
}
.expired-tool .hero h2
{
	color:#000
}
.expired-tool .hero p
{
	color:rgba(0,0,0,0.5)
}
.expired-tool .hero p.date
{
	color:rgba(0,0,0,0.5);
	margin-top:65px;
	margin-bottom:15px
}
.expired-tool .hero p.date span
{
	margin:0 7px
}
.expired-tool .hero .dl-button
{
	background-color:#3ea5ce;
	color:#fff;
	border:0;
	-webkit-transition:background-color .4s;
	-moz-transition:background-color .4s;
	-o-transition:background-color .4s;
	transition:background-color .4s
}
.expired-tool .hero .dl-button:hover
{
	color:#fff;
	background-color:#3392b7
}
.expired-tool .tools-wrap
{
	background:transparent;
	padding-top:8px
}
.expired-tool .tools-wrap .images
{
	margin-bottom:75px
}
.expired-tool .tools-wrap .images img
{
	width:100%;
	max-width:100%;
	margin-bottom:35px
}
	@media all and (max-width:1000px) and (min-width:500px)
{
.expired-tool .hero p
{
	font-size:24px;
	width:92%
}

}
	@media all and (max-width:500px) and (min-width:0)
{
.expired-tool .hero p
{
	font-size:20px;
	width:92%
}
.expired-tool .hero img
{
	max-width:45%;
	margin:5px 0 30px
}

}
	#tools
{
	background:#eee
}
	#tools h1,#tools h3,#tools h5
{
	text-align:center
}
	#tools h5
{
	font-size:17px
}
	#tools .intro-copy
{
	padding:90px 0 70px;
	color:#b4b4b4
}
	#tools .tool,#tools .tool-archive
{
	position:relative;
	margin-bottom:40px
}
	#tools .tool img,#tools .tool-archive img
{
	display:block;
	width:100%
}
	#tools .tool .logo,#tools .tool-archive .logo
{
	display:block;
	width:100%;
	height:57px;
	background:url(/resources/img/tools/ios7-logo.png) no-repeat center top;
	margin-bottom:12px
}
	#tools .tool .info-wrap,#tools .tool-archive .info-wrap
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:5
}
	#tools .tool .info,#tools .tool-archive .info
{
	width:100%;
	height:100%;
	opacity:0;
	background:rgba(62,165,206,0.9);
	text-align:center;
	-webkit-transition:opacity .3s;
	-moz-transition:opacity .3s;
	-o-transition:opacity .3s;
	transition:opacity .3s;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-box;
	display:box;
	-webkit-box-orient:vertical;
	-moz-box-orient:vertical;
	-ms-box-orient:vertical;
	box-orient:vertical;
	-webkit-box-pack:center;
	-moz-box-pack:center;
	-ms-box-pack:center;
	box-pack:center
}
	#tools .tool .info .name,#tools .tool-archive .info .name
{
	margin:0 0 10px 0;
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:30px;
	font-weight:bold;
	color:#fff;
	text-decoration:none
}
	#tools .tool .info .btns .dl-button,#tools .tool-archive .info .btns .dl-button
{
	display:inline-block;
	margin:0
}
	#tools .tool .info .btns .dl-button:first-child,#tools .tool-archive .info .btns .dl-button:first-child
{
	margin-right:5px
}
	#tools .tool .info .btns .dl-button img,#tools .tool-archive .info .btns .dl-button img,#tools .tool .info .btns .dl-button div,#tools .tool-archive .info .btns .dl-button div
{
	float:left
}
	#tools .tool .info .btns .dl-button img,#tools .tool-archive .info .btns .dl-button img
{
	margin:0 10px 0 0;
	width:20px
}
	#tools .tool .info .details,#tools .tool-archive .info .details
{
	display:block;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:20px;
	color:rgba(255,255,255,0.55);
	margin-bottom:30px
}
	#tools .tool .also-available,#tools .tool-archive .also-available
{
	position:absolute;
	bottom:50px;
	left:0;
	width:100%;
	display:block;
	text-align:center;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-weight:bold;
	color:#fff;
	-webkit-transition:opacity .3s;
	-moz-transition:opacity .3s;
	-o-transition:opacity .3s;
	transition:opacity .3s;
	opacity:0
}
	#tools .tool .also-available a,#tools .tool-archive .also-available a
{
	color:#fff;
	text-decoration:underline
}
	#tools .tool .also-available a:hover,#tools .tool-archive .also-available a:hover
{
	text-decoration:none
}
	#tools .tool:hover .info,#tools .tool-archive:hover .info,#tools .tool:hover .also-available,#tools .tool-archive:hover .also-available
{
	opacity:1
}
	#tools .tool.soon .info
{
	opacity:1;
	background:rgba(51,51,51,0.35)
}
	#tools .tool.soon .info .details
{
	margin-bottom:0
}
	#tools .tool-archive
{
	float:left;
	width:48%;
	margin-right:4%
}
	#tools .tool-archive.last
{
	margin-right:0
}
	#tools .updates
{
	padding:75px 0;
	background-color:#fff
}
	#tools .updates p.kicker
{
	margin-bottom:0;
	font-size:35px;
	line-height:51px;
	text-align:left;
	color:#b3b3b1
}
	@media all and (max-width:1000px) and (min-width:0)
{
	#tools .intro-copy
{
	padding:70px 0 20px
}
	#tools .tool .info-wrap,#tools .tool-archive .info-wrap
{
	position:relative
}
	#tools .tool .info-wrap .info,#tools .tool-archive .info-wrap .info
{
	opacity:1;
	background:#fff;
	padding:0;
	text-align:left;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box
}
	#tools .tool .info-wrap .name,#tools .tool-archive .info-wrap .name
{
	font-size:20px;
	color:#bbb;
	margin:15px
}
	#tools .tool .info-wrap a.name,#tools .tool-archive .info-wrap a.name
{
	color:#3ea5ce
}
	#tools .tool .info-wrap .details,#tools .tool-archive .info-wrap .details,#tools .tool .info-wrap .dl-button,#tools .tool-archive .info-wrap .dl-button
{
	display:none
}
	#tools .tool .also-available,#tools .tool-archive .also-available
{
	display:none
}
	#tools .tool .info-wrap .btns .dl-button
{
	display:inline-block!important;
	background:transparent;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	border-radius:0;
	text-align:center;
	padding:0 15px 5px 15px;
	margin:0 0 15px 0;
	float:left;
	width:auto;
	color:#3ea5ce;
	font:18px "Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-weight:bold
}
	#tools .tool .info-wrap .btns .dl-button:first-child
{
	border-right:1px #ddd solid
}
	#tools .tool.soon .info-wrap
{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:5
}
	#tools .tool.soon .info-wrap .info
{
	background:0;
	text-align:center
}
	#tools .tool.soon .info-wrap .name
{
	color:#fff
}
	#tools .tool.soon .info-wrap .details
{
	display:block;
	margin-bottom:0;
	font-size:14px
}
	#tools .tool.soon .logo
{
	display:none
}
	#tools .tool-archive
{
	width:100%;
	margin-right:0
}
	#tools .updates
{
	padding:60px 0
}
	#tools .updates p.kicker
{
	font-size:24px;
	line-height:33px;
	text-align:center
}

}
	#ios8 .reveal
{
	background:#3ea5ce url(/resources/img/tools/ipad-footer-card-bg.png) no-repeat bottom center
}
	#ios8 .hero-bg
{
	background-image:url(/resources/img/tools/bg-tools-ios8.jpg)
}
	#ios8 .iphone
{
	float:left;
	width:40%;
	height:489px;
	text-align:center;
	padding:30px 20px 0 30px
}
	#ios8 .new
{
	width:280px
}
	#ios8 .new p
{
	margin:60px 0 0 -40px;
	width:185px;
	height:100px;
	padding:7px 0 0 65px;
	float:left;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1em;
	background:url(/resources/img/tools/squiggle-palm.png) 0 top no-repeat
}
	#ios8 .iphone-fullsize
{
	background:url(/resources/img/tools/ios8-fullsize.png) center 150px no-repeat;
	margin-bottom:0;
	padding-top:35px;
	text-align:center;
	height:2000px
}
	#ios8 .iphone-fullsize p
{
	display:inline-block;
	margin-bottom:0;
	width:113px;
	height:90px;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1em;
	background:url(/resources/img/tools/squiggle-right.png) 25px bottom no-repeat
}
	#ios7 .reveal
{
	background:#3ea5ce url(/resources/img/tools/ipad-footer-card-bg.png) no-repeat bottom center
}
	#ios7 .hero-bg
{
	background-image:url(/resources/img/tools/bg-tools-ios7.jpg)
}
	#ios7 .iphone
{
	float:left;
	width:40%;
	height:489px;
	text-align:center;
	padding:30px 20px 0 30px
}
	#ios7 .new
{
	width:280px
}
	#ios7 .new p
{
	margin:60px 0 0 -40px;
	width:185px;
	height:100px;
	padding:7px 0 0 65px;
	float:left;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1em;
	background:url(/resources/img/tools/squiggle-palm.png) 0 top no-repeat
}
	#ios7 .iphone-fullsize
{
	background:url(/resources/img/tools/ios7-fullsize.png) center 150px no-repeat;
	margin-bottom:0;
	padding-top:35px;
	text-align:center;
	height:1750px
}
	#ios7 .iphone-fullsize p
{
	display:inline-block;
	margin-bottom:0;
	width:113px;
	height:90px;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1em;
	background:url(/resources/img/tools/squiggle-right.png) 25px bottom no-repeat
}
	@media all and (max-width:500px) and (min-width:0)
{
	#ios7 .iphone,#ios8 .iphone
{
	float:none;
	width:100%;
	text-align:center;
	padding:0 30px 0 0
}
	#ios7 .iphone img,#ios8 .iphone img
{
	max-width:90%;
	padding-right:50px
}
	#ios7 .new,#ios8 .new
{
	margin-left:0;
	margin-bottom:30px
}
	#ios7 .new h3,#ios8 .new h3
{
	margin:10px 0 20px
}
	#ios7 .new p,#ios8 .new p
{
	display:none
}
	#ios7 .iphone-fullsize,#ios8 .iphone-fullsize
{
	display:none
}

}
	#iphone-sketch-app .reveal
{
	background:#3ea5ce url(/resources/img/tools/iphone-footer-card-bg.png) no-repeat bottom center
}
	#iphone-sketch-app .hero-bg
{
	background-image:url(/resources/img/tools/bg-tools-ios7.jpg)
}
	#ipad-sketch-app .reveal
{
	background:#3ea5ce url(/resources/img/tools/ipad-footer-card-bg.png) no-repeat bottom center
}
	#ipad-sketch-app .hero-bg
{
	background-image:url(/resources/img/tools/bg-tools-ios7.jpg)
}
	#ipad-psd .reveal
{
	background:#3ea5ce url(/resources/img/tools/iphone-footer-card-bg.png) no-repeat bottom center
}
	#ipad-psd .hero-bg
{
	background-image:url(/resources/img/tools/bg-tools-ipad.jpg)
}
	#ipad-psd .ipad
{
	float:left;
	width:40%;
	height:387px;
	text-align:center;
	padding-left:60px
}
	#ipad-psd .new
{
	float:left;
	margin-left:40px
}
	#ipad-psd .new h3
{
	margin:30px 0 20px
}
	#ipad-psd .new p
{
	margin:130px 0 0 -40px;
	width:185px;
	height:141px;
	padding:7px 0 0 65px;
	float:left;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1em;
	background:url(/resources/img/tools/squiggle-palm.png) 0 top no-repeat
}
	#ipad-psd .ipad-fullsize
{
	margin-bottom:0;
	padding-top:35px;
	height:1846px;
	text-align:center;
	background:url(/resources/img/tools/ipad-fullsize.jpg) center 155px no-repeat
}
	#ipad-psd .ipad-fullsize p
{
	margin:0 auto;
	width:160px;
	height:110px;
	font-family:"nanumpenscript",Helvetica,Arial,sans-serif;
	font-size:19px;
	line-height:1em;
	background:url(/resources/img/tools/squiggle-right.png) 50px bottom no-repeat
}
	@media all and (max-width:1000px) and (min-width:500px)
{
	#ipad-psd .ipad
{
	float:left;
	width:40%;
	height:317px;
	text-align:center;
	padding-left:0
}
	#ipad-psd .ipad img
{
	max-width:90%
}
	#ipad-psd .new
{
	float:left;
	margin-left:30px
}
	#ipad-psd .new h3
{
	margin:30px 0 20px
}
	#ipad-psd .new p
{
	margin:60px 0 0 -40px
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#ipad-psd .ipad
{
	width:100%;
	padding-bottom:0;
	padding-left:0;
	height:430px
}
	#ipad-psd .ipad img
{
	max-width:90%
}
	#ipad-psd .new
{
	margin-left:0;
	margin-bottom:30px
}
	#ipad-psd .new h3
{
	margin:10px 0 20px
}
	#ipad-psd .new p
{
	display:none
}
	#ipad-psd .ipad-fullsize
{
	display:none
}

}
	#density-converter .reveal
{
	background:#3ea5ce url(/resources/img/tools/iphone-footer-card-bg.png) no-repeat bottom center
}
	#density-converter .hero-bg
{
	background-image:url(/resources/img/tools/bg-tools-density-converter.jpg)
}
	#density-converter .sizes
{
	margin-bottom:100px;
	background-color:transparent
}
	#density-converter .sizes img
{
	max-width:100%
}
	#density-converter .density-converter h2
{
	color:#b2b2b2
}
	#density-converter .density-converter #converter
{
	margin:0 auto 100px -12px;
	padding:12px;
	width:1000px;
	max-width:100%;
	height:513px;
	background:url(/resources/img/tools/bg-density-converter.png) no-repeat center center;
	background-size:contain
}
	#density-converter .density-converter #converter table
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-weight:bold;
	width:100%;
	height:100%;
	background:#fff
}
	#density-converter .density-converter #converter table th,#density-converter .density-converter #converter table td
{
	background-color:#fff;
	width:239px;
	text-align:center;
	font-size:18px
}
	#density-converter .density-converter #converter table th
{
	height:111px;
	border-right:1px solid #dedede
}
	#density-converter .density-converter #converter table .labels th:first-child,#density-converter .density-converter #converter table .labels th:last-child
{
	border-right:0
}
	#density-converter .density-converter #converter table td
{
	border-top:1px solid #dedede
}
	#density-converter .density-converter #converter table td div
{
	height:150px
}
	#density-converter .density-converter #converter table .percentage
{
	color:#ccc
}
	#density-converter .density-converter #converter table .size-label
{
	background-color:#dedede
}
	#density-converter .density-converter #converter table .size-label.vertical
{
	width:40px
}
	#density-converter .density-converter #converter table .size-label.vertical .width
{
	background:#3ea5ce url(/resources/img/tools/density-converter-label-width.gif) no-repeat center center;
	text-indent:-10000px
}
	#density-converter .density-converter #converter table .size-label.vertical .height
{
	background:#3ea5ce url(/resources/img/tools/density-converter-label-height.gif) no-repeat center center;
	text-indent:-10000px
}
	#density-converter .density-converter #converter table .size-label.horizontal
{
	display:none
}
	#density-converter .density-converter #converter table .size-label.horizontal .width
{
	height:32px;
	background:#3ea5ce url(/resources/img/tools/density-converter-label-width-horizontal.gif) no-repeat center center;
	text-indent:-10000px
}
	#density-converter .density-converter #converter table .size-label.horizontal .height
{
	height:32px;
	background:#3ea5ce url(/resources/img/tools/density-converter-label-height-horizontal.gif) no-repeat center center;
	text-indent:-10000px
}
	#density-converter .density-converter #converter table .input_field
{
	border-right:1px solid #dedede
}
	#density-converter .density-converter #converter table .input_field:last-child
{
	border-right:0
}
	#density-converter .density-converter #converter table .input_field input
{
	margin-top:23px;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:48px;
	width:100%;
	text-align:center;
	border:0;
	color:#3ea5ce;
	outline:0
}
	#density-converter .density-converter #converter table .pixels
{
	color:#ccc
}
	#density-converter .density-converter #converter table tfoot
{
	background-color:#dedede;
	color:#8d8d8d
}
	#density-converter .density-converter #converter table tfoot th
{
	padding-top:20px;
	background-color:transparent;
	border:0;
	height:30px
}
	#density-converter .density-converter #converter table tfoot .radio
{
	padding:0 15px
}
	#density-converter .density-converter #converter table tfoot .remember
{
	padding:0;
	font-size:16px;
	font-weight:normal
}
	@media all and (max-width:1000px) and (min-width:500px)
{
	#density-converter .density-converter #converter
{
	margin:0 auto 100px auto;
	padding:0;
	width:100%;
	height:auto;
	background:0
}
	#density-converter .density-converter #converter table
{
	padding:0;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-weight:bold;
	width:100%;
	height:100%;
	background:#fff
}
	#density-converter .density-converter #converter table th,#density-converter .density-converter #converter table td
{
	width:auto;
	padding:5px;
	border:0
}
	#density-converter .density-converter #converter table .labels th,#density-converter .density-converter #converter table .labels th:first-child,#density-converter .density-converter #converter table .labels th:last-child
{
	border-top:1px solid #dedede;
	border-left:1px solid #dedede;
	border-right:1px solid #dedede
}
	#density-converter .density-converter #converter table .size-label
{
	padding:0
}
	#density-converter .density-converter #converter table .size-label.vertical
{
	display:none
}
	#density-converter .density-converter #converter table .size-label.horizontal
{
	display:table-cell;
	width:100%
}
	#density-converter .density-converter #converter table .size-label.horizontal .width
{
	width:100%
}
	#density-converter .density-converter #converter table .input_field,#density-converter .density-converter #converter table .input_field:last-child
{
	border-left:1px solid #dedede;
	border-right:1px solid #dedede
}
	#density-converter .density-converter #converter table tfoot th
{
	border:1px solid #dedede
}
	#density-converter .density-converter #converter table tfoot .remember
{
	padding:10px
}

}
	@media all and (max-width:500px) and (min-width:0)
{
	#density-converter .sizes
{
	width:100%;
	height:700px;
	background:url(/resources/img/tools/density-converter-sizes-small.png) no-repeat center center;
	background-size:contain
}
	#density-converter .sizes img
{
	display:none
}
	#density-converter .density-converter #converter
{
	margin:0 auto 100px auto;
	padding:3px;
	width:272px;
	height:473px;
	background:url(/resources/img/tools/bg-density-converter-small.png) no-repeat center center
}
	#density-converter .density-converter #converter table
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-weight:bold;
	width:100%;
	height:100%;
	background:#fff
}
	#density-converter .density-converter #converter table th,#density-converter .density-converter #converter table td
{
	background-color:#fff;
	width:67px;
	text-align:center;
	font-size:14px
}
	#density-converter .density-converter #converter table th
{
	height:90px;
	border-right:1px solid #dedede;
	padding:5px
}
	#density-converter .density-converter #converter table td
{
	border-top:0
}
	#density-converter .density-converter #converter table td div
{
	height:90px
}
	#density-converter .density-converter #converter table .size-label.vertical
{
	display:none
}
	#density-converter .density-converter #converter table .size-label.horizontal
{
	display:table-cell;
	width:100%
}
	#density-converter .density-converter #converter table .size-label.horizontal .width
{
	width:100%
}
	#density-converter .density-converter #converter table .input_field input
{
	margin-top:23px;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:18px;
	width:100%;
	text-align:center;
	border:0;
	color:#3ea5ce;
	outline:0
}
	#density-converter .density-converter #converter table .pixels
{
	font-size:13px
}

}
.blog-contents
{
	min-height:100%;
	background:#eee
}
.blog-footer
{
	background:#fff
}
.customize-support #main-nav
{
	top:28px
}
.tl-blog
{
	padding-top:63px
}
.tl-blog h1
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-weight:700;
	font-size:59px;
	line-height:60px;
	color:#222;
	margin-bottom:10px
}
.tl-blog h2
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-weight:700;
	font-size:45px;
	line-height:55px;
	color:#222;
	margin-bottom:10px
}
.tl-blog h1 a,.tl-blog h2 a
{
	color:#222
}
.tl-blog h1 a:hover,.tl-blog h2 a:hover
{
	color:#444
}
.tl-blog h3
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:40px;
	font-weight:700;
	line-height:50px;
	color:#222;
	margin-top:60px;
	margin-bottom:26px;
	letter-spacing:-0.03em
}
.tl-blog h4
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:26px;
	font-weight:700;
	color:#222;
	margin-bottom:10px
}
.tl-blog p
{
	font-size:24px;
	line-height:37px;
	color:#222
}
.tl-blog .post-stub
{
	border-bottom:1px solid #d6d6d6;
	padding:65px 0
}
.tl-blog .back-button
{
	display:inline-block;
	padding:15px 15px 12px 40px;
	border:1px solid #bbb;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:14px;
	color:#999;
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	border-radius:8px;
	background-image:url(/resources/img/ui/blog-back.png);
	background-repeat:no-repeat;
	background-position:15px 18px;
	margin-bottom:60px;
	-webkit-transition:color .2s,border-color .2s;
	-moz-transition:color .2s,border-color .2s;
	-o-transition:color .2s,border-color .2s;
	transition:color .2s,border-color .2s
}
.tl-blog .back-button:hover
{
	color:#666;
	border-color:#aaa;
	background-position:15px -19px
}
.tl-blog .byline
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:22px;
	color:#999
}
.tl-blog .byline a
{
	color:#999;
	text-decoration:underline
}
.tl-blog .byline a:hover
{
	color:#666
}
.tl-blog .byline .news
{
	color:#3ea5ce
}
.tl-blog .byline .labs
{
	color:#4cbd99
}
.tl-blog .byline .development
{
	color:#f5a83b
}
.tl-blog .byline .strategy
{
	color:#616161
}
.tl-blog .byline .design
{
	color:#df7154
}
.tl-blog .post-list-nav
{
	padding:30px 0;
	font-size:26px;
	*zoom:1
}
.tl-blog .post-list-nav:before,.tl-blog .post-list-nav:after
{
	display:table;
	content:"";
	line-height:0
}
.tl-blog .post-list-nav:after
{
	clear:both
}
.tl-blog .post-list-nav .prev
{
	float:left
}
.tl-blog .post-list-nav .next
{
	float:right
}
.tl-blog .blog-footer
{
	background:#fff;
	padding:30px 0;
	*zoom:1
}
.tl-blog .blog-footer:before,.tl-blog .blog-footer:after
{
	display:table;
	content:"";
	line-height:0
}
.tl-blog .blog-footer:after
{
	clear:both
}
.tl-blog .blog-footer .sharing-tools
{
	float:left
}
.tl-blog .blog-footer .copywrite
{
	float:right;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:16px;
	color:#999
}
.tl-blog .search
{
	border-bottom:1px solid #d6d6d6;
	padding:35px 0
}
.tl-blog .search input
{
	background:transparent;
	border:0;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	color:#c8c8c8;
	font-size:36px;
	font-weight:600;
	outline:0;
	width:100%
}
.tl-blog .header
{
	border-bottom:1px solid #d6d6d6;
	padding:35px 0;
	*zoom:1
}
.tl-blog .header:before,.tl-blog .header:after
{
	display:table;
	content:"";
	line-height:0
}
.tl-blog .header:after
{
	clear:both
}
.tl-blog .header .category
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:36px;
	font-weight:700;
	color:#222;
	float:left
}
.tl-blog .header .post-count
{
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:26px;
	float:right;
	margin-top:10px
}
.tl-blog .author-header
{
	text-align:center;
	padding-top:90px;
	padding-bottom:60px;
	border-bottom:1px solid #d6d6d6
}
.tl-blog .author-header .avatar
{
	-webkit-border-radius:100px;
	-moz-border-radius:100px;
	border-radius:100px
}
.tl-blog .author-header .name
{
	display:block;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:36px;
	font-weight:700;
	color:#222;
	margin-top:20px
}
.tl-blog .author-header .post-count
{
	display:block;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:26px;
	color:#999
}
.tl-blog #blog-home
{
	padding-top:50px
}
.tl-blog #blog-post
{
	padding-top:60px
}
.tl-blog #blog-post .byline
{
	display:block;
	margin-bottom:70px
}
.tl-blog #blog-post .sharing-tools
{
	text-align:left;
	padding:40px 0
}
.tl-blog #blog-post .author
{
	border-top:1px solid #d6d6d6;
	padding:45px 0;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:22px;
	color:#999;
	*zoom:1
}
.tl-blog #blog-post .author:before,.tl-blog #blog-post .author:after
{
	display:table;
	content:"";
	line-height:0
}
.tl-blog #blog-post .author:after
{
	clear:both
}
.tl-blog #blog-post .author a
{
	color:#999;
	text-decoration:underline
}
.tl-blog #blog-post .author .avatar
{
	float:left;
	width:85px;
	height:85px;
	-webkit-border-radius:100px;
	-moz-border-radius:100px;
	border-radius:100px
}
.tl-blog #blog-post .author .info
{
	display:inline-block;
	margin:25px 0 0 20px
}
.tl-blog .wp-pagenavi
{
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:20px;
	padding:40px 0
}
.tl-blog .wp-pagenavi span,.tl-blog .wp-pagenavi a
{
	margin-right:20px
}
.tl-blog .no-posts-found
{
	padding:50px 0;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:26px;
	line-height:39px;
	font-weight:400
}
	@media all and (max-width:500px) and (min-width:0)
{
.tl-blog h1
{
	font-size:38px;
	line-height:45px;
	margin-bottom:7px
}
.tl-blog h2
{
	font-size:33px;
	line-height:37px
}
.tl-blog h3
{
	font-size:31px;
	line-height:36px;
	margin-bottom:26px;
	margin-top:50px;
	letter-spacing:-0.05em
}
.tl-blog h4
{
	font-size:19px
}
.tl-blog p
{
	font-size:19px;
	line-height:29px;
	margin-bottom:30px
}
.tl-blog .post-stub
{
	padding:45px 0
}
.tl-blog .byline
{
	font-size:19px
}
.tl-blog .byline .written-by
{
	display:none
}
.tl-blog #blog-home
{
	padding-top:10px
}
.tl-blog .search
{
	padding:30px 0
}
.tl-blog .search input
{
	font-size:25px
}
.tl-blog .header .category
{
	font-size:25px
}
.tl-blog .header .post-count
{
	font-size:19px
}
.tl-blog .author-header
{
	padding-top:50px;
	padding-bottom:35px
}
.tl-blog .author-header .name
{
	font-size:25px;
	margin-top:10px;
	margin-bottom:3px
}
.tl-blog .author-header .post-count
{
	font-size:19px
}
.tl-blog #blog-post .byline
{
	margin-bottom:30px
}
.tl-blog #blog-post .author
{
	font-size:19px
}
.tl-blog .wp-pagenavi
{
	font-size:20px
}
.tl-blog .no-posts-found
{
	font-size:19px
}

}
.tl-blog .post-body img
{
	max-width:100%;
	height:auto
}
.tl-blog .post-body .aligncenter
{
	display:block;
	margin:0 auto
}
.tl-blog .post-body a
{
	color:#222;
	text-decoration:underline
}
.tl-blog .post-body a:hover
{
	text-decoration:none
}
.tl-blog .post-body a.blue
{
	color:#3ea5ce;
	font-family:"Helvetica Neue",Helvetica,"pragmatica-web",Arial,sans-serif;
	font-size:44px;
	line-height:50px;
	text-decoration:none;
	font-weight:700;
	letter-spacing:-0.03em
}
.tl-blog .post-body a.blue:hover
{
	color:#279
}
.tl-blog .post-body ul
{
	margin-bottom:40px
}
.tl-blog .post-body ul li
{
	list-style-type:none;
	background:url('/resources/img/ui/bullet.png') no-repeat left 13px;
	font-family:"PT Serif",Georgia,Times,"Times New Roman",serif;
	font-size:24px;
	line-height:39px;
	margin-bottom:10px;
	padding-left:30px
}
.tl-blog .post-body ol li
{
	font-size:24px;
	margin-bottom:10px
}
.tl-blog .post-body blockquote
{
	text-align:left;
	font-size:26px;
	font-style:italic;
	line-height:39px;
	color:#222;
	padding-left:30px;
	border-left:7px solid #38a5cb;
	margin:0 0 40px 0
}
.tl-blog .post-body table
{
	width:100%;
	margin-bottom:30px
}
.tl-blog .post-body table th
{
	text-align:left;
	padding:5px 10px
}
.tl-blog .post-body table td
{
	padding:10px;
	text-align:left;
	vertical-align:top;
	border:1px solid #ddd
}
.tl-blog .post-body hr
{
	border-top:1px solid #d6d6d6;
	border-bottom:0;
	border-right:0;
	border-left:none;
	height:1px;
	margin-bottom:40px
}
.tl-blog .post-body pre
{
	overflow-x:auto;
	line-height:28px
}
.tl-blog .post-body code
{
	font-family:"Courier New",Courier,monospace;
	font-size:20px
}
.tl-blog .post-body .gist
{
	margin-bottom:40px
}
.tl-blog .post-body .gist a
{
	text-decoration:none
}
.tl-blog .post-body .gist .gist-file .gist-meta a:visited
{
	color:#369
}
.tl-blog .post-body iframe
{
	max-width:100%
}
	@media all and (max-width:500px) and (min-width:0)
{
.tl-blog .post-body a.blue
{
	font-size:31px;
	line-height:36px
}
.tl-blog .post-body pre
{
	line-height:24px
}
.tl-blog .post-body code
{
	font-size:15px
}

}

