/*!
 * Bootstrap v2.2.2
 *
 * Copyright 2012 Twitter, Inc
 * Licensed under the Apache License v2.0
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Designed and built with all the love in the world @twitter by @mdo and @fat.
 */

.clearfix {
	*zoom: 1;
}

.clearfix:before,
.clearfix:after {
	display: table;
	content: "";
	line-height: 0;
}

.clearfix:after {
	clear: both;
}

img {
	/* Responsive images (ensure images don't scale beyond their parents) */

	max-width: 100%;
	/* Part 1: Set a maxium relative to the parent */

	width: auto\9;
	/* IE7-8 need help adjusting responsive images */

	height: auto;
	/* Part 2: Scale the height according to the width, otherwise you get stretching */

	vertical-align: middle;
	border: 0;
	-ms-interpolation-mode: bicubic;
}

@media print {
	* {
		text-shadow: none !important;
		color: #000 !important;
		background: transparent !important;
		box-shadow: none !important;
	}

	a,
	a:visited {
		text-decoration: underline;
	}

	a[href]:after {
		content: " (" attr(href) ")";
	}

	abbr[title]:after {
		content: " (" attr(title) ")";
	}

	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content: "";
	}

	pre,
	blockquote {
		border: 1px solid #999;
		page-break-inside: avoid;
	}

	thead {
		display: table-header-group;
	}

	tr,
	img {
		page-break-inside: avoid;
	}

	img {
		max-width: 100% !important;
	}

	@page  {
		margin: 0.5cm;
	}

	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 {
		page-break-after: avoid;
	}
}

.row {
	margin-left: -20px;
	*zoom: 1;
}

.row:before,
.row:after {
	display: table;
	content: "";
	line-height: 0;
}

.row:after {
	clear: both;
}

[class*="span"] {
	float: left;
	min-height: 1px;
	margin-left: 20px;
}

.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
	width: 940px;
}

.span12 {
	width: 940px;
}

.span11 {
	width: 860px;
}

.span10 {
	width: 780px;
}

.span9 {
	width: 700px;
}

.span8 {
	width: 620px;
}

.span7 {
	width: 540px;
}

.span6 {
	width: 460px;
}

.span5 {
	width: 380px;
}

.span4 {
	width: 300px;
}

.span3 {
	width: 220px;
}

.span2 {
	width: 140px;
}

.span1 {
	width: 60px;
}

.offset12 {
	margin-left: 980px;
}

.offset11 {
	margin-left: 900px;
}

.offset10 {
	margin-left: 820px;
}

.offset9 {
	margin-left: 740px;
}

.offset8 {
	margin-left: 660px;
}

.offset7 {
	margin-left: 580px;
}

.offset6 {
	margin-left: 500px;
}

.offset5 {
	margin-left: 420px;
}

.offset4 {
	margin-left: 340px;
}

.offset3 {
	margin-left: 260px;
}

.offset2 {
	margin-left: 180px;
}

.offset1 {
	margin-left: 100px;
}

.row-fluid {
	width: 100%;
	*zoom: 1;
}

.row-fluid:before,
.row-fluid:after {
	display: table;
	content: "";
	line-height: 0;
}

.row-fluid:after {
	clear: both;
}

.row-fluid [class*="span"] {
	display: block;
	width: 100%;
	min-height: 30px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
	margin-left: 2.127659574468085%;
}

.row-fluid [class*="span"]:first-child {
	margin-left: 0;
}

.row-fluid .controls-row [class*="span"] + [class*="span"] {
	margin-left: 2.127659574468085%;
}

.row-fluid .span12 {
	width: 100%;
}

.row-fluid .span11 {
	width: 91.48936170212765%;
}

.row-fluid .span10 {
	width: 82.97872340425532%;
}

.row-fluid .span9 {
	width: 74.46808510638297%;
}

.row-fluid .span8 {
	width: 65.95744680851064%;
}

.row-fluid .span7 {
	width: 57.44680851063829%;
}

.row-fluid .span6 {
	width: 48.93617021276595%;
}

.row-fluid .span5 {
	width: 40.42553191489362%;
}

.row-fluid .span4 {
	width: 31.914893617021278%;
}

