@charset "UTF-8";

@font-face {
  font-family: 'Cantora One';
  font-style: normal;
  font-weight: 400;
  src: local('Cantora One'), local('CantoraOne-Regular'), url(http://themes.googleusercontent.com/static/fonts/cantoraone/v2/2Tarv7Qs4oCEU-xItQ7PXYbN6UDyHWBl620a-IRfuBk.woff) format('woff');
}
@font-face {
  font-family: 'PT Serif';
  font-style: normal;
  font-weight: 400;
  src: local('PT Serif'), local('PTSerif-Regular'), url(http://themes.googleusercontent.com/static/fonts/ptserif/v4/sDRi4fY9bOiJUbgq53yZCfesZW2xOQ-xsNqO47m55DA.woff) format('woff');
}

/*-----------------------------------------------------------------------------------*/
/*	resets
/*-----------------------------------------------------------------------------------*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;text-decoration:none;font-weight:400;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}*{outline:none;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-font-smoothing:antialiased;font-smoothing:antialiased}button::-moz-focus-inner{border:0}


/*-----------------------------------------------------------------------------------*/
/*	examples
/*-----------------------------------------------------------------------------------*/

.example {
	padding:40px;
	position:absolute;
	text-align:center;
}

.example .default {
	display:inline-block;
	margin-right:25px;
	z-index:99999;
	position:absolute;
}

.output {
	position:absolute;
	z-index:55555;
	top:80px;
	left:400px;
	box-shadow:0 0 0 100000px rgba(255,255,255,0.9);
}

.newupload {
	border: 3px dashed rgba(0,0,0,0.04);
	background: rgba(0,0,0,0.02);
	width: 320px;
	display: block;
	margin-left:40px;
	margin-top: 40px;
	padding: 20px;
	box-sizing:border-box;
	text-align:center;
	font-family:'PT Serif';
	font-size: 18px;
	color: rgba(0,0,0,0.5);
	cursor:pointer;
}
.newupload:hover {
	background: rgba(0,0,0,0.01);
}

#uploadfile { display:none }


/*-----------------------------------------------------------------------------------*/
/*	main
/*-----------------------------------------------------------------------------------*/

body {
	background: white;
	font-size: 0;
	font-family: 'PT Serif', serif;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Cantora One', sans-serif;
}

article a {
	color:#2394c8;
	border-bottom: 1px solid #eee;
}
article a:hover { color:#2cb6f7 }

article {
	padding:40px;
	display:block;
	position:absolute;
	top: 0;
	left: 370px;
}


/*-----------------------------------------------------------------------------------*/
/*	header
/*-----------------------------------------------------------------------------------*/

h1 { font-size:45px }
h1 em {	color:#8aca4c }

.version{
	font-size: 10px;
	background: #ededed;
	padding: 5px;
	position: relative;
	top: -15px;
	left: 5px;
	color:#888;
}

article header p {
	margin: 15px 0;
	font-size: 20px;
	line-height: 30px;
	color: #888;
}

article .details {
	display: block;
	margin-top: 20px;
	font-size: 14px;
	line-height: 16px;
	color: #888;
}

article del { text-decoration:line-through }


/*-----------------------------------------------------------------------------------*/
/*	sections
/*-----------------------------------------------------------------------------------*/



section {
	padding-top:30px;
	padding-bottom:30px;
}

section h2 {
	font-size:32px;
	padding-bottom:15px;
	margin-bottom:20px;
	border-bottom: 1px solid #eee;
}

section h3 {
	font-size:20px;
	line-height:26px;
	margin:25px 0 15px 0;
}

section h4 {
	font-size:16px;
	line-height:20px;
	margin:15px 0 5px 0;
}

section > p {
	font-size: 16px;
	line-height: 24px;
	color: #4e4e4e;
	margin-bottom:15px;
}

section > ul li {
	list-style-type: square;
	list-style-position: inside;
	font-size: 16px;
	line-height: 24px;
	color: #757575;
}

section strong {
	font-weight: bold;
}
section em {
	font-style: italic;
}
section img {
	margin: 10px 0;
}



.buy {
	margin-top:10px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	-o-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-moz-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	transition: all 0.2s linear;
	height: 40px;
	width: 200px;
	text-align: center;
	color: #fff;
	border: none;
	font-size: 18px;
	font-family:'PT Serif';
	background-color: #ec5d59;
	background-image: -webkit-linear-gradient(top, #ec5d59 0, #c33d36 100%);
	background-image: -moz-linear-gradient(top, #ec5d59 0, #c33d36 100%);
	background-image: -ms-linear-gradient(top, #ec5d59 0, #c33d36 100%);
	background-image: -o-linear-gradient(top, #ec5d59 0, #c33d36 100%);
	background-image: linear-gradient(top, #ec5d59 0, #c33d36 100%);
	-moz-box-shadow: inset 0 2px 5px rgba(0,0,0,0.20), 0 3px 0 0 #94302a, 0 7px 5px rgba(0,0,0,0.10);
	-o-box-shadow: inset 0 2px 5px rgba(0,0,0,0.20), 0 3px 0 0 #94302a, 0 7px 5px rgba(0,0,0,0.10);
	-webkit-box-shadow: inset 0 2px 5px rgba(0,0,0,0.20), 0 3px 0 0 #94302a, 0 7px 5px rgba(0,0,0,0.10);
	box-shadow: inset 0 2px 5px rgba(0,0,0,0.20), 0 3px 0 0 #94302a, 0 7px 5px rgba(0,0,0,0.10);
	text-shadow: #94302a 0 1px 1px;
	cursor:pointer;
	padding:6px 10px;
}

.btn:hover {
  -moz-box-shadow: inset 0 2px 5px rgba(0,0,0,0.20);
  -o-box-shadow: inset 0 2px 5px rgba(0,0,0,0.20);
  -webkit-box-shadow: inset 0 2px 5px rgba(0,0,0,0.20);
  box-shadow: inset 0 2px 5px rgba(0,0,0,0.20);
  color:white;
}
.btn:active {
  -moz-box-shadow: none;
  -o-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  text-shadow: none;
  background: #202020;
}

/* syntax highlight
================================================== */

pre,
code {
	font-family:'Droid Sans Mono', monospace;
	padding:0;
	font-size:12px;
	line-height:14px;
	white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word;
	margin:15px 0 20px 0;
}

pre .nocode {background-color:none;color:#363636}
.str { color: #DD0000; }
.kwd { color: #007700; }
.com { color: #FF8000; font-style:italic; }
.typ { color: #0000BB; }
.lit { color: #0000BB; }
.pun { color: #007700; }
.pln { color: #0000BB; }
.tag { color: #008; }
.atn { color: #606; }
.atv { color: #080; }
.dec { color: #606; }
pre li{list-style-type:decimal;list-style-position:inside;color:#c1c1c1}
pre li:hover{background:#f8fbff}