/************************************************************************************
smaller than 980
*************************************************************************************/
@media screen and (max-width: 980px) {
	body {
		background: #000 url(/jdd/public/images/2012/facebook.jpg) repeat-x left -15px ;
	}
	/* pagewrap */
	#pagewrap {
		margin:0 2%;
		padding:10px;
		width:auto;
		height:auto;
		background: none;
		overflow:hidden;
	}
	
	#header {
		position: static;
		margin: 0;
		padding: 30px 0 10px 0;
		width:100%;
		height:auto;
		overflow: hidden;
	}

	#site-logo {
		position: static;
		margin:0;
		padding:0;
	}
	#site-logo a {
		background-image: url(/jdd/public/images/2012/logo.png);
	}
	#site-logo .site-logo-cn {
		background-image: url(/jdd/public/images/2012/logo-cn.png);
	}


	#main-nav li a {
		width: auto ; height: auto;
		background: none;
	}
	#main-nav li a:hover { 

	}
	#main-nav .first { background: none; }
	#main-nav .first:hover { background-image: none; }
	
	#main-nav {
		width: 100%;
		margin: 20px 0 0 0;
		padding: 0;
		position: static;
		clear: both;
		left: 0;
		bottom: 0;
		z-index: 100;
		/* gradient */
		background: #6a6a6a url(/jdd/public/images/2012/nav-bar-bg.png) repeat-x;
		background: -webkit-gradient(linear, left top, left bottom, from(#b9b9b9), to(#6a6a6a));
		background: -moz-linear-gradient(top,  #b9b9b9,  #6a6a6a);
		background: linear-gradient(-90deg, #b9b9b9, #6a6a6a);
		/* rounded corner */
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		border-radius: 8px;
		/* box shadow */
		-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4);
		-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4);
		box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4);
	}
	#main-nav li {
		margin: 0;
		padding: 0;
		list-style: none;
		float: left;
		position: relative;
	}
	#main-nav li:first-child {
		margin-left: 10px;
	}
	#main-nav li a {
		line-height: 100%;
		font-weight: bold;
		color: #fff;
		display: block;
		padding: 10px;
		text-decoration: none;
		text-shadow: 0 -1px 0 rgba(0,0,0,.5);
	}
	#main-nav li a:hover {
		color: #fff;
		background: #474747;
		/* gradient */
		background: -webkit-gradient(linear, left top, left bottom, from(#282828), to(#4f4f4f));
		background: -moz-linear-gradient(top,  #282828,  #4f4f4f);
		background: linear-gradient(-90deg, #282828, #4f4f4f);
	}
	#main-nav .first:hover {
		color: #fff;
		background: #474747;
		/* gradient */
		background: -webkit-gradient(linear, left top, left bottom, from(#282828), to(#4f4f4f));
		background: -moz-linear-gradient(top,  #282828,  #4f4f4f);
		background: linear-gradient(-90deg, #282828, #4f4f4f);
	}
	
	#lang-nav {
		position: static;
		margin: 15px 0 0 0;
		padding: 0;
		float: left;
	}

	#top-facebook {
		position: static;
		margin: 15px 0 0 0;
		padding: 0;
		float: right;
	}

	#searchform {
		display: none;
	}

	/* content */
	#content {
		width: 60%;
		padding: 3% 4% 3% 3%;
		background: #fff;
		margin: 0;
		overflow: hidden;
		/* rounded corner */
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		border-radius: 8px;
		/* box shadow */
		-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4);
		-moz-box-shadow: 0 1px 3px rgba(0,0,0,.4);
		box-shadow: 0 1px 3px rgba(0,0,0,.4);
	}

	/* sidebar */
	#sidebar {
		width: 30%;
	}
	#sidebar .widget {
		padding: 8% 7%;
		margin-bottom: 20px;
		background-color:#fff;
		/* rounded corner */
		-webkit-border-radius: 8px;
		-moz-border-radius: 8px;
		border-radius: 8px;
		/* box shadow */
		-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.4);
		-moz-box-shadow: 0 1px 3px rgba(0,0,0,.4);
		box-shadow: 0 1px 3px rgba(0,0,0,.4);
	}
	.widgettitle {
		position: static;
		height: auto;
		margin: 10px 0;
		padding: 0;
		background: none;
		font-size:2em;
		color: #000;
		font-family: inherit;
		font-weight: bold;
		text-shadow: none;
		overflow: visible;
		display:block;
		line-height: 1.2em;
	}

	.widget h5{
		margin-left:0;
		margin-top: 1em;
	}
	.widget p {
		margin-left:0;
	}

	/* embedded videos */
	.video embed,
	.video object,
	.video iframe {
		width: 100%;
		height: auto;
		min-height: 300px;
	}

	#google{
		margin: 0 0 12px 0;
	}
	#like {
		width:100%;
	}

	/***************************
	*			blogHome
	****************************/
	.blogHome {}
		.blogHome li {
			float:none;
			width:100%;
			list-style:none;
			margin: 0 0 15px 0;
			padding:0 0 20px 0;
			border-bottom: dotted #ddd 1px;
		}
		.blogHome .liA {
			padding:0;
		}
		.blogHome .liB {
			padding:0;
		}
		.blogHome .ccImg {
			float:left;
			max-width:200px;
			width: 40%; height:auto;
			margin: 0 20px 10px 0;
			border: none;
		}
		.blogHome .ccContents {
			overflow: hidden;
		}
		.blogHome .ccKey  {
			margin:0 0 10px 0;
		}
		.blogHome .ccKey  a {
			display: inline;
		}
		.blogHome .ccTag {
			color:#999;
		}

	.blogWidget {
		margin: 0px;
	}
	.cbTop li {
		margin: 0 10px 5px 0;
	}
	.cbListLeft {
		padding-left:0;
	}
	.cbDead {
		padding-left:0;
	}
}

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

	#pagewrap {
		margin:0 3%;
		padding:10px 0 0 0;
	}
	
	blockquote {
		margin:2em;
	}

	/* header */
	#header {}

	/* search form */
	#searchform {
		position: absolute;
		top: 5px;
		right: 0;
		z-index: 100;
		height: 40px;
	}
	#searchform #s {
		width: 70px;
	}
	#searchform #s:focus {
		width: 150px;
	}
	
	/* site logo */
	#site-logo {}

	/* site description */
	#site-description {}

	/* content */
	#content {
		width: auto;
		float: none;
	}

	/* sidebar */
	#sidebar {
		position: static;
		width: 100%;
		margin: 0;
		float: none;
	}
	#sidebar .widget {
		padding: 3% 4%;
		margin: 20px 0;
	}

	/* embedded videos */
	.video embed,
	.video object,
	.video iframe {
		min-height: 250px;
	}

	#google {
	}

	/************************************************************************************

	*************************************************************************************/
	.blogWidget {}
		.blogWidget .ccImg {
			max-width:53px;
			float: left;
			width: 20%;
			margin-right: 3%;
			}
		.blogWidget .ccTitle a {
			font-size:1.2em;
			}

	.cbTop {
		width:100%;
	}
	.cbDead .cblImg {

	}
	.cbDead .cblImg  img{
		padding: 0;
		border: 0;
	}
	.cbDead .cblDeathdate {
		font-size: 1em;
		text-align: left;
		padding: 20px 0 5px 0;
	}
	
}

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

	/* disable webkit text size adjust (for iPhone) */
	html {
		-webkit-text-size-adjust: none;
	}

	blockquote {
		margin:2em 1em 2em 0;
	}
	
	/* main nav */
	#main-nav li a {
		font-size: 90%;
	}
	#main-nav li:last-child {
		display:none;
	}
	#like {
		width:98%;
	}

	
	.blogWidget {}
		.blogWidget .ccImg {
			margin-right: 5%;
			}
	.widgettitle {
		font-size: 1.5em;
	}
}