/*通用样式*/
*{margin:0;padding:0;word-wrap:break-word;}
body{font-size:12px;color:#4C4C4C;font-family:Arial,'microsoft yahei',simsun,sans-serif;color:#444;min-width:1200px;}
a{color:#4C4C4C;text-decoration:none;}
a:hover{color:#FF0000;}
a img{border:none;} 
div,ul,li,p,form{padding: 0px; margin: 0px;list-style-type: none;}
em{font-style: normal;font-weight: normal;}
table {padding: 0px; margin: 0px;list-style-type: none;}
dt,dl,dd {padding: 0px; margin: 0px;list-style-type: none;}
form{margin:0px;padding:0px;}
input[type="checkbox"], input[type="radio"] {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding: 0;}
input:focus,textarea:focus,select:focus{ outline:none;}
input[type="text"],select{ height:30px; line-height:30px; color:#999; border:1px solid #ddd;}

tr {padding: 0px; margin: 0px;list-style-type: none;}
h2,h3,h4{padding:0px; font-size:14px; font-weight:normal;}
i,em{ font-style:normal;}
.w1015{ width:1015px; overflow:hidden;}
.clear{ height:0px; clear:both; overflow:hidden;}
.blank10{ height:10px !important; overflow:hidden;}
.blank15{ height:15px !important; overflow:hidden;}
.blank20{ height:20px !important; overflow:hidden;}
.clearfloat {clear:both;height:0; overflow:hidden;}
.clearfix{display:block;*zoom:1}
.clearfix:after{content:"";display:block;height:0;clear:both;visibility:hidden}
.mainbox{ width:1180px; margin:0 auto;padding: 0 10px;}
.fl{ float:left;}
.fr{ float:right;}
.bk{border:1px solid red;}
.w1200{ width:1200px; overflow:hidden;margin:auto;}




/*首页样式*/

.header_logo{width:100%;height:230px;overflow:hidden;background:url(../images/logo.jpg) no-repeat top center;}


/*导航栏*/

.hl_nav{
    background:url(../images/navbg.jpg) repeat-x left top;
    position: relative;
    color: #ffffff;
    min-width: 1200px;
    height: 64px;
}
.hl_nav a{
    display: block;
    text-decoration: none;
    font-size:15px;
}
.hl_nav .shade{
    position: absolute;
    width: 100%;
    height: 200px;
    top: 64px;
    left: 0;
    z-index: 11;
    background-color: #EEEEEE;
    opacity: 0.9;
    filter: alpha(opacity=90);
    box-shadow: 0 5px 15px #CCCCCC;
    display: none;
    border-bottom: #ffffff solid 1px;
    border-bottom: rgba(255,255,255,0.3) solid 1px;
}
.hl_nav .nav_list{
    position: absolute;
    top: 0;
    left: 50%;
    margin: 0 0 0 -600px;
    z-index: 12;
    padding: 0;
    list-style: none;
    width: 1200px;
    overflow: hidden;
    height: 64px;border:0;
}
.hl_nav .nav_list>li{
    padding: 0;
    float: left;
    margin: 0;
    width: 150px;
    text-align: center;
    height: 264px;
}
.hl_nav .nav_head{
    height: 64px;
    line-height: 64px;
    color: #ffffff;
    font-size: 16px;
}
.hl_nav .nav_head .icon{
    font-size: 18px;
}
.hl_nav .item{
    height: 40px;
    line-height: 40px;
    color: #333333;
    position: relative;
}
.hl_nav .item:hover:after{
    content: '';
    display: block;
    position: absolute;
    width: 60px;
    height: 2px;
    bottom: 5px;
    left:45px;
    background-color: #004588;
}
.hl_nav .nav_list:hover{
    height: 264px;
    transition: height 0.3s;
}
.hl_nav .nav_list:hover + .shade{
    display: block;
}
.hl_nav .nav_list>li.highlight:hover{
    background-color: #ffffff;
}
.hl_nav .nav_list>li:hover .nav_head,.hl_nav .nav_list>li.active .nav_head{
    background-color: #2575b0;
}
/*.hl_nav .nav_list .first_li .highlight:hover{
    background: none;
}*/
.hl_nav .nav_list>li.right{
    float: right;
}
.hl_nav .nav_list>li:hover .item{

}



.menu_nav{overflow:hidden;background:url(../images/navbg.jpg) repeat-x left top;}
.menu_nav ul{width:1200px;margin:auto;overflow:hidden;height:64px}
.menu_nav ul li{float:left;line-height:64px;height:64px;width:150px}
.menu_nav ul .li_first{width:220px}
.menu_nav ul .li_first a{width:220px;text-align:center}
.menu_nav ul li a{color:#fff;font-size:16px;font-weight:600;display:block;text-align:center;width:150px;height:64px}
.menu_nav ul li a:hover{background:#1876bb;position:relative;color:#fff}
.menu_nav ul li dl{position:absolute;background:url(../images/navbg.jpg) repeat left top;;width:150px;display:none;z-index:99999}
.menu_nav ul li dl a{display:block;font-size:14px;line-height:40px;height:40px;border-bottom:1px solid #fff;font-weight:400}
.menu_nav ul li dl dt:last-child a{border-bottom:0}

.menu_nav .current{background:#1876bb;}


/*首页新闻和幻灯*/

.index_news{width:1200px;margin:auto;overflow:hidden;background:#fff;padding:40px 0;}
.index_news .w1200{overflow:hidden;}
.index_news .w1200 .leftbox{overflow:hidden;float:left;width:550px;}
.index_news .w1200 .rightbox{overflow:hidden;float: right;width:620px;}
.index_news .w1200 .rightbox .tit{overflow:hidden;height:60px;overflow:hidden;}
.index_news .w1200 .rightbox .tit .bigtit{width:153px;height:60px;background:url(../images/newstt.png) no-repeat left top;font-size:24px;font-weight:600;color:#0b61b4;line-height: 92px;padding-left:40px;float:left;}
.index_news .w1200 .rightbox .tit .xxkright{border-bottom:2px solid #0b61b4;width:411px;margin-left:-14px; float: right;height:58px;padding-left:30px;line-height:86px;}
.index_news .w1200 .rightbox .tit .xxkright a{font-size:18px;margin:0 15px;font-weight: 600;}
.index_news .w1200 .rightbox .tit .xxkright a:hover{color:#0b61b4;}
.index_news .w1200 .rightbox .tit .xxkright .cut{color:#0b61b4;}

.index_news .w1200 .rightbox .newscon{width:100%;padding-top:8px;}
.index_news .w1200 .rightbox .newscon ul{}
.index_news .w1200 .rightbox .newscon ul li{background:url(../images/dian.jpg) no-repeat left center;height: 49px;line-height: 49px;border-bottom: 1px dashed #d5d5d5;padding-left:15px;}
.index_news .w1200 .rightbox .newscon ul li a{float:left;width: 510px;font-size:15px;color:#333;    overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.index_news .w1200 .rightbox .newscon ul li span{float: right;display:block;width:95px;text-align:center;}
.index_news .w1200 .rightbox .newscon ul li:hover a{color:red;}
.index_news .w1200 .rightbox .newscon ul li:hover span{color:red;}



/*关于我们*/

.index_aboutus{width:100%;height:325px;overflow:hidden;background:url(../images/aboutbg.png) no-repeat top center;}

.index_aboutus .leftbox{width:850px;height:225px;margin-top:50px;background:#fff;border-radius:10px;overflow: hidden;float:left;}
.index_aboutus .leftbox .lbox{width:300px;height:225px;overflow:hidden;float: left;}
.index_aboutus .leftbox .lbox img{width:458px;height:257px;margin-left: -160px;margin-top: 5px;}

.index_aboutus .leftbox .rbox{width:500px;overflow:hidden;float:left;margin-left:10px;margin-top:40px;}
.index_aboutus .leftbox .rbox .t{overflow:hidden;background:url(../images/ttbg.jpg) no-repeat left center;height:28px;line-height:28px;padding-left:15px;}
.index_aboutus .leftbox .rbox .t h1{font-size: 20px;color:#4b6ec9;float: left;}
.index_aboutus .leftbox .rbox .t span{text-transform : uppercase;float: left;color:#d0d0d0;margin:6px 0 0 10px;}

.index_aboutus .leftbox .rbox p{line-height:26px;color:#818181;text-indent:2em;margin-top:10px;font-size:14px;}

.index_aboutus .leftbox .rbox .but{width:100%;overflow:hidden;height:40px;margin-top:10px;}
.index_aboutus .leftbox .rbox .but a{width:70px;height:30px;line-height:30px;display:block;color:#666;float: left;background:#f6f6f6;margin-right:20px;text-align:center;border-radius:6px;}
.index_aboutus .leftbox .rbox .but a:hover{color:#fff;background:#0b61b4;font-weight:600;}


.index_aboutus .rightbox{float:right;width:330px;margin-top:50px;overflow:hidden;}

.index_aboutus .rightbox a{display:block;margin-bottom:25px;border-radius:10px;overflow:hidden;height:100px;width:100%;}
.index_aboutus .rightbox a img{height:100%;width:100%;}


/*大事记*/
.dsjnav{width:880px;overflow:hidden;margin:auto;}
.dsjnav a{display:block;float:left;width:100px;height:36px;font-size:17px;line-height:36px;border-radius:8px;text-align:center; background:#f6f6f6;color:#666;margin-left:22px;margin-bottom:25px;}
.dsjnav a:hover{color:#fff;background:#0b61b4;font-weight:600;}
.dsjnav .on{color:#fff;background:#0b61b4;font-weight:600;}


/*项目动态*/

.index_xmdt{overflow:hidden;width:100%;min-height:220px;background:#fff;padding:50px 0;}

.index_xmdt .tt{overflow:hidden;background:url(../images/ttbg.jpg) no-repeat left center;height:28px;line-height:28px;padding-left:20px;}
.index_xmdt .tt h1{font-size: 20px;color:#4b6ec9;float: left;}
.index_xmdt .tt span{text-transform : uppercase;float: left;color:#d0d0d0;margin:6px 0 0 10px;}
.index_xmdt .tt a{float: right;color: #c3c3c3;font-weight: 600;margin: 8px 30px 0 0;}
.index_xmdt .tt a:hover{color:#4b6ec9;}

.index_xmdt .picsrcoll{margin-top:20px;position:relative;}
.index_xmdt .picsrcoll .img{margin-right:20px;border-radius:10px;overflow:hidden;position:relative;z-index:1;top:0;}
.index_xmdt .picsrcoll .img a{width:280px;height:170px;}

.index_xmdt .picsrcoll .t{height:40px;overflow:hidden;z-index:9;position: relative;width:280px;line-height:40px;
      background-color:#4b6ec9;
      background-color:rgba(75,110,210,0.8);
}
.index_xmdt .picsrcoll .t a{color:#fff;font-weight:600;font-size:14px;}

.index_xmdt .picsrcoll .img a img{
    -webkit-transition: -webkit-transform 1s ease-out;
    -moz-transition: -moz-transform 1s ease-out;
    -ms-transition: -ms-transform 1s ease-out;
    transition: transform 1s ease-out;
}
.index_xmdt .picsrcoll .img a img:hover{
    transform:scale(1.2);
    -webkit-transform:scale(1.2);
    -moz-transform:scale(1.2);
    -ms-transform:scale(1.2);
}


/*中间新闻*/

.index_midnews{overflow:hidden;width:100%;padding:21px 0;background:url(../images/bg3.png) no-repeat top center;}

.index_midnews .tt{overflow:hidden;height:36px;line-height:36px;border-bottom:1px solid #4b6ec9;margin-bottom:15px;}
.index_midnews .tt h1{font-size:20px;color:#4b6ec9;float: left;border-bottom:3px solid #4b6ec9;width:100px;height:34px;text-align:center;display:block;}
.index_midnews .tt a{margin-top: 12px;float: right;display:block;width:19px;height:19px;background:url(../images/h.png) no-repeat top left;}
.index_midnews .tt a:hover{background:url(../images/ha.png) no-repeat top left;}

.index_midnews ul {}
.index_midnews ul li{background:url(../images/dian.jpg) no-repeat left center;height:40px;line-height:40px;padding-left:15px;}
.index_midnews ul li a{color:#818181;float: left;width:290px;font-size:15px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.index_midnews ul li span{float:right;color:#8c8989;}
.index_midnews ul li:hover a{color:red;}
.index_midnews ul li:hover span{color:red;}

.index_midnews .leftbox{float: left;width:380px;margin-right:30px;}

.index_midnews .midbox{float: left;width:380px;}

.index_midnews .rightbox{float: right;width:380px;}


/*友情链接*/

.index_link{overflow:hidden;width:100%;padding:30px 0;background:#f6f6f6;}
.index_link .w1200{background:url(../images/link.jpg) no-repeat top center;padding:80px 0 20px 0;}
.index_link a{font-size: 15px;display:block;float: left;height:40px;;line-height:40px;text-align:center;border-radius:6px;background:#fff;padding:0 20px;margin-right:30px;margin-bottom: 30px;}
.index_link a:hover{background:#4b6ec9;color:#fff;font-weight:600;}





/*底部样式*/

.footer{width:100%;height:240px;background:url(../images/footerbg.jpg) no-repeat top center;position:relative;}

.footer .gs{width:57px;height:51px;margin:auto;display:block;top:-25px;position:relative;}

.footer p{text-align:center;line-height:30px;font-size:16px;color:#afafaf;}
.footer p a{color:#afafaf;}
.footer p a:hover{color:#4b6ec9;}



/*导航栏面包屑*/
.navdh{background:#f6f6f6;overflow:hidden;}
.navdh .navigation{height:50px;line-height:50px;width:1200px;margin:auto;background:url(../images/dh.png) no-repeat 250px 13px;padding-left:280px;color:#434343;font-size:14px;overflow: hidden;}
.navdh .navigation a{color:#434343;font-size:14px;margin: 0 5px;}


/*栏目banner*/
.listbanner{overflow:hidden;position:relative;}

.listbanner p{position:absolute;z-index:2;font-size:36px;font-weight: bold;color:#fff;line-height:230px;top:0;left:50%;margin-left:-550px;}
.listgg{width:100%;overflow:hidden;position:relative;z-index:1;height:260px;}
.listgg img{width:100%;height:100%;}



/*栏目页-图片文章列表*/

.column_bg{width:100%;background:#eee;}

.column .leftbox .on{border-left: 6px solid #0b61b4;}
.column .leftbox .on a{font-weight:600;color:#0b61b4 !important;}

.column{width:1160px;height:auto;overflow:hidden; margin:auto;position:relative;top:-30px;padding:10px 20px 0 20px;background:#fff;z-index:999;}

.column .leftbox{width:240px;height:auto;overflow:hidden;float: left;}
.column .leftbox p{height: 50px;font-size: 24px;line-height: 50px;color: #0b61b4;font-weight: bold;border-bottom: 1px solid #e6e6e6;background:url(../images/lmbg.png) no-repeat 120px 18px;}
.column .leftbox ul{border-right: 1px solid #e6e6e6;}
.column .leftbox ul li{border-bottom: 1px solid #e6e6e6;}
.column .leftbox ul li a{font-size: 16px;color: #333333;line-height: 55px;padding-left: 20px;width: 240px;height: 55px;display: block;}
.column .leftbox ul li:hover{font-weight:600;color:#0b61b4 !important;border-left: 6px solid #0b61b4;}   
.column .leftbox ul .on:hover{border-left:0;}   
.column .leftbox ul li:hover a{color:#0b61b4;} 

.column .rightbox{width:900px;height:auto;min-height:500px;overflow:hidden;float:right;}

.column .rightbox .navigation{width:880px;height: 50px;width: 100%;border-bottom: 1px solid #f0f0f0;overflow:hidden;line-height:50px;text-align:right;padding-right:20px;}
.column .rightbox .navigation a{color:#333;font-size:14px;display:block;float:right;}
.column .rightbox .navigation a:hover{color:red;}
.column .rightbox .navigation .sy{background:url(../images/dh.png) no-repeat left center;width:70px;}
.column .rightbox .navigation p{float: left;color: #333;font-size: 20px;line-height: 50px;font-weight:600;}

.column .rightbox .contlist{overflow:hidden;width:100%;padding-bottom: 40px;}
.column .rightbox .contlist ul{width:100%;overflow:hidden;}
.column .rightbox .contlist li{border-bottom:1px dashed #D9D9D9;width: 880px;padding: 20px 10px;overflow:hidden;font-size: 16px;}
.column .rightbox .contlist li dd{width: 640px;float: right;padding: 0 10px;height: 135px;overflow: hidden;}
.column .rightbox .contlist li img{width: 200px;float: left;height:135px;max-height:135px;}
.column .rightbox .contlist li h2{font-size: 20px;height: 30px;}
.column .rightbox .contlist li h2 a{color: #000;font-size: 16px;display:block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display:block;width:90%;}
.column .rightbox .contlist li a:hover{color: red;}
.column .rightbox .contlist li p{padding: 5px 0;line-height: 30px; font-size: 12px;}
.column .rightbox .contlist li p a{color: #016ca4;}
.column .rightbox .contlist li span{font-size: 12px;margin-top: 15px;color: #999;display: block;}
.column .rightbox .contlist li p{}

.column .rightbox .contlist li .bom{height: 30px;line-height: 30px;padding: 0 20px;}
.column .rightbox .contlist li .bom span{margin: 0;}
.column .rightbox .contlist li .more{float: right;display: block;width:80px;height:26px;line-height: 26px;text-align: center;background: #0b61b4;margin-top:4px;border-radius: 4px;color:#fff;font-size: 12px;font-weight: bold;}
.column .rightbox .contlist li .more:hover{background:#777;color: #fff;}


/*栏目页-无图片列表*/

.column .nopiclist{overflow:hidden;padding:20px 0;width:900px;min-height:500px;}
.column .nopiclist .list{}
.column .nopiclist .list ul{}
.column .nopiclist .list ul li{height:45px;line-height:46px; padding-left:15px;border-bottom: 1px dashed #dddddd;background:url(../images/dian.jpg) no-repeat left center;}
.column .nopiclist .list ul li a{font-size:16px;float: left;width:800px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.column .nopiclist .list ul li span{float: right;font-size:15px;}
.column .nopiclist .list ul li:hover a{color:red;}
.column .nopiclist .list ul li:hover span{color:red;}




/*栏目页-图片文章列表无左边栏目样式*/

.column .midbox{width:1000px;height:auto;min-height:500px;overflow:hidden;margin:auto;}

.column .midbox .navigation{width:880px;height: 50px;width: 100%;border-bottom: 1px solid #f0f0f0;overflow:hidden;line-height:50px;text-align:right;padding-right:20px;}
.column .midbox .navigation a{color:#333;font-size:14px;display:block;float:right;}
.column .midbox .navigation a:hover{color:red;}
.column .midbox .navigation .sy{background:url(../images/dh.png) no-repeat left center;width:70px;}
.column .midbox .navigation p{float: left;color: #333;font-size: 20px;line-height: 50px;font-weight:600;}

.column .midbox .contlist{overflow:hidden;width:100%;padding-bottom: 40px;}
.column .midbox .contlist ul{width:100%;overflow:hidden;}
.column .midbox .contlist li{border-bottom:1px dashed #D9D9D9;width:980px;padding: 20px 10px;overflow:hidden;}
.column .midbox .contlist li dd{width: 740px;float: right;padding: 0 10px;height: 135px;overflow: hidden;}
.column .midbox .contlist li img{width: 200px;float: left;height:135px;max-height:135px;}
.column .midbox .contlist li h2{font-size: 20px;height: 30px;}
.column .midbox .contlist li h2 a{color: #000;font-size: 16px;display:block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display:block;width:90%;}
.column .midbox .contlist li a:hover{color: red;}
.column .midbox .contlist li p{padding: 5px 0;line-height: 30px; font-size: 12px;}
.column .midbox .contlist li p a{color: #016ca4;}
.column .midbox .contlist li span{font-size: 12px;margin-top: 15px;color: #999;display: block;}
.column .midbox .contlist li p{}

.column .midbox .contlist li .bom{height: 30px;line-height: 30px;padding: 0 20px;}
.column .midbox .contlist li .bom span{margin: 0;}
.column .midbox .contlist li .more{float: right;display: block;width:80px;height:26px;line-height: 26px;text-align: center;background: #0b61b4;margin-top:4px;border-radius: 4px;color:#fff;font-size: 12px;font-weight: bold;}
.column .midbox .contlist li .more:hover{background:#777;color: #fff;}    


/*招贤纳士样式*/

.zxnstt{width:100%;overflow:hidden;margin-bottom:20px;}
.zxnstt a{display:block;float: left;width:285px;height:180px;margin-right:20px;}
.zxnstt a img{width:100%;height:100%;}


/*单页样式*/

.column .listdy{width:880px !important;padding:20px 10px;margin:20px 0;overflow:hidden;}
.column .listdy p{font-size:16px;line-height:190%;margin-bottom:15px;}
.column .listdy span{font-size:16px;line-height:190%;text-indent:2em;}



/*人才招聘表单样式*/

.zxly .rczp{width:850px;border:1px solid #eee;margin:20px auto;}
.zxly .rczp .tt{font-weight:bold;font-size:18px;color:#00549d;line-height:36px;margin-bottom:20px;}



.zdybd{width:800px;overflow:hidden;padding:20px 0;margin:auto;}
.zdybd li{line-height:46px;margin:20px auto;overflow:hidden;}
.zdybd li span{width:120px;display:block;float: left;text-align:center;line-height:46px;font-size:15px;color:#5a5a5a;}
.zdybd li input{width:600px !important;float:left;display:block;height:44px;background:#fbfbfb;text-indent:15px;color:#000;font-size:15px;}
.zdybd li textarea{width:580px !important;padding:5px 10px; min-height:150px;font-size:14px; line-height:30px;float:left;display:block;background:#fbfbfb;color:#000;border:1px solid #eee;}

.zdybd .wdjl .sc{width:680px;float:right;}
.zdybd .wdjl p{width: 680px;float: right;color: red;}

.zdybd .submit1{margin-top:50px;}
.zdybd .submit1 input{width:200px !important;margin:auto;float:none;border:0;background:#00549d;color:#fff;font-size: 16px;border-radius: 10px;cursor:pointer;text-indent: 0;}
.zdybd .submit1 input:hover{background:#797979;color:#fff;}







/*动画*/

@-webkit-keyframes flipInX {from {-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0;}
40% {-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;}
60% {-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1;}
80% {-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg);}
to {-webkit-transform:perspective(400px);transform:perspective(400px);}
}
@keyframes flipInX {from {-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0;}
40% {-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;}
60% {-webkit-transform:perspective(400px) rotate3d(1,0,0,10deg);transform:perspective(400px) rotate3d(1,0,0,10deg);opacity:1;}
80% {-webkit-transform:perspective(400px) rotate3d(1,0,0,-5deg);transform:perspective(400px) rotate3d(1,0,0,-5deg);}
to {-webkit-transform:perspective(400px);transform:perspective(400px);}
}
.flipInX {-webkit-backface-visibility:visible !important;backface-visibility:visible !important;-webkit-animation-name:flipInX;animation-name:flipInX;}
@-webkit-keyframes flipInY {from {-webkit-transform:perspective(400px) rotate3d(0,1,0,45deg);transform:perspective(400px) rotate3d(0,1,0,45deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0;}
40% {-webkit-transform:perspective(400px) rotate3d(0,1,0,-10deg);transform:perspective(400px) rotate3d(0,1,0,-10deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;}
60% {-webkit-transform:perspective(400px) rotate3d(0,1,0,5deg);transform:perspective(400px) rotate3d(0,1,0,5deg);opacity:1;}
80% {-webkit-transform:perspective(400px) rotate3d(0,1,0,-2.5deg);transform:perspective(400px) rotate3d(0,1,0,-2.5deg);}
to {-webkit-transform:perspective(400px);transform:perspective(400px);}
}
@keyframes flipInY {from {-webkit-transform:perspective(400px) rotate3d(0,1,0,45deg);transform:perspective(400px) rotate3d(0,1,0,45deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0;}
40% {-webkit-transform:perspective(400px) rotate3d(0,1,0,-10deg);transform:perspective(400px) rotate3d(0,1,0,-10deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;}
60% {-webkit-transform:perspective(400px) rotate3d(0,1,0,5deg);transform:perspective(400px) rotate3d(0,1,0,5deg);opacity:1;}
80% {-webkit-transform:perspective(400px) rotate3d(0,1,0,-2.5deg);transform:perspective(400px) rotate3d(0,1,0,-2.5deg);}
to {-webkit-transform:perspective(400px);transform:perspective(400px);}
}
.flipInY {-webkit-backface-visibility:visible !important;backface-visibility:visible !important;-webkit-animation-name:flipInY;animation-name:flipInY;}
@-webkit-keyframes flipOutX {from {-webkit-transform:perspective(400px);transform:perspective(400px);}
30% {-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1;}
to {-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0;}
}
@keyframes flipOutX {from {-webkit-transform:perspective(400px);transform:perspective(400px);}
30% {-webkit-transform:perspective(400px) rotate3d(1,0,0,-20deg);transform:perspective(400px) rotate3d(1,0,0,-20deg);opacity:1;}
to {-webkit-transform:perspective(400px) rotate3d(1,0,0,90deg);transform:perspective(400px) rotate3d(1,0,0,90deg);opacity:0;}
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}