html, body { display: block; width: 100%; overflow-x: hidden}
body{color:#5a5a5a;font-size:12px; background: #FFFFFF}
*{ margin:0px; padding:0px}
body {
    background: #FFFFFF !important;
}
.footerx * { box-sizing: border-box}
.mitem, .tb a, .tb, .tb li, .flb, .fdiy .tfm .px, .fdiy .tfm .pt { box-sizing: unset}
a{ text-decoration:none; color:#666; -webkit-transition: all ease-in .2s; 
-ms-transition: all ease-in .2s; -moz-transition: all ease-in .2s;
 -o-transition: all ease-in .2s; transition: all ease-in .2s}
#sub_content_in {
    padding: 0;
    text-align: center;
    background: rgba(0,0,0,.6);
    width: 100%;
    height: 100%;
    display: block;
}

.nvhm { color: #FF8E00}
#pt { position: relative; height: 75px; line-height: 75px; margin: 0 0 30px 0}
#pt .z a, #pt .z em, #pt .z span {
    float: left;
    height: 75px;
}
#pt:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 3px;
    background-color: #e7e5cf;
}
.pgs { padding: 10px 0}

a:hover{ color:#ba2c1f}
.clearfix { *zoom:1;/*IE/7/6*/}
.clearfix:before, .clearfix:after {content: "";display: table;}
.clearfix:after {clear: both;}
.section{ width:92%; max-width: none;margin:0 auto;}
.header{ width:100%; height: 87px; overflow: visible}
.logo { width: auto; padding: 18px 0; margin-top: 0; float:left;}
.map {width: auto;float: right;height: 80px;}

/*meun*/
.menu { max-width:70.6%; float: right; height: 87px; border-right: 0; overflow: hidden}
.menu ul{ float: none !important; height: auto !important; width:100%; margin:0 auto;}
.menu ul li{ float:left; height: auto !important; font-size: 15px; padding-top: 0; width: auto;text-align:center; line-height: 87px}
.menu ul li span { display: none}
.menu ul li a{ display: block; color: #032974; height: 87px; line-height: 87px; padding: 0; margin: 0 20px; font-weight: bold}
.menu ul li.a a { height: 84px; border-bottom: 3px solid #ff8e00; color: #032974}
.menu ul li a:hover{ color: #032974}
.menu ul .dqzt{  color:#ba2c1f; }
.m_menu{ background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/icon_nav.png) no-repeat center; width: 24px; position:absolute; right: 3%; top: 5px; height: 60px; display: none}
.map { height:84px; }
.map ul{ width:100%; margin:0 auto }
.map ul li{ border-right:1px solid #f0f0f0; float:left; width:49.1%; text-align:center; height:80px; }
.map .lang {float: left;  padding-top:20%;}

/*banner*/
.banner{width:100%; position:relative; overflow:hidden; background-color:#CCC}
.banner_bar{ width:1000px; margin:0 auto; }

.n_banner{ width:1920px; margin:0 -460px; overflow:hidden; position:relative;}
.banner ul{ width:100%; position:relative;  height:648px;}
.banner ul li{ width:100%; position:absolute;  height:648px; left:0; top:0; opacity:0; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);}
.banner ul li.on{z-index:2;}
.banner .num{ position:absolute; width:100%; height:12px; bottom:5%; left:0; text-align:center; z-index:3;}
.banner .num a{ width:12px; height:12px; display:inline-block; background:#fff; border-radius:10px; margin:0 5px;}
.banner .num a.on{ background:#007ec5}
.banner li img {display: block;}

/*index_ab*/
.index_ab {width: 100%;    overflow: hidden;    margin: 20px auto; float:left}
.index_ab_tt { color:#e4ecef; font-size:250px; position:relative; margin:0 auto; }
.index_ab_tt h3 {text-transform:uppercase; font-family:Arial, Helvetica, sans-serif; font-weight:bold; text-align:center;  }
.index_ab_tt01 {width: 100%; position:absolute; text-align:center; font-size:50px; color:#ba2c1f; font-weight:bold; top:37%; left:0;}

.abt_nav { width:90%; margin:2% 5%; height:auto; float:left}

.abt_nav .list{ width:20%; height: auto; float:left; }
.abt_nav .list:hover{ color:#ba2c1f }
.abt_nav .list span{ width:144px; height:auto; float:left; background:url(http://www.gxphoto.net/template/elec_201803_pic/style/images/list_img01.png); display:block }
.abt_nav .icon01 { display: block;width: 53px; height: 48px; margin: auto;  background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-4.jpg) no-repeat;}
.abt_nav .icon01:hover{  background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-40.jpg) no-repeat}
.abt_nav .icon02 { display: block;width: 53px; height: 48px;margin: auto;  background:  url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-5.jpg) no-repeat;}
.abt_nav .icon02:hover{ background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-50.jpg) no-repeat}
.abt_nav .icon03 { display: block;width: 53px; height: 48px;margin: auto;  background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-6.jpg) no-repeat;}
.abt_nav .icon03:hover{ background:url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-60.jpg) no-repeat}
.abt_nav .icon04 { display: block;width: 53px; height: 48px;margin: auto;  background:  url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-7.jpg) no-repeat;}
.abt_nav .icon04:hover{ background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-70.jpg) no-repeat}
.abt_nav .icon05 { display: block;width: 53px; height: 48px;margin: auto;  background:  url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-8.jpg) no-repeat;}
.abt_nav .icon05:hover{ background:url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-80.jpg) no-repeat}
.abt_nav .icon06 { display: block;width: 53px; height: 48px;margin: auto;  background:  url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-9.png) no-repeat;}
.abt_nav .icon06:hover{ background:url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-90.png) no-repeat}
.abt_nav .icon07 { display: block;width: 53px; height: 48px;margin: auto;  background:  url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-10.png) no-repeat;}
.abt_nav .icon07:hover{ background:url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-100.png) no-repeat}
.abt_nav .list h3{ font-size:19px; color:#747474; line-height:60px; width:100%; height:auto; text-align:center; font-weight:normal}
.abt_nav .list h3:hover{ color:#ba2c1f }
.abt_nav .list em{ width:50px; height:3px; margin:auto;display:block; background:#4b7cbe; margin-bottom:20px;}
.abt_nav .list p{ font-size:15px; line-height:25px; color:#888888; width:100%; height:110px;}
.abt_nav .list p:hover{ color:#096}

.ab_txt { font-size:14px; line-height:30px; color:#000; text-align:center; width:90%; padding:0 5%; margin:1% auto; float:left  }
.more {
    overflow: hidden;;
    width:120px; background-color:#ba2c1f;
    height: 36px; margin:15px auto;
    line-height: 38px;
    font-size: 13px;
    color:#fff;
    text-align: center;
     border-radius:8px;
}
.more a{ color:#FFF}

/*???????*/
.index_gc { background:#943636 url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-9.jpg) top center no-repeat; width:100%; height: auto; overflow:hidden;}
.gc_title { width: 100%;    text-align: center; margin:3% auto}
.gc_title h3 {  display: block;    margin: auto;    text-transform: uppercase;    font-size:30px;    color: #fff; }
.gc_title h5 {    color: #fff;    font-size: 20px; font-weight:normal; font-family:Arial, Helvetica, sans-serif;text-transform:uppercase; line-height:40px; }

/*?????????*/
.nTab{ 
float: left; 
width:100%; 
background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-10.jpg) repeat-x 0px 15px; 
margin:0  auto;
    overflow: hidden;
} 
.nTab .TabTitle{ 
clear: both;
height:32px; 
overflow: hidden; 
} 
.nTab .TabTitle ul{
width: 750px;
border:0; 
margin:0 auto;
padding:0; 
} 
.nTab .TabTitle li{ 
float: left; 
width:147px; 
cursor: pointer; 
padding-top:0; 
margin:0 20px; line-height:32px;
list-style-type: none; height:32px; 
} 
.nTab .TabTitle .on {background:#d2d2d2 !important; color:#242424 !important; text-align:center; font-size:15px;} 
.nTab .TabTitle .normal {background:#ba2c1f; color:#ffffff; text-align:center;font-size:15px;} 
.nTab .TabContent{ 
width:auto;
margin: 0px auto; 
padding:25px 0 0 0; 
 
} 
.none {display:none;} 
.more01 {
    width:120px; background-color:#e2e2e2;
    height: 36px; margin:15px auto ;
    line-height: 38px;
    font-size: 13px;
    color:#fff;
    text-align: center;
   border-radius:8px;
    overflow: hidden;
}
.more01 a{ color:#242424}

.build-list{width: 100%;overflow: hidden;}
.build-list ul{width: 100%;  font-size: 0;}
.build-list ul li{width:31%; margin:1%; display: inline-block; position: relative; overflow: hidden;}
.build-list ul li a{display: block; width: 100%; height: 100%;}
.build-list .build-pic{width: 100%;position: relative; height: 100%;}
.build-list .build-pic img{ width: 100%; height:300px; transform: translateZ(0px); }
.build-list .build-pic span{display: block; width: 100%; line-height: 60px; background:url("http://www.gxphoto.net/template/elec_201803_pic/style/build-blck.png"); color: #fff; position: absolute; text-align: center; font-size: 18px; bottom: 0;}
.build-list .intro{background:rgba(255,255,255,0.6); padding:10px 15px; width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; color: #242424; visibility: hidden; position: absolute; bottom: 0;  opacity: 0;
    transition: opacity 0.5s; }
.build-list .intro h5{ font-size:18px; font-weight:normal; color:#000; line-height: 35px;}
.build-list .intro h3{font-size: 14px; font-weight:normal; color:#888; line-height: 25px;}
.build-list .intro p{font-size: 12px; line-height: 20px;}
.build-list ul li a:hover .intro{visibility: visible; opacity: 1;}
.build-list ul li a:hover span{display: none;}
.build-list ul li a:hover img{transform: scale(1.05, 1.05);  transition: transform 0.6s ease 0s;}

/*????*/
.index_news { background:url(http://www.gxphoto.net/template/elec_201803_pic/style/images/a01-11.jpg); height: auto;padding-bottom:2%;}
.news_title { width: 100%;    text-align: center; margin:0 auto; padding:3% 0;}
.news_title h3 {  display: block;    margin: auto;    text-transform: uppercase;    font-size:30px;    color: #242424; }
.news_title h5 {    color: #242424;    font-size: 20px; font-weight:normal; font-family:Arial, Helvetica, sans-serif;text-transform:uppercase; line-height:40px; }

.NewsPicRec{width: 90%; margin:20px auto;  overflow:hidden; line-height:20px; font-size:12px;}
.NewsPicRec a{display:block; width: 100%; height: 40px; font-weight: bold;  line-height:40px; overflow: hidden; text-align:center; font-size:18px;color:#1b54aa;}
.NewsPicRec p{ text-indent:2em; height:50px; line-height: 25px; overflow:hidden; color:#222; font-size: 14px;}

 .news-list{width: 100%;}
 .news-list ul{width: 100%; font-size: 0;}
 .news-list ul li{width:31.333%;display: inline-block; margin:10px 1%; vertical-align: top; overflow: hidden;}
 .news-list ul li a{width:100%; display: block; background: #fff;color: #878686;}
 .news-list .news-pic{width: 100%;overflow: hidden;}
.news-list .news-time { width:100%; background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/time.png) left no-repeat; padding-left:20px}
.news-list .news-time:hover { background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/time01.png) left no-repeat; padding-left:20px}
 .news-list .news-pic img{width: 100%; height:250px; transform: translateZ(0px);transition: transform 0.3s ease 0s; opacity: 0.8;}
 .news-list .new-con{width: 100%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -o-box-sizing: border-box; padding: 20px;}
 .news-list .new-con h4{ font-size:16px; line-height: 28px; height: 56px; text-align:center;overflow: hidden; color: #1a1a1a; font-weight:normal }
 .news-list .new-con p{ font-size: 14px; line-height: 25px; height:75px; overflow: hidden; }
 .news-list ul li a:hover{background: #7e090f; color: #fff;}
 .news-list ul li a:hover h4{color: #fff;}
 .news-list ul li a:hover img{transform: scale(1.05, 1.05);  transition: transform 0.6s ease 0s; opacity: 1;}
 
 .more00{display:block;width: 180px; line-height: 40px; border: 1px solid #000; margin:50px auto;text-align: center; font-size: 14px;}

.newslist {
    width: 100%;
}
.newslist li {
    overflow: hidden;
    width: 100%;
    padding: 20px 0;
    border-bottom: 1px dotted #c5c5c4;
}
.newslist .time {
    float: left;
    width: 8%;
    margin-right: 2%;
    min-width: 60px;
}
.newslist .day {
    height: 42px;
    line-height: 42px;
    border-bottom: 1px solid #fff;
    color: #000;
    font-size: 30px;
}
.newslist .date {
    height: 18px;
    line-height: 18px;
    font-size: 12px;
}
.newslist .day, .newslist .date {
    background-color: #eae6e2;
    display: block;
    text-align: center;
    font-family: Arial;
}
.newslist h3 {
	font-size: 18px;
    line-height: 25px;
    font-weight: bold;
    color: #2e82cd;
    clear: both;
    padding: 5px 0;
}
.newslist p {
    padding-bottom: 5px;
    line-height: 25px; font-size: 14px;
    width: 100%;
}
.newslist .conts {
    float: left;
    width: 88%;
    
}
.mmore{display:block; margin-top: 5px;}

.f_links_z {    float: left; line-height: 38px; font-size: 14px;    color: #262626; width:100%; padding:0.5% 0;}
.f_links_z span { font-weight:bold; float:left; font-size:16px}
.f_links_z ul li {    padding:0 1%;    height: auto;    float: left;    line-height: 38px;    text-align: center;}
.f_links_z ul li a {    text-decoration: none;    color: #242424;}

/*??????*/
/*n-main*/
.inside-ban{width: 100%; overflow: hidden; background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/4-1.jpg) no-repeat center; height: 280px; background-size: cover; position: relative; text-align: center}

.ban-warp{}
.ban-warp h2{ display: inline-block; font-size: 50px;  color: #FFFFFF; max-height: 55px; line-height: 50px;  font-weight: 400;  margin: 105px 0 0 0; overflow: visible}
.ban-warp p{ font-size: 20px;  line-height: 36px;  color: #4b4948; text-shadow:1px 1px 0 rgba(255,255,255,0.8)}

/*inside_menu*/
.inside_menu{ width:100%; background-color: #fff;  border-bottom: 1px solid #e5e5e5; overflow:hidden; }
.inside_menu  a{  display: inline-block;font-size: 16px; line-height: 74px; padding:0 25px;border-bottom: 2px solid #f9f9f9;}
.inside_menu  a:hover{color: #ba2c1f;border-bottom: 2px solid #ba2c1f;}
.inside_menu .menunows{ color:#ba2c1f;border-bottom: 2px solid #ba2c1f;}
.inside_menu_fix{position: fixed; top: 0;z-index: 9999;}

.nr_lm{ width:100%; height:74px;background-color: #fff;border-bottom: 1px solid #e5e5e5;}
.nr_lm .now-menu{  float:left;height: 74px; line-height:74px;}
.nr_lm .now-menu a.home{ display:block;     width: 20px; height:74px; background:url(http://www.gxphoto.net/template/elec_201803_pic/style/images/bg_sign06.png) no-repeat center; float:left;}
.nr_lm .now-menu span{display: inline-block; width: 28px;height:74px;background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/bg_sign07.png) no-repeat center; float:left}
.nr_lm .now-menu p{    display: inline-block;    font-size:14px;    line-height:74px;    color: #a3a3a3; float:left;}
.nr_lm ul{ float:right;}
.nr_lm ul li{float:left; line-height:74px; height:74px;margin-right: 23px;font-size: 15px;}
.nr_lm ul li a{display:block;    padding: 0 18px;}
.nr_lm ul li a:hover{color: #ba2c1f;border-bottom: 2px solid #ba2c1f;position: relative;margin-bottom: -1px;}
.nr_lm a.menunows{color: #ba2c1f;border-bottom: 2px solid #ba2c1f;position: relative;margin-bottom: -1px;}

.tl-box{width: 100%; text-align: center; }
.tl-box h5{color: #494949; font-size:28px; }
.tl-box h4{color: #fff; font-size:30px; }
.tl-box em{ display: block; width:50px; background: #ba2c1f; height: 3px; margin:12px auto; transition:width 1s;  -webkit-transition:width 1s;}
.tl-box span{display: block; margin: auto; text-transform: uppercase; font-size: 20px; color: #949494;}
.tl-box p{display: block; margin: auto; text-transform: uppercase; font-size: 16px; color: #555555; padding:1% 0; font-family:Arial, Helvetica, sans-serif}
.tl-box .bs-em{ background: #fff;}
.tl-box .bs-span{ color: #fff;}
.tl-box:hover em{width:100px;}

.cn-txt,.cn-form,.cn-list{width: 100%; padding: 50px 0; overflow: hidden;}
.cn-box{width: 100%; overflow: hidden;}
.cn-box .left,.cn-box .right{width: 50%; float: left;}
.cn-box h3{font-size:35px; color: #ba2c1f; font-weight:500; padding: 30px 0;}
.cn-box span{ display:block; width:100%; color: #666; font-size: 25px; padding: 10px 0;}
.cn-box p{font-size: 14px; line-height: 25px;padding: 5px 0;}
.cn-form{background: #f1f1f1;}
.cn-form ul{width: 100%;}
.cn-form ul li{width:48%; float: left; margin: 10px 2% 20px 0 ;}
.cn-form li span{ display:block;padding: 0 2px 0 0; font-size: 20px; color: #333; width:20%;  float: left;line-height: 45px;}
.cn-form h5{width: 100%; float: left;}
.cn-form input{background: #fff; border: 0; line-height: 45px; color: #333; padding-left: 10px;   width: 66%;}
.cn-form .texta{ width:100%; border:0; line-height: 25px;color: #fff;}
.cn-form .texta textarea{width: 96%;background: #fff; border: 0px;color: #333; line-height: 25px;  padding-left: 10px;    }
.cn-form .button{background: #ba2c1f; border: 0; line-height: 45px;  color: #fff; font-size: 16px;    width: 15%; float: left; margin-right: 7%;
    border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -webkit-border-radius: 0; -o-border-radius: 0;}
.cn-list{width: 100%;}
.cn-list ul{width: 100%; font-size: 0;}
.cn-list ul li{width: 31.333%;margin:10px 1%;vertical-align: top;background: #fff; display: inline-block;}
.cn-list ul li a{display: block; width: 100%; height: 100%; overflow: hidden; background: #f1f1f1;}
.cn-list .hd-pic{width: 100%; height:auto; overflow: hidden;}
.cn-list .hd-pic img{max-width: 100%; transform: translateZ(0px);}
.cn-list .con-tlt{width: 100%; height:auto; overflow: hidden; padding: 10px 10px; box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box;}
.cn-list .con-tlt h4{font-size: 16px; line-height: 30px;padding: 0 5px;  color: #333; }
.cn-list .con-tlt p{font-size: 14px; line-height: 20px;padding: 0 5px;  color: #666; }
.cn-list ul li a:hover{background: #ba2c1f;}
.cn-list ul li a:hover img{ transform: scale(1.05,1.05);  transition: transform 0.6s ease 0s;}
.cn-list ul li a:hover h4{ color: #fff;}
.cn-list ul li a:hover p{ color: #fff;}

.con-box{width: 100%; overflow: hidden; padding:40px 0; background: #fff; font-size: 14px; line-height: 25px;}
.con-box p{ text-indent: 0; padding-bottom:1%; }
.con-box img{max-width: 100%; margin: auto;}
.con-box01{width: 100%; overflow: hidden; padding:40px 0; background: #fff; font-size: 14px; line-height: 25px;}
.con-box01 p{ padding-bottom:1%; }
.cn-box{width: 100%; overflow: hidden;}
.cn-box .left,.cn-box .right{width: 50%; float: left;}
.cn-box h3{font-size:35px; color: #ba2c1f; font-weight:500; padding: 10px 0 30px 0}
.cn-box span{ display:block; width:100%; color: #666; font-size: 25px; padding: 10px 0;}
.cn-box p{font-size: 14px; line-height: 25px;padding: 5px 0;}

.ab-con{width:92%; margin: 30px auto; overflow: hidden;font-size: 14px; line-height: 30px; text-align:justify }
.ab-con h2{color: #054b91; font-size: 20px; padding: 10px 0; font-weight: bold;}
.ab-con p{padding: 5px 0; line-height: 28px; font-size: 16px}
.ab-con img{max-width: 100%;}
a.ab-more{display: block; width: 150px;overflow: hidden; background: #054b91; text-align: center; color: #fff; margin:70px auto 0 auto; line-height: 40px;}
.ab-con ul{ width:45%;  margin:0.5% 2.5%; float: left; height:345px; overflow:hidden; border-bottom:1px solid #ccc}
.ab-con ul li{ width:100%;}
.ab-con ul h3{ color: #333333}

.cp_query{ width:100%; padding-top:30px; font-size: 14px; line-height: 26px;}
 .cp_query ul{ width:100%;}
 .cp_query ul li{ width:23%;   margin:10px 1%; float:left; background:#FFF;border-bottom: 1px solid #dfdfdf; }
 .cp_query ul li a{ display:block; width:100%; overflow:hidden;}
 .cp_query ul li img{ width:100%;  height:200px;  transform: translateZ(0px);transition: transform 0.3s ease 0s;}
 .cp_query ul li a:hover img{transform: scale(1.05, 1.05);transition: transform 0.6s ease 0s;}
 .cp_query ul li p{ font-size:16px;text-align:center;  color: #444;line-height:50px;text-align: center; height:50px;  overflow: hidden; text-overflow: ellipsis;  white-space: nowrap;}

.cp_query01{ width:100%; padding-top:30px; font-size: 14px; line-height: 26px;}
 .cp_query01 ul{ width:100%;}
 .cp_query01 ul li{ width:23%;   margin:10px 1%; float:left; background:#FFF;border-bottom: 1px solid #dfdfdf; }
 .cp_query01 ul li a{ display:block; width:100%; overflow:hidden;}
 .cp_query01 ul li img{ width:100%;height:263px;  transform: translateZ(0px);transition: transform 0.3s ease 0s;}
 .cp_query01 ul li a:hover img{transform: scale(1.05, 1.05);transition: transform 0.6s ease 0s;}
 .cp_query01 ul li p{ font-size:16px;text-align:center;  color: #444;line-height:50px;text-align: center; height:50px;  overflow: hidden; text-overflow: ellipsis;  white-space: nowrap;}

.nr_content .cp_medit{ width:100%;min-height:300px; padding-top:30px; font-size: 14px; line-height: 26px; background:#fff; margin:30px 0px 60px 0px;}
.nr_content .cp_title{ font-size:24px; font-weight:bold; text-align:center; margin:30px 0px 20px 0px; color:#5a5b5c;}
.nr_content .cp_content{ width:90%; margin:auto; font-size:14px; text-align:left;   padding-top: 24px;  padding-bottom: 50px;line-height: 26px; color: #444;}
.nr_content .cp_content img{max-width: 100%; margin:auto;}

.new-lr { width:100%; margin:25px auto; }
/*.new-lr ul{width: 100%;}
.new-lr ul li{width:100%; padding: 15px 0;    border-bottom: 1px solid #e5e5e5;}
.new-lr ul li a{display: block;}
.new-lr ul li h4{font-size: 20px; color: #333;}
.new-lr ul li span{display: inline-block;  line-height: 22px;  color: #a5a5a5;  margin-top: 4px;  font-size: 14px;}
.new-lr ul li p{    display: block;  line-height: 22px;  color: #666;  margin-top: 9px;  height: 48px;  overflow: hidden;  font-size: 12px;}
*/
.news_query{ width:100%; overflow:hidden; margin-top:20px}
.news_query ul{ width:100%; background:#fff;}
.news_query ul li{ width:31.333%; margin:15px 1%; background: none; float:left;}
.news_query .img{ width:100%; height: 250px; overflow:hidden; text-align:center;}
.news_query ul li a{ display:block; width:100%; height:100%; text-decoration:none; overflow:hidden;}
.news_query ul li img { width: 100%; height: 250px; transform: translateZ(0px);transition: transform 0.3s ease 0s;}
.news_query li h1{ display:block; width:90%; font-size: 19px; line-height:26px; height: 26px; margin: 0 0 10px 0; overflow:hidden; padding: 0; color: #1a1a1a}
.news_query ul li a:hover img{transform: scale(1.05, 1.05);transition: transform 0.6s ease 0s;}


.qt-pagination{ width:94%; margin:auto; overflow:hidden; padding:30px 0; text-align:center; }
.qt-pagination a{  background-color: #fff;border: 1px solid #e3e3e3;padding: 0 10px;margin-right: 3px; min-width: 30px;  height: 35px;   line-height: 35px;   display: inline-block;   text-align: center; font-size: 14px;  }
.qt-pagination .pages{ background:#ba2c1f; color:#fff;}


.ne-del{width: 100%; padding: 0 0 50px 0}
.ne-del h4{ padding: 20px 0; font-size: 56px; color: #333; text-align: center;}
.ne-del .ne-time{width: 100%; line-height: 30px; text-align: center; font-size: 14px}
.ne-del .ne-con{width: 100%; margin: 30px 0; padding: 30px 0; padding-top: 10px; line-height: 25px; font-size: 14px; border-top: 0; overflow: hidden;}
.ne-del .ne-con > div {padding: 5px 0;}
.ne-del .ne-con img{max-width: 100%; margin: 10px auto;}


/*???1???*/
.con-box .down-list{width: 31%; margin: 10px 1%; display: inline-block;vertical-align: top; font-size: 0; }
.con-box .down-list a{display:block; width:100%; height: 100%;padding: 20px 15px; box-sizing: border-box; -moz-box-sizing: border-box;  -webkit-box-sizing: border-box; -ms-box-sizing: border-box; border: 1px solid #e7e7e7;  background: #f7f7f7; overflow: hidden;}
.con-box .down-list dd{width: 100%;overflow: hidden; margin: 30px 0; }
.con-box .down-list dd h3{display: block; width: 100%; color: #222; font-size: 18px;}
.con-box .down-list dt{width: 100%; overflow: hidden; margin: 20px 0;}
.con-box .down-list dt span{display:block; width:80%; float:left;font-size: 12px; line-height: 28px; color: #9a9a9a;}
.con-box .down-list dt i{display:block; width:20%; float:left; background: url("http://www.gxphoto.net/template/elec_201803_pic/style/img1.png") no-repeat center center; padding: 14px 0;}
.con-box .down-list a:hover{background: #ba2c1f;}
.con-box .down-list a:hover h3{ color: #fff;}
.con-box .down-list a:hover span{color: #fff;}
.con-box .down-list a:hover i{background: url("http://www.gxphoto.net/template/elec_201803_pic/style/img2.png") no-repeat center center;}




.INPUT{
color:#777777;
font-size:12px;
height:20px;
padding:3px;
border:1px #555555 solid;
background-image: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/inputbg.gif)
}

.TEXTAREA{
color:#777777;
font-size:12px;
padding:3px;
border:1px #555555 solid;
background-image: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/inputbg.gif)}



.button{color:#333333;font-size:12px;border:1px outset}

/* ==????== */
.ss { float: left; width:30%; margin-top:5px; }
.anniu {
  width: 72px;
    background-image: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/ssan.jpg);
    background-repeat: no-repeat;
    height: 40px;
    float: right;
    color: #FFF;
    font-size: 13px;
    border: none !important;
}
.xla {
    width:80px;
   height: 40px;
    border: 1px solid #dddddd;
    color: #666; 
}
.sskbg {
   border: 1px solid #dddddd;
   height:38px;
    float: left;
   
    padding-left: 23px; margin-right:1%;
    width: 175px !important;
}
.n_news01 { width:100%; overflow: hidden; padding:2% 0; background:#fff; }
.n_news01 ul{ width:100%; margin:0 auto; overflow:hidden;}
.sslmys .ssbt{ background-image:url(http://www.gxphoto.net/template/elec_201803_pic/style/images/tb_16.jpg); height:35px; line-height:35px; background-repeat:no-repeat; padding-left:20px; font-size:16px; font-weight:bolder; background-position:left center; border-bottom:#CCC dashed 1px;}
.qufanye { width:96%; margin:2% auto; font-size:14px; height:30px; }
.n_news_intitle { background-color:#fafafa; width:100%; height:40px; border-bottom:1px solid #c91872;}
.n_news_intitle  h2{ color:#c91872; padding-left:20px; text-align:center;line-height:40px; height:40px; font-size:16px; }
.n_news_intitle h3 a{ color:#666;line-height:40px; height:40px; padding-right:10px; }
.n_news_intitle h3 a:hover{ color:#c91872; }


/* ==?????????== */






/* ==?????????== */

.nav {color:#777777;font-size:12px;} 
td.nav {padding-left:5px} 


/* ==??????== */

td.title{background:#eeeeee }
td.con{background:#ffffff}
.table{border:1px #dddddd solid}
.tablemenu{color:#555555;BORDER-RIGHT: #cccccc 1px solid; BORDER-TOP: #cccccc 1px solid; BORDER-LEFT: #cccccc 1px solid;background:#eeeeee}
.line{background:#dddddd}



/* ==???????== */



/* =={#lanTitle#}?б????== */

.tList{color:#333333;line-height:22px;font-size:12px}
.tList1{color:#b0b0b0;line-height:150%;font-size:12px}

a.tList{font-size:12px;;text-decoration: underline}
a.tList:link{color:#333333}
a.tList:visited{color:#333333}
a.tList:active{color:#333333}
a.tList:hover{color:#ff6611}

/* ==???б????== */

td.piclist{background:#ffffff}
div.piclist{border:1px #dddddd solid;width:50px;height:50px;padding:1px;background:#ffffff}

a.pictitle{color:#777777;font-size:12px;line-height:26px}
div.pictitle{border:0px #dddddd solid;padding:1px;background:#ffffff}



/* ==???????????== */

a.more{font-size:12px;;text-decoration: underline}
a.more:link{color:#555555;}
a.more:visited{color:#555555;}
a.more:active{color:#555555;}
a.more:hover{color:#ff6611;}

/* ==?????????== */

.dtree {color: #555555;font-size: 12.00px;	white-space: nowrap;}
.dtree img  {border: 0px;	vertical-align: middle;}
.dtree a   {color: #555555;font-size: 12.00px;	TEXT-DECORATION: none}
.dtree a.node{color: #555555;white-space: nowrap;padding: 1px 2px 1px 2px;TEXT-DECORATION: none}
.dtree a.nodeSel {color: #555555;font-size: 12.00px;	white-space: nowrap;	padding: 1px 2px 1px 2px;TEXT-DECORATION: none}
.dtree a.node:hover {color: #555555;font-size: 12.00px;	TEXT-DECORATION: none}
.dtree a.nodeSel:hover {color: #555555;	font-size: 12.00px;TEXT-DECORATION: none}
.dtree a.nodeSel {background-color: #cfdfef;font-size: 12.00px;}
.dtree .clip {overflow: hidden;}

/* ==??????== */

.pagesinfo {color:#555555;font-size:12px;}
.pagesnow {color:#D07E36;font-size:14px;text-decoration: none}
.pages {color:#777777;font-size:14px;text-decoration: none}


/* ==????????????б????== */

td.newsquery{height:23px}

.newsquery{color:#777777;line-height:150%;font-size:12px}
a.newsquery{color:#777777;line-height:150%;font-size:12px;text-decoration: none}
a.newsquery:link{color:#777777;}
a.newsquery:active{color:#777777;}
a.newsquery:visited{color:#777777;}
a.newsquery:hover{color:#ff6611;}

.newsquerytitle{border:1px #eeeeee solid;background:#f0f0f0}
.newsquerytime{color:#555555;font-size:12px}

.banner01 { background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/1.jpg) no-repeat center top; height: 600px}
.banner02 { background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/2.jpg) no-repeat center top; height: 600px}
.banner03 { background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/3.jpg) no-repeat center top; height: 600px}
.banner04 { background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/4.jpg) no-repeat center top; height: 600px}
/* ==??????????????== */

.newstitle {color:#333333;font-size:18px;font-weight:bold}
.newsinfo {background:#f0f0f0;color:#555555;font-size:12px;}
.newscon {color:#777777;font-size:14px;line-height:160%;padding:15px}


/* ==????????б????== */

.class{color:#777777;font-size:12px;}
a.class{color:#777777;text-decoration: none}
a.class:link{color:#777777;}
a.class:visited{color:#777777;}
a.class:hover{color:#ff6611;}

table.class{border:1px #dddddd solid}
td.class{padding-left:10px}

/* ==?????????б????== */

table.bigclass{border:1px #dddddd solid}
td.bigclass{background:#eeeeee;padding-left:10px;height:25px}

.bigclass{color:#777777;font-size:12px;line-height:150%}
a.bigclass{color:#777777;font-weight:bold;line-height:150%;text-decoration: none}
a.bigclass:link{color:#777777;}
a.bigclass:visited{color:#777777;}
a.bigclass:actived{color:#777777;}
a.bigclass:hover{color:#ff6611;}


table.smallclass{border:0px #dddddd solid}
td.smallclass{background:#f7f7f7;padding-left:10px;height:18px}

.smallclass{color:#555555;font-size:12px;line-height:150%}
a.smallclass{color:#555555;line-height:150%;text-decoration: none}
a.smallclass:link{color:#555555;}
a.smallclass:visited{color:#555555;}
a.smallclass:actived{color:#555555;}
a.smallclass:hover{color:#ff6611;}



/* ==??????????== */

td.downquery{height:22px}

.downquery{color:#777777;line-height:150%;font-size:12px}
a.downquery{color:#777777;line-height:150%;font-size:12px;text-decoration: none}
a.downquery:link{color:#777777;}
a.downquery:active{color:#777777;}
a.downquery:visited{color:#777777;}
a.downquery:hover{color:#ff6611;}

.downquerytitle{border:1px #eeeeee solid;background:#f0f0f0}
.downquerytime{color:#555555;font-size:12px}

.downpropname{color:#555555;font-size:12px;background:#dddddd}
.downprop{color:#555555;font-size:12px;padding-left:10px;background:#f0f0f0}
.downintro {color:#777777;font-size:12px;line-height:150%;}


/* ==?????????== */

.cpline{background:#dddddd}
td.cpquery{background:#ffffff;}
div.cpquery{border:1px #eeeeee solid;padding:5px;background:#ffffff;}

a.cpquerytitle{color:#777777;font-size:12px;line-height:26px}
div.cpquerytitle{border:1px #eeeeee solid;padding:2px;background:#f7f7f7}


.cppropname{color:#555555;font-size:12px;background:#dddddd}
.cpprop{color:#555555;font-size:12px;padding-left:10px;background:#f0f0f0}
.cpintro {color:#777777;font-size:12px;line-height:150%;}


/* ==?????????== */

.notic{font-size:12px;color:#777777}
.noticerr{font-size:12px;color:#ff6600}
.noticlink{font-size:12px;color:#ff6600}


/* ==?????????== */

.mustfill {color:#ff0000;font-size:14px;}
.memberinfo{color:#555555;}


/* ==???????== */

td.bbsquery{height:23px}

.bbsquery{color:#777777;line-height:150%;font-size:12px}
a.bbsquery{color:#777777;line-height:150%;font-size:12px;text-decoration: none}
a.bbsquery:link{color:#777777;}
a.bbsquery:active{color:#777777;}
a.bbsquery:visited{color:#777777;}
a.bbsquery:hover{color:#ff6611;}

.bbsquerytitle{border:1px #eeeeee solid;background:#f0f0f0}
.bbsquerytime{color:#555555;font-size:12px}


.bbstitle{background:#eeeeee}
.bbscon{background:#ffffff}
.bbstable{background:#dddddd;}
.bbsline{background:#dddddd}


/* ==?????????== */

.searchtitle{color:#777777;font-size:14px;line-height:32px}
a.searchtitle{color:#777777;font-size:14px;line-height:32px}
.searchbody{color:#333333;font-size:13px;line-height:18px;height:60px; padding:0.5% 0;}
.searchtime{color:#555555;font-size:12px}


@media (min-width: 1260px){
.header1 .menu { display: none}
}
@media (max-width:1260px){
	.head_box1 { height: 70px}
	.wrapper { width: 100% !important}
    .top, #i_menu_login_reg {display:none;}
    .header{z-index: 9999; height: auto; overflow: visible; position: fixed; top: 0; background: #FFFFFF; box-shadow: none}
    .header .section{width: 94%}
    .m_menu{ display:block;}
	.news_query .img { height: 190px}
	.elecom_user { display: none}
    .header .menu { display: none !important; position:absolute; right: 0; height: 100%; top: 0; padding-top: 55px; border: 0 !important; background: #1a1a1a; width: 250px; max-width: none !important; display:none;z-index: 9888}
    .header .menu ul li{ width:100%; line-height: 40px; border-bottom: 1px solid rgba(255,255,255,.03); padding: 0;}
    .header .menu ul li a{ float: none !important; padding:0; height: 40px; line-height: 40px; color: #A6A6A6}
	.header .menu ul li a:hover { color: #FFFFFF !important}
	.header .menu ul li.a a { color: #FFFFFF !important}
    .header .menu li .drop ul{ width:100%; padding:0;}
    .header .menu li .drop{ position:static;}
    .header .menu li .drop .hide{ display:none;}
    .header .menu li .drop li{ width:100%; text-align:left;  box-sizing:border-box; border:none;}
	
	.header1 .menu { position: fixed; right: -250px; transition: all 0.5s ease 0s; height: 100%; top: 0; padding-top: 55px; border: 0 !important; background: #1a1a1a; width: 250px; max-width: none !important; z-index: 10000}
	.header1 .menu.on { right: 0 !important}
    .header1 .menu ul li{ width:100%; line-height: 40px; border-bottom: 1px solid rgba(255,255,255,.03); padding: 0; text-align: left}
    .header1 .menu ul li a{ float: none !important; padding: 0 0 0 20px; height: 40px; line-height: 40px; color: #A6A6A6}
	.header1 .menu ul li a:hover { color: #FFFFFF !important}
	.header1 .menu ul li.a a { color: #FFFFFF !important}
    .header1 .menu li .drop ul{ width:100%; padding:0;}
    .header1 .menu li .drop{ position:static;}
    .header1 .menu li .drop .hide{ display:none;}
    .header1 .menu li .drop li{ width:100%; text-align:left;  box-sizing:border-box; border:none;}
	
    .header .logo{padding: 18px 0; margin: 0; width: auto;}
    .header .logo img{ height: 34px}
    .map{display: none;}
    .index_ab_tt{font-size: 150px;}
    .index_ab_tt01{ font-size: 40px;}
    .inside-ban{margin-top: 70px;}
    .ban-warp h2{ font-size: 42px; line-height: 42px}
	.ban-warp h2.views1 { max-height: 34px; font-size: 32px !important; line-height: 32px}
    .ban-warp p{font-size: 16px;}
    .ab-con ul{height: auto; width: 100%; margin: 10px 0;}
    .cp_query ul li{width: 31.333%;}
    .cp_query01 ul li{width: 31.333%;}
    .gc_title h3,.news_title h3{ font-size: 25px;}
    .tl-box h5{font-size: 24px; line-height: 28px;}
    .tl-box span{ font-size: 17px;}
	.col-md-5 { margin-left: 0 !important}

}


@media (max-width:1200px){

}
@media (max-width:1120px){
    .cn-box .left, .cn-box .right{width: 100%; margin-top: 30px}
}


@media (max-width:1024px){
    .build-list .build-pic img{height: 250px;}
    .news-list .news-pic img{height: 190px;}
    .news_query ul li img{ height: auto}
}
@media (max-width:999px){
    .nr_lm .now-menu{display: none;}
	.mcb-column .align_center h2 { font-size: 49px !important}
	big, .big, .mcb-column .align_center h6 { font-size: 14px !important}
}
@media (max-width:856px){

    .foot_Buttom .fl{width: 100%;}
    .foot_Buttom .fr{width: 100%;}
	.l_box { float: none !important; width: 100% !important; margin-top: 30px !important}
	.r_box { float: none !important; width: 100% !important}

}
/*banner媒体查询*/
@media (max-width:768px){
.mcb-column .align_center h2 { font-size: 40px !important}
.ne-del h4 { font-size: 40px}
.container.margin_60 .main_title h3 { padding-top: 50px; font-size: 26px !important}
.ab-con ul { height: auto !important}
}


@media (max-width:658px){
    .nTab .TabTitle ul{
        width: 92%;
    }
    .nTab .TabTitle li{
        width:31.333%;
        margin:0 1%;
    }

    .build-list ul li{width: 48%;}
    .index_ab_tt{font-size: 80px;}
    .index_ab_tt01{    font-size: 25px;}
    .abt_nav .list{ width: 31.33%; margin: 10px 1%;}
    .news-list ul li{width: 48%;}
    .build-list .build-pic img{height: 155px;}
    .news-list .news-pic img{height: 140px;}
    .foot_left .none1 {display: none;}
	.foot_left ul { width: 33.33%}
    .foot_right{width: 100%;    margin: 15px 0;}
    .foot_right01{width: 100%; margin: 10px 0;text-align: center;}
    .foot_right01 ul{width: 162px;}
    .foot_right02{width: 100%; text-align: center;}
    .foot_right02 img{margin: auto}
    .foot_right02 h3{padding: 5px 0;}
    .ban-warp h2 { font-size: 42px;line-height: 42px}
	.ban-warp h2.views1 { max-height: 64px; font-size: 24px !important; line-height: 32px}
    .ban-warp p{font-size: 14px;line-height: 24px;}
	.news_query .img { height: 150px}
    .news_query ul li img{height: auto}
    .news_query ul li{width: 48%;}
    .cp_query ul li{width: 48%;}
    .cp_query ul li img{height: 150px;}
    .nr_lm ul li{    margin-right: 10px;}
    .nr_lm ul li a{    padding: 0 10px;}
    .cp_query01 ul li{width: 48%;}
    .qt-pagination a{ padding: 0 5px;margin-right: 3px; min-width: 25px;  height: 25px;   line-height: 25px;    }
    .newslist .time{width: 13%;}
    .newslist .conts{width: 85%}
	.mcb-column .align_center h2 { font-size: 30px !important; line-height: 40px !important}
	.fancy_heading .title { font-size: 30px !important}
	.foot_left ul li { text-align: center}
	.ne-del h4 { font-size: 32px}
	.mcb-column .align_center h6 a { height: 24px !important; line-height: 24px !important; font-size: 12px !important; padding: 0 16px !important}
	.pagination { bottom: 15px !important}
	.foot_left ul h3 { text-align: center}
	ul.wx1 { width: 100%; padding-top: 50px; text-align: center}
	ul.wx1 .y { float: none !important}
	.foot_Buttom .z { float: none; width: 100%; text-align: center}
	.foot_Buttom .y { float: none; width: 100%; padding-top: 10px; text-align: center}
}

@media (max-width:525px){
    .newslist .time{width: 20%;}
    .newslist .conts{width: 72%; float: right;}
	.mcb-column .align_center h2 { font-size: 22px !important; line-height: 30px !important}
	.fancy_heading .title { font-size: 22px !important}
}

@media (max-width:428px){

    .cp_query01 ul li{width: 98%;}
    .cp_query01 ul li img{    height: auto;}
}


.mcb-column .align_center {
    text-align: center;
}
.mcb-column .align_center h2 {
    font-size: 48px;
    line-height: 60px;
    font-weight: bold;
    letter-spacing: 0px;
	margin-bottom: 22px;
	color: #FFFFFF;
	font-family: Arial,SourceHanSansCN-Regular,Microsoft Yahei,Verdana,Helvetica Neue,Hiragino Sans GB,Microsoft Sans Serif,WenQuanYi Micro Hei,sans-serif
}
hr.no_line {
    background: none;
    color: transparent;
}
big, .big {
    font-size: 20px;
    line-height: 28px;
    font-weight: 400;
    letter-spacing: 0px;
	color: #FFFFFF
}
.mcb-column .align_center p {
    margin: 0 0 28px 0;
	text-align: center !important
}
.mcb-column .align_center h6 {
    font-size: 13px;
    letter-spacing: 0px;
}
.mcb-column .align_center h6 a {
	display: inline-block;
	height: 37px;
	line-height: 37px;
	padding: 0 50px;
    color: #FFFFFF;
	border-radius: 3px;
	background: #ba2c1f
}





.section_wrapper, .container {
    max-width: 1220px;
    margin: 0 auto;
    position: relative;
}
@media (max-width:1240px) {
    .section_wrapper, .container { max-width: 1122px}
}
.one.mcb-wrap {
    width: 100%;
}
.one.column {
    width: 98%;
}
.fancy_heading {
    text-align: center;
}
.fancy_heading_line {
    background-image: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fancy_heading_hr.png);
    background-position: bottom center;
    background-repeat: no-repeat;
    padding-bottom: 15px;
}
.fancy_heading .title {
    font-size: 42px;
	padding: 0;
	margin: 0 0 15px 0;
	height: auto;
    line-height: 42px;
	color: #ba2c1f;
}
.mcb-wrap {
    float: left;
    position: relative;
    z-index: 1;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.one-third.mcb-wrap {
    width: 33.333%;
}
.column_zoom_box {
    text-align: center;
    line-height: 0;
}
.column-margin-20px .column {
    margin-bottom: 20px !important;
}
.zoom_box {
    position: relative;
    line-height: 0;
    overflow: hidden;
    display: inline-block;
    max-width: 100%;
}
img.scale-with-grid, #Content img {
    max-width: 100%;
    height: auto;
}
#Content .zoom_box .photo img {
    max-width: 100.1%;
}
.zoom_box .photo img, .zoom_box .desc {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.zoom_box .photo img {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
.zoom_box .desc {
    background: rgba(0,0,0,.8);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    opacity: 0;
    -webkit-transform: scale(1.15);
    -moz-transform: scale(1.15);
    -ms-transform: scale(1.15);
    -o-transform: scale(1.15);
    transform: scale(1.15);
}
.zoom_box:hover .desc {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
.zoom_box .desc .desc_img img {
	display: inline-block;
    max-width: 30%!important;
    padding-bottom: 15px;
}
img.scale-with-grid, #Content img {
    max-width: 100%;
    height: auto;
}
.column_attr h5 {
    font-size: 19px;
    line-height: 26px;
    font-weight: 800;
    letter-spacing: 0px;
	color: #1a1a1a
}
@media (max-width:767px) {
.section_wrapper .mcb-wrap, .section_wrapper .column, .container .column, .sections_group, .four.columns {
    margin: 0;
    width: 100%!important;
    clear: both;
}
}


#body_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 120%;
    background: rgba(0,0,0,.6);
    z-index: 10000;
    display: none;
}


.section.has-video .section_video {
    position: absolute;
    top: 0;
    left: 0;
    min-height: 100%;
    min-width: 100%;
    overflow: hidden;
    z-index: 1;
}
.section_video .mask {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 3;
    background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/videomask.png) repeat center;
}
.section.has-video .section_video video {
    position: absolute;
    top: 0;
    left: 0;
    min-height: 100%;
    min-width: 100%;
    z-index: 2;
}
.section_wrapper {
    position: relative;
    z-index: 10;
}
.mcb-wrap {
    float: left;
    position: relative;
    z-index: 1;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
a.button_full_width {
	display: inline-block;
    background-color: #ba2c1f;
    color: #ffffff;
}
a.button_full_width {
    margin: 0!important;
    vertical-align: middle;
	font-size: 14px
}

a.button_full_width {
    display: inline-block;
    padding: 2px 0;
    margin-bottom: 15px;
    cursor: pointer;
    border: 0;
    border-radius: 6px;
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: inset 0 0 0 1px rgb(0 0 0 / 3%);
    box-shadow: inset 0 0 0 1px rgb(0 0 0 / 3%);
    background-image: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/box_shadow_button.png);
    background-repeat: repeat-x;
}

a.button_full_width {
    width: 100%;
    text-align: center;
}
a.button_full_width {
    background-image: none;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: inset 0 0 0 0;
    box-shadow: inset 0 0 0 0;
    -webkit-appearance: none;
}
a.button_full_width .button_label {
    display: block;
    float: left;
    position: relative;
    z-index: 2;
}
a.button_full_width .button_label {
    padding: 11px 20px;
}
a.button_full_width .button_label {
    display: inline-block;
    float: none;
}


@media (max-width: 767px) {
.section_wrapper, .container, .four.columns .widget-area {
    max-width: 700px!important;
    padding-left: 33px!important;
    padding-right: 33px!important;
}
}
@media (min-width: 1240px) {
.section_wrapper, .container {
    max-width: 1200px;
}
}

.one-second.column {
    width: 48%;
}


h3.tits {
    font-size: 36px;
    line-height: 42px;
    font-weight: 700;
    letter-spacing: 0px;
	color: #1a1a1a;
	margin-bottom: 15px
}
.button_size_2 { display: inline-block; padding: 11px 20px; background-color: #ba2c1f; color: #ffffff !important; font-size: 14px}


#gotop { display: none !important}

.carousel_testimonials .hd { padding-top: 20px; text-align: center}
.carousel_testimonials .hd li { width: 10px;
    height: 10px;
    margin: 5px 7px;
    background: #D6D6D6;
    display: inline-block;
	border-radius: 50%;
	text-indent: 9999px;
	cursor: pointer}
.carousel_testimonials .hd li.on { background: #ba2c1f;}


@media (max-width: 500px) {
	.mcb-column .align_center h2 { margin-bottom: 12px !important}
	big, .big { max-height: 44px !important; line-height: 22px !important; font-size: 12px !important; overflow: hidden !important}
	.mcb-column .align_center p { margin-bottom: 18px !important}

}








.newsbg[data-v-49836f9e] {
    padding: 62px 0;
    background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/bgx.png) no-repeat 50% bottom;
}
.pageWidth {
    width: 100%;
    max-width: 1200px;
    padding: 0;
    margin: 0 auto;
}
.dynamic[data-v-49836f9e] {
    background: #fff;
    -webkit-box-shadow: 0 0 60px 0 rgb(0 0 0 / 10%);
    box-shadow: 0 0 60px 0 rgb(0 0 0 / 10%);
    overflow: hidden;
    height: 418px;
}
.el-row {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.el-col {
    float: left;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
	overflow: hidden
}
.el-col-8 {
    width: 33.33333%;
}
.dynamic .newsbgs[data-v-49836f9e] {
    height: 418px;
    position: relative;
    overflow: hidden;
    width: 400px;
}
.dynamic .newsbgs img[data-v-49836f9e] {
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
    width: 400px;
    height: 418px;
}
.dynamic .newsbgs h4[data-v-49836f9e] {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 36px;
    font-weight: 700;
    line-height: 1;
    padding: 38px 0 0 30px;
    color: #fff;
}
.el-col-9 {
    width: 37.5%;
}
.dynamic .news[data-v-49836f9e] {
    height: 420px;
    padding: 30px;
    position: relative;
}
.dynamic .title[data-v-49836f9e] {
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    margin-bottom: 19px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -ms-flexbox;
    display: -webkit-box;
    -ms-line-clamp: 2;
    -ms-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}
.dynamic .date[data-v-49836f9e] {
    color: #ababab;
    font-size: 16px;
    line-height: 1;
    margin-bottom: 0;
}
.HTSC {
    font-family: HTSC!important;
    font-size: .213333rem;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.date .icon[data-v-49836f9e] {
	float: left;
	width: 18px;
	height: 18px;
	margin: -3px 0 0 0;
    font-size: 18px;
    vertical-align: 0;
    margin-right: 6px;
	background: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/datex.png) no-repeat center center
}

element.style {
}
@media (min-width: 1000px)
.contain .dynamic .news .desc[data-v-49836f9e] {
    height: 125px;
}
.contain .dynamic .news .desc[data-v-49836f9e] {
    line-height: 2;
    color: #666;
    font-size: 16px;
    margin-top: 18px !important;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -ms-line-clamp: 4;
    -ms-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    -webkit-box-orient: vertical;
}
.dynamic .news .desc[data-v-49836f9e] {
    line-height: 2;
    color: #666;
    font-size: 16px;
    margin-top: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
	text-indent: 22px;
    -ms-line-clamp: 4;
    -ms-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    -webkit-box-orient: vertical;
}
.dynamic .news .desc[data-v-49836f9e] {
    height: 125px;
}
.dynamic .news .link[data-v-49836f9e] {
    position: absolute;
    right: 30px;
    bottom: 22px;
    margin-bottom: 0;
	transition: all 0.5s ease 0s
}
.dynamic .news .link[data-v-49836f9e]:hover { right: 25px}
.dynamic .news .link a[data-v-49836f9e] {
    font-size: 14px;
    color: #666;
}


.el-col-7 {
    width: 29.16667%;
}
.dynamic .list[data-v-49836f9e] {
    padding: 30px;
}
.dynamic .list ul li[data-v-49836f9e] {
    border-top: 1px solid #d8d8d8;
    padding: 10px 0 20px 0;
}
.dynamic .list ul li[data-v-49836f9e]:first-child {
    border-top: none;
    padding-top: 0;
}
.title1[data-v-49836f9e] {
    font-size: 18px;
    font-weight: 400;
    line-height: 30px;
    margin-bottom: 19px !important;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -ms-flexbox;
    display: -webkit-box;
    -ms-line-clamp: 2;
    -ms-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
	transition: all 0.5s ease 0s
}
.title1[data-v-49836f9e]:hover { padding-left: 5px}
.title1 a { display: block; color: #333333}
.dynamic .list ul li .op[data-v-49836f9e] {
    margin-bottom: 0;
}


.announce[data-v-49836f9e] {
    height: auto;
    padding: 36px 0;
}
.announce h4[data-v-49836f9e] {
    font-size: 36px;
    font-weight: 700;
    color: #fff;
    line-height: 1;
    margin-bottom: 25px;
}
.announce .al[data-v-49836f9e] {
    height: 282px;
    width: 386px;
    padding-right: 52px;
    border-right: 1px solid hsla(0,0%,67.1%,.3);
}
.announce .al img[data-v-49836f9e] {
    width: 334px;
    height: 166px;
    margin-bottom: 26px;
}
.announce .al .title[data-v-49836f9e] {
    height: 59px;
    font-size: 18px;
    font-weight: 400;
    color: #fff;
    margin-bottom: 8px;
    line-height: 28px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -ms-line-clamp: 2;
    -ms-box-orient: vertical;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}
.announce .al .title1 a[data-v-49836f9e] {
    color: #fff;
}
.announce .al .date[data-v-49836f9e] {
    font-size: 16px;
    margin-bottom: 0;
    color: #ababab;
}
.el-col-16 {
    width: 66.66667%;
}
.announce .ar[data-v-49836f9e] {
    padding-left: 36px;
}
.announce h4 a[data-v-49836f9e] {
    float: right;
    font-weight: 400;
    font-size: 16px;
    color: #ababab;
}
.announce .ar ul li[data-v-49836f9e] {
    padding: 30px 0;
    border-top: 1px solid hsla(0,0%,67.1%,.3);
}
.announce .ar ul li[data-v-49836f9e]:first-child {
    padding-top: 0;
    border-top: none;
}
.contain .announce .ar ul li[data-v-49836f9e]:first-child {
    padding-top: 0;
    border-top: none;
}
.announce .ar ul li a[data-v-49836f9e] {
    font-size: 18px;
    font-weight: 400;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    display: inline-block;
    text-overflow: ellipsis;
    width: 615px;
	transition: all 0.5s ease 0s
}
.announce .ar ul li a[data-v-49836f9e]:hover { padding-left: 5px}
.announce .ar ul li .date[data-v-49836f9e] {
    float: right;
    font-size: 16px;
    color: #ababab;
}


.service .title1[data-v-49836f9e] {
    padding: 80px 0 60px 0;
}
.service .title1 h4[data-v-49836f9e] {
    font-size: 36px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    margin-bottom: 37px;
}
.service .title1 h4 span[data-v-49836f9e] {
    position: relative;
	color: #333333
}
.service .title1 h4 span[data-v-49836f9e]:after {
    content: "";
    position: absolute;
    height: 3px;
    width: 52px;
    bottom: -18px;
    left: 50%;
    margin-left: -26px;
    background: #ba2c1f
}
.service .title1 p[data-v-49836f9e] {
    margin-bottom: 0;
    font-size: 18px;
    text-align: center;
    color: #ababab;
}
.el-col-12 {
    width: 50%;
	overflow: visible
}
.service .item[data-v-49836f9e] {
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 0 0 60px 0 rgb(0 0 0 / 10%);
    box-shadow: 0 0 60px 0 rgb(0 0 0 / 10%);
}
.service .item img[data-v-49836f9e] {
    height: 314px;
    -webkit-transition: all .3s;
    transition: all .3s;
}
.service .item .box h4[data-v-49836f9e] {
    font-size: 30px;
    color: #0c39b9;
    font-weight: 700;
    margin-bottom: 18px;
    line-height: 1;
    margin-top: 28px;
    padding-left: 30px;
}
.service .item .box .desc[data-v-49836f9e] {
	max-height: 128px;
    font-size: 16px;
    font-weight: 400;
    padding: 0 30px;
    color: #999;
    text-align: justify;
    line-height: 32px;
	overflow: hidden
}
.service .row2[data-v-49836f9e] {
    margin-top: 55px;
}


@media only screen and (max-width: 1200px) {
	.pageWidth { padding: 0 3%}
}
@media only screen and (max-width: 1000px) {
	.el-col-7 { display: none}
	.el-col-8 { width: 40% !important}
	.el-col-9, .el-col-16 { width: 60% !important}
}
@media only screen and (max-width: 900px) {
	.announce .ar ul li a[data-v-49836f9e] { width: 70%}
}
@media only screen and (max-width: 660px) {
	.el-col-7 { display: none}
	.el-col-8, .el-col-12 { width: 100% !important}
	.el-col-9, .el-col-16 { width: 100% !important}
	.el-col-12 { margin-bottom: 40px}
	.service .row2[data-v-49836f9e] { margin-top: 0}
	.service .item .box .desc[data-v-49836f9e] { max-height: none}
	.dynamic[data-v-49836f9e] { height: auto !important}
	.dynamic .newsbgs[data-v-49836f9e] { width: 100%; height: auto; max-height: 300px; border-radius: 4px 4px 0 0; overflow: hidden}
	.dynamic .newsbgs img[data-v-49836f9e] { width: 100%; height: auto}
	.dynamic .news[data-v-49836f9e] { height: auto}
	.dynamic .news .desc[data-v-49836f9e] { height: auto; padding-bottom: 30px}
	
	.announce h4[data-v-49836f9e] {}
	.announce h4 a[data-v-49836f9e] { margin-top: 10px}
	.announce .al[data-v-49836f9e] { width: 100%; height: auto; border: 0; padding: 0; margin: 0 0 30px 0}
	.announce .al img[data-v-49836f9e] { width: 100%; height: auto}
	.announce .ar[data-v-49836f9e] { padding-left: 0}
	.announce .ar ul li[data-v-49836f9e] { padding: 20px 0}
	
}


.service-list .el-col-12 { transition: all 0.5s ease 0s}
.service-list .el-col-12:hover { transform: translateY(-10px)}
.service-list .el-col-12:hover .item[data-v-49836f9e] { box-shadow: 0 10px 60px 0 rgb(0 0 0 / 15%)}

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

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
}

@-webkit-keyframes bounce {
  0%, 20%, 53%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
            transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
            transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
            transform: translate3d(0,-4px,0);
  }
}

@keyframes bounce {
  0%, 20%, 53%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
            transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
            transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
            transform: translate3d(0,-4px,0);
  }
}

.bounce {
  -webkit-animation-name: bounce;
          animation-name: bounce;
  -webkit-transform-origin: center bottom;
      -ms-transform-origin: center bottom;
          transform-origin: center bottom;
}

@-webkit-keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
          animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05);
    }

    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes pulse {
    /*0% {*/
        /*-webkit-transform: scale3d(1, 1, 1);*/
        /*transform: scale3d(1, 1, 1);*/
    /*}*/

    0% {
        opacity: 0;
        -webkit-transform: scale3d(.75, .75, .75);
        transform: scale3d(.75, .75, .75);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse;
}

@-webkit-keyframes rubberBand {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
            transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
            transform: scale3d(1.05, .95, 1);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
            transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
            transform: scale3d(1.05, .95, 1);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  -webkit-animation-name: rubberBand;
          animation-name: rubberBand;
}

@-webkit-keyframes shake {
  0%, 100% {
    -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 {
  0%, 100% {
    -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);
  }
}

.shake {
  -webkit-animation-name: shake;
          animation-name: shake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
            transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
            transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
            transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
            transform: rotate3d(0, 0, 1, -5deg);
  }

  100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
            transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
            transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
            transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
            transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
            transform: rotate3d(0, 0, 1, -5deg);
  }

  100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
            transform: rotate3d(0, 0, 1, 0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
      -ms-transform-origin: top center;
          transform-origin: top center;
  -webkit-animation-name: swing;
          animation-name: swing;
}

@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

.tada {
  -webkit-animation-name: tada;
          animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: none;
            transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
            transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
            transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
            transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
            transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
            transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: none;
            transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
            transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
            transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
            transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
            transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
            transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.wobble {
  -webkit-animation-name: wobble;
          animation-name: wobble;
}

@-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
            transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
            transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
            transform: scale3d(.97, .97, .97);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
            transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
            transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
            transform: scale3d(.97, .97, .97);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: .75s;
          animation-duration: .75s;
}

@-webkit-keyframes bounceInDown {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
            transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
            transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
            transform: translate3d(0, 5px, 0);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes bounceInDown {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
            transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
            transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
            transform: translate3d(0, 5px, 0);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
          animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
            transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
            transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
            transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
            transform: translate3d(5px, 0, 0);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes bounceInLeft {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
            transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
            transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
            transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
            transform: translate3d(5px, 0, 0);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
          animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
            transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
            transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
            transform: translate3d(-5px, 0, 0);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes bounceInRight {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
            transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
            transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
            transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
            transform: translate3d(-5px, 0, 0);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
          animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
            transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
            transform: translate3d(0, -5px, 0);
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
            transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
            transform: translate3d(0, -5px, 0);
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
          animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(.9, .9, .9);
            transform: scale3d(.9, .9, .9);
  }

  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }
}

@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(.9, .9, .9);
            transform: scale3d(.9, .9, .9);
  }

  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }
}

.bounceOut {
  -webkit-animation-name: bounceOut;
          animation-name: bounceOut;
  -webkit-animation-duration: .75s;
          animation-duration: .75s;
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }
}

@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
            transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
          animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
            transform: translate3d(20px, 0, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
            transform: translate3d(20px, 0, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
          animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
            transform: translate3d(-20px, 0, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }
}

@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
            transform: translate3d(-20px, 0, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
          animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
            transform: translate3d(0, 20px, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }
}

@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
            transform: translate3d(0, 20px, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
          animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

@keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

.fadeIn {
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
          animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
          animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
}

@keyframes fadeInLeft50 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-50px, 0, 0);
        transform: translate3d(-50px, 0, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInLeft50 {
    -webkit-animation-name: fadeIn50Left;
    animation-name: fadeInLeft50;
}

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
          animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
}


@keyframes fadeInRight50 {
  0% {
      opacity: 0;
      -webkit-transform: translate3d(50px, 0, 0);
      transform: translate3d(50px, 0, 0);
  }

  100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
  }
}

.fadeInRight50 {
  -webkit-animation-name: fadeInRight50;
  animation-name: fadeInRight50;
}


@keyframes fadeInRight100 {
  0% {
      opacity: 0;
      -webkit-transform: translate3d(100px, 0, 0);
      transform: translate3d(100px, 0, 0);
  }

  100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
  }
}

.fadeInRight100 {
  -webkit-animation-name: fadeInRight100;
  animation-name: fadeInRight100;
}
@keyframes fadeInRight20 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInRight20 {
    -webkit-animation-name: fadeInRight20;
    animation-name: fadeInRight20;
}

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
          animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}

@keyframes fadeInUp50 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 50px, 0);
        transform: translate3d(0, 50px, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInUp50 {
    -webkit-animation-name: fadeInUp50;
    animation-name: fadeInUp50;
}

@keyframes fadeInUp20 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

.fadeInUp20 {
    -webkit-animation-name: fadeInUp20;
    animation-name: fadeInUp20;
}

@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
          animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  0% {opacity: 1;}
  100% {opacity: 0;}
}

@keyframes fadeOut {
  0% {opacity: 1;}
  100% {opacity: 0;}
}

.fadeOut {
  -webkit-animation-name: fadeOut;
          animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
          animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }
}

@keyframes fadeOutDownBig {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
            transform: translate3d(0, 2000px, 0);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
          animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
}

@keyframes fadeOutLeft {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
          animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
            transform: translate3d(-2000px, 0, 0);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
          animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }
}

@keyframes fadeOutRight {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
          animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }
}

@keyframes fadeOutRightBig {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
            transform: translate3d(2000px, 0, 0);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
          animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }
}

@keyframes fadeOutUp {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
          animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }
}

@keyframes fadeOutUpBig {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
            transform: translate3d(0, -2000px, 0);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
          animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
            transform: perspective(400px) scale3d(.95, .95, .95);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
}

@keyframes flip {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
            transform: perspective(400px) scale3d(.95, .95, .95);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
          backface-visibility: visible;
  -webkit-animation-name: flip;
          animation-name: flip;
}

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
            transition-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-transition-timing-function: ease-in;
            transition-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);
  }

  100% {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }
}

@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
            transition-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-transition-timing-function: ease-in;
            transition-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);
  }

  100% {
    -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 {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
            transition-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-transition-timing-function: ease-in;
            transition-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  100% {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }
}

@keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
            transition-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-transition-timing-function: ease-in;
            transition-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  100% {
    -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 {
  0% {
    -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;
  }

  100% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  0% {
    -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;
  }

  100% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-name: flipOutX;
          animation-name: flipOutX;
  -webkit-animation-duration: .75s;
          animation-duration: .75s;
  -webkit-backface-visibility: visible !important;
          backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px);
            transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
            transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
            transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
          backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
          animation-name: flipOutY;
  -webkit-animation-duration: .75s;
          animation-duration: .75s;
}

@-webkit-keyframes lightSpeedIn {
  0% {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
            transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
            transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
            transform: skewX(-5deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

@keyframes lightSpeedIn {
  0% {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
            transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
            transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
            transform: skewX(-5deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
          animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
          animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  0% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
            transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  0% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
            transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
          animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
          animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  0% {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
            transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

@keyframes rotateIn {
  0% {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
            transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
          animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
          animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
          animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
          animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
            transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
            transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: none;
            transform: none;
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
          animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  0% {
    -webkit-transform-origin: center;
            transform-origin: center;
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
            transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  0% {
    -webkit-transform-origin: center;
            transform-origin: center;
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
            transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
          animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
            transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
          animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
          animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
            transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
            transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
          animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
            transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
            transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
            transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
          animation-name: rotateOutUpRight;
}

@-webkit-keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
            transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
            transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
    opacity: 1;
  }

  100% {
    -webkit-transform: translate3d(0, 700px, 0);
            transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

@keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
            transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }

  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
            transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
            transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
    opacity: 1;
  }

  100% {
    -webkit-transform: translate3d(0, 700px, 0);
            transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-name: hinge;
          animation-name: hinge;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
            transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes rollIn {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
            transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
          animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
            transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

@keyframes rollOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
            transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

.rollOut {
  -webkit-animation-name: rollOut;
          animation-name: rollOut;
}

@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomInDown {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInDown {
  -webkit-animation-name: zoomInDown;
          animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomInLeft {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
          animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomInRight {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
            transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInRight {
  -webkit-animation-name: zoomInRight;
          animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomInUp {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInUp {
  -webkit-animation-name: zoomInUp;
          animation-name: zoomInUp;
}

@-webkit-keyframes zoomOut {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  100% {
    opacity: 0;
  }
}

@keyframes zoomOut {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  100% {
    opacity: 0;
  }
}

.zoomOut {
  -webkit-animation-name: zoomOut;
          animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
          animation-name: zoomOutDown;
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
            transform: scale(.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
            transform-origin: left center;
  }
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
            transform: scale(.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
            transform-origin: left center;
  }
}

.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
          animation-name: zoomOutLeft;
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
            transform: scale(.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
            transform-origin: right center;
  }
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
            transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
            transform: scale(.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
            transform-origin: right center;
  }
}

.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
          animation-name: zoomOutRight;
}

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
            transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
            animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
            transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
            transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
            animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
          animation-name: zoomOutUp;
}

@-webkit-keyframes slideInDown {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes slideInDown {
  0% {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
    visibility: visible;
  }


  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
          animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  0% {
    -webkit-transform: translateX(-110%);
            transform: translateX(-110%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@keyframes slideInLeft {
  0% {
    -webkit-transform: translateX(-110%);
            transform: translateX(-110%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
          animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  0% {
    -webkit-transform: translateX(105%);
            transform: translateX(105%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@keyframes slideInRight {
  0% {
    -webkit-transform: translateX(105%);
            transform: translateX(105%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
          animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes slideInUp {
  0% {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
          animation-name: slideInUp;
}

@-webkit-keyframes slideOutDown {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }

  100% {
    visibility: hidden;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}

@keyframes slideOutDown {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }

  100% {
    visibility: hidden;
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}

.slideOutDown {
  -webkit-animation-name: slideOutDown;
          animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }

  100% {
    visibility: hidden;
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

@keyframes slideOutLeft {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }

  100% {
    visibility: hidden;
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
          animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }

  100% {
    visibility: hidden;
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

@keyframes slideOutRight {
  0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }

  100% {
    visibility: hidden;
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
          animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }

  100% {
    visibility: hidden;
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}

@keyframes slideOutUp {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }

  100% {
    visibility: hidden;
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
          animation-name: slideOutUp;
}

@font-face {
 font-family: "Gilroy-Bold";
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Bold.eot);
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Bold.eot?#iefix) format("embedded-opentype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Bold.woff2) format("woff2"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Bold.woff) format("woff"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Bold.ttf) format("truetype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Bold.svg#BlenderPro-Medium) format("svg");
 font-weight: 500;
 font-style: normal;
 font-display: swap
}
 @font-face {
 font-family: "Gilroy-Medium";
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Medium.eot);
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Medium.eot?#iefix) format("embedded-opentype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Medium.woff2) format("woff2"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Medium.woff) format("woff"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Medium.ttf) format("truetype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Gilroy-Medium.svg#Gilroy-Medium) format("svg");
 font-weight: 500;
 font-style: normal;
 font-display: swap
}
 @font-face {
 font-family: "Myriad-Pro";
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/MyriadPro-Regular.eot);
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/MyriadPro-Regular.eot?#iefix) format("embedded-opentype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/MyriadPro-Regular.woff2) format("woff2"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/MyriadPro-Regular.woff) format("woff"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/MyriadPro-Regular.ttf) format("truetype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/MyriadPro-Regular.svg#BlenderPro-Medium) format("svg");
 font-weight: 500;
 font-style: normal;
 font-display: swap
}
 @font-face {
 font-family: "Rajdhani-Bold";
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-Bold.eot);
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-Bold.eot?#iefix) format("embedded-opentype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-Bold.woff2) format("woff2"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-Bold.woff) format("woff"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-Bold.ttf) format("truetype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-Bold.svg#BlenderPro-Medium) format("svg");
 font-weight: 500;
 font-style: normal;
 font-display: swap
}
 @font-face {
 font-family: "Rajdhani-semibold";
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-semibold.eot);
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-semibold.eot?#iefix) format("embedded-opentype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-semibold.woff2) format("woff2"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-semibold.woff) format("woff"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-semibold.ttf) format("truetype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/Rajdhani-semibold.svg#BlenderPro-Medium) format("svg");
 font-weight: 500;
 font-style: normal;
 font-display: swap
}
 @font-face {
 font-family: "GESans-Regular";
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/GESans-Regular.eot);
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/GESans-Regular.eot?#iefix) format("embedded-opentype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/GESans-Regular.woff2) format("woff2"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/GESans-Regular.woff) format("woff"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/GESans-Regular.ttf) format("truetype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/GESans-Regular.svg#BlenderPro-Medium) format("svg");
 font-weight: 500;
 font-style: normal;
 font-display: swap
}
 @font-face {
 font-family: "ONE-DAY";
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/ONEDAY.eot);
 src: url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/ONEDAY.eot?#iefix) format("embedded-opentype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/ONEDAY.woff2) format("woff2"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/ONEDAY.woff) format("woff"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/ONEDAY.ttf) format("truetype"), url(http://www.gxphoto.net/template/elec_201803_pic/style/images/fonts/ONEDAY.svg#ONEDAY) format("svg");
 font-weight: 400;
 font-style: normal;
 font-display: swap
}
.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.pc-banner[data-v-dabc661e] {
                padding-top: 0
            }

            .page-ban[data-v-dabc661e] {
                position: relative
            }

            .page-ban .img[data-v-dabc661e] {
                width: 100%;
                height: 520px;
                background-repeat: no-repeat;
                background-position: 50%;
                background-size: cover
            }

            .page-ban .auto[data-v-dabc661e] {
                position: relative;
                height: 100%
            }

            .page-ban .slogan[data-v-dabc661e] {
                z-index: 2;
                position: absolute;
                left: 0;
                top: 50%;
				width: 100%;
				text-align: center;
                transform: translateY(-50%);
                -webkit-transform: translateY(-50%);
                -moz-transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                -o-transform: translateY(-50%)
            }

            .page-ban .slogan .cn[data-v-dabc661e] {
                font-size: 36px;
                color: #FFFFFF;
                line-height: 1.2;
                font-weight: 300
            }

            .page-ban .slogan .en[data-v-dabc661e] {
                font-family: "Myriad-Pro";
                font-size: 20px;
                color: #F3AF3E;
                text-transform: capitalize;
                margin-top: 10px;
                line-height: 24px;
                letter-spacing: -.5px
            }