body{color: #909090;width:100%;background: #1e1e1e;font-size: 14px;font-family: Arial,sans-serif;}
body,ul,li,u,i,h1,h2,h3,tr,td,form,p,hr,em {margin:0px;padding:0px;list-style-type: none;font-style: normal;text-decoration: none;}
a {color: #f7d0bf;text-decoration: none;}
a:hover {color: #FF5B82;transition: all 0.5s;}
*:focus {outline: none;}

em {color: #ff6600;font-weight: bold;}
h3 {font-size: 20px; line-height: 1.3;}
textarea,input,button,select{display:inline-block;margin-bottom:20px;width:100%;color: #f7d0bf;background: #242424;padding:15px;border:none;box-sizing:border-box;border-radius: 4px;vertical-align:middle;}
form {box-sizing:border-box;}
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-text-fill: #909090 !important;
  -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  background: transparent;
  background: none;
  transition: background 50000s ease-in-out 0s;
}

.container {margin:0 auto;position: relative;}


.header .menu {position: absolute;width:130px;left:20px;top:5px;}
.header .menu .icon {display:inline-block;font-size:30px;}

.header {position: relative;margin:10px 0px 0px 0px;border-bottom:1px solid #242424;}
.header .logo {display:block;text-align:center;margin:20px 10px;vertical-align: middle;}
.header .logo img {height:40px}

.header .user {position: absolute;right:20px;top:0px;font-size:16px;}
.header .user .face .icon {display:inline-block;font-size:30px;}
.header .user .face img {width: 36px;height: 36px;border-radius: 100%;vertical-align: middle;}

.header .hot {display:block;margin:20px 10px;text-align:center;vertical-align: middle;}
.header .hot i{display:block;font-size:20px;}
.header .hot a{display:inline-block;font-size:14px;margin:0px 10px;}

.search {display:block;position: relative;margin:20px 10px;font-size:0;vertical-align: top;}
.search .key {background:#242424;height:45px;padding-left:40px;width:100%;border-radius: 4px 0px 0px 4px ;}
.search .but {position: absolute;height:45px;width:60px;right:0px;background:#3a3636;padding:14px;border-radius: 0px 4px 4px 0px ;}
.search i {position: absolute;cursor: pointer;width:20px;margin:12px 0px 0px 10px;}
.search .icon {font-size:20px;}

.dropdown {position: relative; display: inline-block;width:100%}
.dropdown-content {display: none;position: absolute;margin-top:10px;z-index:99999;line-height:35px;width:150px;background: #242424;right:0px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);}
.dropdown-content a {position: relative;color: f7d0bf;font-size:14px;padding: 5px 30px;text-decoration: none;display: block;}
.dropdown-content a:hover {background: #3a3636}
.header .menu .dropdown-content a i.icon {font-size:16px;}
.dropdown:hover .dropdown-content {display: block;}


.top {position: fixed;right: 10px;bottom: 80px;z-index: 99999;display: none;}
.top li {width: 50px; padding: 8px 0px; margin-bottom: 1px; text-align: center; cursor: pointer;font-size: 12px;background: #323436;color: #fff; border-radius: 2px;opacity: .8;}
.top li i {display: block;width: 50px;height: 22px;font-size: 20px;}

.bottom {position:fixed;bottom:0;z-index:99999;width:100%;background: #323436;box-shadow: 0 0 5px 0 rgb(64 60 67 / 16%);}
.bottom ul{padding:10px;font-size:0;}
.bottom ul li{display: inline-block;text-align:center;font-size:14px;width:20%;}
.bottom ul li i.icon{display: block;font-size:20px;}



.des,.chapter {padding:15px 5px;border-bottom: 1px solid #242424;word-break:break-all;word-wrap:break-word;}
.chapter a{display:inline-block;padding:10px 20px 10px 0px;}
.des a {margin:5px;}

.text {font-size:20px;line-height:1.8;text-indent: 2em;padding:10px;word-break:break-all;word-wrap:break-word;}
.text p{margin-bottom:20px;}

.font {display:none;position: fixed;background:rgba(0,0,0,0.5);width:300px;padding:30px 0px;    box-shadow: 0 0 5px 0 rgb(64 60 67 / 16%);;text-align: center;;left:50%;top:50%;transform:translate(-50%,-50%)}
.font button {width:120px;background: #323436;color: #ffff00;border-radius: 2px;line-height:10px;height:40px;margin:10px;}
.font.show {display:block;}

.box h3 {font-size: 16px; text-align: center;    margin: 20px;}


.site {margin:0px;font-size:0px;}
.site h2{text-align:center}
.site .icon{display:block;font-size:24px;margin-bottom:5px;}
.site a {display: inline-block;text-align:center;width:25%;font-size:14px;padding:10px 0px;vertical-align: top;}
.site a span{padding:0px 5px}
.site a:hover{background:#242424;color:#bcba01;border-radius: 10px;}
.site .active {color:#bcba01;font-weight: bold;}


.sites {
    position: relative;
    margin: 10px 10px;
    background: #242424;
    padding: 10px 0px;
}

.comment {border-top:1px solid #242424;border-bottom:1px solid #242424;}
.comment h2{font-size:18px;padding-left:5px;}
.comment ul {margin:10px;border-bottom:1px solid #242424;}
.comment .content{margin:10px 0px;color: #f7d0bf;padding-left:50px;font-size:14px;line-height:1.5;word-break:break-all;word-wrap:break-word;}

.list_user {position: relative;display:inline-block;}
.list_user img{width: 36px;height: 36px;border-radius: 100%;vertical-align: middle;}
.list_user .name {margin:0px 10px;font-size:14px;font-weight: bold;}
.list_user .date {color:#666}
.list_user .del {position: absolute;right:0px;top:10px;cursor: pointer;z-index:999}

.editor {height:60px;margin-bottom:5px;}

#form_post textarea {width:100%}
.form_tool {padding:10px 0px;margin-bottom:20px;position: relative;}
.form_button {position: absolute;width:120px;right:0px;user-select: none;padding:10px 10px;background: #3a3636; color: #f7d0bf;border: 1px solid #3a3636;border-radius: 5px;cursor: pointer;}
.form_button:hover{border:1px solid #f7d0bf}

.box {position: relative;height:auto;margin:5px;border-radius: 10px;}


.user_home {margin:20px;text-align:center;position: relative; padding: 20px; margin: 20px 8px; border-radius: 10px;}
.user_home .face {margin:0px auto;display: block;width: 180px;height: 180px;border-radius: 100%;}
.user_home .name {margin:10px;font-size:24px;}
.user_home .intro {margin:10px;font-size:16px;}
.user_home span {display: inline-block;}
.user_home .division {margin:0px 10px}
.user_home .fans span{margin:5px;padding:10px 15px;border-radius: 10px;}
.user_home .fans span i{display: block;text-align:center;margin-top:5px;}
.user_home .follow {cursor: pointer;}
.user_home .button {position: relative;padding:10px 15px;width:120px;color:#F9E699;border-radius:4px;margin:10px auto;background:#3A3636}

.user_box {position: relative;max-width:600px; border-radius: 10px;    margin: 10px auto;   padding: 20px;}
.user_box h2 {color:#f7d0bf;font-size:18px;margin:15px 5px;word-break:break-all;word-wrap:break-word;}
.upload {position: absolute; width: 100%; height: 100%; right: 0;top: 0;opacity: 0; filter: alpha(opacity=0);cursor: pointer;}

.b300,.b3001 {
	text-align: center;
	padding: 5px;
	margin-bottom:10px;
}


.h100 {
	display: inline-block;
	height: 100px;
	overflow: hidden;
	text-align: center;
	margin: 5px;
	position: relative;
}

.h100 img{
	width:300px;
	height:100px;
}

.h100 span , li.iframe span{
    position: absolute;
    background: rgba(0,0,0,.54);
    color: #fff;
    font-size: 12px;
    border-radius: 2px;
    padding: 2px 5px;
    right: 5px;
    bottom: 5px;z-index:99999;
}


.logs , .share {font-size:0px;padding:10px 0px;background: #101010;}
.logs li,.share li {display:inline-block;width:16.6%;color:#F7D0BF;cursor: pointer;text-align:center;vertical-align: top;}
.logs li i{font-size:24px;}
.logs li span{display:block;padding:5px;font-size:12px;vertical-align: middle;}
.logs li span i{font-size:12px;}
.logs .download {display:none;font-size:16px;text-align:center;}
.logs .download a {display:inline-block;color:#F9E699;vertical-align: middle;margin-top:10px;padding:10px}

.share {display:none;margin:10px 0px;text-align:right}
.share li {width:50px;}
.share li i{font-size:28px;color:#F9E699}

.qrcode {	position: fixed; 	left:0; top:0; 	background: rgba(0,0,0,0.8); 	width: 100%; 	height:100%;	z-index: 99999;	text-align: center;}
.qrcode img{	box-shadow: -2px 0px 20px #000;	margin-top:250px;}

hr {display:block;border:none;border-top:1px solid #242424;margin:10px 0px;height:1px;}


.footer {color:#999;padding:30px 10px;font-size:12px;line-height:2;border-top:1px solid #242424;text-align:center}

.pages {margin:20px 0px;text-align:center}
.pages a {background: #242424;color:#f7d0bf;height:35px;line-height:35px;border-radius: 3px;display: inline-block;padding:0px 15px;margin:2px;}
.pages a.active{background: #ff5b82;color:#fff}
.pages a:hover {background: #ff5b82;color:#fff;;transition: all 0.5s;}


.h100 iframe {margin:0px}


.loading {display:nones;position:absolute;width:100%;height:100%;border-radius: 10px;padding-top:50px;left:0px;top:0px;z-index:99999;text-shadow: 0 1px 0 #fff;background-color:rgba(0,0,0,0.5);text-align:center;box-sizing:border-box;}
.loading i {font-size:96px;color:#F9E699}

.msg_tips {
  position:absolute;
  pointer-events:none;
  left:50%;
  top:50%;
  margin-left:-124px;
  z-index: 19891045;
  text-align: center;
  background: #666;
  box-shadow: 0 10px 30px 0 rgba(68,74,102,.5)!important;
  text-align:center;
  color: #fff;
  border-radius: 5px;
  padding: 12px 24px;
  text-align: center;
  line-height: 24px;
  font-size: 14px;
  min-width: 200px;
  transition: all .1s ease-in;
}

.msg_tips{animation: 3s opacity 0s infinite; animation-iteration-count:1;animation-fill-mode: forwards;}

@keyframes opacity{
  0%{opacity:0;transform: translateY(0);}
  50%{opacity:1;transform: translateY(-30px);}
  75%{opacity:1;transform: translateY(-30px);}
  100%{opacity:0;transform: translateY(-60px);}
}

@media (min-width:768px) {
  .list_box ul {width:33%;}
  .h100 {width: 238px;}
}

@media (min-width:1024px) {
  .list_box ul {width:25%;}
  .h100 {width: 300px;}

  .header .hot {display:inline-block;margin-left:50px;}
  .header .search {display:inline-block;width:300px;margin-left:50px;}
  .header .logo {display:inline-block;}
  .header .menu {display:none}
  .header .logo i.icon {font-size:36px;}
  .header .logo .name {font-size:18px;}
  .header .logo .domain {font-size:16px;}
  .dropdown-content {margin-top:0px;}
  .header .logo img {height:50px}
}

@media (min-width:1281px) {
  .container {width:98%;}
  .header .user {right:20px;top:15px;}

  .list_box ul {width:20%;}
  .h100 {width: 300px;}
  .list_box li.intro {padding:10px;}

  .user_box {position: relative;max-width:600px;margin:10px auto;border-radius: 10px;}

  .logs li span{display:inline-block;}
  .ul1 ul {width:50%;}
}

@media (min-width:1920px) {
  .container {width:1900px;}
  .list_box ul {width:16.6%;}
  .h100 {width: 300px;}
  .ul1 ul {width:50%;}
}