/* @group Article List */

div.detailedArticleList div.article {
	clear: both;
	overflow: hidden;
	
	margin: 12px 0px 12px 0px;
    padding: 10px;
    
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.04);
    border-bottom-color: rgba(0, 0, 0, 0.12);
    
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), inset 0 1px 0px rgba(255, 255, 255, 0.7);
      -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), inset 0 1px 0px rgba(255, 255, 255, 0.7);
           box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), inset 0 1px 0px rgba(255, 255, 255, 0.7);

    background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.09));
    background-image:    -moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.09));
    background-image:         linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.09));
}


div.detailedArticleList div.article div.image {
	float: left;
	width: 100px;
	margin-right: 20px;
	text-align:center;
}


div.detailedArticleList div.article div.image.qlink { /*width:24px; margin-right:16px;*/ }
div.detailedArticleList div.article div.image.qlink > img { width:24px; height:24px; }


div.detailedArticleList div.article div.info {
	float: left;
	width: 460px;
}

div.detailedArticleList div.article div.info p.title {
	font-weight: bold;
	font-size: 14px;
	padding-bottom: 0;
}


div.detailedArticleList div.article div.info p.author {
	font-weight: bold;
}


div.detailedArticleList div.article div.info span.date {
	font-weight: normal;
	color: #555;
	font-size: 90%;
}


div.detailedArticleList div.article div.info p.title a {
	/*color: blue;*/
}

/* @end */




/* @group Article Styles */

/* The selectors for these styles are specific to the implementation of the articles in the Qwil example site. This is primarily about page layout and style. It does not have anything to do with the styles of the aricle content markup. See the file qwil_markup for that. */

/* @group Structures */

div.qwilArticleList p { 
	line-height: 140%;
	}

div.qwilCredits { 
	padding-bottom: 10px; 
	}

div.qwilCredits p { 
	padding-bottom: 0px; 
	}

div.qwilCredits span.author { 
	font-weight: bold;
	font-size: 120%;
}

div.qwilCredits span.publishDate { 
	color: #919191;
	font-size: 110%;
}







div.qwilToCOuter { 
	margin: 20px;
	overflow: hidden;
	width: 240px;
	float: right;
	}

div.qwilArticle div.qwilToCOuter div.qwilToC {
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	padding: 2px 0 2px 4px;
}

div.qwilArticle div.qwilToCOuter div.qwilToC > ul,
div.qwilArticle div.qwilToCOuter div.qwilToC > ol {
	margin-bottom: 0;
	padding-bottom: 0;
}

.qwilArticle .qwilToCPrevNext {
	float:right;
}

.qwilArticle .qwilToCOuter span.qwilToCTitle {
	/*margin-left: -20px;*/
	font-weight: bold;
}

div.qwilToC li { 
	padding-bottom: 0px; 
}
	
div.qwilToC li.current { 
	font-weight: bold;
}










div.qwilStory { 
	padding-top: 10px;
	/*border-top: 1px dotted #a28d61; */
	overflow: hidden;
	}

div.qwilPrev{
	display: block;
	float: left;
	width: 50%;
	padding-bottom: 30px;
	text-align: left;
	overflow: hidden;
	}

div.qwilNext{
	display: block;
	float: left;
	width: 50%;
	padding-bottom: 30px;
	text-align: right;
	overflow: hidden;
	}

div.qwilDiscuss { 
	clear: both;
	/*width: 480px;*/
	border-top: 1px dotted #a28d61; 
	overflow: hidden;
	}

/* @end */


/* @group Text */


div.qwilArticle {
	font-family: Helvetica, "Lucida Grande", Lucida, Verdana, Helvetica, sans-serif;
	font-size: 12px; 
	line-height: 19px; 
	color: black; 
	color: rgb(63, 63, 63);
	}

div.qwilArticle a { 
	text-decoration: none; 
	color: #8e373c;
	}

div.qwilArticle a:hover { 
	color: #244dc2; 
	}

