/* ------------------------------------

 * Typecho Default Theme

 *

 * @author  Typecho Team

 * @link  http: //typecho.org/

 * @update  2013-10-28

 * --------------------------------- */



/* ------------------

 * Global style

 * --------------- */

body {

  background-color: #FFF;

  color: #444;

  /*font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;*/

  font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "WenQuanYi Micro Hei","Microsoft Yahei", sans-serif;

  font-size: 87.5%;

}



a {

  color: #3354AA;

  text-decoration: none;

}

a:hover, a:active {

  color: #444;

}

pre, code { 

  background: #F3F3F3;

  font-family: Menlo, Monaco, Consolas, "Lucida Console", "Courier New", monospace;

  font-size: .92857em;

}

code { padding: 2px 4px; color: #B94A48; }

pre {

  padding: 8px;

  overflow: auto;

  max-height: 400px;

}

pre code {

  padding: 3px;

  color: #444;

}



blockquote {

  margin: 1em 0;

  padding-left: 1.5em;

  border-left: 4px solid #eee;

  color: #666;

}



table {

  border: 1px solid #ddd;

  width: 100%;

}

table th,

table td {

  padding: 5px 10px;

  border: 1px solid #eee;

}

table th {

  background: #f3f3f3;

}



h1, h2, h3, h4, h5, h6 {

  font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "WenQuanYi Micro Hei","Microsoft Yahei", sans-serif;

}



input[type="text"],

input[type="email"],

input[type="url"],

input[type="password"],

textarea {

  padding: 5px;

  border: 1px solid #E9E9E9;

  width: 100%;



  border-radius: 2px;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}

textarea {

  resize: vertical;

}





/* Special link style */

.post-meta a,

.post-content a,

.widget a,

.comment-content a {

  border-bottom: 1px solid #EEE;

}



.post-meta a:hover,

.post-content a:hover,

.widget a:hover,

.comment-content a:hover {

  border-bottom-color: transparent;

}



/* ------------------

 * Header

 * --------------- */



#header {

  padding-top: 35px;

  border-bottom: 1px solid #EEE;

}



#logo {

  color: #333;

  font-size: 2.5em;
  
  margin:0 0;

}

#logo img {

    max-height: 64px;

}



.description {

  margin: .5em 0 0;

  color: #999;

  font-style: italic;

}

.readtime{color:#999;}

/* Navigation menu */

#nav-menu {

  margin: 25px 0 0;

  padding: 0;

}

#nav-menu a {

  display: block;

  margin-right: -1px;

  padding: 0 13px;

  border: 1px solid #EEE;

  border-bottom: none;

  height: 32px;

  line-height: 32px;

  color: #444;

  float: left;

}

#nav-menu a:hover,

#nav-menu .current {

  background: #F6F6F6;

}



/* Search */

#search {

  position: relative;

  margin-top: 15px;
  border:1px solid #eee;
  border-radius:2px;

}

#search input {

  padding-right: 30px;
  width:calc(100% - 150px);
  border:none !important;

}
#search input::placeholder{ color:#ff6600;}

#search .select {
	
	border: 1px solid #E9E9E9;
	color: #666;
	width: 105px;
	padding: 5px;
	border-radius:2px;
	color:#FF6600;
  	border:none !important;

}

#search button {

  position: absolute;

  right: 4px;

  top: 2px;

  border: none;

  padding: 0;

  width: 24px;

  height: 24px;

  background: transparent url(img/icon-search.png) no-repeat center center;

  direction: ltr; /* fix RTL language */

  text-indent: -9999em;

}

.widget-tag-cloud a{ margin-right:10px; line-height:1.8;}

@media 

(-webkit-min-device-pixel-ratio: 2), 

(min-resolution: 192dpi) {

  #search button {

    background-image: url(img/icon-search@2x.png);

    -webkit-background-size: 24px 24px;

    -moz-background-size: 24px 24px;

    -o-background-size: 24px 24px;

    background-size: 24px 24px;

  }

}





/* ------------------

 * Main

 * --------------- */



.post {

  padding: 15px 0 20px;

  border-bottom: 1px solid #EEE;

}

.post-title {

  margin: .83em 0;

  font-size: 1.4em;

}

.post-meta {

  margin-top: -0.5em;

  padding: 0;

  color: #999;

  font-size: .92857em;

}

.post-meta li {

  display: inline-block;

  margin: 0 8px 0 0;

  padding-left: 6px;

  border-left: 1px solid #EEE;

}

.post-meta li:first-child {

  margin-left: 0;

  padding-left: 0;

  border: none;

}

.post-content {

  line-height: 1.5;

}

.post .tags {

  clear: both;

}



.post-near {

  list-style: none;

  margin: 30px 0;

  padding: 0;

  color: #999;

}

