* { text-decoration:none !important; 
  margin: 0;
  padding: 0;
  position: relative;
  outline: none;
  /*text-shadow: 0 0 0.5px !important;*/
}

a, a:hover, a:focus { color: #444; }

body {
  background: #EFEFEF;
  font: 14px/100% arial,\5b8b\4f53;
  font-family: "Microsoft YaHei",Helvetica,Verdana,sans-serif;
  padding-bottom: 250px;
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

.modal-open label { line-height: 2; }
.modal-header { padding-bottom: 0; }
.modal-title { line-height: 1; }
/*.modal-body { padding-top: 0; }*/

::-moz-selection{background: rgba(144, 180, 216, 0.84);color: #FFF  !important; }.close { z-index: 1; }
::selection {background: rgba(80, 105, 131, 0.84);color: #FFF  !important;} 
.framework { width: 998px; margin: auto; }
.search { height:175px; margin:35px auto 0; }
.logo-box { width: 100px; height: 100px; margin: 0 0 10px 45%; }
.header_img {
  width: 100%;
  height: 100%;
  background-image: url("./../images/logo5.png");
  background-position: center;
  border-radius: 50%;
  background-size: 100%;
  transition: background-size 1.5s;
  transition: transform 0.4s cubic-bezier(0.71, 0.01, 0.25, 0.99);/*变化时间设置为0.4秒(变化动作即为下面的图像旋转360读）*/
}
.header_img:hover { transform: rotateZ(360deg); -webkit-transform: rotateZ(360deg); -moz-transform: rotateZ(360deg); }
.header_wrap.active { transform: rotateY(360deg); -webkit-transform: rotateY(360deg); -moz-transform: rotateY(360deg); }
.search-wrapper { text-align: center; margin: auto; width: 525px; margin-top: 30px; }
.search-wrapper form input { float: left; /*vertical-align: top;*/ }
.button2 {
  color: #FFFFFF;
  width: 91px;
  height: 30px;
  border: 0;
  font-size: 14px;
  background: rgb(90, 105, 117);
  cursor: pointer;
  -webkit-appearance: none;
  border-radius: 30px 0px 0px 30px;
  /*margin-left: -5px;*/
}
.button2:focus { background: rgb(90, 105, 117); }
.button2:hover { background: rgb(44, 45, 46) !important; }
.search .button{ color:#FFFFFF;width:91px; height:30px; border:0; font-size: 14px; background:rgb(90, 105, 117); cursor:pointer; -webkit-appearance: none; border-radius: 0px 30px 30px 0px; /*margin-left: -5px;*/ }
.search .button:hover { background: rgb(44, 45, 46) !important; }
.recommonds { overflow: hidden; list-style: none; clear: both; }
.sigleRecommond { width: 99px; height: 99px; float: left; }
.singleLink img, .singleLink span.icon-box { transition: all .2s ease }
.singleLink:hover img, .singleLink:hover span.icon-box { transform: translate3d(0, -3px, 0); box-shadow: rgba(33, 33, 33, 0.75) 0 14px 12px -6px !important }
.singleLink { display: block; text-align: center; width: 100%; height: 85px; padding-top: 17px; }
.singleLink>.img-links2 { max-width: 50px; }
.text-links { font-size: 12px; float: left; width: 100px; margin-top: 13px; }
.text-links, .footer-box { text-shadow:-1px -1px 1px #fff,1px 1px 1px #fff,1px -1px 1px #fff,-1px 1px 1px #fff }
ul.recommonds.shake-rotate.sortable .singleLink { cursor: default }

/* index style */

.input2 {
    position: relative;
    width: 430px;
    height: 30px;
    transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    -webkit-transition-duration: 0.2s;
    -o-transition-duration: 0.2s;
    padding: 5px 5px 5px 10px;
    background-color: #DEDEDE;
    border-radius: 0px;
    outline:none;
    margin-left: -4px;
    border: none;
}
input:focus {  background-color: #FFF; }
label { margin-bottom: 0px; }
label:active { color:rgb(90, 105, 117) }
label:focus { color:rgb(90, 105, 117) }
#Like1 { display: none; }

.header_wrap { width: 100px; height: 100px; margin: 0 auto; border-radius: 50%; cursor: default; display: block; transition: all .5s ease }
#b-word {
  color: #6B6B6B;
  width: 346px;
  -moz-box-shadow: inset 1px 1px 5px rgba(90, 105, 117, 0.3);
  -webkit-box-shadow: inset 1px 1px 5px rgba(90, 105, 117, 0.3);
  box-shadow: inset 1px 1px 5px rgba(90, 105, 117, 0.3);
  background-image: url('../images/u6.png');
  background-repeat: no-repeat;
  padding-left: 30px;
  background-position: 10px;
  background-color: rgba(222, 222, 222, 0.85) !important;
}
#q-btn, #b-btn { opacity: .85; z-index: 1; }

.footer-box { font-size: 10px; margin: auto; text-align: center; padding-bottom: 15px; position: fixed; left: 0px;  width: 100%; bottom: 0; }

.st-move { /*border: 1px solid red; position: relative*/ }
.sortable-dragging { opacity: .5; display: block !important }
.sortable li { transition: transform 1s; }

/* torn */

.nav-tabs {
    margin-bottom: 15px;
}

span.del-flag { display: none; position: absolute; right: 16px; top: 8px; width: 20px; height: 20px; border-radius: 50%; background-color: red; color: #fff; z-index: 1; line-height: 21px; text-align: center; font-size: 12px; box-shadow:0 1px 2px #600; cursor:pointer; }
span.del-flag:hover { background-color: #c00; color:#ddd }
.sortable span.del-flag { display: block }
  
.framework .useful-links, .top-section, .recommonds { height: auto !important; }
span.show-color { display: inline-block; width: 15px; height: 15px; border-radius: 50%; position: relative; top: 3px; }
.singleLink { position: relative; }

.nav-tabs>li:nth-child(4) { float: right }
#logout-btn { color:#d00; box-shadow: inset 0 -2px 0 #d00 !important; }
#logout-btn:hover { /*background: #d00 !important;*/ color: #a00; border-color: #a00 !important; box-shadow: inset 0 -2px 0 #a00 !important; }

.tool-box { min-width: 60px; min-height: 60px; position: fixed; right: 50px; bottom: 85px; z-index: 10; }
.tool-box.user-info { right: 50px; bottom: 20px }
.tool-box a { bottom: 0; margin-top: 15px; padding: 0px;line-height: 60px; font-size: 20px; position: absolute; border-radius: 50%; width: 60px; height: 60px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }
ul.recommonds>li { position: relative; }
.tool-box a span { line-height: 60px; } 
.glyphicon-plus { left: 1.5px; }
.tool-box.manage a:nth-of-type(2) { bottom: 65px;}
.tool-box.manage a:nth-of-type(3) { bottom: 130px; }
.tool-box.manage a:nth-of-type(4) { bottom: 65px; right: 0; }
#cancel-btn.act { right: 65px; }
li>a>span.icon-box { color: #fff; text-shadow: 1px 1px 3px #444; box-sizing: border-box; box-shadow: 0px 6px 9px rgba(0, 0, 0, 0.15); position: relative;  display: block; margin: 0 auto; width: 50px; height: 50px; background-color: #ccc; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; line-height: 50px; font-size: 14px; }
li.item>a>span.text-links { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; display: block; text-align: center; width: 100%; }
ul>li img, ul>li span.icon-box { border-radius: 8px; }
ul.shake-slow>li img, ul.shake-slow>li span.icon-box {
  transform-origin: center center;
  -webkit-animation-name: shake-slow;
  -ms-animation-name: shake-slow;
  animation-name: shake-slow;
  -webkit-animation-duration: 5s;
  -ms-animation-duration: 5s;
  animation-duration: 5s;
  -webkit-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out;
  -ms-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-delay: 0s;
  -ms-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation-play-state: running;
  -ms-animation-play-state: running;
  animation-play-state: running
}

ul.shake-little>li img, ul.shake-little>li span.icon-box {
  -webkit-animation-name: shake-little;
  -ms-animation-name: shake-little;
  animation-name: shake-little;
  -webkit-animation-duration: 200ms;
  -ms-animation-duration: 200ms;
  animation-duration: 200ms;
  -webkit-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out;
  -ms-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-delay: 0s;
  -ms-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation-play-state: running;
  -ms-animation-play-state: running;
  animation-play-state: running
}

ul.shake-rotate>li img, ul.shake-rotate>li span.icon-box {
  animation-name: shake-rotate;
  animation-duration: 500ms;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  animation-delay: 0s;
  animation-play-state: running
}

/* 夜间模式 */
#nightMode { background: #444; color: #fff; font-size: 10.5px; text-shadow: none; padding: 3px; margin-left: 10px; border-radius: 4px; transition: all .25s ease }
#nightMode:before { content:"☾ " }
#nightMode.rijian { background: #aaa; color: #000 }
#nightMode.rijian:before { content: "☀ " }

body.night-mode { background-color: #333435; }
.night-mode .sigleRecommond:hover .text-links { color:#A9A9A9 }
.night-mode .img-links2 { box-shadow:rgba(16, 16, 16, 0.9) 0 10px 10px -6px !important }
.night-mode .text-links { color:#DEDEDE; text-shadow: 0px 1px 1px #000; }
.night-mode .button2 { background: rgb(71, 75, 78); }
.night-mode .button2:focus { background: rgb(71, 75, 78); }
.night-mode #b-word { background-color: rgba(19,22,23, .85) !important; color: #ddd; box-shadow: inset 1px 1px 4px #000 }
.night-mode .header_img { background-image: url("./../images/logo5_yejian.png"); }
/*.night-mode .header_img {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray;
}
.night-mode .header_img:hover{ background-color: rgb(189, 189, 189); }*/
.night-mode #zanzhu1 { color: #FBFBFB; }
.night-mode .btn-primary:hover, .night-mode .btn-danger:hover, .night-mode .btn-primary, .night-mode .btn-danger { background-color: #242425 !important; border-color: #242425 !important; }
.night-mode .btn-warning, .night-mode .btn-warning:hover  { background-color: #151515  !important; border-color: #151515  !important; }
.night-mode .btn-success:hover, .night-mode .btn-success { background-color: #424242 !important; border-color: #424242 !important; }
.night-mode #banquan, .night-mode .rijian, .night-mode #about, .night-mode #hezuo, .night-mode .yejian, .night-mode #hezuo {  color: #DEDEDE; }
.night-mode .icon-box { box-shadow: rgba(33, 33, 33, 0.75) 0 10px 10px -6px !important; }
.night-mode .singleLink:hover img, .night-mode .singleLink:hover span.icon-box { box-shadow: rgba(222,222,222, 0.75) 0 14px 12px -6px !important }
.night-mode .tool-box a span { top: 0px; }
.night-mode .footer-box { text-shadow: 0px 1px 1px #000; }
.night-mode .btn-primary { background-color: #2a2a2b !important; border-color: #2a2a2b !important }

.night-mode #logout-btn { background: #d00; color: #fff }
.night-mode #logout-btn:hover { background: #a00 !important; color: #ddd; border-color: #a00 !important }

@media screen and (min-width: 320px) and (max-width: 880px) {
  html { font-size: 625%; }
  body { padding-bottom: 1.8rem; background-position: top center; background-size: 100% auto }
  .logo-box { width: auto; height: auto; margin: .1rem auto 0; }
  .framework { width: 100%; }
  .header_wrap { width: .8rem; height: .8rem; }
  .header_img { margin: 0 auto; }
  .search { margin: 0; height: auto; }
  .search-wrapper { width: 100%; margin: .1rem auto .2rem; }
  .search-wrapper form { display: block; overflow: hidden; width: 2.8rem; margin: 0 auto }
  .button2, .search .button { border-radius: .2rem 0 0 .2rem; width: .6rem; height: .3rem; left: 0; font-size: .1rem }
  .search .button { border-radius: 0 .2rem .2rem 0; }
  #b-word { width: 1.6rem; height: .3rem; line-height: .3rem; font-size: .12rem; }
  ul.recommonds>li { width: .8rem; height: .92rem; overflow: hidden; }
  .singleLink { width: 100%; height: .85rem; padding-top: .07rem }
  .singleLink:hover img, .singleLink:hover span.icon-box { box-shadow: rgba(33,33,33, 0.75) 0 .14rem .12rem -.06rem !important }
  .singleLink>.img-links2 { max-width: 100%; }
  .night-mode .singleLink:hover img, .night-mode .singleLink:hover span.icon-box { box-shadow: rgba(222,222,222, 0.75) 0 .14rem .12rem -.06rem !important }
  .text-links { width: 100%; margin-top: .13rem; font-size: .08rem; }
  ul>li img, ul>li span.icon-box { width: .5rem; height: .5rem; line-height: .5rem; font-size: .12rem; }
  ul>li img, ul>li span.icon-box { border-radius: .08rem; }
  span.del-flag { right: .1rem; top: 0; width: .2rem; height: .2rem; line-height: .2rem; font-size: .1rem; }
  .footer-box { font-size: .1rem; line-height: .18rem; position: absolute; bottom: .05rem; padding: 0 .3rem; }

  .tool-box { min-width: .5rem; min-height: .5rem; position: fixed; right: .1rem; bottom: .3rem; width: .5rem; }
  .tool-box a { margin-top: .1rem; line-height: .5rem; font-size: .2rem; width: .5rem; height: .5rem; }
  .tool-box a span { line-height: .5rem; } 
  .glyphicon-plus { left: .015rem; }
  .glyphicon { top: 0; }
  .tool-box.user-info { bottom: .3rem; left: .1rem; }
  .tool-box.manage a:nth-of-type(3) { bottom: 1.1rem; }
  .tool-box.manage a:nth-of-type(4), .tool-box.manage a:nth-of-type(2) { bottom: .55rem; }
  #cancel-btn.act { right: .55rem; }

  #nightMode { font-size: .1rem; }
}

@keyframes shake-rotate {
	0% {
		transform:rotate(0deg);
	}
	25% {
		transform:rotate(7deg);
	}
	75% {
		transform:rotate(-7deg);
	}
	100% {
		transform:rotate(0deg);
	}
}