div.qwilArticle h1, 
div.qwilArticle h2, 
div.qwilArticle h3,
div.qwilArticle h4 { 
	font-family: "Lucida Grande", Lucida, Verdana, Helvetica, sans-serif;
	font-weight: bold; 
	line-height: 125%; 
	text-transform: none;
	letter-spacing: normal;
	padding: 0; 
	/*clear: both;*/
	}
	
div.qwilArticle h1 { color: #a73833 }
div.qwilArticle h2 { color: #3c5a72 }
div.qwilArticle h3 { color: #446688 }
div.qwilArticle h4 { color: #444; }
div.qwilArticle h5, h6 { color: black }

div.qwilArticle h1 { 
	font-size: 28px; 
	margin-bottom: 14px;
	}

div.qwilArticle h2 { 
	padding-top: 30px;
	margin-bottom: 10px;
	font-size: 22px; 
	border-bottom: 1px dashed rgba(0, 0, 0, 0.15);
	}

div.qwilArticle h3 { 
	padding: 20px 0 8px 0; 
	font-size: 18px; 
	}

div.qwilArticle h4 { 
	padding: 10px 0 6px 0;
	font-weight: bold; 
	font-size: 14px; 
	}

div.qwilArticle p { 
	padding: 0px 0px 10px 0px; 
	}

div.qwilArticle div.downloadAsset {
	padding: 0px 0px 8px 0px;
	margin-left: 16px;
}

div.qwilArticle div.downloadAsset p {
	vertical-align: middle;
	display: inline;
}

div.qwilArticle div.downloadAsset img {
	vertical-align: middle;
}


div.qwilArticle span.downloadSize { 
	color: #999999; 
	}

div.qwilArticle ul { 
	margin: 0 0 15px 6px; 
	padding-left: 15px; 
	list-style-type: square; 
	list-style-position: outside; 
	}

div.qwilArticle ol { 
	margin: 0 0 15px 6px; 
	padding-left: 15px; 
	}

div.qwilArticle li { 
	margin-left: 0; 
	padding-left: 0; 
	padding-bottom: 2px; 
	}


/* @end */

/* @group Comment Display */

div.commentEntry {
	padding: 10px 0 10px 0;
	overflow: hidden;
	
	border: 1px solid #e6e6e6;
	border-radius: 4px;
	margin: 12px 8px 12px 8px;
}


div.commentEntry .author {
	float: left;
	margin-left: 4px;
	margin-right: 10px;
	text-align: center;
	width: 120px;
}

div.commentEntry .author img {
	margin-top: 10px;
	margin-bottom: 10px;
}


div.commentEntry .author .name {
	display: block;
	
	background-color: #EEE;
	background-image: -webkit-linear-gradient(top, rgb(220, 220, 220) rgb(247, 247, 247));
	background-image:    -moz-linear-gradient(top, rgb(220, 220, 220) rgb(247, 247, 247));
	background-image:         linear-gradient(top, rgb(220, 220, 220) rgb(247, 247, 247));
	
	border: 1px solid #bfbfbf;
	border-radius: 4px;
	
	color: #444;
	font-size: 10px;
	font-weight: bold;
	text-align: left;
	
	width: 108px;
	height: 15px;
	line-height: 15px;
	
	padding: 2px 5px 2px 5px;
}


div.commentEntry .author .name a {
	color: #444;
	text-decoration: none;
}

div.commentEntry .body {
	float: left;
	margin-left: 10px;
	min-height: 60px;
	overflow: hidden;
	width: 440px;
}


div.commentEntry .body .header {
	border-bottom: 1px dotted #DDD;
	margin-top: 0px;
	padding-bottom: 1px;
	margin-bottom: 5px;
	
	height: 20px;
}


div.commentEntry .body .header .title {
	display: block;
	float: left;
	
	font-size: 10px;
	font-weight: bold;
	color: #666;
}


div.commentEntry .body .header .date {
	display: block;
	float: right;
	
	font-size: 10px;
	color: #999;
}


/* @end */

/* @group Comment Form */

div.qwilDiscuss textarea.qwilDiscussStory { 
	height: 200px;
	}

div.qwilDiscuss div.buttonBar { 
	padding: 0px 2px 0 0;
	text-align: right; 
	}	

div.qwilDiscuss p.fieldHelp { 
	padding: 0px;
	}

/* @end */



/* @end */





/* @group Qwil Styles */

/* The selectors for these styles are used by Qwil in the StylizeText class for rendering content. */

/* @group Structures */

div.qwilContent .floatLeft { 
	float: left; 
	}

div.qwilContent .floatRight { 
	float: right; 
	}

div.qwilContent div.inset { 
	margin: 10px 0 20px 0;
	padding: 8px;
	background-color: #eeeeee;
	border: 1px solid #dddddd;
	}


/* @group Images */

div.qwilContent img {
	/*margin: 10px;*/
	}

div.qwilContent img.floatRight { 
	clear: both;
	float: right;
	margin: 4px 0 10px 10px; 
	}

div.qwilContent img.floatLeft { 
	float: left;
	margin: 4px 10px 10px 0; 
	}

/* @end */


div.qwilContent div.largeImageAsset,
div.qwilContent div.smallImageAsset {
	margin: 10px;
	padding: 10px;
	overflow: hidden;
	text-align: center;
	border-top: 1px dotted #ccc;
	border-bottom: 1px dotted #ccc;
	}



div.qwilContent div.largeImageAsset.noborder,
div.qwilContent div.smallImageAsset.noborder {
	border: none;
}


div.qwilContent div.largeImageAssetLeft,
div.qwilContent div.smallImageAssetLeft {
	float: left;
	overflow: hidden;
	padding-bottom: 20px;
	padding-right: 20px;
	}

div.qwilContent div.largeImageAssetRight,
div.qwilContent div.smallImageAssetRight {
	float: right;
	overflow: hidden;
	padding-bottom: 20px;
	padding-left: 20px;
	}

div.qwilContent div.imageAsset,
div.qwilContent div.widgetAsset,
div.qwilContent div.sidebarAsset { 
	padding-bottom: 20px;
	overflow: hidden;
	}

div.qwilContent blockquote.pullLeft,
div.qwilContent blockquote.pullRight { 
	float: right;
	width: 200px;
	margin: 4px 0 10px 10px;
	padding: 16px 8px 16px 8px;
	border-top: 4px double rgba(0, 0, 0, 0.15); 
	border-bottom: 4px double rgba(0, 0, 0, 0.15); 
	font-size: 16px;
	overflow: hidden;
	}

div.qwilContent blockquote.pullLeft { 
	float: left;
	margin: 4px 10px 10px 0;
	}
	
div.qwilContent blockquote {
	font-style: italic;
}

/* @end */

/* @group Text */

div.qwilContent p.intro { 
	font-size: 16px; 
	color: #808080; 
	}

div.qwilContent p.synopsis { 
	color: #666666; 
	}

div.qwilContent p.caption { 
	padding-top: 4px;
	color: #666666;
	}

div.qwilContent p.footnote { 
	color: #999999;
	font-family: "Lucida Grande", Verdana, Tahoma, "Luxi Sans", sans-serif; 
	font-size: 12px;
	}

div.qwilContent cite.publication {
	font-style: normal; 
	border-bottom: 1px solid #aaaaaa;
	}

div.qwilContent cite.article {
	font-style: italic; 
	}

div.qwilContent span.small { 
	font-size: 10px; 
	}

div.qwilContent .bold { 
	font-weight: bold; 
	}

div.qwilContent .italic { 
	font-style: italic; 
	}


div.qwilContent .super {
	font-size: 10px;
	vertical-align: super;
	}

div.qwilContent .sub {
	font-size: 10px;
	vertical-align: sub;
	}

div.qwilContent .strike	{
	text-decoration: line-through;
	}

div.qwilContent .filename {
	font-size: 13px;
	font-family: "Lucida Grande", Verdana, Tahoma, "Luxi Sans", sans-serif; 
	color: #666666;
	}
	
div.qwilContent .mono1, 
div.qwilContent .mono2,
div.qwilContent .mono3,
div.qwilContent .mono4 {
	font-size: 12px;
	font-family: Monaco, "Andale Mono", "Luxi Mono", monospace;
	color: #4a4e7d;
	}

div.qwilContent .mono2 {
	color: #57a36d;
	}

div.qwilContent .mono3 {
	color: #597caa;
	}

div.qwilContent .mono4 {
	color: #80579f;
	}

div.qwilContent pre.code,
div.qwilContent pre.codebox,
div.qwilContent pre.terminal {
	width: 97%;
	padding: 6px;
	margin: 10px 0 20px 0;
	border: 1px solid #dddddd;
	font-size: 12px;
	line-height: 120%;
	font-family: "Andale Mono", Monaco, "Luxi Mono", monospace;
	white-space: pre;
	color: #666666;
	overflow: auto;
	}

div.qwilContent pre.codebox {
	height: 200px;
	}

div.qwilContent pre.terminal {
	background-color: black;
	color: #00ff00;
	}

div.qwilContent hr.line { 
	height: 1px;
	border: none;
	border-top: 1px dotted #999999; 
	}

/*

 @end */

/* @end */





div.qwilContent > table { 
	font-size: 11px; 
	color: black;
	background-color: white; 
	border-spacing: 0px 0px; 
	
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, 0.3);
	
	margin-bottom: 10px;
	
	/*-webkit-border-radius: 8px 8px 0px 0px;*/
	-webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);
	   -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);
	        box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);
}


