share/docroot_duckpan/duckpan.css
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

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

strong, b {
    font-weight: bold;
}

em, i {
    font-style: italic;
}

blockquote, q { quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after { content: ""; content: none; }

ins { background-color: #ff9; color: #000; text-decoration: none; }

mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }

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

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

input, select { vertical-align: middle; }


/**
 * Font normalization inspired by YUI Library's fonts.css: developer.yahoo.com/yui/
 */

body { font:15px/1.5 sans-serif; *font-size:small; } /* Hack retained to preserve specificity */
select, input, textarea, button { font:99% sans-serif; }

/* Normalize monospace sizing:
   en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome */
pre, code, kbd, samp { font-family: monospace, sans-serif; }


/**
 * Minimal base styles.
 */

/* Always force a scrollbar in non-IE */
html { overflow-y: scroll; }

/* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active { outline: none; }

ul, ol { margin-left: 2em; }
ol { list-style-type: decimal; }

/* Remove margins for navigation lists */
nav ul, nav li { margin: 0; list-style:none; list-style-image: none; }

small { font-size: 85%; }
strong, th { font-weight: bold; }
em { font-style: italic; }

td { vertical-align: top; }

/* Set sub, sup without affecting line-height: gist.github.com/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

pre {
  /* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */
  white-space: pre; white-space: pre-wrap; word-wrap: break-word;
  padding: 15px;
}

textarea { overflow: auto; } /* www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ */

.lt-ie8 legend { margin-left: -7px; } 

/* Align checkboxes, radios, text inputs with their label by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css  */
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.lt-ie8 input[type="checkbox"] { vertical-align: baseline; }
.lt-ie8.lt-ie7 input { vertical-align: text-bottom; }

/* Hand cursor on clickable input elements */
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea { margin: 0; }

/* Colors for form validity */
input:valid, textarea:valid   {  }
input:invalid, textarea:invalid {
   border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red;
}
.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }


/* These selection declarations have to be separate
   No text-shadow: twitter.com/miketaylr/status/12228805301 */