.row-fluid .span3 {
	width: 23.404255319148934%;
}

.row-fluid .span2 {
	width: 14.893617021276595%;
}

.row-fluid .span1 {
	width: 6.382978723404255%;
}

.row-fluid .offset12 {
	margin-left: 104.25531914893617%;
}

.row-fluid .offset12:first-child {
	margin-left: 102.12765957446808%;
}

.row-fluid .offset11 {
	margin-left: 95.74468085106382%;
}

.row-fluid .offset11:first-child {
	margin-left: 93.61702127659574%;
}

.row-fluid .offset10 {
	margin-left: 87.23404255319149%;
}

.row-fluid .offset10:first-child {
	margin-left: 85.1063829787234%;
}

.row-fluid .offset9 {
	margin-left: 78.72340425531914%;
}

.row-fluid .offset9:first-child {
	margin-left: 76.59574468085106%;
}

.row-fluid .offset8 {
	margin-left: 70.2127659574468%;
}

.row-fluid .offset8:first-child {
	margin-left: 68.08510638297872%;
}

.row-fluid .offset7 {
	margin-left: 61.70212765957446%;
}

.row-fluid .offset7:first-child {
	margin-left: 59.574468085106375%;
}

.row-fluid .offset6 {
	margin-left: 53.191489361702125%;
}

.row-fluid .offset6:first-child {
	margin-left: 51.063829787234035%;
}

.row-fluid .offset5 {
	margin-left: 44.68085106382979%;
}

.row-fluid .offset5:first-child {
	margin-left: 42.5531914893617%;
}

.row-fluid .offset4 {
	margin-left: 36.170212765957444%;
}

.row-fluid .offset4:first-child {
	margin-left: 34.04255319148936%;
}

.row-fluid .offset3 {
	margin-left: 27.659574468085104%;
}

.row-fluid .offset3:first-child {
	margin-left: 25.53191489361702%;
}

.row-fluid .offset2 {
	margin-left: 19.148936170212764%;
}

.row-fluid .offset2:first-child {
	margin-left: 17.02127659574468%;
}

.row-fluid .offset1 {
	margin-left: 10.638297872340425%;
}

.row-fluid .offset1:first-child {
	margin-left: 8.51063829787234%;
}

[class*="span"].hide,
.row-fluid [class*="span"].hide {
	display: none;
}

[class*="span"].pull-right,
.row-fluid [class*="span"].pull-right {
	float: right;
}

.container {
	margin-right: auto;
	margin-left: auto;
	*zoom: 1;
}

.container:before,
.container:after {
	display: table;
	content: "";
	line-height: 0;
}

.container:after {
	clear: both;
}

.container-fluid {
	padding-right: 20px;
	padding-left: 20px;
	*zoom: 1;
}

.container-fluid:before,
.container-fluid:after {
	display: table;
	content: "";
	line-height: 0;
}

.container-fluid:after {
	clear: both;
}

.hidden {
	display: none;
	visibility: hidden;
}

.visible-phone {
	display: none !important;
}

.visible-tablet {
	display: none !important;
}

.hidden-desktop {
	display: none !important;
}

.visible-desktop {
	display: inherit !important;
}

@media (min-width: 768px) and (max-width: 979px) {
	.hidden-desktop {
		display: inherit !important;
	}

	.visible-desktop {
		display: none !important ;
	}

	.visible-tablet {
		display: inherit !important;
	}

	.hidden-tablet {
		display: none !important;
	}
}