div.qwilContent > table thead { 
	font-family: "Lucida Grande", Lucida, Verdana, Helvetica, sans-serif;
	
	background-color: gray;
	background-image: -webkit-linear-gradient(bottom, rgb(225, 225, 225) rgb(237, 237, 237));
	background-image:    -moz-linear-gradient(bottom, rgb(225, 225, 225) rgb(237, 237, 237));
	background-image:         linear-gradient(bottom, rgb(225, 225, 225) rgb(237, 237, 237));
	
	-webkit-border-radius: 8px 8px 0px 0px;
	   -moz-border-radius: 8px 8px 0px 0px;
	        border-radius: 8px 8px 0px 0px;
}


div.qwilContent > table thead td { 
	font-family: Verdana, "Lucida Grande", Lucida, Helvetica, sans-serif;
	font-weight: bold; 
	font-size: 12px; 
	color: #555;
	text-align: left; 
	text-shadow: 1px 1px 1px white;
	
	padding: 8px 4px; 
	border-bottom: 1px solid #bbb;
}



div.qwilContent > table thead td.sorted { 
	color: black;
	}


div.qwilContent > table thead a { 
	color: #555;
	text-decoration: underline;
	}

div.qwilContent > table thead a:hover { 
	color: #990000; 
	}




div.qwilContent > table tr.altRowA { 
	background-color: white; 
}

