/*
* 整站网站灰色 -- start --
**/
/*html{
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
-webkit-filter:grayscale(100%);
}*/
/*
*--- end --
*/
body{background-color: #f2f2f2; font-size:1em}
/*白色顶部*/
.top-header{z-index: 1; width: 100%; background-color: #fff; display: table; border-bottom: solid 1px rgba(0,0,0,0.2);}
.top-header h3{ font-size: 1.9em; color: #333; margin: 0 30%; display: table-cell; font-weight: normal; text-align: center; padding: 0.7em 0;}
.top-header .text{display: table-cell; text-align: center; width: 20%; font-size: 1.5em; color: #fc605a; }
.top-header .texta{ color: #999;}
.top-header a{display: table-cell;}
.top-header .icona{ width: 8.5%; padding-left: 5%; vertical-align: middle;}/*只能添加图标*/
.top-header .iconb{ width: 11%;padding-right: 5%; vertical-align: middle;}/*只能添加图标*/
.top-header .text-top{ width: 11%;color: #999;font-size: 1.169em; vertical-align: middle;}/*能添加文字*/
.top-header img{ width: 100%;}
/*固定顶部*/
/*登录注册*/
.login{ width: 100%; margin-top:5%;}
.login form{ width: 100%; }
.login form ul{ width: 100%; overflow: hidden;}
.login form ul li{ width: 90%; padding: 4% 5%; background-color: #fff; margin-bottom: 2%; overflow: hidden; }
.login form ul li img{ width:7%; vertical-align: middle;}
.login form ul li label{ font-size: 1.4875em; vertical-align: middle; color: #333; margin:0 3%; }
.login form ul li input{width: 70%; display: inline-block;vertical-align: middle; font-size: 1.4875em; color: #666; border: none;}
.login form input[type="submit"]{ width: 94%; margin: 5% 3%; padding: 4% 0;background-color: #FC605A;color: #fff; font-size: 1.7em; border-radius: 0.3em; border: none;}
/*首页*/
/*头部开始*/
.page-header{ width: 100%; background-color: #000; overflow: hidden;}
.headerop{float:left; width:6%; padding: 1.5em 0px 0em 2em;position:absolute;z-index:999999}
.header{width:13.3%; float: right; padding:1em 0px;}
.page-header h3{width:100%; position: relative; font-size:1.5em; color: #fff; font-weight: normal; text-align: center; line-height:3.8em;}
.page-header h2{width:100%; float: left;position: relative; font-size:1.5em; color: #fff; font-weight: normal; text-align: center; line-height:4em;}
.page-header input{ width: 60%; border: none; border-radius: 3em; margin: 2% 5%; padding: 1.5% 7.5%; font-size: 1.7em; float: left; }
.page-header span{ width: 15%; display: inline-block;margin: 3% 0; float: right;}
.page-header span img {width: 50%; }
.contaniner{ width: 100%; overflow: hidden;}
.contaniner .ban li{}
.contaniner .ban a{ width: 100%;display: block; overflow: hidden;}
.contaniner .ban img{ width: 100%;height: auto; display: block;}
/*主体开始*/
.contaniner .shop{ width: 100%; height: 530px; background:url(../images/beijing.jpg)repeat;}
.contaniner .main{width:100%; height:33em;}
.main ul{width:33.3%; height:auto; float:left; margin:1em 0px;}
.main ul img{width:65%; height:50%; margin: 0 16%;}
.main li{font-size:1.3em; color:#fff; line-height:1.5em; text-align:center;}
/*主体结束*/
/*通知公告开始*/
.wealth{width:100%; background:url(../images/wealth.jpg)repeat; border-top: 1px solid #585c63;}
.wealth h3{width:20%;
font-size:1.2em;
color: #fff;
line-height:2.5em;
text-align:center;
letter-spacing:0.2em;
float:left;
background-color:#0B8EEA;
border-radius: 0.5em;
margin:0.3em 0 0.8em 0.8em;
}
.wealth li{font-size:1.1em; color: #E57505; line-height:2em; text-align: center; padding: 0.8em 0;}
/*通知公告结束*/
/*首页提示开始*/
.hint{width:100%; background:url(../images/hint.jpg)repeat; opacity:2%;}
.hint li{font-size:1em; color:#E57505; line-height:4em; text-align: center;}
/*底部*/
.page-footer{width: 100%; overflow:hidden;}
.page-footer ul{width: 100%; background-color: #000; overflow:hidden;/*margin-top: -14px;*/}
.page-footer ul li{float:left; width:23%; text-align: center; padding:2% 0; }
.page-footer ul li a{width:100%; display: block;}
.page-footer ul .active a p{color:#E77605;}
.page-footer ul li img{width:25%;}
.page-footer ul li p{font-size: 1.275em; color: #fff;margin-top: 3%;}
/*本馆介绍页*/
.jsmain{width:100%; height:auto;}
.jsbeij{width:100%; height:auto; position:absolute; z-index:-1; margin-top:0.5em;}
.jsmain{width:100%; height:auto;}
.jsbeij img{width:100%; height:100%;}
.jesmain{width:90%; height:auto; margin:0 auto;}
.jesone{width:100%; }
.jo{width:100%; height:auto; padding:1.5em 0px;}
.jo img{width:100%; }
.jesone ul li {font-size:1em; line-height:1.6em; text-indent:2em;}
.sub_con_r_top {width:100%; height:50px; line-height:50px; margin:0px auto; border-bottom:0.3em solid #CCC;}
.jies {width:40%; float:left; border-bottom:0.3em solid #424242;}
.jies li {font-size:1.5em; line-height:2.5em; color:#0B0A0A; font-weight:bold;}
.jies img {margin:10px; float:left;}
.jestwo{width:100%;}
.jestwo ul{width:38%; border:0.1em solid #CCC; float:left; margin:1em; background:#fff;}
.jestwo img {width:100%; height:100%;}
.jestwo ul li {font-size:16px; line-height:28px; color:#0B0A0A; text-align:center;}
/*非物遗产开始*/
#wrapper {width: 100%;margin-bottom: 60px;}
#body_wrapper {background: white; width: 100%; }
#tab-zbjpone{width:100%;margin:0 auto; background-color:#f0f0f0;height:auto;padding-top:0.5em;}
#tab-zbjptwo{width:100%;margin:0 auto; background-color:#f0f0f0; height:auto;padding-top:0.5em;}
.tab-zbjp{width:100%;margin:0 auto;}
.tab-zbjp h3{float:left;
width:40%;
background-color:#F2F1F6;
color: #888;
font-size: 16px;
text-transform: uppercase;
line-height: 80px;
letter-spacing: 2px;
font-weight: 300;
color: rgb(0, 0, 0);
line-height: 1.8em;
border-radius: 0.5em;
padding: 1em;
}
.tazbjp LI {background: white; width: 95%; margin: 0 auto;}
.tazbjp A {
color:#fff;
background:#57595C;
display: block;
font-size:1.2em;
padding:0.8em 0.1em;
text-decoration: none;
text-align: center;
}
.tazbjp A:hover {
color:#ED9542;
background:#57595C;
display: block;
font-size:1.2em;
padding:0.8em 0.1em;
text-decoration: none;
}
.tazbjp LI:hover {background: #a57595c ;}
.tazbjp LI:hover A {color:#ED9542; }
.active {background: #57595c;}
.active A {color:#ED9542;}
UL.zslive { /* Horizontal lists */
display: inline;
margin: 0
}
UL.zslive > LI {
display:inline-block;
width:32%;
/* IE */
*margin: 1px;
zoom: 1;
*display: inline;
}
ARTICLE UL {
list-style: disc outside none;
margin-left: 2.615em; /* 34px */
}
UL LI, OL LI {line-height: 1.385em}
.zbjp{width:100%; margin:0 auto; position:absolute;}
.zbjp img {width:100%; margin:0 auto;}
.fyi{width:100%; color:#fff; height:3em; background-color:#0c0c0c; opacity:0.6; border-top:1px solid #000; color:#fff; letter-spacing:0.2em;}
.fyi a{width:100%; font-size:1.5em; line-height:0.8em; float:left; text-align:center;}
.fyi a:hover{font-size:1.5em; line-height:0.8em; float:left; text-align:center;}
.zbjptwo{width:95%; height:3em; margin:0 auto;}
.jpone{width:15%; float: left;}
.jpone img{width:12%; margin-left:2em;}
.jpone dl dt{font-size:0.5em; line-height:1em; text-align:center;}
.jptwo{width:80%; background-color:#fff; float: left; margin-top: 0.3em;}
.jptwo a{background-color:rgb(255, 255, 255);font-size:0.6em; line-height:1.6em; text-align:center; color:#6f070c;float:left;}
.jptwo a:hover{background-color:rgb(255, 255, 255);font-size:0.6em; line-height:1.6em; text-align:center; color:#ED9542;float:left;}
.jptwo span{font-size:0.6em; line-height:3em; text-align:center; color:#b3b3b3; float:left;}
/*非物遗产结束*/
/*基层文化开始*/
.jic{width:100%;background:#fff;}
.jice{width:90%; margin:0 auto;padding-bottom:30px;}
.jiceng {width:100%; margin:0.5em auto;}
.jiceng ul {width:43%; margin:0.8em; float:left; box-shadow:0px 0px 0.8em #B7B3B3;}
.jiceng ul li {line-height:2em; color:#ccc; text-align:center; background:#E2853A none repeat scroll 0% 0%;}
.jiceng ul li a {color:#FFF; text-decoration:none;}
.jiceng ul li img {width:100%; height:100%;}
.pagelist {display:block; position:relative; text-align:center; cursor:pointer;margin-bottom:100px}
.pagelist a.cur {background-color:#A87A4C; color:#FFF;}
.pagelist a {display:inline-block; font-size:1.2em; line-height:1.8em; background:#FFF none repeat scroll 0% 0%; padding:0 0.4em; border:0.1em solid #E6E9EC;}
/*基层文化结束*/
/*精彩视频开始*/
.spvideo {width:100%; margin:0.5em auto;}
.spvideo ul {width:45%; margin:0.8em 0.6em; float:left;}
.spvideo ul li {line-height:1.2em; color:#000; text-align:center;}
.spvideo ul li a {color:#FFF; text-decoration:none;}
.spvideo ul li img {width:100%; height:130px;}
/*精彩视频开始*/
/*群文活动开始*/
.huod {width:100%; margin:0.5em auto;}
.huod ul{width:100%;}
.huod .listcon li {padding:1em 0; border-bottom:0.1em solid #EEE; height:6em;}
.huod .listcon img {float:left; width:30%; margin-right:1em;height: 6.5em;}
.huod .listcon .item {display:block; padding-left:34%; position:relative;}
.huod .listcon .item .title {
display:block;
font-size:1.2em;
color:#313131;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
margin-bottom:0.2em;
text-decoration:none;
font-weight:bolder;
}
.huod .listcon .item .cnt {
display:block;
font-size:1.2em;
color:#7E7E7E;
line-height:1.5em;
text-decoration:none;
text-indent:2em;
}
.huod .listcon .item .time{color:#ccc;}
/*群文活动结束*/
/*文艺创作开始*/
UL.creation {display:inline; margin:0}
UL.creation > LI {display:inline-block; width:15%; *margin: 1px; zoom: 1; *display: inline;}
.czuo{width:100%; background:#fff;}
.czu{width:90%; margin:0 auto; height:50em;}
.czu dl {width:41%; margin:1em; float:left;}
.czu dl dt {font-size:1.2em; line-height:1.3em; text-align:center; color:#000;}
.czu dl dt a {padding:0; text-decoration:none; margin-bottom:0.5em;}
.czu dl dt img {padding:0; width:100%; height:100%;}
/*文艺创作结束*/
/*新闻资讯开始*/
.huod .listcon .zx{color:#E57505; display:block; padding:1em 0; border-bottom:0.1em solid #EEE; height:1em;}
/*新闻资讯结束*/
/*艺术考级开始*/
UL.level {display:inline; margin:0}
UL.level > LI {display:inline-block; width:45%; *margin: 1px; zoom: 1; *display: inline;}
.kaoji{width:100%; background:#fff;}
.kaoj{width:90%; margin:0.5em auto;}
.kaojone{width:100%; border-bottom:1px solid #ccc; padding-top:1em; height:5em;}
.kaojone dl{width:88%; float:left;}
.kaojone img{width:7%;}
.kaojone a{background:#fff;}
.kaojone a:hover{background:#fff;}
.kaojone dt{font-size:1.2em; font-weight:bold; color:#000;}
.kaojone .timer{font-size:1.2em; color:#ccc; line-height:2em; font-weight:100;}
.center{text-align: center;}
.login-page {
width: 360px;
padding:5% 0;
margin: auto;
}
.form {
position: relative;
z-index: 1;
background: #FFFFFF;
margin: 0 auto 100px;
padding:2em 3em;
text-align: center;
box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}
.form input {
font-family: "Roboto", sans-serif;
outline: 0;
background: #f2f2f2;
width: 100%;
border: 0;
margin: 0 0 15px;
padding: 15px;
box-sizing: border-box;
font-size: 14px;
}
.form button {
font-family: "Microsoft YaHei","Roboto", sans-serif;
text-transform: uppercase;
outline: 0;
background: #FFAE00 ;
width:86%;
border: 0;
padding: 15px;
color: #FFFFFF;
font-size: 14px;
-webkit-transition: all 0.3 ease;
transition: all 0.3 ease;
cursor: pointer;
}
.form button:hover,.form button:active,.form button:focus {
background: #43A047;
}
.login-form .message {
margin: 15px 0 0;
color: #b3b3b3;
font-size: 12px;
}
.login-form .message a {
background:#fff;
color:#FFAE00;
padding:0em
color: #FFAE00;
text-decoration: none;
}
.form .register-form {
display: none;
}
.container {
position: relative;
z-index: 1;
max-width: 300px;
margin: 0 auto;
}
.container:before, .container:after {
content: "";
display: block;
clear: both;
}
.container .info {
margin: 50px auto;
text-align: center;
}
.container .info h1 {
margin: 0 0 15px;
padding: 0;
font-size: 36px;
font-weight: 300;
color: #1a1a1a;
}
.container .info span {
color: #4d4d4d;
font-size: 12px;
}
.container .info span a {
color: #000000;
text-decoration: none;
}
.container .info span .fa {
color: #EF3B3A;
}
.shake_effect{
-webkit-animation-name: shake;
animation-name: shake;
-webkit-animation-duration: 1s;
animation-duration: 1s;
}
@-webkit-keyframes shake {
from, to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
@keyframes shake {
from, to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
p.center{
color: #fff;font-family: "Microsoft YaHei";
}
/*艺术考级结束*/
/*艺术培训开始*/
.pex{width:90%; margin:0.5em auto;}
.pex dl{width:100%; border-bottom:0.1em solid #ccc;}
.pex dl a{background:#fff;}
.pex dl dt{width:88%; color:#000; font-size:1em; line-height:3.5em; float:left;}
.pex img{width:7%;}
.pex span{color:#ccc; font-size:1em; line-height:3.5em; margin-left:4em;}
/*艺术培训结束*/
/*在线留言开始*/
.luyn{width:100%; padding:2em 0; border-bottom:0.1em solid #ccc; height:6em;}
.luyn .luynone{width:25%; float:left;}
.luyn .luyntwo{width:75%; float:left;}
.luyn ul li {font-size:1.2em; line-height:1.5em; color: #000;}
.luyn img {width:85%; border:0.17px solid #000;}
.luyn .yantwo {width: 610px; float: right;}
.luyn .yanthree span{font-size: 12px; line-height: 15px; color: #CCC;}
.luyn .huifu {
background: #FFAE00 none repeat scroll 0% 0%;
font-size:1.2em;
line-height:2em;
border-radius: 11%;
width:25%;
text-align:center;
float:right;
}
.luyn .huifu a {color: #FFF; text-decoration: none;}
.message {max-width:400px; width:100%; margin:0 auto; position:relative;}
#mess input[type="text"], #mess input[type="email"], #mess input[type="tel"], #mess input[type="url"], #mess textarea, #mess button[type="submit"] { font:400 12px/16px "Open Sans", Helvetica, Arial, sans-serif; }
#mess {margin:5px 0;}
#mess h3 {color: #000;
display: block;
font-size:2.5em;
font-weight:400;
line-height:2em;
text-align:center;
}
fieldset {
border: medium none !important;
margin:0.5em 1em;
width:42%;
float:left;
}
#mess input[type="text"], #mess input[type="email"], #mess input[type="tel"], #mess input[type="url"], #mess textarea {
width:100%;
border:0.1em solid #CCC;
background:#FFF;
margin:0 0 0.1em;
padding:0.5em;
}
#mess input[type="text"]:hover, #mess input[type="email"]:hover, #mess input[type="tel"]:hover, #mess input[type="url"]:hover, #mess textarea:hover {
-webkit-transition:border-color 0.3s ease-in-out;
-moz-transition:border-color 0.3s ease-in-out;
transition:border-color 0.3s ease-in-out;
border:1px solid #AAA;
}
#mess textarea {height:5em; max-width:92%; resize:none;}
#mess button[type="submit"] {
cursor:pointer;
width:100%;
border:none;
background:#157710;
color:#FFF;
margin:0 0 5px;
padding:10px;
font-size:15px;
border-radius:0.5em;
}
#mess button[type="submit"]:hover {
background:#1f501d;
border-radius:0.5em;
-webkit-transition:background 0.3s ease-in-out;
-moz-transition:background 0.3s ease-in-out;
transition:background-color 0.3s ease-in-out;
}
#mess button[type="submitone"] {
cursor:pointer;
width:100%;
border:none;
background:#d44f1b;
color:#FFF;
margin:0 0 5px;
padding:8px;
font-size:15px;
border-radius:0.5em;
}
#mess button[type="submitone"]:hover {
background:#764532;
border-radius:0.5em;
-webkit-transition:background 0.3s ease-in-out;
-moz-transition:background 0.3s ease-in-out;
transition:background-color 0.3s ease-in-out;
}
#mess button[type="submit"]:active { box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.5); }
#mess input:focus, #mess textarea:focus {outline:0; border:1px solid #999;}
/*在线留言结束*/
/*最新动态开始*/
.dtai{width:100%; height:3em;}
.dtai a{font-size:1.2em; line-height:1.5em; text-align:center; color:#000; font-weight:bolder;}
.dtai a:hover{font-size:1.2em; line-height:1.5em; text-align:center; color:#ED9542; font-weight:bolder;}
.dtai-cnt span{font-size:1em; line-height:1.5em; float:right; color:#ccc;}
.dtai-cnt span:hover{font-size:1em; line-height:1.5em; float:right; color:#ED9542;}
/*最新动态结束*/
/*内容详情页开始*/
.nyxq {
width:100%;
margin:0.5em auto;
overflow: hidden;
}
.nyxq h3{font-size:1.5em; line-height:2em;color:#000; padding-top:0.5em;}
.nyxq li{
font-size:1.1em;
line-height:1.5em;
color:#848282;
text-align: left;
float: left;
width: 100%;
}
.nyxq img{width:100%; height:100%; margin:0.5em 0; display: block;}
/*内容详情页结束*/
/*用户登陆开始*/
.landing {
width: 100%;
height: auto;
position: absolute;
z-index: -1;
}
.landing img {
width: 100%;
height: 100%;
}
/*用户登陆结束*/