@media (max-width: 767px) {

	body {
		padding-left: 20px;
		padding-right: 20px;
	}

	.container-fluid {
		padding: 0;
	}

	.dl-horizontal dt {
		float: none;
		clear: none;
		width: auto;
		text-align: left;
	}

	.dl-horizontal dd {
		margin-left: 0;
	}

	.container {
		width: auto;
	}

	.row-fluid {
		width: 100%;
	}

	.row,
	.thumbnails {
		margin-left: 0;
	}

	.thumbnails > li {
		float: none;
		margin-left: 0;
	}

	[class*="span"],
	.row-fluid [class*="span"] {
		float: none;
		display: block;
		width: 100%;
		margin-left: 0;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	.span12,
	.row-fluid .span12 {
		width: 100%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	.row-fluid [class*="offset"]:first-child {
		margin-left: 0;
	}

	/* Webflow custom */
	.row [class*="landscape-span"] {
		float: left;
	}

	.row .landscape-span6 {
		width: 50%;
	}

	.row .landscape-span6:nth-child(odd) {
		padding-right: 10px;
	}

	.row .landscape-span6:nth-child(even) {
		padding-left: 10px;
	}

	.row .landscape-span4 {
		width: 33.3333%;
	}

	.row .landscape-span4:nth-child(3n-2) {
		padding-right: 10px;
	}

	.row .landscape-span4:nth-child(3n-1) {
		padding-right: 5px;
		padding-left: 5px;
	}

	.row .landscape-span4:nth-child(3n) {
		padding-left: 10px;
	}


}

/*@media (min-width: 481px) and (max-width: 767px) {
	div[class*="span"] {
	    width: 48%;
	    margin-left: 2%;
	    float: left;
	}

	div[class="span"]:first-of-type {
	    margin-left: 0;
	}
}*/

@media (max-width: 480px) {
	.media .pull-left,
	.media .pull-right {
		float: none;
		display: block;
		margin-bottom: 10px;
	}

	.media-object {
		margin-right: 0;
		margin-left: 0;
	}

	.row [class*="landscape-span"] {
		float: none;
		display: block;
		width: 100%;
		margin-left: 0;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	.row [class*="landscape-span"]:nth-child(1n) {
		padding-left: 0;
		padding-right: 0;
	} 

	/* Webflow custom */
	.row [class*="portrait-span"] {
		float: left;
	}

	.row .portrait-span6 {
		width: 50%;
	}

	.row .portrait-span6:nth-child(odd) {
		padding-right: 10px;
	}

	.row .portrait-span6:nth-child(even) {
		padding-left: 10px;
	}
}


@media (min-width: 768px) and (max-width: 979px) {
	.row {
		margin-left: -20px;
		*zoom: 1;
	}

	.row:before,
	.row:after {
		display: table;
		content: "";
		line-height: 0;
	}

	.row:after {
		clear: both;
	}

	[class*="span"] {
		float: left;
		min-height: 1px;
		margin-left: 20px;
	}

	.container {
		width: 724px;
	}

	.span12 {
		width: 724px;
	}

	.span11 {
		width: 662px;
	}

	.span10 {
		width: 600px;
	}

	.span9 {
		width: 538px;
	}

	.span8 {
		width: 476px;
	}

	.span7 {
		width: 414px;
	}

	.span6 {
		width: 352px;
	}

	.span5 {
		width: 290px;
	}

	.span4 {
		width: 228px;
	}

	.span3 {
		width: 166px;
	}

	.span2 {
		width: 104px;
	}

	.span1 {
		width: 42px;
	}

	.offset12 {
		margin-left: 764px;
	}

	.offset11 {
		margin-left: 702px;
	}

	.offset10 {
		margin-left: 640px;
	}

	.offset9 {
		margin-left: 578px;
	}

	.offset8 {
		margin-left: 516px;
	}

	.offset7 {
		margin-left: 454px;
	}

	.offset6 {
		margin-left: 392px;
	}

	.offset5 {
		margin-left: 330px;
	}

	.offset4 {
		margin-left: 268px;
	}

	.offset3 {
		margin-left: 206px;
	}

	.offset2 {
		margin-left: 144px;
	}

	.offset1 {
		margin-left: 82px;
	}

	.row-fluid {
		width: 100%;
		*zoom: 1;
	}

	.row-fluid:before,
	.row-fluid:after {
		display: table;
		content: "";
		line-height: 0;
	}

	.row-fluid:after {
		clear: both;
	}

	.row-fluid [class*="span"] {
		display: block;
		width: 100%;
		min-height: 30px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		float: left;
		margin-left: 2.7624309392265194%;
	}

	.row-fluid [class*="span"]:first-child {
		margin-left: 0;
	}

	.row-fluid .controls-row [class*="span"] + [class*="span"] {
		margin-left: 2.7624309392265194%;
	}

	.row-fluid .span12 {
		width: 100%;
	}

	.row-fluid .span11 {
		width: 91.43646408839778%;
	}

	.row-fluid .span10 {
		width: 82.87292817679558%;
	}

	.row-fluid .span9 {
		width: 74.30939226519337%;
	}

	.row-fluid .span8 {
		width: 65.74585635359117%;
	}

	.row-fluid .span7 {
		width: 57.18232044198895%;
	}

	.row-fluid .span6 {
		width: 48.61878453038674%;
	}

	.row-fluid .span5 {
		width: 40.05524861878453%;
	}

	.row-fluid .span4 {
		width: 31.491712707182323%;
	}

	.row-fluid .span3 {
		width: 22.92817679558011%;
	}

	.row-fluid .span2 {
		width: 14.3646408839779%;
	}

	.row-fluid .span1 {
		width: 5.801104972375691%;
	}

	.row-fluid .offset12 {
		margin-left: 105.52486187845304%;
	}

	.row-fluid .offset12:first-child {
		margin-left: 102.76243093922652%;
	}

	.row-fluid .offset11 {
		margin-left: 96.96132596685082%;
	}

	.row-fluid .offset11:first-child {
		margin-left: 94.1988950276243%;
	}

	.row-fluid .offset10 {
		margin-left: 88.39779005524862%;
	}

	.row-fluid .offset10:first-child {
		margin-left: 85.6353591160221%;
	}

	.row-fluid .offset9 {
		margin-left: 79.8342541436464%;
	}

	.row-fluid .offset9:first-child {
		margin-left: 77.07182320441989%;
	}

	.row-fluid .offset8 {
		margin-left: 71.2707182320442%;
	}

	.row-fluid .offset8:first-child {
		margin-left: 68.50828729281768%;
	}

	.row-fluid .offset7 {
		margin-left: 62.70718232044199%;
	}

	.row-fluid .offset7:first-child {
		margin-left: 59.94475138121547%;
	}

	.row-fluid .offset6 {
		margin-left: 54.14364640883978%;
	}

	.row-fluid .offset6:first-child {
		margin-left: 51.38121546961326%;
	}

	.row-fluid .offset5 {
		margin-left: 45.58011049723757%;
	}

	.row-fluid .offset5:first-child {
		margin-left: 42.81767955801105%;
	}

	.row-fluid .offset4 {
		margin-left: 37.01657458563536%;
	}

	.row-fluid .offset4:first-child {
		margin-left: 34.25414364640884%;
	}

	.row-fluid .offset3 {
		margin-left: 28.45303867403315%;
	}

	.row-fluid .offset3:first-child {
		margin-left: 25.69060773480663%;
	}

	.row-fluid .offset2 {
		margin-left: 19.88950276243094%;
	}

	.row-fluid .offset2:first-child {
		margin-left: 17.12707182320442%;
	}

	.row-fluid .offset1 {
		margin-left: 11.32596685082873%;
	}

	.row-fluid .offset1:first-child {
		margin-left: 8.56353591160221%;
	}
}

* { 
	-moz-box-sizing: border-box; 
	box-sizing: border-box; 
}

@-webkit-keyframes wf-new-code {
	0% { 
		background-color: rgba(255, 239, 149, 1.0); 
		box-shadow: 0 0 4px 0 rgba(255, 174, 10, 1.0);
		text-shadow: 0 1px 0 rgba(255, 255, 255, 1.0);
	}
	60% { 
		background-color: rgba(255, 239, 149, 1.0); 
		box-shadow: 0 0 4px 0 rgba(255, 174, 10, 1);
		text-shadow: 0 1px 0 rgba(255, 255, 255, 1.0);
	}
	100% {
		background-color: rgba(255, 239, 149, 0.0); 
		box-shadow: 0 0 4px 0 rgba(255, 174, 10, 0.0);
		text-shadow: 0 1px 0 rgba(255, 255, 255, 0.0);
	}
}

.live-code {
	position: relative;
	margin-top: 15px;
	margin-bottom: 15px;
	border-radius: 4px;
	box-shadow: 0 2px 10px -3px rgba(0, 0, 0, 0.3);
	background-color: #F8FBFC;
	border: 1px solid #B2BBBF;

	height: 37px;
	font-size: 12px;
	line-height: 1.0em;

	-webkit-transition: height 0.5s ease-in-out, box-shadow 0.25s ease;
	transition: height 0.5s ease-in-out, box-shadow 0.25s ease;
}

.live-code:hover {
	box-shadow: 0 2px 10px -3px rgba(0, 0, 0, 0.4);
}

.live-code > a {
	position: absolute;
	display: block;
	left: -1px;
	top: -1px;
	right: -1px;
	height: 37px;

	padding: 12px 10px 9px 64px;

	background-color: #F5FAFD;
	color: #7898B6;
	border: 1px solid rgba(145, 180, 217, .6);
	border-radius: 4px;

	background-image: -webkit-linear-gradient(top, #F7FCFF, #EEF3F6);
	background-image: linear-gradient(to bottom, #F7FCFF, #EEF3F6);
	box-shadow: 0 1px 0 0 rgba(255, 255, 255, 1.0) inset,
				0 56px 47px -41px rgba(255, 255, 255, 0.0) inset;

	font-family: 'Montserrat', sans-serif;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 15px;
	-webkit-font-smoothing: antialiased;

	-webkit-transition: box-shadow 0.25s ease, border-color 0.25s ease;
	transition: box-shadow 0.25s ease, border-color 0.25s ease;

}

.live-code > a:hover {
	box-shadow: 0 1px 0 0 rgba(255, 255, 255, 1.0) inset,
				0 56px 47px -41px rgba(255, 255, 255, 0.9) inset;

	border-color: rgba(145, 180, 217, .8);

}

.live-code > a > i.code {
	position: absolute;
	left: -1px;
	top: -1px;
	bottom: -1px;
	width: 50px;
	background-color: #1B8EF6;

	background-image: url(../img/code-icon.png), -webkit-linear-gradient(top, #1092FF, #228AEA);
	background-image: url(../img/code-icon.png), linear-gradient(to bottom, #1092FF, #228AEA);
	background-position: 50% 48%, left top;
	background-repeat: no-repeat, no-repeat; 
	background-size: 31px, auto;

	box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.5) inset,
				0 56px 47px -41px rgba(255, 255, 255, 0.0) inset;

	border: 1px solid rgba(49, 126, 204, 0.5);
	border-radius: 4px 0 0 4px;

	-webkit-transition: box-shadow 0.25s ease;
	transition: box-shadow 0.25s ease;
}

.live-code > a:hover > i.code {
	box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6) inset,
				0 56px 47px -41px rgba(255, 255, 255, 0.3) inset;
	}

.live-code > a > i.expand {
	float: right;
	width: 11px;
	margin-top:-2px;
	height: 16px;
	opacity: 0.25;
	background: url(../img/expand-icon.png) no-repeat left top;
	background-size: 11px;

	-webkit-transition: opacity 0.25s ease;
	transition: opacity 0.25s ease;
}

.live-code > a:hover > i.expand {
	opacity: 0.4;
}

.live-code.open {
	height: 350px;
}

.live-code.open:hover {
	box-shadow: 0 2px 11px -3px rgba(0, 0, 0, 0.3);
}

.live-code.open > a {
	height:37px;
	padding: 12px 10px 10px 64px;


	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	border-color: #1E78CF;

	-webkit-transition: box-shadow 0.0s ease;
	transition: box-shadow 0.0s ease;

	background-image: -webkit-linear-gradient(top, #1092FF, #228AEA);
	background-image: linear-gradient(to bottom, #1092FF, #228AEA);

	box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.5) inset,
				0 56px 47px -41px rgba(255, 255, 255, 0.0) inset;

	color: #fff;
}

.live-code.open > a > i.expand {
	float: right;
	width: 11px;
	margin-top:-2px;
	height: 16px;
	opacity: 0.25;
	background: url(../img/collapse-icon.png) no-repeat left top;
	background-size: 11px;

	-webkit-transition: opacity 0.25s ease;
	transition: opacity 0.25s ease;
}

.live-code.open > a:hover > i.expand {
	opacity: 0.8;
}

.live-code.open:hover > a > i.code {
	box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.5) inset,
				0 56px 47px -41px rgba(255, 255, 255, 0.0) inset;
}

.live-code.open > a > i.code {
	border-left-color: transparent;

	-webkit-transition: box-shadow 0.0s ease;
	transition: box-shadow 0.0s ease;
}

.live-code .body {
	position: absolute;
	top: 36px;
	left: 0;
	right: 0;
	bottom: 0;
	overflow: hidden;
}

.live-code pre {
	padding-top: 1em;
}

.live-code code {
	font-family: 'Inconsolata', Courier, monospace;
}

.live-code .body:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 15px;
	z-index: 1;
	
	background-image: -webkit-linear-gradient(left, rgba(248, 251, 252, 0.5) 4px, rgba(248, 251, 252, 0.0));
	background-image: linear-gradient(to right, rgba(248, 251, 252, 0.5) 4px, rgba(248, 251, 252, 0.0));
}

.live-code .body:after {
	content: "";
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: 50px;
	
	background-image: -webkit-linear-gradient(right, rgba(248, 251, 252, 0.5) 25px, rgba(248, 251, 252, 0.0));
	background-image: linear-gradient(to left, rgba(248, 251, 252, 0.5) 25px, rgba(248, 251, 252, 0.0));
}

.live-code .body > .scroll-pane {
	position: absolute;
	overflow: scroll;
	overflow-x: scroll;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;

	background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.05) 1px, transparent 1px);
	background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.05) 1px, transparent 1px);
	background-size: 100% 1.0em;
	background-position: 0 0.8em;
	background-repeat: repeat-y;
	background-attachment: local;
}