::-moz-selection{ background: #de3c10; color:#fff; text-shadow: none; }
::selection { background:#de3c10; color:#fff; text-shadow: none; }

/* j.mp/webkit-tap-highlight-color */
a:link { -webkit-tap-highlight-color: #de3c10; }

/* Make buttons play nice in IE:
   www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ */
button {  width: auto; overflow: visible; }

/* Bicubic resizing for non-native sized IMG:
   code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
.lt-ie8 img { -ms-interpolation-mode: bicubic; }
 
/* End Reset */
/* Global Fonts & Colours */
body, select, input, textarea, button { font-size: 0.9em; }
body { color: #444; background: #fff; }
	body.texture { background: #fefefe url('../img/bg-body-texture.jpg'); }
body, select, input, textarea, button, .sans, .account-form h2, .account-form h4, .site-header h2, .site-header h3, .callout-box h2, .content-box .head h2, .callout-row h3, .duckpan h1, .duckpan h2  { 
	font-family: "Helvetica Neue","Segoe UI","Nimbus Sans L","Liberation Sans","Open Sans",FreeSans,Arial,sans-serif; 
}

a, .fakelink { color: #3262b4; text-decoration: none; }

/* 
	Global Elements 
*/

html, body { min-height: 100%; height: 100%;}

#wrapper { width: 100%; min-height: 100%; overflow: hidden; position: relative; }

h1, h2, h3, h4, h5, h6, .headfont { 
	font-family: "Proxima Nova",ProximaNova,Segoe,Segoe UI,Frutiger,"Frutiger Linotype","Myriad Pro",Myriad,Univers,Tahoma,"Gill Sans","Gill Sans MT","DejaVu Sans Condensed","Liberation Sans","Nimbus Sans L",Geneva,"Helvetica Neue",Helvetica,Arial,sans-serif;	
}

h1, h2, h3, h4, h5, h6 {	
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
	position: relative;
	display: block;
	font-weight: normal;
	line-height: 1;
}
h1, .h1 { font-size:36px; color: #48505b; letter-spacing: -0.07em; text-align: center; }
h2 , .h2{ font-size:24px; }
h3 , .h3{ font-size:20px; } 
h4, .h4 { font-size:18px; }
h5, .h5 { font-size:16px; }
h6, .h6 { font-size:14px; font-weight: normal; }

h1, h2, h3, h4, h5, h6 { margin: 0 auto 10px; }
h1 { margin: 30px auto 40px; }	
p, ul { margin: 0 auto 18px; }
img { max-width: 100%; }

hr { border: none; background: #e8e8e8; display: block; height: 1px; margin: 18px auto; }

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { text-decoration: none; }

pre {	
	margin: 0 10px 18px 0; 
	overflow: auto;
	color: #fafafa;
	background: #333;
	padding: 0;		
    -webkit-border-radius: 4px;
    border-radius: 4px;
	background-clip: padding-box;
	-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.5);
    box-shadow: inset 1px 1px 2px rgba(0,0,0,0.5);
	text-shadow: 0 -1px 0 #000;
	-moz-tab-size: 1;
	-o-tab-size: 1;
	tab-size: 1;
	-ms-word-break: normal;
	word-break: normal;
	word-break: normal;
	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
	position: relative;
}

pre code {
	padding: 11px 8px 11px 0; 
	background: none;
	white-space: pre;
	overflow: auto;
	display: block;
}

/* 	
	Semantic Helper Classes 
*/

.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.mid, .intro-message { text-align: center; }
.hide { display: none; }
.allcaps { text-transform: uppercase; }
.no-js .no-js-hide, .js .js-hide { display: none !important; }

/* 
	'Grids' & Sizes 
*/

.half, .third, .twothird, .quarter, .threequarter, .sixth, .eighth { 
	float: left; 
	position: relative; 
	/* Just in case someone tries to get cute and add padding to grid elements... */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}
.half { width: 50%; }
.third { width: 33.3%; }
.twothird { width: 66.6%; }
.quarter { width: 25%; }
.threequarter { width: 75%; }
.sixth { width: 16.6%; }
.eighth { width: 12.5%; }

.grid-pad { 
	/* for when you *intentionally* want to break the grid with padding */
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	-ms-box-sizing: content-box;
	-o-box-sizing: content-box;
	box-sizing: content-box;
}

.content-wrap {
	width: 100%;
	min-width: 600px;
	max-width: 960px;
	margin: auto;	
	position: relative;
}

/* clearfix */
.group:after, .wrap:after, .breadcrumb-nav:after, .content-box .head:after, .content-box .row:after  {
  content: "";
  display: table;
  clear: both;
}

/*--------------------------------------------------
Buttons
-------------------------------------------------- */	
	
.button, a.button, input.button {
	text-align: center; 
	padding: 0;
	display: block; 
	position: relative;
	border: 1px solid #babec9;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	text-shadow: 0 1px 1px #fff;
	background-color: #f8f8f8;
	font-weight: bold;
	color: #474747;
	cursor: pointer;
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 1px 1px rgba(0,0,0,0.1);
}
	.half .button, .third  .button, .twothird  .button, .quarter .bntton, .sixth .button { 
		width: 95%; margin: 0 2.5%; 
	}	
		.input-wrap .button { width: 100%; margin: 0 auto;}		
	
	.button:hover {
		background-color: #fff;
	}	
		.input-wrap .button:hover {
			border: 1px solid #59a1ed; 
			-moz-box-shadow: 0 0 5px #59a1ed;
			-webkit-box-shadow: 0 0 5px #59a1ed;
			box-shadow: 0 0 5px #59a1ed;
		}
	.button:active {		
		background-color: #eee;		
	}
	.button.red {
		color: #fff;
		background-color: #d84736;
		border-color: #ae2419;
		text-shadow: 0 -1px 0 rgba(0,0,0,0.1);
	}
		.button.red:hover { background-color: #c43429; }
		
	.button.darkblue {
		color: #fff;
		background-color: #6b7b94;
		border-color: #395c72;
		text-shadow: 0 -1px 1px #3d4751;
	}
	.button.blue {
		color: #fff;
		background-color: #4b8df8; 
		border-color: #2c478f;
		text-shadow: 0 1px 1px #3769b8;
	}	
	.button.blue:hover, .button.darkblue:hover { 
		background-color: #277adb; 		
	}
		.input-wrap .button.blue:hover, .input-wrap .button.darkblue:hover{
			border-color: #2c478f;
			-moz-box-shadow: 0 0 5px #666;
			-webkit-box-shadow: 0 0 5px #666;
			box-shadow: 0 0 5px #666;
		}

/* 
	Header
*/
.site-header { 
	position: relative;
	overflow: hidden;
	min-height: 57px;
	width: 100%;
	border-bottom: 1px solid #bdbdbd;
	box-shadow: inset 0 0 1px rgba(255,255,255,0.1), 0 1px 1px rgba(0,0,0,0.1);
	background: #e9e9e9;	
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YzZjNmMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlMmUyZTIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #f3f3f3 0%, #e2e2e2 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f3f3f3), color-stop(100%,#e2e2e2));
	background: -webkit-linear-gradient(top,  #f3f3f3 0%,#e2e2e2 100%);
	background: -o-linear-gradient(top,  #f3f3f3 0%,#e2e2e2 100%);
	background: -ms-linear-gradient(top,  #f3f3f3 0%,#e2e2e2 100%);
	background: linear-gradient(to bottom,  #f3f3f3 0%,#e2e2e2 100%);
	-pie-background: linear-gradient(to bottom,  #f3f3f3 0%,#e2e2e2 100%);
}
	.site-header .content-wrap { overflow: hidden; }
	.header-logo { width: 300px; float: left; }
		.header-logo .logo { 
			width: 46px;
			height: 46px; 
			padding: 6px 19px 0 0;
			float: left;			
		}
		.header-logo h2, .header-logo h3 { line-height: 1; margin: 0; text-align: left; position: relative; float: left; }
		.header-logo h2 { color: #4c4c4c; font-weight: bold; font-size: 21px; padding-top: 10px; left: -1px; }
			.header-logo h2 i { font-style: normal; color: #419503; }
		.header-logo h3 { color: #606060; font-weight: normal; padding-top: 4px; font-size: 12px; }
	
	
	.header-nav { float: left; text-align: center; }
		.header-nav ul { 
			list-style: none; 
			float: left;
			margin: 0; 
			padding: 0;			
			/*
			border-left: 1px solid #d5d5d5;
			border-right: 1px solid #f3f3f3;		
			*/
			}
		.header-nav li { 
			display: inline-block; 
			list-style: none; 
			padding: 0; 
			margin: 0 0 0 -1px;
			float: left;
		}
		.header-nav a { 
			display: block; 
			color: #606060; 
			padding: 20px 22px 21px; 
			font-size: 16px;
			line-height: 1; 
			text-shadow: 0 1px 0 #fff;
			border-left: 1px solid transparent;
			border-right: 1px solid #d5d5d5;
			box-shadow: 1px 0 0 #f3f3f3;
		}
			.header-nav .nav-home a { border-left: 1px solid #d5d5d5; }
			
		.header-nav .active a, .header-nav a:hover, .page-home .nav-home a, .page-blog .nav-blog a  { 
			color: black; 
			background: #cdcdcd; 			
			border-left-color: #bbb;
			border-right-color: #bbb;
			text-shadow: 0 1px 0 rgba(255,255,255,0.5);
		}
			.page-home .header-nav ul { border-left-color: #c3c3c3; }
			
/* 
	Site Content
*/

.site-main { position: relative; overflow: hidden; padding: 15px 0 72px; }		
	.intro-message { max-width: 90%; line-height: 1.38; margin: -30px auto 40px; }
		.page-home .intro-message { max-width: 85%; }		
	.disclaimer{ padding: 0 17px; margin: 28px auto; }
		.disclaimer h6, .disclaimer p{ font-size: 0.8em; line-height: 1.52; margin: 0; }

/* not currently needed - set to display: none */		
.breadcrumb-nav { padding-bottom: 10px; min-height: 26px; display: none; }	
	.breadcrumbs { float: left; font-size: 0.9em; }
	.breadcrumbs a { border-bottom: 1px solid #3262b4; }

/* extra top margin because no breadcrumb nav */		
.content-box {
	position: relative;
	margin: 10px auto 18px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-webkit-background-clip: padding-box; 
	background-clip: padding-box;		
}
	.content-box .head { 
		background: #ffde85;
		color: #484438;
		border: 1px solid #d8be74;
		padding: 9px 8px 9px;
		-webkit-border-radius: 5px 5px 0 0;
		border-radius: 5px 5px 0 0;
		-webkit-background-clip: padding-box; 
		background-clip: padding-box;
		margin-bottom: -1px;
	}
		.content-box .head h2, .content-box .head h3, .content-box .head h4, .content-box .head h5 { 
			display: inline-block;
			padding: 3px 0 2px 10px; 
			margin: 0; 
			font-weight: normal; 
			font-size: 20px; 
		}
		.content-box .head i[class*='icon'] { 
			color: #be9c43; 
			text-shadow: -1px 0 1px rgba(255,255,255,0.1);
			padding-left: 8px;
			font-size: 90%;
			position: relative;
			top: -2px;
		}
		
	.content-box .body {
		color: #color: #48505b;
		background: #fff;
		border: 1px solid #d7d7d7;
		border-top: none;
		-webkit-border-radius: 0 0 5px 5px;
		border-radius: 0 0 5px 5px;
		-webkit-background-clip: padding-box; 
		background-clip: padding-box;	
	}
	.content-box .row {
		clear: both;
		border-top: 1px solid #d7d7d7;
		padding: 8px 8px 8px 18px;
		position: relative;
	}	
		.content-box .row .row {
			padding: 8px 0;
			border: none;
		}
		
	.content-box .button {
		height: 28px; 
		line-height: 28px;
	}
		.content-box input.button { line-height: 18px; }
	
/*
	Site Bottom
*/
.site-bottom {
	background: #f4f4f4 url('../img/bg-site-bottom-texture.jpg');
	border-top: 1px solid #d4d4d4;
	box-shadow: inset 0 1px 0 (255,255,255,0.3);
	padding: 25px 0;
	overflow: hidden;
}
	.site-bottom .nav-col { padding-left: 25px; }
		.site-bottom h4 { margin: 0 0 16px; color: #565656; font-size: 1em; }
		.site-bottom ul { list-style: none; padding: 0; margin: 0; font-size: 0.95em; }
		.site-bottom li { list-style: none; margin: 0 0 6px; padding: 0; line-height: 1; }
		.site-bottom a { color: #3364b3; }
	
/* 
	Site Footer
*/
.site-footer {
	background: #2b2b2b;
	color: #c3c3c3;
	padding: 12px 0 25px; 
	overflow: hidden;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
}	
	.site-footer a { color: #93beff; }
	.site-footer p { margin-bottom: 0; padding-left: 25px; }
	.footer-nav a { display: inline-block; padding-right: 16px; }

.duckpan .body h1, .duckpan .body h2 { 
	margin: 10px 10px 5px 0; 
	padding-bottom: 8px;
	text-align: left; 
	font-weight: bold; 
	overflow: hidden;
	border-bottom: 1px solid #d7d7d7;
}
.duckpan h1  { font-size: 20px; }
	.duckpan h1.cdh-index-dist-name { margin-top: 0; }
.duckpan h2 { font-size: 16px; }
.duckpan h3 { font-size: 17px; margin-bottom: 8px; }
	
.duckpan h1 + pre, .duckpan h2 + pre, .duckpan h3+ pre {
	margin-top: 10px;
}
	
.duckpan #index {
	float: right;
	list-style: none;
	margin: 10px 10px 18px 18px;
	border: 1px solid #d7d7d7;
	background: #fff;	
	padding: 10px 0;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	position: relative;
	z-index: 2;
}
	.duckpan #index li { list-style: none; }
		.duckpan #index li a { display: block; padding: 0 16px; font-size: 12px; }
	.duckpan #index ul { margin: 0; width: 100%; padding: 2px 0; }
		.duckpan #index ul li { padding-left: 1.25em; }
		
	
/* 
	Media Queries
*/
@media only screen and (max-width: 1060px) {
	.topmsg + .content-wrap h1 { max-width: 85%; }
}
@media only screen and (max-width: 887px) {
	.header-logo { width: 220px; }
		.header-logo.wide { width: 300px; }
}
@media only screen and (max-width: 788px) {
	.site-main .content-wrap { width: 98%; }	
	.topmsg { zoom: 0.85; }
	.header-nav { clear: both; float: none; padding-top: 4px;}
		.header-nav ul { float: none; }
		.header-nav li { 
			width: 25%; /* assuming 4 nav items */ 
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			-ms-box-sizing: border-box;
			-o-box-sizing: border-box;
			box-sizing: border-box;
		}
		.header-nav a { 
			border-top: 1px solid #d5d5d5;
			padding-left: 0;
			padding-right: 0;
			width: 100%;
		}
}
@media only screen and (max-width: 600px) {	
	.palm-hide { display: none; }	
	body, .content-wrap {
		min-width: 320px;
	}		
	.wrap, .half, .third, .twothird, .quarter, .threequarter, .sixth  { width: 100%; float: none; margin: 0 auto;}	
		.half.palm-half { width: 50%; float: left; }
		.half .half { width: 100%; }	
		
	.site-bottom .nav-col { padding-left: 0; text-align: center; }
		.nav-col h4 { font-size: 17px; padding-top: 14px; }
		.nav-col li { display: inline-block; padding: 0 7px; }
}

@media only screen and (max-width: 430px) {
/*
	.loggedin .header-logo, .header-account-info { float: none; clear: both; margin: 0 auto; }
		.loggedin .header-logo { width: 14.8em; }
		.header-account-info { width: 13em; }
			.header-account-info .user-avatar { margin-right: 19px; }
*/	
	.half { width: 95%; }
	.header-nav ul { border: none; border-top: 1px solid #d5d5d5;}
	.header-nav li { width: 100%; float: none; clear: both; }
	.header-nav ul li a { 
		border-left: none; 
		border-right: none; 
		padding: 11px 0; 
		border-top: 1px solid #f3f3f3;
		border-bottom: 1px solid #d5d5d5;
	}

}

@media only screen and (max-width: 521px) {
	.duckpan #index {
		float: none;
		margin: 10px 10px 18px 0;
	}
}