div.qwilContent > table tr.altRowB { 
	background-color: rgb(237, 243, 254); 
}



div.qwilContent > table td { 
	padding: 4px 4px 4px 4px; 
	vertical-align: middle; 
	line-height: 130%; 
	}

div.qwilContent > table td.left { 
	text-align: left; 
	}

div.qwilContent > table td.cntr { 
	text-align: center; 
	}

div.qwilContent > table td.right { 
	text-align: right; 
	}

div.qwilContent > table td.sorted { 
	/*background-color: #deded2;*/ 
	}

div.qwilContent > table td.empty { 
	background-color: white; 
	}






div.qwilContent .gallery {
    margin: 20px;
    padding: 10px;
    
    border-top:    1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    
    text-align: center;
}


div.qwilContent .gallery.left {
    float: left;
    
    margin: 0 20px 0 0;
    padding: 10px 10px 10px 10px;
}

div.qwilContent .gallery.right {
    float: right;
    
    margin: 0 0 0 20px;
    padding: 10px 10px 10px 10px;
}




div.qwilContent .gallery-images {
    display: inline;
    margin: 0 auto 0 auto;
}

div.qwilContent .gallery-images img {
    margin: 4px 8px 4px 8px;
/*    -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
       -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
        -ms-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
            box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
*/}



div.qwilContent .gallery.left .gallery-images img, 
div.qwilContent .gallery.right .gallery-images img {
    margin-top: 10px;
    margin-bottom: 10px;
}