.live-code .body > .scroll-pane:focus {
	outline: thin dotted;
}

.live-code .body > .scroll-pane::-webkit-scrollbar {
	visibility: hidden;
}

.live-code .body > .scroll-track {
	position: absolute;
	width: 10px;
	right: 10px;
	top: 10px;
	bottom: 10px;
	z-index: 4;
	

	background-color: rgba(0, 0, 0, .05);
	border: 1px solid rgba(0, 0, 0, .08);

	opacity: 0.01; 

	-webkit-transition: all 0.2s ease;
	border-radius: 5px;
}

.live-code .body > .scroll-track.active,
.live-code .body > .scroll-track.flashed {
	opacity: 0.99;
}

.live-code .body > .scroll-track > .scroll-handle {
	position: relative;
	margin: -1px;
	
	background-color: #F8FBFC;
	border: 1px solid #C4C8C9;
	
	border-radius: 10px;
}

.live-code .body > .scroll-track.active,
.live-code .body > .scroll-track {
	opacity: 0.99;
}


.live-code .body > .scroll-wrapper:hover > .scroll-track {
	opacity: 0.99;
}

.live-code pre {
	margin: 0;
}

.live-code pre ins,
.live-code .new {
	display: inline-block;
	text-decoration: none;

	-webkit-animation: wf-new-code 3s 1 ease-in-out;
	-moz-animation: wf-new-code 3s 1 ease-in-out;
	animation: wf-new-code 3s 1 ease-in-out;
}

