﻿/* Custom container */
.container-narrow {
  margin: 0 auto;
  max-width: 750px;
  background-color: #ffffff;
  border-radius: 3px;
  padding: 5px; }

.container-narrow > hr {
  margin: 0px auto; }

.navbar .nav {
  float: right; }

/* posts index */
.post > h3.title {
  position: relative;
  padding-top: 10px; }

.post > h3.title span.date {
  position: absolute;
  right: 0;
  font-size: 0.9em; }

.post > .more {
  margin: 10px 0;
  text-align: left; }

/* post-full*/
.post-full .date {
  margin-bottom: 20px;
  font-weight: bold; }

/* tag_box */
.tag_box {
  list-style: none;
  margin: 0;
  overflow: hidden; }

.tag_box li {
  line-height: 28px; }

.tag_box li i {
  opacity: 0.9; }

.tag_box.inline li {
  float: left; }

.tag_box a {
  padding: 3px 6px;
  margin: 2px;
  background: #eee;
  color: #555;
  border-radius: 3px;
  text-decoration: none;
  border: 1px dashed #cccccc; }

.tag_box a span {
  vertical-align: super;
  font-size: 0.8em; }

.tag_box a:hover {
  background-color: #e5e5e5; }

.tag_box a.active {
  background: #57A957;
  border: 1px solid #4c964d;
  color: #FFF; }
  
  
.c2 {
	line-height: 1.0;
	padding-top: 0pt;
	direction: ltr;
	padding-bottom: 0pt;
}

.c6 {
	text-align: center;
}

.c9 {
	vertical-align: top;
	width: 112.5pt;
	border-style: solid;
	border-color: #000000;
	border-width: 1pt;
	padding: 5pt 5pt 5pt 5pt;
}

.c10 {
	vertical-align: top;
	width: 41.2pt;
	border-style: solid;
	border-color: #000000;
	border-width: 1pt;
	padding: 5pt 5pt 5pt 5pt;
}

.c13 {
	vertical-align: top;
	width: 69.8pt;
	border-style: solid;
	border-color: #000000;
	border-width: 1pt;
	padding: 5pt 5pt 5pt 5pt;
}

.c15 {
	height: 0pt;
}

.c21 {
	margin-right: auto;
	border-collapse: collapse;
}

.c23 {
	vertical-align: top;
	width: 81.8pt;
	border-style: solid;
	border-color: #000000;
	border-width: 1pt;
	padding: 5pt 5pt 5pt 5pt;
}

.c29 {
	vertical-align: top;
	width: 57.8pt;
	border-style: solid;
	border-color: #000000;
	border-width: 1pt;
	padding: 5pt 5pt 5pt 5pt;
}

.c30 {
	vertical-align: top;
	width: 53.2pt;
	border-style: solid;
	border-color: #000000;
	border-width: 1pt;
	padding: 5pt 5pt 5pt 5pt;
}

/* alpha list */
ol { list-style-type: upper-alpha; }


@font-face {
	font-family: founder;
	font-style:  normal;
    font-weight: 400;
	src: url("founder.TTF");
}

body {
	/*background: url(http://lh4.ggpht.com/bd7y0XYFjqg44W4idK30rW_XeuMLMKUcx5yWF-ro9ctTtpeiRU8FVMLsa-8NrWPIo5GQ7AdR5k_V63ay_GJ3PMnjWpElml-WFuBTNmlO) center;*/
    /*background-repeat: no-repeat;*/
	
	/* Auto 100% */
/*	filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale')";
    -moz-background-size:100% 100%;
    background-size:100% 100%;
*/
	/*background-attachment: fixed;*/
	
/*	font-family: founder;
	line-height: 20px;
	color: #333333;*/
}

/* image */
img[alt=IMG-THUMBNAIL] {
	display: inline-block;
    height: auto;
    max-height: 200px;
    max-width: 100%;
    padding: 4px;
    line-height: 1.428571429;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    border-radius: 4px;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

/* google translate */
.cyeam_float {
	position: fixed;
	margin: 0px auto;
	z-index: 999;
	top: 73px;
	left: 50px;
	padding-top: 5px;

	border-radius: 3px;
  	padding: 5px;

  	max-height: 400px;
	overflow-y: hidden;
}

/* navbar */
.navbar {

}

/* opacity: */
.opacity {
	background: rgba(255,255,255,0.9);
	border-color: #efefef;
}

.span12 {
 	margin: auto !important;
}


/* image center */
.span12 h2 {
	text-align: center;
 	margin: 0 auto;
}

.center {
	text-align: center;
 	margin: 0 auto;
}

.read-all {
	text-align: right;
	margin-right: 5px;
}

.cyeam_float {
	max-width: 230px;
}

/* a */
a {
	color:#000000;
	font-weight:bold; /*CSS字体效果 普通 可以改成bold粗体 如果去除此行那么默认是不显示下划线的*/
	text-decoration:none; /*CSS下划线效果：无下划线*/
}

a:hover {
	color:#000000;
	text-decoration:none; /*CSS下划线效果：无下划线*/
}

.cyeam_float_right {
	position: fixed;
	margin: 0px auto;
	z-index: 999;
	top: 73px;
	right: 40px;
	padding-top: 5px;

	border-radius: 3px;
  	padding: 5px;
}

.icon {
	margin-right: 10px;
}

/* iPhone */
/* First, we'll make the body. After that we'll use :after and :before elements to make other things like buttons */

.iphone {
	position: relative;
	height: 495px;
	width: 250px;
	border-radius: 35px;
	margin: 50px auto;
	
	/* We are going to use multiple background images (linear-gradients) here to create the main background, the shine and the screen */
	/* This is our first gradient, to draw more, we'll have to write them before this one separated by a comma */
	/* Now, we'll draw the screen */
	/* The screen should be below the shine, right? */
	background: 
		linear-gradient(-165deg, rgba(255,255,255,0.4), rgba(255,255,255,0.15) 35%, transparent 35%),
		linear-gradient(top, transparent 85px, #222222 85px, #151515 410px, transparent 410px),
		linear-gradient(top, #000, #0a0a0a);
	
	/* Something isn't right... */
	/* Now, it's perfect. Try playing with the values below to get a better understanding */
	background-repeat: no-repeat;
	background-size: 100% 100%, 220px 100%, 100% 100%;
	background-position: 0 0, 15px 0, 0 0;
	
	
	
	/* Now we need the aluminium borders and the top button */
	/* We'll use box shadows for that */
	box-shadow: 0 0 0 3px black,
							/* A small divider */
							-40px -128px 0 -123px black,
							0 0 0 5px #a09f9d,
							/* Some metallic shine on the button */
							49px -130px 3px -123px #777,
							46px -130px 2px -123px #ddd,
							/* Top button from here */
							62px -111px 0 -105px #8e8d8b,
							62px -112px 0 -105px #b4b3b1,
							62px -113px 0 -105px #666;
}


/* Our phone's body is complete! Now we'll move onto the home button, front cam and the speaker.. */
/* We are going to use :after pseudo element for that and a lot of box-shadow awesomeness */
.iphone:after {
	content: '▢';
	line-height: 46px;
	text-align: center;
	font-size: 28px;
	color: #666;
	position: absolute;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: white;
	bottom: 18px;
	left: 100px;
	border: 2px solid #0a0a0a;
	
	
	
	/* We'll use gradients for the depth */
	background-image:
		linear-gradient(left, rgba(0, 0, 0, 0.85), black); /* Looking good */

	/* Now some box-shadow magic to create speaker and front cam */
	box-shadow:
		/* Front Cam: looking good */
		-39px -410px 0 -23px #000f31,
		-39px -410px 0 -22px #0a1c5a,
		-40px -410px 0 -21px #0d1216,
		-40px -410px 0 -19px #1b191a,
		
		
	
		/* Speaker, it's a mess. Really. */ 
		/* now the outer covering of speaker, another mess */
		-12px -410px 0 -22px #333,
		-8px -410px 0 -22px #333,
		-4px -410px 0 -22px #333,
		-0px -410px 0 -22px #333,
		4px -410px 0 -22px #333,
		8px -410px 0 -22px #333,
		12px -410px 0 -22px #333,
		16px -410px 0 -22px #333,
		20px -410px 0 -22px #333,
		24px -410px 0 -22px #333,
		
		-12px -410px 0 -18px #0a0a0a,
		-9px -410px 0 -18px #0a0a0a,
		-6px -410px 0 -18px #0a0a0a,
		-3px -410px 0 -18px #0a0a0a,
		0px -410px 0 -18px #0a0a0a,
		3px -410px 0 -18px #0a0a0a,
		6px -410px 0 -18px #0a0a0a,
		9px -410px 0 -18px #0a0a0a,
		12px -410px 0 -18px #0a0a0a,
		15px -410px 0 -18px #0a0a0a,
		18px -410px 0 -18px #0a0a0a,
		21px -410px 0 -18px #0a0a0a,
		24px -410px 0 -18px #0a0a0a;

}

/* Looks good till now. But we are still missing the side buttons and those are pretty easy to make. We'll only use gradient for that ;) */
.iphone:before {
	position: absolute;
	content: '';
	width: 2px;
	height: 117px;
	background: transparent;
	top: 40px;
	left: -7px;
	
	/* The shape is building up */
	background-image:
		/* This is going to be a long top to bottom linear gradient so see the output and code */
		/* A final touch ;) */
		linear-gradient(left, transparent 0px, transparent 1px, #7a7879 2px),
		linear-gradient(top, #383838 1px, #b9b9b9 3px, #b9b9b9 10px, #383838 19px, #b9b9b9 23px, transparent 23px, transparent 53px, #383838 53px, #b9b9b9 54px, #dadada 58px, #383838 62px, black 62px, black 66px, #383838 66px, #b9b9b9 67px, #dadada 68px, #383838 70px, transparent 70px, transparent 100px, #383838 100px, #b9b9b9 101px, #dadada 105px, #383838 109px, black 109px, black 113px, #383838 113px, #b9b9b9 114px, #dadada 115px, #383838 117px);
	
}

.iphone img {
	position: absolute;
	left: 6px;
	top: 65px;
}

.phone-bg {
    margin-top: 10px;
    padding-top: 60px;
    background: url(http://siteapp.baidu.com/static/webappservice/pic/new-bg-mobile_dafd5fd.png) no-repeat 0 -10px;
    height: 614px;
    width: 332px;
    margin-right: -10px;
    position: relative;
}
.phone-bg .phone_display {
    margin-left: 34px;
    width: 272px;
    height: 465px;
    background-color: #fff;
}