.post-near li {

  margin: 10px 0;

}



.archive-title {

  margin: 1em 0 -1em;

  padding-top: 20px;

  color: #999;

  font-size: 1em;

}

.more {

  text-align: center;

}

.more a {

  border: none;

}

.protected .text {

  width: 50%;

}



/* Page nav */



.page-navigator {

  list-style: none;

  margin: 25px 0;

  padding: 0;

  text-align: center;

}

.page-navigator li {

  display: inline-block;

  margin: 0 4px;

}

.page-navigator a {

  display: inline-block;

  padding: 0 10px;

  height: 30px;

  line-height: 30px;

}

.page-navigator a:hover {

  background: #EEE;

  text-decoration: none;

}



.page-navigator .current a {

  color: #444;

  background: #EEE;

}



/* ------------------

 * Comment list

 * --------------- */

#comments {

  padding-top: 15px;

}

.comment-list, .comment-list ol {

  list-style: none;

  margin: 0;

  padding: 0;

}

.comment-list li {

  padding: 14px;

  margin-top: 10px;

  border: 1px solid #EEE;

}

.comment-list li.comment-level-odd {

  background: #F6F6F3;

}

.comment-list li.comment-level-even {

  background: #FFF;

}

.comment-list li.comment-by-author {

  background: #fcfaf5;

}

.comment-list li .comment-reply {

  text-align: right;

  font-size: .92857em;

}

.comment-meta a {

  color: #999;

  font-size: .92857em;

}

.comment-author {

  display: block;

  margin-bottom: 3px;

  color: #444;

}

.comment-author .avatar {

  float: left;

  margin-right: 10px;
  
  border-radius:5px;

}

.comment-author cite {

  font-weight: bold;

  font-style: normal;

}



/* Comment reply */

.comment-list .respond {

  margin-top: 15px;

  border-top: 1px solid #EEE;

}

.respond .cancel-comment-reply {

  float: right;

  margin-top: 15px;

  font-size: .92857em;

}

#comment-form label {

  display: block;

  margin-bottom: .5em;

  font-weight: bold;

}

#comment-form .required:after {

  content: " *";

  color: #C00;

}



/* ------------------

 * secondary

 * --------------- */

#secondary {

  padding-top: 15px;

  word-wrap: break-word;

}

.widget {

  margin-bottom: 30px;

}

.widget-list {

  list-style: none;

  padding: 0;

}

.widget-list li {

  margin: 5px 0;

  line-height: 1.6;

}



.widget-list li ul {

  margin-left: 15px;

}





/* ------------------

 * Footer 

 * --------------- */

#footer {
	margin-top:2em;
  padding: 1em 0 3em 0;

  line-height: 1.5;

  text-align: center;

  color: #666;
  border-top:1px solid #eee;
  

}





/* -----------------

 * Error page

 * -------------- */

.error-page {

  margin-top: 50px;

  margin-bottom: 20px;

}


/* -----------------

 * Content format

 *--------------- */

.post-content, .comment-content {

  line-height: 1.5;

  word-wrap: break-word;

}

.post-content h2, .comment-content h2 {

  font-size: 1.28571em;

}

.post-content img, .comment-content img,

.post-content video, .comment-content video {

  max-width: 100%;

}

.post-content a img,

.comment-content a img {

  background: #FFF;

  position: relative;

  bottom: -4px;  /* hidden img parent link border  */

}

.post-content hr, .comment-content hr {

  margin: 2em auto;

  width: 100px;

  border: 1px solid #E9E9E9;

  border-width: 2px 0 0 0;

}





/* -----------------

 * Misc

 *--------------- */

.aligncenter, div.aligncenter {

  display: block;

  margin-left: auto;

  margin-right: auto;

}

.alignleft {

  float: left;

}

.alignright {

  float: right;

}

img.alignleft {

  margin: 0 15px 0 0;

}

img.alignright {

  margin: 0 0 0 15px;

}





/* -----------------

 * Responsive

 *--------------- */

@media (max-width: 767px) {

  body {

    font-size: 81.25%;

  }

  #nav-menu a {

    float: none;

    display: inline-block;

    margin: 0 -2px;

  }

}



@media (max-width: 768px) {

  #header{

    text-align: center;

  }

}



@media (min-width: 992px) {



}



@media (min-width: 1200px) {

  .container {

    max-width: 952px;

  }

}





/*

* Hide from both screenreaders and browsers: h5bp.com/u

*/

.hidden {

  display: none !important;

  visibility: hidden; }



/*

* Hide only visually, but have it available for screenreaders: h5bp.com/v

*/

.sr-only {

  border: 0;

  height: 1px;

  margin: -1px;

  overflow: hidden;

  padding: 0;

  position: absolute;

  width: 1px; }



