#main-body ul,ol {
	list-style-position:inside;
	margin:2em;
}
#main-body li {}

.ccpages{text-align:center; padding-top:3px; margin:10px 0 20px 0; clear:both; }
	.ccpages ul {display:inline; padding:0px; margin:0px; }
	.ccpages li {display:inline;list-style:none; text-align:center; margin:2px; }
	.ccpages li a {color:#999; font-weight: 100; font-size: .8em; text-decoration: none; border: 1px #ccc solid; padding:3px 6px 3px 6px; }
	.ccpages li a.last {border:2px #ccc solid;}
	.ccpages li a:hover {background-color: #FF8800; color: #000; font-weight: bold;}
	.ccpages .current {font-weight: bold; font-size: .8em; text-decoration: none; padding-left:2px; padding-right:2px;}
	.ccpages .next a, .ccpages .previous a {border: 1px #fff solid; padding: 3px 6px 3px 6px;  }
	.ccpages .next a:hover, .ccpages .previous a:hover, .ccpages .home a:hover {font-weight:normal;}

.cchopage {
	padding:0 0 50px 0;
	margin:40px 0;
	border-bottom: 1px dotted #CBC2C6; }
	.cchopage .title {
		font: italic 1.8em 'Trebuchet MS',sans-serif; }
	.cchopage .body {}
	.cchopage .body a {
		color: #036; }
	.cchopage .body h2 {
		margin:10px 0;
		font-size:1.2em; }
	.cchopage .more {
		margin:5px 0 0 0;
		font: bold 0.8em Arial;
		text-transform: uppercase; }
		.cchopage .more a {
			color: #067AB4; }
		.cchopage .more a:after {
			color: #FF0060;
			content: ' »'; }
		
h2 {
	margin:10px 0;
	color:#036;
	font: italic 1.5em 'Trebuchet MS',sans-serif;  }
p + h2 { margin-top: 30px;  }
p { margin: 10px 0; }
blockquote{font-style:normal; font-family: arial; }

.warning{
	overflow:hidden;
	color: red;
	padding: 8px 16px 6px;
	margin: 20px 0;
	background: #F8F9FB;
	border-left: 1px solid #E4E6E9; }
	.warning a {
		color:#036;
		border-bottom: 1px dotted #747B83; }
	.warning a:hover {
		color: #129AF0;
		text-decoration:none; }
.read{
	clear:both;
	padding: 8px 16px 6px;
	margin: 20px 0;
	background: #F8F9FB;
	border-left: 1px solid #E4E6E9;
	font-weight: bold; }
	.read a {
		color:#036;
		border-bottom: 1px dotted #747B83; }
	.read a:hover {
		color: #129AF0;
		text-decoration:none; }
			
/* Signature */

#signature { text-align:right; margin: 20px 0; }


/* Index */

#abc {}
	#abc h2 { font-size: 1.4em; margin: 0; padding: 0; }
	#abc ul { padding: 10px 0 30px 0; margin: 0 0 0 16px; }
	#abc li { padding: 0 15px 0 0; }


/* Cloud */

#cloud {
	text-align:center;
	clear:both;
	padding:0 10px 10px 10px; }

	#cloud a {text-decoration:none; margin: 2px; }

	#cloud .c1{font-size:1.1em; color:#B7B7F5; }
	#cloud .c2{font-size:1.3em; color:#9292F0; }
	#cloud .c3{font-size:1.5em; color:#6D6DE7; }
	#cloud .c4{font-size:1.6em; color:#4747DF; }
	#cloud .c5{font-size:1.7em; color:#1F1FD5; }
	#cloud .c6{font-size:1.8em; color:#00C; }
	#cloud .c7{font-size:1.9em; color:#00C; }

	#cloud a:hover {color: #ff6c00; }


/***************************
*			Page
****************************/
#related {}
#related  ul {
	margin: 0px;
	}
.blogRelated {}
	.blogRelated ul {}
	.blogRelated li {
		margin:10px 0;
		padding:0 0 5px 0;
		border-bottom: dotted #ddd 1px; }
		.blogRelated li:last-child {
			border-bottom: none; }
	.blogRelated .ccImg {
		float: left;
		max-width:100px;
		width: 30%;
		margin-right: 3%; }
		.blogRelated .ccImg  img{
			border:1px solid #ddd;
			padding: 2px; }
	.blogRelated .ccContents {
		overflow: hidden; }
	.blogRelated .ccTitle a {
		font-size:1em; }

.blogLast {
	margin-bottom:30px; }
	.blogLast h1 {
		margin: 10px 0;
		color: #036;
		font: italic 1.5em 'Trebuchet MS',sans-serif; }
	.blogLast ul {
		border-top: 1px dotted #CBC2C6; 
		margin: 0; padding: 0;
		list-style: none ; }
	.blogLast li {
		padding:10px;
		background-color: #FFF;
		border-bottom: 1px dotted #CBC2C6; }
	.blogLast li:nth-child(odd) {
		background-color: #FEF3F8; }
	.blogLast a {
		font-weight: bold;
		color: black; }


#prevnext {clear:both; overflow:hidden; padding:20px 0; margin: 0; width: 100%; }
	#prevnext .next {
		float:left; width:30%; min-height:30px; margin:0 0 0 8%; padding:0 0 0 40px;
		background:url(/jdd/public/images/2012/blog-left.gif) no-repeat left top;
		text-align:left; }
	#prevnext .prev {
		float:right; width:30%; min-height:30px; margin:0 8% 0 0; padding:0 40px 0 0;
		background:url(/jdd/public/images/2012/blog-right.gif) no-repeat right top;
		text-align:right; }
	#prevnext ul {clear: both; margin:0; padding:0; overflow:hidden; }
	#prevnext li  {display:inline; float:left; width:100%; margin:0; padding:0; overflow:hidden; background-color:white; }
	#prevnext .ccImg {border:1px solid #D0D1CF; background-color:#fff; width:120px; height:80px; padding:2px; }
	#prevnext .ccImg img {margin:0; padding:0; width:120px; height:80px; }
	#prevnext .ccTitle {margin:0; font-size:12px; }



/* =============================================================================
   Mobile
   ========================================================================== */

/************************************************************************************
smaller than 980
*************************************************************************************/
@media screen and (max-width: 980px) {

	/* Column */
	.quid2Col{}
		.quid2ColLeft{
			float:none;
			width:100%
		}
		.quid2ColRight{
			float:none;
			width:100%
		}
		
	#prevnext .next { margin:0 0 0 5%; padding:0 0 0 40px; }
	#prevnext .prev { margin:0 5% 0 0; padding:0 40px 0 0; }

	.s600x300 {width: auto; max-width:602px; height: auto; }
	.s600x250 {width: auto; max-width:602px; height: auto; }
	.s300x300 {width: auto; max-width:302px; height: auto; }
	
	#quidTop {
		overflow: hidden;
		margin: 0;
		padding: 0 0 20px 0;
		border: none;
		}
		#quidTop img{
			position: static;
			width:99%;
			border: 1px solid black;
		}
		#quidTop .bg {
			display: none;
		}
		#quidTop .txt {
			position: static;
			margin:0;
			padding: 0;
			width: auto;
			height: auto;
			text-align: right; }
		#quidTop .t1 { font-size: 1.3em; font-weight: normal; color:#555; }
		#quidTop .t2 { font-size: 1em; color:#bbb; }
	
}

/************************************************************************************
smaller than 650
*************************************************************************************/
@media screen and (max-width: 650px) {
	.blogRelated .ccTitle a {
		font-size:1.2em;
		}
}

/************************************************************************************
smaller than 480
*************************************************************************************/
@media screen and (max-width: 480px) {

	#prevnext .next {
		margin:0 0 0 3%;
		padding:0 0 0 40px;
	}
	#prevnext .prev {
		margin:0 3% 0 0;
		padding:0 40px 0 0;
	}
	#postbody ul,ol {
		margin:2em 0.5em;
	}

	.blogRelated .ccImg {
		margin-right: 5%;
	}
}