.live-code pre ins.scroll,
.live-code .new.scroll {
	-webkit-animation-duration: 4.5s;
	-moz-animation-duration: 4.5s;
	animation-duration: 4.5s;
}

.live-code .selectors {
	display: block;
	padding-left: 15px;
}

.live-code .media-query {
	display: block;
	padding: 0 10px 0 15px;
	margin-bottom: 1em;
	display: none;
}

.live-code .media-query .selectors {
	padding-left: 0;
}

.live-code .media-query.has-styles {
	display: block;
}

.live-code .media-query .media-text {
	color: #B285D3;
	white-space: nowrap;
}

.live-code .media-query .media-text .query {
	color: #924ABC;
}

.live-code .selector {
	padding: 0em 7px;
	margin-left: -7px;
	margin-bottom: 1em;
	display: none;
}

.live-code .selector.has-styles {
	display: block;
}

.live-code .selector .sel-text {
	color: #C15D5D;
	white-space: nowrap;
}

.live-code .selector .sel-body {
}

.live-code .selector .multi-value {
	padding-right: 25px;
}

.live-code .token.punc {
	color: #888;
}

.live-code .token.name {
	color: #3D3D3D;
}

.live-code .token.value {
	color: #005CA0;
}

.live-code .token.sep {
	color: #999;
}

