/* @override http://82.173.134.236/AppFuseTutorial/themes/Bright/style.css */

/*
	Defines the style of HTML Output. To be used in conjunction with `../lib/webpreview.sh`.
	
	In Flux: http://macromates.com/wiki/Suggestions/StylingHTMLOutput
	
	I'm not sure whether all the styles should really go in here or if we leave the css in the bundles and include them dynamically. I've copied all things here to make it easier for me mostly while experimenting.
	— Soryu
*/

/* =================== */
/* = General Styling = */
/* =================== */
body {
	margin: 0;
	padding: 0;
	color: #000;
	font: 13px "Trebuchet MS", Helvetica, sans-serif;
}
#tm_webpreview_header {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;

	color: #FFFFFF;
	font-size: 200%;
}
#tm_webpreview_header #gradient {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;

	margin: 0;
	padding: 0;
	width: 100%;
	height: 2.6em;
}
#tm_webpreview_header .headline {
	position: relative;
	z-index: 3;
	margin: 0;

	padding-left: 1em;
	padding-top: 1ex;
	font-variant: normal;
	text-shadow: rgba(189,159,245,0.8) 3px 3px 4px;
}
#tm_webpreview_header #teaser {
	position: absolute;
	top: 0px;
	right: 0px;
	z-index: 2;

	margin: 0;
	padding: 0;
	height: 2.4em;
	width: 2.4em;
	text-shadow: #000000 0 0 0;
}
#tm_webpreview_header #actions {
	position: absolute;
	top: 2.3em;
	right: 0.5ex;
	
	z-index: 3;
	
	font-size: 8pt;
}
#tm_webpreview_header .type {
	position: absolute;
	top: 3em;
	right: 6em;
	z-index: 2;

	color: rgba(189,159,245,0.8);
	font-size: 8pt;
	font-weight: light;
	text-shadow: #000000 1px 1px 1px;
}
#theme_switcher {
	position: absolute;
	top: 1em;
	right: 6em;
	z-index: 4;

	font-size: 50%;
	opacity: 0.1;
}
#theme_switcher:hover {
	opacity: 1;
}
#tm_webpreview_footer {
	position: fixed;
	bottom: 0px;

	width: 100%;
	height: 1.6em;

	margin: 0;
	padding: 0.3em 2em 0 2em;

	color: #777;
	background: #292929;
	text-shadow: #000 1px 3px 3px;

	border-top: 2px solid #000;
}
#tm_webpreview_footer p {
	margin: 0;
	padding: 0;
}

#tm_webpreview_content {
	padding: 0.5em 2em 0.5em 2em;
	margin-top: 6em;
}

#tm_webpreview_content :first-child {
	margin-top: 0;
}

a {
	color: #535cc1;
	text-decoration: none;
	text-shadow: rgba(47,0,253,0.35) 2px 2px 2px;
}

h1 {
	font-family: "Lucida Grande", Lucida, Verdana, sans-serif;*

	color: rgba(0,0,0,0.8);
	text-shadow: rgba(34,25,50,0.8) 3px 3px 3px;
}

h2 {
	color: #222;
	text-shadow:  #DDDDDD 3px 3px 5px;
}

h3 {
	color: #333;
		font-weight: bold;
	font-style: italic;
}

em {
	font-variant: normal;
	font-style: italic;
	opacity: 0.75;
}

h4 {
	color: #666;
	margin-top: 1ex;
	margin-bottom: 1ex;
}

blockquote {
/*	font-family: "Palatino", "Book Antiqua", Verdana;*/
	font-style: italic;
/*	font-size: 106%;*/
	border-left: 4px solid #E6E5DD;
	color: #FFF;
	
	margin: 1em 25px;
	padding-left: 1em;
}

code {
	color: #676600;
	font-variant: normal;
	font-weight: normal;
	font-style: normal;
}

pre {
	color: #FFF;
	background-color: #eeeeee;
	padding: 10px 10px 10px 20px;
	word-wrap: break-word;
	white-space: pre;
	white-space: pre-wrap;
	white-space: -moz-pre-wrap;
	white-space: -o-pre-wrap;
	border: 1px solid #cccbba;
	font: normal 10px "Monaco", "LuxiMono", "Bitstream Vera Sans Mono", "Courier New", monospace;
}


.pro_table {
	font-size: 12px;
	border-top: 1px solid #919699;
	border-left: 1px solid #919699;
}
.pro_table th {
	font-weight: bold;
	padding: 4px 8px 4px 8px;
	text-align: left;
	background: #E2E2E2;
	border-bottom: 1px solid #919699;
	border-right: 1px solid #919699;
}
.pro_table td {
	border-bottom: 1px solid #919699;
	border-right: 1px solid #919699;
	padding: 8px;
	vertical-align: top;
}
.pro_table p {
	margin: 0;
}
.pro_table p + p {
	margin-top: 1em;
}

li > p {
	margin: 1ex 0 1ex 0;
}

.footnote {
	color: #525151;
	vertical-align: top;
	font-size: 75%;
	font-weight: bold;
	text-decoration: none;
}
.footnote:before {
	color: #525151;
	content: "[";
	vertical-align: top;
	font-weight: bold;
}
.footnote:after {
	color: #525151;
	content: "]";
	vertical-align: top;
	font-weight: bold;
}

div.footnotes {
   background: #F0F0F0;
   padding: 1em;
   font-size: 90%;
}

td, .dark th {
	color: #000;
}

hr {
	background: #606060;
	color:  #606060;
	border-style: solid;
	border-color: #606060;
	border-width: 1px 0 0 0;
	margin-top: 0;
}

caption, .dark label {
	color: #CCC;
}

.alternate {
	background-color: #F0F0F0;
}