/*

* Extends the .sr-only class to allow the element to be focusable

* when navigated to via the keyboard: h5bp.com/p

*/

.sr-only.focusable:active,

.sr-only.focusable:focus {

  clip: auto;

  height: auto;

  margin: 0;

  overflow: visible;

  position: static;

  width: auto; }



/*

* Hide visually and from screenreaders, but maintain layout

*/

.invisible {
	visibility: hidden;
}

.post-content h2{ font-size:1.4em; border-bottom: 1px solid #cccccc; padding-bottom: 10px;}
.post-content h3{ font-size:1.3em;}
.post-content h4{ font-size:1.2em;}
.post-content h5{ font-size:1.1em;}
.message{ color: #666;}
.message span{ color: #CC9900;}
.category-level-0 ul{ display: none;}
.author-section{ border-bottom: 1px solid #eeeeee; margin-top:10px;}
.title-more{ width: 100%; display: block; line-height: 1.5;}
.title-more a{ float: right; font-size:0.8em;}
.ul-list ul{ padding:0px; margin:10px 0 10px 15px;}
.ul-list ul li{line-height:1.5;}
.brandlist ul{ display:flex; justify-content: center; flex-flow: wrap; justify-content: flex-start; margin:10px 0 10px 0; list-style:none;}
.brandlist ul li{ width:20%;}
.brandlist ul li sup{ color:red;}
.relatedposts ul{ padding:0; margin:0 0 0 15px;}
.nav_page{ margin:20px auto; text-align:center;}
.nav_page .current{ color:red; margin:0px 10px;}
.shoplink{ color:#0066CC; border:1px solid #0066CC !important; border-radius:5px; padding:2px 5px; margin-right:5px; display:inline-block; margin-bottom:5px;}
.shoplink sup{ margin-left:2px; color:#ff6600;}
.brand-intro p{ line-height:1.5; }
.hot{ position:relative;}
.hot:before{content:""; position:absolute; width:20px; height:13px; right:-5px; top:-7px; display:block; background:url(img/hot.gif) no-repeat center;}
.hide{ display:none !important;}
.coupon_tab{ font-size:0.8em; margin-left:1em; font-weight:normal;}
.coupon_tab span{ padding:0.2em 0.6em; border-radius:0.2em; cursor:pointer;}
.coupon_tab span.current{ background-color:#ff6600; color:#fff;}

.shopinfo_box{ display:flex; justify-content: center; flex-flow: wrap; justify-content: flex-start;}
.shopinfo{ margin:0px; padding:0px; line-height:2em; list-style:none; width:calc(100% - 120px); margin-right:20px;}
.shopscore span{ border:1px solid #eeeeee; border-radius:3px; padding:3px 5px 3px 0px;}
.shopscore span b{ font-weight:normal; padding:3px 5px; background-color:#eee; color:#333; margin-right:5px;}
.buy_box{ width:100px;display: flex;align-items: center; }

.bt_buy,.bt_buy:hover{ color:#fff; background-color:#ff6600; padding:8px 16px; text-align:center; display: block; border-radius:5px;width:100px;}
.bt_buy.bt_center,.bt_buy.bt_center:hover{ margin:0 auto;}
.relatedshops{ margin:10px 0; line-height:2em;}
.relatedshops a{background-color:#3354AA; color:#fff; border-radius:3px; padding:2px 10px; display:inline-block;margin: 5px 10px 0 0;}
#mainmenu{ list-style:none; margin:0px; padding:0px;}
#mainmenu li{ display:inline-block;margin-bottom: -4px; position:relative;}
#mainmenu li ul li{ display:block; width:100px; text-align:center;}
#mainmenu li ul li a{ width:100%; padding:0px;}
#mainmenu li ul li:last-child a{ border:1px solid #eee;}
.sub_menu{ display:none; position:absolute; top:32px; left:0px; padding:0px; margin:0px; background-color:#fff; z-index:9;}
@media (max-width: 767px) {
#nav-menu hd{ display:none;}
.home,.category{ display:none !important;}
.brandlist ul li{ width:50%;}
.site-search{ width:100%; position:fixed; bottom:0px; display:block !important; padding-left:0px !important; padding-right:0px !important; background-color:#fff; z-index:99;}
#search input{ padding:10px !important; width:calc(100% - 170px);}
#search .select { padding:8px 10px; width:110px; margin-right:25px; background-color:#fff;}
#search button{ top:7px;}
#mainmenu li{ display:inline-block;margin-bottom: 0px; position:relative;}
.shopinfo_box{ display:block;}
.shopinfo{ margin:0px; padding:0px; line-height:2em; list-style:none; width:100%; margin-right:0px;}
.buy_box{ width:100%; margin-top:20px;}
}