.live-code .comment {
	color: #ddd ! important;
}

.feedback-link {
	width:100%;
	display: inline-block;
	padding: 15px 10px;
	margin-top: 51px;

	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 19px;
	line-height: 20px;

	color: #fff;
	text-align: center;
	text-shadow: 0 -1px 0px rgba(0, 0, 0, 0.27);


	background-color: #F46E60;
	border-radius: 5px;

	text-decoration: none;

	box-shadow: #FFA69F 0px 1px 0px 0px inset,
				rgba(255, 255, 255, 0.0) 0px 67px 67px -40px inset,
				#C95B4F 0px 1px 0px 0px;

	-webkit-transition: box-shadow 80ms ease-in-out, border-color 80ms ease-in-out;
	transition: box-shadow 80ms ease-in-out, border-color 80ms ease-in-out;

}

.feedback-link:hover {

	border-color: rgba(47, 121, 196, .7);

	box-shadow: #FFC0BD 0px 1px 0px 0px inset,
				rgba(255, 255, 255, 0.2) 0px 67px 67px -40px inset,
				#C95B4F 0px 1px 0px 0px;
}

.tutorial-link {
	display: inline-block;
	position: relative;

	margin-bottom: 30px;

	color: #fff;
	text-align: center;
	text-decoration: none;
}

