@charset "utf-8";
*{margin: 0;padding: 0;border: 0;outline: none;box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box;-ms-box-sizing: border-box; -moz-box-sizing: border-box; font-style:normal;}

.fl {float: left;}
.fr {float: right;}

.container{display: block;width:90%; max-width: 1440px; margin: 0 auto;}

.gai{margin-left:35%;margin-top:-4.7%}

/*banner***********************************************************************/
.banner{width: 100%; overflow: hidden; position:relative;}
.banner .swiper-slide{ background-repeat: no-repeat; background-position: center; background-size: cover;display: flex; align-items: center; justify-content: center;}
.banner .swiper-slide b{font-size: 66px; color: #fff; margin-top: -4%}
.banner .ban-prev, .banner .ban-next{ width: 36px; height: 80px; margin-top: -40px; }
.banner .ban-prev{background: rgba(0,0,0,0.5) url(../images/ban-prev.png) center center no-repeat;}
.banner .ban-next{background: rgba(0,0,0,0.5) url(../images/ban-next.png) center center no-repeat;}

.banner .ban-prev:hover, .banner .ban-next:hover{background-color:rgba(201,175,127,0.5)}

.banner .swiper-pagination-bullet {background:#fff; opacity:0;border-radius:50%; width: 10px;height: 10px;}

.banner .swiper-pagination-bullet-active{background: #19210c;}

/*sect01***********************************************************************/
.sect01{width: 100%; display: table; margin-top: -140px; position: relative; z-index: 1}

.sect01 li{width: 23.5%; float: left; background: rgba(0,0,0,0.6); margin-right: 2%;
font-size: 22px; color: #fff; text-align: center; height: 90px; line-height: 90px}
.sect01 li img{margin-right: 10px;width: 35px;}
.sect01 li a{display: block;}
.sect01 li:hover{background: rgba(255,255,255,0.6)}
.sect01 li:last-child{margin-right: 0}
.sect01he{height: 50px; width: 100%;}
/*sypro***********************************************************************/

.sypro-t{width: 100%; padding: 4% 0; text-align:center;}

.sypro-t .b1{font-size: 56px; color: #e9e9e9; line-height: 1; text-transform: uppercase;letter-spacing: -4px;}
.sypro-t .b2{font-size: 34px; color: #2b2b2b; line-height: 1; display: block;}
.sypro-t p{font-size: 16px; color: #808183; margin-top: 15px}







.sypro{width: 100%; display: table; }



.sypro li{width: 48%; margin-right: 2%; float: left; }



.sypro li figure{width: 50%; text-align: center; background: #fff;}



.sypro li figure img{width: 94%;}



.sypro li figure img:hover{transform: scale(0.96); -webkit-transform: scale(0.96);



-o-transform: scale(0.96); -ms-transform: scale(0.96); -moz-transform: scale(0.96);}



.sypro li figure .more{width: 54%;display: inline-block; margin-top: 10px;



height: 35px; line-height: 35px; font-weight: bold; color: #d79420; border: 1px solid #dcdcdc;



text-transform: uppercase;}



.sypro li .syproy{width: 50%; background: #fafafa; padding: 28px;}



.sypro li .syproy h2{ font-size: 45px; line-height: 1.2; font-weight: lighter}



.sypro li .syproy b{ font-size: 30px; display: block; line-height: 1.1; margin: 10px 0 20px 0}



.sypro li .syproy span{ font-size: 18px; display: block; }



.sypro li .syproy span:after{content: ""; display: block; height: 2px; width: 50px;



margin: 6px 0 12px 0;}



.sypro li .syproy:hover span:after{width: 100%;}



.sypro li figure .more:hover{background: #d79420; color: #fff}











.skin01 span:after{ background: #b0986a;}



.skin02 span:after{ background: #6ba685;}



/*其他在   pro*/











/*syscroll***********************************************************************/



.syscrollzong{overflow: hidden; width: 100%;}



.syscrollzong .syscroll{overflow:visible;margin: 4% auto!important;}



.syscroll .swiper-slide img{width: 100%;}



.syscroll .scroll-prev, .syscroll .scroll-next{ width: 40px; height: 80px; margin-top: -40px; }



.syscroll .scroll-prev{background: rgba(0,0,0,0.5) url(../images/ban-prev.png) center center no-repeat;



left: -60px;}



.syscroll .scroll-next{background: rgba(0,0,0,0.5) url(../images/ban-next.png) center center no-repeat;



right: -60px}



.syscroll .scroll-prev:hover, .syscroll .scroll-next:hover{background-color:rgba(201,175,127,0.5)}













.bian{width: 100%; color: #5c5c5c;line-height: 2; }

.bian p{color: #5c5c5c;line-height: 2;}

.bian img{width: auto; max-width: 100%}



/*sectxia***********************************************************************/



.secbgzimu{position: relative;}



.secbgzimu>img{max-width: 100%;position: absolute; z-index: -1;}



.secbgzimu>.im1{top: 1.5%; right: 10%}



.secbgzimu>.im2{top: 25%; right: 6%}



.secbgzimu>.im3{top:35%; left:3%}















.sectxia{width: 100%; display: table;}



.sectxia li{width: 100%; float: left; margin-bottom:7%;}







.sectxia li figure{position: relative;}



.sectxia li figure a{display: block;}



.sectxia li figure img{width: 100%;}



.sectxia li figure i{position: absolute;background: #fafafa;



 z-index: -1}







.sectxia li .zi{}



.sectxia li .zi b{font-size: 30px; color: #3b3a3a; display: block;}



.sectxia li .zi span{font-size: 36px; color: #3b3a3a; display: block; font-weight: lighter;}



.sectxia li .zi p{ color: #787878; line-height: 2;}



.sectxia li .zi .more{width:140px;display: inline-block; margin-top:30px;



height: 35px; line-height: 35px; font-weight: bold; color: #d79420; border: 1px solid #dcdcdc;



text-transform: uppercase; text-align: center;}



.sectxia li .zi .more:hover{background: #d79420; color: #fff}



.sectxia li.li01{ padding:0 50px;}



.sectxia li.li01 figure{width: 52%;}



.sectxia li.li01 figure i{bottom: -9%; left: -6%; width: 46%; height: 74%}



.sectxia li.li01 .zi{width:46%; text-align: right;}



.sectxia li.li01 .zi b{margin-top:16%}







.sectxia li.li04 .zi{text-align: left; padding-left: 7%}



.sectxia li.li04 figure i{bottom: -9%; left: auto; right: -6%;}











.sectxia li.li02{ padding:0 20% 0 10%;}



.sectxia li.li02 figure{width: 33%;}



.sectxia li.li02 figure i{top: -9%; right: -12%; width: 96%; height: 79%}



.sectxia li.li02 .zi{width:50%;}







.sectxia li.li03 {margin-top: -8%}



.sectxia li.li03 figure i{top:auto; bottom: -9%; right: auto; left: -12%}



.sectxia li.li03 .zi{text-align: right; margin-top: 10%}









/*内页****公共*******ban***************************************************/



.ban{width: 100%; overflow: hidden;height: 313px;background-repeat: no-repeat;



 background-position: center; background-size: cover;



display: flex; align-items: center; justify-content: center;}



.ban span{font-size:36px; color: #fff;}



.ban span:after{content: ""; display: block; width: 50px; height: 2px;



 background: #fff; margin:0 auto; margin-top: 10px;}







.posi{width: 100%; font-size: 14px; color: #838383; border-bottom: 1px solid #f2f2f2; padding: 15px 0;



margin-bottom: 4%}



.posi>a:hover{text-decoration: underline; color: #19210c}















/*pro***********************************************************************/



.pro{width: 100%; display: table;margin: 4% auto; }



.pro li{width: 48%; margin-right: 2%; float: left; margin-bottom: 25px;}



.pro li figure{width: 50%; text-align: center; background: #fff;}



.pro li figure a{display: block;}



.pro li figure img{width: 98%;}



.pro li figure img:hover{transform: scale(0.96); -webkit-transform: scale(0.96);



-o-transform: scale(0.96); -ms-transform: scale(0.96); -moz-transform: scale(0.96);}







.pro li .proy{width: 50%; background: #fafafa; padding: 30px;}



.pro li .proy h2{ font-size: 45px; line-height: 1.2; font-weight: lighter}



.pro li .proy b{ font-size: 24px; display: block; line-height: 1.1; margin:20px 0}



.pro li .proy b:after{content: ""; display: block; height: 2px; width: 50px;



margin: 12px 0;}



.pro li .proy p{line-height: 1.8}



.pro li .proy .more{width: 100px;display: inline-block; margin-top: 20px;



height: 35px; line-height: 35px;text-transform: uppercase; text-align: center;}







.pro li .proy:hover b:after{width: 100%;}







.skin01{ color: #93763d;}



.skin01 b:after{ background: #b0986a;}



.skin01 p{ color: #b0986a;}



.skin01 .more{color: #b0986a; border: 1px solid #b0986a}



.skin01 .more:hover{background: #b0986a; color: #fff}







.skin02{ color: #4b8b67;}



.skin02 b:after{ background: #6fb18b;}



.skin02 p{ color: #6fb18b;}



.skin02 .more{color: #6fb18b; border: 1px solid #6fb18b}



.skin02 .more:hover{background: #6fb18b; color: #fff}







.skin03{ color: #9c5d71;}



.skin03 b:after{ background: #c1778e;}



.skin03 p{ color: #c1778e;}



.skin03 .more{color: #c1778e; border: 1px solid #c1778e}



.skin03 .more:hover{background: #c1778e; color: #fff}







.skin04{ color: #ac9707;}



.skin04 b:after{ background: #cbbc56;}



.skin04 p{ color: #cbbc56;}



.skin04 .more{color: #cbbc56; border: 1px solid #cbbc56}



.skin04 .more:hover{background: #cbbc56; color: #fff}







.skin05{ color: #93763d;}



.skin05 b:after{ background: #b0986a;}



.skin05 p{ color: #b0986a;}



.skin05 .more{color: #b0986a; border: 1px solid #b0986a}



.skin05 .more:hover{background: #b0986a; color: #fff}







.skin06{ color: #4b8b67;}



.skin06 b:after{ background: #6fb18b;}



.skin06 p{ color: #6fb18b;}



.skin06 .more{color: #6fb18b; border: 1px solid #6fb18b}



.skin06 .more:hover{background: #6fb18b; color: #fff}















/*procon***********************************************************************/



.zuo{ width:19%; display: table; margin-bottom: 4%;}



.zuo b{display: block; font-size: 24px; color: #222222; border-bottom: 1px solid #e5e5e5;



padding-bottom:15px; padding-left: 10px}



.zuo li{width: 100%;color: #4a4a4a; height:50px; line-height:50px;border-bottom: 1px solid #e5e5e5;



padding: 0 10px; background:url(../images/zuo-libg.jpg) no-repeat 98% center;}



.zuo li>a{}



.zuo li.cur, .zuo li:hover{color: #19210c}







.you{width: 78%; display: table;}



/*procons**上***********/



.procons{width: 100%;display: table;}



.proconsz{width: 41%;}















.spec-preview{width:100%;}



.jqzoom{position:relative;cursor:pointer;display:block}



.jqzoom>img{width: 100%;}



.jqZoomPup{z-index:10;visibility:hidden;



	position:absolute;top:0;left:0;



	max-width:100px!important;max-height:100px!important;border:1px solid #aaa;background:#fff;



	opacity:.5;-moz-opacity:.5;-khtml-opacity:.5;filter:alpha(Opacity=50)}



.zoomdiv{z-index:20;position:absolute;top:0;left:0;



	width:200px;height:200px;background:#fff;border:1px solid #ccc;



	display:none;text-align:center;overflow:hidden}



.spec-scroll{clear:both;margin-top:10px;width:100%}



.spec-scroll .items{float:left;position: relative; width:100%;height:80px;overflow:hidden}



.spec-scroll .items ul{position:absolute;width:100%;}



.spec-scroll .items ul li{float:left;width:23%; height: 80px; line-height: 70px; margin-right:2%;



 text-align:center; background:#f8f8f8;border:2px solid #f8f8f8;}



.spec-scroll .items ul li>img{max-width:100%;max-height:100%}



.spec-scroll .items ul li:hover{border-color:#c69f65;}











.proconsy{width: 55%;}



.proconsy h1{font-size: 24px; color: #222222; font-weight: bold; display: block; 



	padding-bottom: 10px;border-bottom: 1px solid #e5e5e5}



.proconsy .zi{color: #4a4a4a;border-bottom: 1px solid #e5e5e5; padding: 4% 0;



line-height: 2}



.proconsy .zi b{font-size: 18px; color: #222222;}



.proconsy .zi i{font-size: 24px; color: #d79420;}



.proconsy .mai{width: 100%; display: table; margin: 40px 0;font-size:18px; color: #fff; height: 40px; line-height: 40px;}



.proconsy .mai>a{background:#19210c; margin-right: 10px;padding: 0 8%; display: inline-block;}



.proconsy .mai>span{background:#222222; padding: 0 8%; display: inline-block;}



.proconsy .xia{color: #5e5e5e;}



.proconsy .xia>a{margin-right: 20px;}



.proconsy .xia img{margin-right: 5px}



.proconsy .xia>a:hover{color: #19210c}



.proconsy .xia>span:hover{color: #19210c; cursor: pointer;}







/*proconm**中***********/



.proconm{width: 100%; display: table;border: 1px solid #e5e5e5; margin: 4% 0;}



.proconm .t{font-size: 14px; color: #3f3f3f; border-bottom: 1px solid #e5e5e5;



display: block; padding: 12px 0 12px 25px;}



.proconm ul{padding: 25px; width: 100%; display: table;}



.proconm ul li{float: left;width: 23%; margin-right: 2%}



.proconm ul li .img{border:1px solid #e5e5e5;display: flex; align-items: center; justify-content: center;



width: 45%; height: 90px}



.proconm ul li .img>img{max-width: 90%;}



.proconm ul li .y{width: 55%; padding: 10px;}



.proconm ul li .y b{font-size: 14px; color: #4d4d4d; display: block; max-height: 22px; overflow: hidden;}



.proconm ul li .y span{font-size: 12px; display: block;}



.proconm ul li .y .btn{font-size: 12px; display: inline-block; color: #19210c;



border: 1px solid #19210c;width: 100%; text-align: center; margin-top: 15px;}



.proconm ul li .img:hover{border:1px solid #19210c}



.proconm ul li .y .btn:hover{background: #19210c;color: #fff}







/*proconx**下***********/



.proconx{width: 100%; display: table; color:#7e7e7e; line-height: 2; margin-bottom: 4%}



.proconx .t{ border-bottom: 1px solid #e5e5e5;width: 100%; margin-bottom: 20px}



.proconx .t>span{background:#19210c;font-size: 18px; color: #fff;width: 150px;



height: 45px; line-height: 45px; display: inline-block;text-align: center; }



.proconx img{max-width: 100%}







































/*news***************************************************************/ 

.news{width: 100%; display:table;}
.news li{width:100%; float:left; margin-bottom: 3%; border-bottom:1px solid #dcdcdc;}
.news li a{ display:block; padding: 25px;}
.news li i{ display:block;color: #a8a8a8;}
.news li i:after{content:""; display: block; margin: 10px 0 20px 0; width: 50px; height: 1px; background: #19210c}
.news li b{display: block; font-size:18px; color:#322d2c; margin: 10px 0}
.news li p{ color:#848484; line-height:25px; }
.news li .news-more{display: block; color:#19210c; margin-top:30px} 
.news li:hover{background: #19210c}
.news li:hover i{color: #fff}
.news li:hover i:after{background: #fff}
.news li:hover b{color: #fff}
.news li:hover p{color: #fff}
.news li:hover .news-more{color: #fff}


/*newscon******************************************************************/



.neirong{width: 100%; color: #5c5c5c;line-height: 2;max-width:1250px }



.neirong p{color: #5c5c5c;line-height: 2;}



.neirong img{width: auto; max-width: 100%}



.neirong-t{width: 100%;border-bottom: 1px solid #e5e5e5; padding-bottom:3%;



margin-bottom: 4%;text-align: center; }



.neirong-t>h1{font-size: 30px; color: #322d2c; font-weight: bold;}



.neirong-t .canshu{display: block; line-height:30px;}
.neirong-t .canshu img{ 
    vertical-align: middle;
    border: none;
}




.newscon-share{margin: 0 auto; margin-top: 4%; display: table;}



.newscon-share>span{float: left;}



.newscon-share .bdshare-button-style0-16{display: table;}







.artpage{width: 100%; display: table; color: #828282;border: 1px solid #eeeeee;



border-left: none; border-right: none; margin: 4% 0;}



.artpage span{width: 50%;float: left; padding:10px 0px 10px 20px}



.artpage span:first-child{border-right: 1px solid #eeeeee}



.artpage span:hover{color: #19210c; text-decoration: underline;}



















/*xun******************************************************************/



.xun01{width: 100%; font-size: 16px; color: #2f2f2f; line-height: 2;



text-align: center; margin: 4% auto; position: relative;}



.xun01 i{position: absolute; z-index: -1}



.xun01 i>img{width: 100%;}



.xun01 .i01{width: 14.5%; right: 0; top:9%}



.xun01 .i02{width: 16.5%; left: 0; top: 3%}







.xun01 b{font-size: 24px; color: #292929; display: block; margin-bottom: 4%}



.xun01 .img{display: block; width: 40%; margin: 0 auto;margin-bottom: 4%;



	background: #fff; padding: 4px; box-shadow:0px 0px 20px #999}



.xun01 .img>img{max-width: 100%}







.xun02{width: 90%; display: table; margin: 0 auto;font-size: 16px; color: #2f2f2f;margin-bottom: 4%}



.xun02 li.li01{width:66%; float: left;}



.xun02 li.li02{width: 32%; float: right;}



.xun02 li img{max-width: 100%;padding: 4px; background: #fff; box-shadow:0px 0px 20px #999;}



.xun02 p{width: 100%; margin-top: 20px; line-height: 1.8}







.xun03{width:56%;}



.xun03 li{float:left; width:49%; margin-right: 2%}







.xun04{width:96%;}



.xun04 li{float:left; width:49%; margin-right: 2%}







.xun05{width:90%;}



.xun05 li{float:left; width:32%; margin-right: 2%}















.xunxia{width: 90%; margin: 0 auto;margin-bottom: 4%;



 background: url(../images/xunxia-bg.png) no-repeat center center;



background-size: 100% auto; 



font-size:16px; color: #2f2f2f; text-align: center;}



.xunxia>img{max-width: 100%;padding: 4px; background: #fff; box-shadow:0px 0px 20px #999;



margin-bottom: 4%}











/*peifang******************************************************************/



.peifang{width: 100%; font-size: 18px; color: #383838; line-height: 2;



text-align: center; margin: 4% auto;/* font-family: "SimHei";*/}



.peifang b{font-size: 30px;}



.peifang p{font-size: 18px; color: #383838; line-height: 2; }



.peifang p>img{max-width: 100%}











.peifang01{width: 90%; display: table; margin: 3% auto; }



.peifang01 li{ border-radius: 20px; border: 1px dashed #c9c9c9; overflow: hidden;}



.peifang01 li>img{max-width: 99%;}



.peifang01 li.li01{width: 55%;}



.peifang01 li.li02{width: 41%;}







.peifang02{width: 69%; margin: 3% auto; display: table;



 border-radius: 20px; border: 1px dashed #c9c9c9; padding:15px;}



.peifang02>img{width: 49%; float: left; }



.peifang02 p{width: 47%; float: right; text-align: left;}







.peifang03{width: 69%; margin: 3% auto; display: table;



 border-radius: 20px; border: 1px dashed #c9c9c9; padding: 15px 0;



display: flex; align-items: center; justify-content: center;}



.peifang03>img{max-width: 96%}



















/*about******************************************************************/



.typemenu{ width:100%;display: inline-block; margin-bottom:3%;border-bottom: 1px solid #e5e5e5;}



.typemenu ul{}



.typemenu li{ float:left;text-align:center; font-size:16px;color:#343434;



 height: 80px;line-height:80px;padding:0 20px;}



.typemenu li a{ display: block;}



.typemenu li:hover, .typemenu li.cur{border-bottom: 1px solid #19210c;}







.about{width: 100%; color: #343434;line-height: 1.9; margin-bottom: 4%;max-width:1250px;}



.about span{font-size: 32px; display: block; font-weight: lighter}



.about p{color: #343434;line-height: 1.8 }



.ab01{width: 100%; text-align: center;}







.ab02{width: 100%; display: table; margin: 4% 0; position: relative;}



.ab02>img{width: 48%; margin-right: 3%}



.ab02 em{width: 29%;position: absolute; z-index: -1; right: 0; top: 0}



.ab02 em>img{width: 100%;}



.ab02 b{font-size:52px; color: #3b3a3a; margin-bottom: 10px; padding-top: 8%; display: block;}







/*partner**/



.partner {width: 100%; display: inline-block; margin-bottom:4%;}



.partner li{width: 19%; margin-right:1.2%; margin-bottom:20px; float: left; height: 110px;



background: #fff; border:1px solid #e4e4e4; display:flex;align-items: center; justify-content: center;}



.partner li img{max-width: 100%; max-height: 100%}



.partner li:hover{border: 1px solid #19210c}



.partner li:hover img{transform: scale(0.94); -webkit-transform: scale(0.94);



-o-transform: scale(0.94); -ms-transform: scale(0.94); -moz-transform: scale(0.94);}







/*contact**/



.conlist {display: table; width:92%; margin:0 auto; margin-bottom: 4%;}



.conlist li{ float: left; text-align: center; width: 33.3%;}



.conlist li:hover img{transform: scale(0.9); -webkit-transform: scale(0.9);



-o-transform: scale(0.9); -ms-transform: scale(0.9); -moz-transform: scale(0.9)}



.conlist li p{ color: #434343; margin-top: 30px;}



.contact2{width: 100%;display: table;}



.contact2 .k{width: 31%; border:none; padding-left: 10px;



height:45px; line-height:45px;color: #696969; background:#f1f1f1;



margin-right:3.1%; margin-bottom:20px;}



.contact2 .dk{width:89%; height: 140px; line-height: 26px; float: left; margin-right:0;}



.contact2 .b{float: right; font-size:24px; color: #fff; width: 8%; height: 140px;



 text-align: center; background: #19210c; border: none;



 cursor: pointer;}



.ditu{width: 100%; margin:4% auto}



.ditu>div{width: 100%; height: 400px!important}











/*newslist********************************************************************/
.newslist{width: 100%; display:table; margin-top: 4%}
.newslist li{width:50%; padding: 0 20px; float: left; margin-bottom:3%; position: relative;}
.newslist li a{display: block;}
.newslist li figure{width:35%; height: 170px; overflow: hidden;}
.newslist li figure img{width: 100%; min-height: 100%}
.newslist li .newslisty{width:61%;}

.newslisty b{font-size: 20px; color: #322d2c; display: block;max-height: 32px; overflow: hidden;}
.newslisty span{ color: #a8a8a8; display: block;margin: 8px 0}
.newslisty p{color: #848484; line-height: 24px;margin-bottom: 20px;max-height: 48px; overflow: hidden;}
.newslisty i{color: #a8a8a8; display: inline-block; padding: 3px 30px;border: 1px solid #eaeaea;}
.newslist li figure:hover img{transform: scale(1.2);}
.newslist li i:hover{border: 1px solid #19210c; background: #19210c; color: #fff}


.fenye{width: 100%; display: inline-block; margin:2% 0 4% 0; text-align:center;}
.fenye a{ color:#848484; border:1px solid #eeeeed; padding:5px 11px;}
.fenye a:hover{color:#fff;background: #19210c}
.fenye span{color:#fff;background: #19210c; border:1px solid #19210c; padding:5px 11px;}



/*about****************************************************************************/

.aboutul{width: 100%; display: table;}

.aboutul li{width: 23.5%; margin-right: 2%; float: left; margin-bottom: 20px;}

.aboutul li a b{width: 100%; display: block;}

.aboutul li a b>img{width: 100%; height: 100%}

.aboutul li a p{font-size: 16px;color: #333333; text-align: center;

margin-top: 20px;}

.aboutul li:hover{transform: translateY(-5px);-webkit-transform: translateY(-5px);

-o-transform: translateY(-5px); -ms-transform: translateY(-5px); -moz-transform: translateY(-5px);}



.topnav{ text-align:center; margin-bottom:3%;}
.topnav a{ display:inline-block; height:40px; line-height:40px; padding:0 20px; margin:0 10px; background:#f6f6f6;}
.topnav a.on,.topnav a:hover{ background:#19210c; color:#ffffff;}







img, .nav li, .sect01 li, .sypro li figure .more, .sypro li .syproy span:after, 

.sectxia li .zi .more, .pro li .proy b:after, .pro li .proy .more, .aboutul li,

.typemenu li, .partner li, 

.news li{transition: all .5s;-webkit-transition: all .5s;

-o-transition: all .5s; -ms-transition: all .5s; -moz-transition: all .5s;}

.iframe iframe{width:80%;height:600px;margin:0 auto;}