.tutorial-link img {
	pointer-events: none;
	border-radius: 5px;
	width: 100%;
}

.tutorial-link .play {
	pointer-events: none;

	position: absolute;
	left: -webkit-calc(50% - 49px);
	left: calc(50% - 49px);
	
	top: -webkit-calc(50% - 37px);
	top: calc(50% - 37px);

	width: 98px;
	height: 74px;

	background-color: #8f959d;
	background-image: url(../img/play-icon.png);
	background-position: 54% 50%;
	background-repeat: no-repeat;
	background-size: 28px;

	border-radius: 5px;

	box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5),
				0 1px 1px 0 rgba(255, 255, 255, 0.5) inset;

	opacity: 0.9;

	-webkit-transition: box-shadow 0.25s ease, opacity 0.25s ease;
	transition: box-shadow 0.25s ease, opacity 0.25s ease;
}

.tutorial-link:hover .play {
	box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.7),
				0 1px 1px 0 rgba(255, 255, 255, 0.5) inset;

	opacity: 1.0;
}

	
@media (min-width: 768px) and (max-width: 979px) {
	.feedback-link {
		margin-top: 112px;
	}
}

@media (max-width: 767px) {
	.feedback-link {
		margin-top: 0px;
		width:auto;
		min-width:307px;
	}

	.tutorial-link {
		margin-bottom: 60px;
	}

	.tutorial-link img {
		width: 307px;
	}

	.live-code > a {
		min-height: 37px;
		height:auto;
		line-height: 14px;
	}
}

@media (max-width: 480px) {
	.feedback-link {
		min-width:0;
		width:100%;
	}

	.tutorial-link img {
		width:100%;
	}

	.live-code > a {
		font-size: 14px;
	}
}

.wf-editing-text {
  outline: 1px solid rgba(0, 164, 255, 0.85);
  outline-offset: 6px;
  box-shadow: 0 0 12px 5px rgba(0, 164, 255, 0.25);
  position: relative;
  z-index: 2;
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}
body.wf-xray-on * {
  outline: 1px solid rgba(0, 0, 0, 0.1);
  outline-offset: -1px;
}
body.wf-xray-on .wf-control * {
  outline: none;
}
body.wf-show-affected .wf-affected {
  outline: 2px solid rgba(255, 0, 0, 0.9);
  outline-offset: 3px;
}
body.wf-show-pos-parent .wf-pos-parent {
  outline: 2px solid rgba(255, 0, 0, 0.9);
  outline-offset: 1px;
}
body.wf-design-mode .wf-updating,
body.wf-design-mode .wf-affected {
  -webkit-transition: none ! important;
  -moz-transition: none ! important;
  transition: none ! important;
}
[contenteditable] {
  outline: none;
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}