@charset "utf-8";
/* CSS Document */
@import url(base.css);
@import url(bootstrap.min.css);
.login_top{ width:980px; margin:0 auto; height:90px;}
.login_top img{ display:block; float:left; padding:37px 15px 0 0;}
.login_top span{ display:block; float:left; font: bold 30px/90px 'microsoft yahei'; color:#4e4e4e;}
.login_news{ width:980px; margin:0 auto; display:table; clear:both;}
.login_news h3{ font: bold 18px/54px 'microsoft yahei'; color:#8cb900;}
.login_news_portlet{ padding:0px 20px;}
.login_uiList01 li{ color:#8a8a8a; background:url(../images/index/icon01.gif) 0 12px no-repeat; padding-left:10px}
.login_uiList01 li b{ float:right;}
.login_uiList01 li a{ color:#8a8a8a;}
.login_uiList01 li a:hover{ color:#F80;}
.login_uiList02 li{ color:#8a8a8a; padding-left:10px}
.login_uiList02 li b{ float:right;}
.login_uiList02 li span{ padding-right:20px;}
.login_uiList02 li a{ color:#8a8a8a;}
.login_uiList02 li a:hover{ color:#F80;}
.login_uiList03 li{ color:#8a8a8a; padding-left:10px}
.login_uiList03 li b{ padding-left:20px; color:#10a4da;}
.login_uiList03 li span{ padding-right:20px; color:#10a4da;}
.login_uiList03 li a{ color:#8a8a8a;}
.login_uiList03 li a:hover{ color:#F80;}
.login_uiList03 li a b,.login_uiList03 li a span{ color:#10a4da;}
.login_uiList03 li a:hover b,.login_uiList03 li a:hover span{ color:#F80;}
.login_footer{ border-top:1px #dfdfdf solid; width:100%; clear:both; padding:15px 0; text-align:center; font: normal 14px/26px 'microsoft yahei'; margin-top:15px;}
.login_footer_cont{ width:960px; margin:0 auto; color:#666;}
.login_footer_cont b{ padding:0 5px; color:#f45d12;}
.login_footer_copy{ color:#787878; font-size:12px;}

.banner { position: relative; top: 0; z-index: 1; margin-top: 0;margin:0px auto; height: auto;
background:#4b8a08 url(../images/index/header46.jpg) center top no-repeat; border-top: 10px solid #eee;border-bottom: 10px solid #eee; font-family:'microsoft yahei'; overflow: hidden }
/*ms*/
.msmh_banner{ background:#008bd6; border-bottom:0;}
.msmh_banner dl{margin-bottom:0; overflow:auto;}
.msmh_banner dt{padding:0;}
.msmh_banner dd{ position:absolute;}
.msmh_banner_text{ color:#fff; font-size:24px; font-family:"Microsoft YaHei"; display:block; }


.msmh_ob01 dd{left:395px; top:120px; text-align:right;}
.msmh_ob01 .msmh_banner_text1{ color:#fff; font-size:24px; font-family:"Microsoft YaHei"; display:block; left:100px;
font-size:33px;text-shadow: 1px 1px 1px rgba(0,0,0,.3);
}
.msmh_ob01 .msmh_banner_text2{margin-top:6px; display:block; font-family:'方正正准黑简体','Microsoft YaHei'; font-size:19px; color:#fff;}

.msmh_ob02 dd{left:330px; top:125px; text-align:right;}
.msmh_ob02 .msmh_banner_text1{ font-size:32px; color:#fb3f20;font-family:'方正启体简体','Microsoft YaHei';}
.msmh_ob02 .msmh_banner_text2{margin-top:-10px;display:block; font-family:'Microsoft YaHei'; font-size:39px; color:#fff;text-shadow: 1px 1px 1px rgba(0,0,0,.3);}

.msmh_ob03 dd{top:135px; text-align:right;left:335px;}
.msmh_ob03 .msmh_banner_text1{ font-size:32px; color:#fff;font-family:'Microsoft YaHei';text-shadow: 1px 1px 1px rgba(0,0,0,.3);}
.msmh_ob03 .msmh_banner_text2{display:block;margin-top:5px; font-family:'方正细黑一简体','Microsoft YaHei'; font-size:20px; color:#fee28f;}
/*ms End*/

/*wklm*/
.wklmmh_banner{ background:#61d1e4 url(../images/wklm/wk_imgturnsbg2.jpg) repeat-x; border-bottom:0; border-top:0;}
/*wklm End*/


.ban_login_cont{ margin: 0 auto; width: 1003px;top:12px; position: relative; z-index:100;}
.ban_login{ position:absolute; right:0px; top:0px; width:266px; height:296px;}

/*ms*/
.ms_ban_login{width:256px !important;}
.msban_login_bg{position:absolute; right:0px;  width:256px;  background:#fff; opacity:0.5;filter: alpha(opacity=50);-moz-opacity: 0.5;-khtml-opacity: 0.5;}
.msban_login_bg1{height:62px;}
.msban_login_bg2{height:229px; top:63px;}
.ms_ban_login h3{border-bottom:0 !important;}
/*ms End*/

.ban_login_bg{position:absolute; right:0px;  width:266px; height:296px; background:#fff; opacity:0.5;filter: alpha(opacity=50);-moz-opacity: 0.5;-khtml-opacity: 0.5;}
.ban_login h3{ font: bold 20px/54px 'microsoft yahei'; color:#333; text-align:center; border-bottom:1px #666 solid;}
.ban_login table{ width:200px; margin:0 auto; margin-top:15px;}
.ban_login table table{ width:auto; margin:0;}
.ban_login table,.ban_login table th,.ban_login table td{ border:0;}
.ban_login td td{ padding:0;}
input.login_user { background: url(../images/index/login_user.png) 170px 8px no-repeat; }
input.login_key { background: url(../images/index/login_key.png) 170px 8px no-repeat; }
button.login_submit_teacher { height: 36px; background:#0FA3D9; border: 0; border-radius:3px; font: bold 14px/36px 'microsoft yahei'; color:#fff;  }
button.login_submit_student { height: 36px; background:#8BB900; border: 0; border-radius:3px; font: bold 14px/36px 'microsoft yahei'; color:#fff;  }
button.login_submit_teacher01 { height: 36px; background:#0FA3D9; border: 0; border-radius:3px 0px 0px 3px; font: bold 14px/36px 'microsoft yahei'; color:#fff;  }
button.login_submit_student01 { height: 36px; background:#8BB900; border: 0; border-radius:0px 3px 3px 0px; font: bold 14px/36px 'microsoft yahei'; color:#fff;  }
.default_button { font: 11px Helvetica, Arial, sans-serif; font-weight: 400; text-decoration: none; text-transform: uppercase; padding: 8px 18px; margin: 2px 3px; vertical-align: middle; display: inline-block; border: solid 1px #111; color: #fff; background: #444; cursor: pointer; -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 -1px 0 rgba(255,255,255,.1); -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 -1px 0 rgba(255,255,255,.1); box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 -1px 0 rgba(255,255,255,.1); -moz-transition: all .5s; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; zoom: 1; *display:inline
}
.default_button:hover { color: #fff; background: #777; border-color: #333 }
.default_button:active { color: #fff; background: #777; border-color: #333; box-shadow: inset 0 1px 2px rgba(0,0,0,0.50), 0px 0 1px rgba(0,0,0,0.50); -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.50), 0px 0 1px rgba(0,0,0,0.50); -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.50), 0px 0 1px rgba(0,0,0,0.50) }
.default_button.small { font-size: 10px; padding: 5px 14px }
.default_button.large { font-size: 12px; padding: 9px 24px }
.default_button.xlarge { font-size: 13px; padding: 13px 28px }

#onebyone_slider { position: relative; margin: 0 auto; width: 100%; z-index: 2; }
.ob01 { background:#4b8a08 url(../images/index/header46.jpg) center top no-repeat; }
.ob02 { background:#0D61A1 url(../images/index/header40.jpg) center top no-repeat; }
.ob03 { background:#FF5A0E url(../images/index/header49.jpg) center top no-repeat; }
.ob04 { background:#07B6B3 url(../images/index/header47.jpg) center top no-repeat; }
/*ms*/
.msmh_ob01{ background:#008bd6;}
.msmh_ob02{ background:#07B6B3 url(../images/teacherclub/ob02bg.jpg) repeat;}
.msmh_ob03{ background:#f44b4b;}
/*ms End*/
/*wklm*/
.wklmmh_ob01{ background:#61d2e4 url(../images/wklm/wk_imgturnsbg2.jpg) repeat-x;}
.wklmmh_ob02{ background:#ff9d27 url(../images/wklm/wk_imgturnsbg3.jpg) repeat-x;}
.wklmmh_ob03{ background:#00cf83 url(../images/wklm/wk_imgturnsbg4.jpg) repeat-x;}
/*wklm End*/

/*yxx*/
.yxx_banner{height:453px; background:url(../images/yxx/yxxbanner_bg.jpg) no-repeat center;}
/*yxx End*/

/*djmh_login*/
.djmh_form{ float:right;height:33px;line-height:31px;background:none; margin-right:20px;}
.djmh_form label{color:#ACACAC; font-size:12px;margin-left:5px;}
.djmh_form input{width:90px; height:20px; vertical-align:middle; line-height:20px;margin-right:5px; background:#686c6f; border:0; color:#ACACAC; font-size:12px;}
.djmh_form input.login{width:41px; height:20px;line-height:20px; cursor:pointer; color:#fff;background:#df7636; border-radius:2px;}

/*djmh_banner*/
.djmh_banner{height:324px; background:url(../images/djmh/topbg.png) no-repeat center bottom;}
.djmh_banner_1003{height:324px; background:url(../images/djmh/topbg.png) no-repeat center bottom;}
.djmh_bannerb{height:310px; background:url(../images/djmh/qu_top.jpg) no-repeat center bottom;}
.djmh_banner_1003b{height:310px; background:url(../images/djmh/qu_top.jpg) no-repeat center bottom;}
.djmh_bannerc{height:310px; background:url(../images/djmh/sch_top.jpg) no-repeat center bottom;}
.djmh_banner_1003c{height:310px; background:url(../images/djmh/sch_top.jpg) no-repeat center bottom;}
/*djmh_banner End*/

/*kp_banner*/
.kp_banner{height:260px; background:#9cc3e2 url(../images/djmh/kp_qu_top.jpg) bottom center no-repeat;}
.kp_banner_1003{height:260px; background:url(../images/djmh/kp_qu_top.jpg) bottom center no-repeat;}
.kp_bannerb{height:234px; background:#9accef url(../images/djmh/kp_sch_top.jpg) no-repeat center bottom;}
.kp_banner_1003b{height:234px; background:url(../images/djmh/kp_sch_top.jpg) no-repeat center bottom;}
.kp_bannerc{height:310px; background:url(../images/djmh/sch_top.jpg) no-repeat center bottom;}
.kp_banner_1003c{height:310px; background:url(../images/djmh/sch_top.jpg) no-repeat center bottom;}
/*kp_banner End*/

/*ts_banner*/
.ts_banner{height:135px; background:url(../images/tssjyj/ts_qu_top.jpg) no-repeat center bottom;}
.ts_banner_1003{height:135px; background:url(../images/tssjyj/ts_qu_top.jpg) no-repeat center bottom;}
/*ts_banner End*/

/*space*/
.space_banner{height:518px; background:url(../images/space/space_bannerbg.jpg) no-repeat center;}
.space_banner_1003{height:518px; background:url(../images/space/space_bannerbg.jpg) no-repeat center;}
/*space End*/


.oneByOne1 { top: 0; left: 0; margin: 0 auto; width: 100%; height: 320px; position: relative; overflow: visible }
/*ms*/
.msmh_banner .oneByOne1{height:335px;}
.msmh_banner #onebyone_slider .oneByOne_item{height:335px;}
/*ms End*/
.oneByOne_cont{ width:1003px;margin:0 auto; position:relative; top:0;  height: 340px; overflow: visible;}
#onebyone_slider .oneByOne_item { position: absolute; width: 100%; height: 320px;  overflow: visible }
#onebyone_slider .msmh_oneByOne_item{height:335px;}
#onebyone_slider .oneByOne_item span { }
#onebyone_slider .oneByOne_item a { text-decoration: none }
#onebyone_slider .oneByOne_item span.ob1_title { clear: left; position: relative; float: left; margin: 10px 12px 0 0; padding: 8px 8px 8px 0; color: #FFF; font: bold 26px/40px 'microsoft yahei'; text-transform: uppercase; text-shadow: 5px 5px 10px rgba(0,0,0,.3); z-index: 50 }
#onebyone_slider .oneByOne_item span.ob1_title a { color: #fff }
#onebyone_slider .oneByOne_item span.ob1_description { clear: left; position: relative; float: left; margin: 0 12px 0 0; max-width: 550px; color: #FFF; padding:5px 8px 8px 0px; font-size: 14px; text-shadow: 1px 1px 1px rgba(0,0,0,.3); z-index: 50;}
#onebyone_slider .oneByOne_item span.ob1_description b{ padding:0px 5px; color:#ffd200;}
#onebyone_slider .oneByOne_item span.ob1_attr { clear: left; position: relative; float: left; margin: 0px 12px 0 0px; padding:0px 8px; color:#f6f79c; z-index: 50 }
#onebyone_slider .oneByOne_item span.ob1_button { position:absolute; left:460px; top:120px; width:190px; height:56px; padding: 5px; background: #f45d12; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; text-align:center; font: bold 18px/28px 'microsoft yahei'; color:#fff; z-index: 50 }
#onebyone_slider .oneByOne_item span.ob1_button b { color:#ddfe00; display:block; }
#onebyone_slider .oneByOne_item span.ob1_button a{ color:#fff;}
#onebyone_slider .oneByOne_item span.ob1_button .default_button { margin: 0; padding: 10px 25px; border: 1px solid #222; font-size: 13px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px }
#onebyone_slider img.ob1_img_device1 { position: absolute; bottom: 18px; left: 40px; z-index: 40; width:620px; }
#onebyone_slider img.ob1_img_device2 { position: absolute; bottom:0px; left: 50px; z-index: 40; }
#onebyone_slider img.ob1_img_device3 { position: absolute; bottom: 20px; left: 40px; z-index: 40 }
#onebyone_slider img.ob1_img_device4 { position: absolute; bottom: 10px; left: 40px; z-index: 40 }
.buttonArea { float: left; left: 50%; position: relative; top: 100%; margin-top: -32px; z-index: 3; display: none }
.buttonCon { float: left; left: -50%; position: relative }
.buttonCon .theButton { display: block; color: #b22222; width: 20px; height: 22px; background: url(../images/index/circlebutton.png) no-repeat; text-indent: -9999px; border: 0; margin-right: 3px; float: left; transition: all .5s; -moz-transition: all .5s; -webkit-transition: all .5s; -o-transition: all .5s }
.buttonArea a.active { background-position: 0 -22px }
.arrowButton { cursor: pointer }
.arrowButton .prevArrow { background: url(../images/index/slider-arrows.png) no-repeat 0 0; width: 24px; height: 24px; position: absolute; top: 91.5%; right: 48px; z-index: 60 }
.arrowButton .nextArrow { background: url(../images/index/slider-arrows.png) no-repeat -40px 0; width: 24px; height: 24px; position: absolute; top: 91.5%; right: 20px; z-index: 60 }

/*ms,wklm*/
.msmh_banner .arrowButton,.wklmmh_banner .arrowButton { cursor: pointer; position:relative; height:335px; }
.msmh_banner .arrowButton .prevArrow,.wklmmh_banner .arrowButton .prevArrow { background: url(../images/index/slider-arrows.png) no-repeat 0 0; width: 24px; height: 24px; position: absolute; top: 50%; left: 20px; z-index: 60 }
.msmh_banner .arrowButton .nextArrow,.wklmmh_banner .arrowButton .nextArrow { background: url(../images/index/slider-arrows.png) no-repeat -40px 0; width: 24px; height: 24px; position: absolute; top: 50%; right: 20px; z-index: 60 }
/*ms,wklm End*/

.animate_zoom_obo { filter: alpha(opacity=0); opacity: 0; -webkit-transform: scale(5); -moz-transform: scale(5); -o-transform: scale(5); -ms-transform: scale(5); transform: scale(5) }
.animate0 { -webkit-animation-duration: .6s; -webkit-animation-delay: 0s; -webkit-animation-timing-function: ease; -webkit-animation-fill-mode: both; -moz-animation-duration: .6s; -moz-animation-delay: 0s; -moz-animation-timing-function: ease; -moz-animation-fill-mode: both; -ms-animation-duration: .6s; -ms-animation-delay: 0s; -ms-animation-timing-function: ease; -ms-animation-fill-mode: both; animation-duration: .6s; animation-delay: 0s; animation-timing-function: ease; animation-fill-mode: both }
.animate1 { -webkit-animation-duration: .6s; -webkit-animation-delay: .2s; -webkit-animation-timing-function: ease; -webkit-animation-fill-mode: both; -moz-animation-duration: .6s; -moz-animation-delay: .2s; -moz-animation-timing-function: ease; -moz-animation-fill-mode: both; -ms-animation-duration: .6s; -ms-animation-delay: .2s; -ms-animation-timing-function: ease; -ms-animation-fill-mode: both; animation-duration: .6s; animation-delay: .2s; animation-timing-function: ease; animation-fill-mode: both }
.animate2 { -webkit-animation-duration: .6s; -webkit-animation-delay: .4s; -webkit-animation-timing-function: ease; -webkit-animation-fill-mode: both; -moz-animation-duration: .6s; -moz-animation-delay: .4s; -moz-animation-timing-function: ease; -moz-animation-fill-mode: both; -ms-animation-duration: .6s; -ms-animation-delay: .4s; -ms-animation-timing-function: ease; -ms-animation-fill-mode: both; animation-duration: .6s; animation-delay: .4s; animation-timing-function: ease; animation-fill-mode: both }
.animate3 { -webkit-animation-duration: .6s; -webkit-animation-delay: .6s; -webkit-animation-timing-function: ease; -webkit-animation-fill-mode: both; -moz-animation-duration: .6s; -moz-animation-delay: .6s; -moz-animation-timing-function: ease; -moz-animation-fill-mode: both; -ms-animation-duration: .6s; -ms-animation-delay: .6s; -ms-animation-timing-function: ease; -ms-animation-fill-mode: both; animation-duration: .6s; animation-delay: .6s; animation-timing-function: ease; animation-fill-mode: both }
.animate4 { -webkit-animation-duration: .6s; -webkit-animation-delay: .8s; -webkit-animation-timing-function: ease; -webkit-animation-fill-mode: both; -moz-animation-duration: .6s; -moz-animation-delay: .8s; -moz-animation-timing-function: ease; -moz-animation-fill-mode: both; -ms-animation-duration: .6s; -ms-animation-delay: .8s; -ms-animation-timing-function: ease; -ms-animation-fill-mode: both; animation-duration: .6s; animation-delay: .8s; animation-timing-function: ease; animation-fill-mode: both }
.animate5 { -webkit-animation-duration: .6s; -webkit-animation-delay: 1s; -webkit-animation-timing-function: ease; -webkit-animation-fill-mode: both; -moz-animation-duration: .6s; -moz-animation-delay: 1s; -moz-animation-timing-function: ease; -moz-animation-fill-mode: both; -ms-animation-duration: .6s; -ms-animation-delay: 1s; -ms-animation-timing-function: ease; -ms-animation-fill-mode: both; animation-duration: .6s; animation-delay: 1s; animation-timing-function: ease; animation-fill-mode: both }
.animated { -webkit-animation: 1s ease; -moz-animation: 1s ease; -ms-animation: 1s ease; animation: 1s ease }
.animated.hinge { -webkit-animation: 2s ease; -moz-animation: 2s ease; -ms-animation: 2s ease; animation: 2s ease }
@-webkit-keyframes flash { 0%, 50%, 100% {
opacity:1
}
25%, 75% {
opacity:0
}
}
@-moz-keyframes flash { 0%, 50%, 100% {
opacity:1
}
25%, 75% {
opacity:0
}
}
@-ms-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; -moz-animation-name: flash; -ms-animation-name: flash; animation-name: flash }
@-webkit-keyframes shake { 0%, 100% {
-webkit-transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
-webkit-transform:translateX(10px)
}
}
@-moz-keyframes shake { 0%, 100% {
-moz-transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
-moz-transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
-moz-transform:translateX(10px)
}
}
@-ms-keyframes shake { 0%, 100% {
-ms-transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
-ms-transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
-ms-transform:translateX(10px)
}
}
@keyframes shake { 0%, 100% {
transform:translateX(0)
}
10%, 30%, 50%, 70%, 90% {
transform:translateX(-10px)
}
20%, 40%, 60%, 80% {
transform:translateX(10px)
}
}
.shake { -webkit-animation-name: shake; -moz-animation-name: shake; -ms-animation-name: shake; animation-name: shake }
@-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% {
-webkit-transform:translateY(0)
}
40% {
-webkit-transform:translateY(-30px)
}
60% {
-webkit-transform:translateY(-15px)
}
}
@-moz-keyframes bounce { 0%, 20%, 50%, 80%, 100% {
-moz-transform:translateY(0)
}
40% {
-moz-transform:translateY(-30px)
}
60% {
-moz-transform:translateY(-15px)
}
}
@-ms-keyframes bounce { 0%, 20%, 50%, 80%, 100% {
-ms-transform:translateY(0)
}
40% {
-ms-transform:translateY(-30px)
}
60% {
-ms-transform:translateY(-15px)
}
}
@keyframes bounce { 0%, 20%, 50%, 80%, 100% {
transform:translateY(0)
}
40% {
transform:translateY(-30px)
}
60% {
transform:translateY(-15px)
}
}
.bounce { -webkit-animation-name: bounce; -moz-animation-name: bounce; -ms-animation-name: bounce; animation-name: bounce }
@-webkit-keyframes tada { 0% {
-webkit-transform:scale(1)
}
10%, 20% {
-webkit-transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-webkit-transform:scale(1.1) rotate(-3deg)
}
100% {
-webkit-transform:scale(1) rotate(0)
}
}
@-moz-keyframes tada { 0% {
-moz-transform:scale(1)
}
10%, 20% {
-moz-transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-moz-transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-moz-transform:scale(1.1) rotate(-3deg)
}
100% {
-moz-transform:scale(1) rotate(0)
}
}
@-ms-keyframes tada { 0% {
-ms-transform:scale(1)
}
10%, 20% {
-ms-transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
-ms-transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
-ms-transform:scale(1.1) rotate(-3deg)
}
100% {
-ms-transform:scale(1) rotate(0)
}
}
@keyframes tada { 0% {
transform:scale(1)
}
10%, 20% {
transform:scale(0.9) rotate(-3deg)
}
30%, 50%, 70%, 90% {
transform:scale(1.1) rotate(3deg)
}
40%, 60%, 80% {
transform:scale(1.1) rotate(-3deg)
}
100% {
transform:scale(1) rotate(0)
}
}
.tada { -webkit-animation-name: tada; -moz-animation-name: tada; -ms-animation-name: tada; animation-name: tada }
@-webkit-keyframes swing { 20%, 40%, 60%, 80%, 100% {
-webkit-transform-origin:top center
}
20% {
-webkit-transform:rotate(15deg)
}
40% {
-webkit-transform:rotate(-10deg)
}
60% {
-webkit-transform:rotate(5deg)
}
80% {
-webkit-transform:rotate(-5deg)
}
100% {
-webkit-transform:rotate(0deg)
}
}
@-moz-keyframes swing { 20%, 40%, 60%, 80%, 100% {
-moz-transform-origin:top center
}
20% {
-moz-transform:rotate(15deg)
}
40% {
-moz-transform:rotate(-10deg)
}
60% {
-moz-transform:rotate(5deg)
}
80% {
-moz-transform:rotate(-5deg)
}
100% {
-moz-transform:rotate(0deg)
}
}
@-ms-keyframes swing { 20%, 40%, 60%, 80%, 100% {
-ms-transform-origin:top center
}
20% {
-ms-transform:rotate(15deg)
}
40% {
-ms-transform:rotate(-10deg)
}
60% {
-ms-transform:rotate(5deg)
}
80% {
-ms-transform:rotate(-5deg)
}
100% {
-webkit-transform:rotate(0deg)
}
}
@keyframes swing { 20%, 40%, 60%, 80%, 100% {
transform-origin:top center
}
20% {
transform:rotate(15deg)
}
40% {
transform:rotate(-10deg)
}
60% {
transform:rotate(5deg)
}
80% {
transform:rotate(-5deg)
}
100% {
transform:rotate(0deg)
}
}
.swing { -webkit-animation-name: swing; -moz-animation-name: swing; -ms-animation-name: swing; animation-name: swing }
@-webkit-keyframes wobble { 0% {
-webkit-transform:translateX(0%)
}
15% {
-webkit-transform:translateX(-25%) rotate(-5deg)
}
30% {
-webkit-transform:translateX(20%) rotate(3deg)
}
45% {
-webkit-transform:translateX(-15%) rotate(-3deg)
}
60% {
-webkit-transform:translateX(10%) rotate(2deg)
}
75% {
-webkit-transform:translateX(-5%) rotate(-1deg)
}
100% {
-webkit-transform:translateX(0%)
}
}
@-moz-keyframes wobble { 0% {
-moz-transform:translateX(0%)
}
15% {
-moz-transform:translateX(-25%) rotate(-5deg)
}
30% {
-moz-transform:translateX(20%) rotate(3deg)
}
45% {
-moz-transform:translateX(-15%) rotate(-3deg)
}
60% {
-moz-transform:translateX(10%) rotate(2deg)
}
75% {
-moz-transform:translateX(-5%) rotate(-1deg)
}
100% {
-moz-transform:translateX(0%)
}
}
@-ms-keyframes wobble { 0% {
-ms-transform:translateX(0%)
}
15% {
-ms-transform:translateX(-25%) rotate(-5deg)
}
30% {
-ms-transform:translateX(20%) rotate(3deg)
}
45% {
-ms-transform:translateX(-15%) rotate(-3deg)
}
60% {
-ms-transform:translateX(10%) rotate(2deg)
}
75% {
-ms-transform:translateX(-5%) rotate(-1deg)
}
100% {
-ms-transform:translateX(0%)
}
}
@keyframes wobble { 0% {
transform:translateX(0%)
}
15% {
transform:translateX(-25%) rotate(-5deg)
}
30% {
transform:translateX(20%) rotate(3deg)
}
45% {
transform:translateX(-15%) rotate(-3deg)
}
60% {
transform:translateX(10%) rotate(2deg)
}
75% {
transform:translateX(-5%) rotate(-1deg)
}
100% {
transform:translateX(0%)
}
}
.wobble { -webkit-animation-name: wobble; -moz-animation-name: wobble; -ms-animation-name: wobble; animation-name: wobble }
@-webkit-keyframes pulse { 0% {
-webkit-transform:scale(1)
}
50% {
-webkit-transform:scale(1.1)
}
100% {
-webkit-transform:scale(1)
}
}
@-moz-keyframes pulse { 0% {
-moz-transform:scale(1)
}
50% {
-moz-transform:scale(1.1)
}
100% {
-moz-transform:scale(1)
}
}
@-ms-keyframes pulse { 0% {
-ms-transform:scale(1)
}
50% {
-ms-transform:scale(1.1)
}
100% {
-ms-transform:scale(1)
}
}
@keyframes pulse { 0% {
transform:scale(1)
}
50% {
transform:scale(1.1)
}
100% {
transform:scale(1)
}
}
.pulse { -webkit-animation-name: pulse; -moz-animation-name: pulse; -ms-animation-name: pulse; animation-name: pulse }
@-webkit-keyframes fadeIn { 0% {
opacity:0
}
100% {
opacity:1
}
}
@-moz-keyframes fadeIn { 0% {
opacity:0
}
100% {
opacity:1
}
}
@-ms-keyframes fadeIn { 0% {
opacity:0
}
100% {
opacity:1
}
}
@keyframes fadeIn { 0% {
opacity:0
}
100% {
opacity:1
}
}
.fadeIn { -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -ms-animation-name: fadeIn; animation-name: fadeIn }
@-webkit-keyframes fadeInUp { 0% {
opacity:0;
-webkit-transform:translateY(20px)
}
100% {
opacity:1;
-webkit-transform:translateY(0)
}
}
@-moz-keyframes fadeInUp { 0% {
opacity:0;
-moz-transform:translateY(20px)
}
100% {
opacity:1;
-moz-transform:translateY(0)
}
}
@-ms-keyframes fadeInUp { 0% {
opacity:0;
-ms-transform:translateY(20px)
}
100% {
opacity:1;
-ms-transform:translateY(0)
}
}
@keyframes fadeInUp { 0% {
opacity:0;
transform:translateY(20px)
}
100% {
opacity:1;
transform:translateY(0)
}
}
.fadeInUp { -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -ms-animation-name: fadeInUp; animation-name: fadeInUp }
@-webkit-keyframes fadeInDown { 0% {
opacity:0;
-webkit-transform:translateY(-20px)
}
100% {
opacity:1;
-webkit-transform:translateY(0)
}
}
@-moz-keyframes fadeInDown { 0% {
opacity:0;
-moz-transform:translateY(-20px)
}
100% {
opacity:1;
-moz-transform:translateY(0)
}
}
@-ms-keyframes fadeInDown { 0% {
opacity:0;
-ms-transform:translateY(-20px)
}
100% {
opacity:1;
-ms-transform:translateY(0)
}
}
@keyframes fadeInDown { 0% {
opacity:0;
transform:translateY(-20px)
}
100% {
opacity:1;
transform:translateY(0)
}
}
.fadeInDown { -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -ms-animation-name: fadeInDown; animation-name: fadeInDown }
@-webkit-keyframes fadeInLeft { 0% {
opacity:0;
-webkit-transform:translateX(-20px)
}
100% {
opacity:1;
-webkit-transform:translateX(0)
}
}
@-moz-keyframes fadeInLeft { 0% {
opacity:0;
-moz-transform:translateX(-20px)
}
100% {
opacity:1;
-moz-transform:translateX(0)
}
}
@-ms-keyframes fadeInLeft { 0% {
opacity:0;
-ms-transform:translateX(-20px)
}
100% {
opacity:1;
-ms-transform:translateX(0)
}
}
@keyframes fadeInLeft { 0% {
opacity:0;
transform:translateX(-20px)
}
100% {
opacity:1;
transform:translateX(0)
}
}
.fadeInLeft { -webkit-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft; -ms-animation-name: fadeInLeft; animation-name: fadeInLeft }
@-webkit-keyframes fadeInRight { 0% {
opacity:0;
-webkit-transform:translateX(20px)
}
100% {
opacity:1;
-webkit-transform:translateX(0)
}
}
@-moz-keyframes fadeInRight { 0% {
opacity:0;
-moz-transform:translateX(20px)
}
100% {
opacity:1;
-moz-transform:translateX(0)
}
}
@-ms-keyframes fadeInRight { 0% {
opacity:0;
-ms-transform:translateX(20px)
}
100% {
opacity:1;
-ms-transform:translateX(0)
}
}
@keyframes fadeInRight { 0% {
opacity:0;
transform:translateX(20px)
}
100% {
opacity:1;
transform:translateX(0)
}
}
.fadeInRight { -webkit-animation-name: fadeInRight; -moz-animation-name: fadeInRight; -ms-animation-name: fadeInRight; animation-name: fadeInRight }
@-webkit-keyframes fadeInUpBig { 0% {
opacity:0;
-webkit-transform:translateY(2000px)
}
100% {
opacity:1;
-webkit-transform:translateY(0)
}
}
@-moz-keyframes fadeInUpBig { 0% {
opacity:0;
-moz-transform:translateY(2000px)
}
100% {
opacity:1;
-moz-transform:translateY(0)
}
}
@-ms-keyframes fadeInUpBig { 0% {
opacity:0;
-ms-transform:translateY(2000px)
}
100% {
opacity:1;
-ms-transform:translateY(0)
}
}
@keyframes fadeInUpBig { 0% {
opacity:0;
transform:translateY(2000px)
}
100% {
opacity:1;
transform:translateY(0)
}
}
.fadeInUpBig { -webkit-animation-name: fadeInUpBig; -moz-animation-name: fadeInUpBig; -ms-animation-name: fadeInUpBig; animation-name: fadeInUpBig }
@-webkit-keyframes fadeInDownBig { 0% {
opacity:0;
-webkit-transform:translateY(-2000px)
}
100% {
opacity:1;
-webkit-transform:translateY(0)
}
}
@-moz-keyframes fadeInDownBig { 0% {
opacity:0;
-moz-transform:translateY(-2000px)
}
100% {
opacity:1;
-moz-transform:translateY(0)
}
}
@-ms-keyframes fadeInDownBig { 0% {
opacity:0;
-ms-transform:translateY(-2000px)
}
100% {
opacity:1;
-ms-transform:translateY(0)
}
}
@keyframes fadeInDownBig { 0% {
opacity:0;
transform:translateY(-2000px)
}
100% {
opacity:1;
transform:translateY(0)
}
}
.fadeInDownBig { -webkit-animation-name: fadeInDownBig; -moz-animation-name: fadeInDownBig; -ms-animation-name: fadeInDownBig; animation-name: fadeInDownBig }
@-webkit-keyframes fadeInLeftBig { 0% {
opacity:0;
-webkit-transform:translateX(-2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0)
}
}
@-moz-keyframes fadeInLeftBig { 0% {
opacity:0;
-moz-transform:translateX(-2000px)
}
100% {
opacity:1;
-moz-transform:translateX(0)
}
}
@-ms-keyframes fadeInLeftBig { 0% {
opacity:0;
-ms-transform:translateX(-2000px)
}
100% {
opacity:1;
-ms-transform:translateX(0)
}
}
@keyframes fadeInLeftBig { 0% {
opacity:0;
transform:translateX(-2000px)
}
100% {
opacity:1;
transform:translateX(0)
}
}
.fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; -moz-animation-name: fadeInLeftBig; -ms-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig }
@-webkit-keyframes fadeInRightBig { 0% {
opacity:0;
-webkit-transform:translateX(2000px)
}
100% {
opacity:1;
-webkit-transform:translateX(0)
}
}
@-moz-keyframes fadeInRightBig { 0% {
opacity:0;
-moz-transform:translateX(2000px)
}
100% {
opacity:1;
-moz-transform:translateX(0)
}
}
@-ms-keyframes fadeInRightBig { 0% {
opacity:0;
-ms-transform:translateX(2000px)
}
100% {
opacity:1;
-ms-transform:translateX(0)
}
}
@keyframes fadeInRightBig { 0% {
opacity:0;
transform:translateX(2000px)
}
100% {
opacity:1;
transform:translateX(0)
}
}
.fadeInRightBig { -webkit-animation-name: fadeInRightBig; -moz-animation-name: fadeInRightBig; -ms-animation-name: fadeInRightBig; animation-name: fadeInRightBig }
@-webkit-keyframes fadeOut { 0% {
opacity:1
}
100% {
opacity:0
}
}
@-moz-keyframes fadeOut { 0% {
opacity:1
}
100% {
opacity:0
}
}
@-ms-keyframes fadeOut { 0% {
opacity:1
}
100% {
opacity:0
}
}
@keyframes fadeOut { 0% {
opacity:1
}
100% {
opacity:0
}
}
.fadeOut { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; -ms-animation-name: fadeOut; animation-name: fadeOut }
@-webkit-keyframes fadeOutUp { 0% {
opacity:1;
-webkit-transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(-20px)
}
}
@-moz-keyframes fadeOutUp { 0% {
opacity:1;
-moz-transform:translateY(0)
}
100% {
opacity:0;
-moz-transform:translateY(-20px)
}
}
@-ms-keyframes fadeOutUp { 0% {
opacity:1;
-ms-transform:translateY(0)
}
100% {
opacity:0;
-ms-transform:translateY(-20px)
}
}
@keyframes fadeOutUp { 0% {
opacity:1;
transform:translateY(0)
}
100% {
opacity:0;
transform:translateY(-20px)
}
}
.fadeOutUp { -webkit-animation-name: fadeOutUp; -moz-animation-name: fadeOutUp; -ms-animation-name: fadeOutUp; animation-name: fadeOutUp }
@-webkit-keyframes fadeOutDown { 0% {
opacity:1;
-webkit-transform:translateY(0)
}

100% {
opacity:0;
-webkit-transform:translateY(20px)
}
}
@-moz-keyframes fadeOutDown { 0% {
opacity:1;
-moz-transform:translateY(0)
}
100% {
opacity:0;
-moz-transform:translateY(20px)
}
}
@-ms-keyframes fadeOutDown { 0% {
opacity:1;
-ms-transform:translateY(0)
}
100% {
opacity:0;
-ms-transform:translateY(20px)
}
}
@keyframes fadeOutDown { 0% {
opacity:1;
transform:translateY(0)
}
100% {
opacity:0;
transform:translateY(20px)
}
}
.fadeOutDown { -webkit-animation-name: fadeOutDown; -moz-animation-name: fadeOutDown; -ms-animation-name: fadeOutDown; animation-name: fadeOutDown }
@-webkit-keyframes fadeOutLeft { 0% {
opacity:1;
-webkit-transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(-20px)
}
}
@-moz-keyframes fadeOutLeft { 0% {
opacity:1;
-moz-transform:translateX(0)
}
100% {
opacity:0;
-moz-transform:translateX(-20px)
}
}
@-ms-keyframes fadeOutLeft { 0% {
opacity:1;
-ms-transform:translateX(0)
}
100% {
opacity:0;
-ms-transform:translateX(-20px)
}
}
@keyframes fadeOutLeft { 0% {
opacity:1;
transform:translateX(0)
}
100% {
opacity:0;
transform:translateX(-20px)
}
}
.fadeOutLeft { -webkit-animation-name: fadeOutLeft; -moz-animation-name: fadeOutLeft; -ms-animation-name: fadeOutLeft; animation-name: fadeOutLeft }
@-webkit-keyframes fadeOutRight { 0% {
opacity:1;
-webkit-transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(20px)
}
}
@-moz-keyframes fadeOutRight { 0% {
opacity:1;
-moz-transform:translateX(0)
}
100% {
opacity:0;
-moz-transform:translateX(20px)
}
}
@-ms-keyframes fadeOutRight { 0% {
opacity:1;
-ms-transform:translateX(0)
}
100% {
opacity:0;
-ms-transform:translateX(20px)
}
}
@keyframes fadeOutRight { 0% {
opacity:1;
transform:translateX(0)
}
100% {
opacity:0;
transform:translateX(20px)
}
}
.fadeOutRight { -webkit-animation-name: fadeOutRight; -moz-animation-name: fadeOutRight; -ms-animation-name: fadeOutRight; animation-name: fadeOutRight }
@-webkit-keyframes fadeOutUpBig { 0% {
opacity:1;
-webkit-transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(-2000px)
}
}
@-moz-keyframes fadeOutUpBig { 0% {
opacity:1;
-moz-transform:translateY(0)
}
100% {
opacity:0;
-moz-transform:translateY(-2000px)
}
}
@-ms-keyframes fadeOutUpBig { 0% {
opacity:1;
-ms-transform:translateY(0)
}
100% {
opacity:0;
-ms-transform:translateY(-2000px)
}
}
@keyframes fadeOutUpBig { 0% {
opacity:1;
transform:translateY(0)
}
100% {
opacity:0;
transform:translateY(-2000px)
}
}
.fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; -moz-animation-name: fadeOutUpBig; -ms-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig }
@-webkit-keyframes fadeOutDownBig { 0% {
opacity:1;
-webkit-transform:translateY(0)
}
100% {
opacity:0;
-webkit-transform:translateY(2000px)
}
}
@-moz-keyframes fadeOutDownBig { 0% {
opacity:1;
-moz-transform:translateY(0)
}
100% {
opacity:0;
-moz-transform:translateY(2000px)
}
}
@-ms-keyframes fadeOutDownBig { 0% {
opacity:1;
-ms-transform:translateY(0)
}
100% {
opacity:0;
-ms-transform:translateY(2000px)
}
}
@keyframes fadeOutDownBig { 0% {
opacity:1;
transform:translateY(0)
}
100% {
opacity:0;
transform:translateY(2000px)
}
}
.fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; -moz-animation-name: fadeOutDownBig; -ms-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig }
@-webkit-keyframes fadeOutLeftBig { 0% {
opacity:1;
-webkit-transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(-2000px)
}
}
@-moz-keyframes fadeOutLeftBig { 0% {
opacity:1;
-moz-transform:translateX(0)
}
100% {
opacity:0;
-moz-transform:translateX(-2000px)
}
}
@-ms-keyframes fadeOutLeftBig { 0% {
opacity:1;
-ms-transform:translateX(0)
}
100% {
opacity:0;
-ms-transform:translateX(-2000px)
}
}
@keyframes fadeOutLeftBig { 0% {
opacity:1;
transform:translateX(0)
}
100% {
opacity:0;
transform:translateX(-2000px)
}
}
.fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; -moz-animation-name: fadeOutLeftBig; -ms-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig }
@-webkit-keyframes fadeOutRightBig { 0% {
opacity:1;
-webkit-transform:translateX(0)
}
100% {
opacity:0;
-webkit-transform:translateX(2000px)
}
}
@-moz-keyframes fadeOutRightBig { 0% {
opacity:1;
-moz-transform:translateX(0)
}
100% {
opacity:0;
-moz-transform:translateX(2000px)
}
}
@-ms-keyframes fadeOutRightBig { 0% {
opacity:1;
-ms-transform:translateX(0)
}
100% {
opacity:0;
-ms-transform:translateX(2000px)
}
}
@keyframes fadeOutRightBig { 0% {
opacity:1;
transform:translateX(0)
}
100% {
opacity:0;
transform:translateX(2000px)
}
}
.fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; -moz-animation-name: fadeOutRightBig; -ms-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig }
@-webkit-keyframes bounceIn { 0% {
opacity:0;
-webkit-transform:scale(.3)
}
50% {
opacity:1;
-webkit-transform:scale(1.05)
}
70% {
-webkit-transform:scale(.9)
}
100% {
-webkit-transform:scale(1)
}
}
@-moz-keyframes bounceIn { 0% {
opacity:0;
-moz-transform:scale(.3)
}
50% {
opacity:1;
-moz-transform:scale(1.05)
}
70% {
-moz-transform:scale(.9)
}
100% {
-moz-transform:scale(1)
}
}
@-ms-keyframes bounceIn { 0% {
opacity:0;
-ms-transform:scale(.3)
}
50% {
opacity:1;
-ms-transform:scale(1.05)
}
70% {
-ms-transform:scale(.9)
}
100% {
-ms-transform:scale(1)
}
}
@keyframes bounceIn { 0% {
opacity:0;
transform:scale(.3)
}
50% {
opacity:1;
transform:scale(1.05)
}
70% {
transform:scale(.9)
}
100% {
transform:scale(1)
}
}
.bounceIn { -webkit-animation-name: bounceIn; -moz-animation-name: bounceIn; -ms-animation-name: bounceIn; animation-name: bounceIn }
@-webkit-keyframes bounceInUp { 0% {
opacity:0;
-webkit-transform:translateY(2000px)
}
60% {
opacity:1;
-webkit-transform:translateY(-30px)
}
80% {
-webkit-transform:translateY(10px)
}
100% {
-webkit-transform:translateY(0)
}
}
@-moz-keyframes bounceInUp { 0% {
opacity:0;
-moz-transform:translateY(2000px)
}
60% {
opacity:1;
-moz-transform:translateY(-30px)
}
80% {
-moz-transform:translateY(10px)
}
100% {
-moz-transform:translateY(0)
}
}
@-ms-keyframes bounceInUp { 0% {
opacity:0;
-ms-transform:translateY(2000px)
}
60% {
opacity:1;
-ms-transform:translateY(-30px)
}
80% {
-ms-transform:translateY(10px)
}
100% {
-ms-transform:translateY(0)
}
}
@keyframes bounceInUp { 0% {
opacity:0;
transform:translateY(2000px)
}
60% {
opacity:1;
transform:translateY(-30px)
}
80% {
transform:translateY(10px)
}
100% {
transform:translateY(0)
}
}
.bounceInUp { -webkit-animation-name: bounceInUp; -moz-animation-name: bounceInUp; -ms-animation-name: bounceInUp; animation-name: bounceInUp }
@-webkit-keyframes bounceInDown { 0% {
opacity:0;
-webkit-transform:translateY(-2000px)
}
60% {
opacity:1;
-webkit-transform:translateY(30px)
}
80% {
-webkit-transform:translateY(-10px)
}
100% {
-webkit-transform:translateY(0)
}
}
@-moz-keyframes bounceInDown { 0% {
opacity:0;
-moz-transform:translateY(-2000px)
}
60% {
opacity:1;
-moz-transform:translateY(30px)
}
80% {
-moz-transform:translateY(-10px)
}
100% {
-moz-transform:translateY(0)
}
}
@-ms-keyframes bounceInDown { 0% {
opacity:0;
-ms-transform:translateY(-2000px)
}
60% {
opacity:1;
-ms-transform:translateY(30px)
}
80% {
-ms-transform:translateY(-10px)
}
100% {
-ms-transform:translateY(0)
}
}
@keyframes bounceInDown { 0% {
opacity:0;
transform:translateY(-2000px)
}
60% {
opacity:1;
transform:translateY(30px)
}
80% {
transform:translateY(-10px)
}
100% {
transform:translateY(0)
}
}
.bounceInDown { -webkit-animation-name: bounceInDown; -moz-animation-name: bounceInDown; -ms-animation-name: bounceInDown; animation-name: bounceInDown }
@-webkit-keyframes bounceInLeft { 0% {
opacity:0;
-webkit-transform:translateX(-2000px)
}
60% {
opacity:1;
-webkit-transform:translateX(30px)
}
80% {
-webkit-transform:translateX(-10px)
}
100% {
-webkit-transform:translateX(0)
}
}
@-moz-keyframes bounceInLeft { 0% {
opacity:0;
-moz-transform:translateX(-2000px)
}
60% {
opacity:1;
-moz-transform:translateX(30px)
}
80% {
-moz-transform:translateX(-10px)
}
100% {
-moz-transform:translateX(0)
}
}
@-ms-keyframes bounceInLeft { 0% {
opacity:0;
-ms-transform:translateX(-2000px)
}
60% {
opacity:1;
-ms-transform:translateX(30px)
}
80% {
-ms-transform:translateX(-10px)
}
100% {
-ms-transform:translateX(0)
}
}
@keyframes bounceInLeft { 0% {
opacity:0;
transform:translateX(-2000px)
}
60% {
opacity:1;
transform:translateX(30px)
}
80% {
transform:translateX(-10px)
}
100% {
transform:translateX(0)
}
}
.bounceInLeft { -webkit-animation-name: bounceInLeft; -moz-animation-name: bounceInLeft; -ms-animation-name: bounceInLeft; animation-name: bounceInLeft }
@-webkit-keyframes bounceInRight { 0% {
opacity:0;
-webkit-transform:translateX(2000px)
}
60% {
opacity:1;
-webkit-transform:translateX(-30px)
}
80% {
-webkit-transform:translateX(10px)
}
100% {
-webkit-transform:translateX(0)
}
}
@-moz-keyframes bounceInRight { 0% {
opacity:0;
-moz-transform:translateX(2000px)
}
60% {
opacity:1;
-moz-transform:translateX(-30px)
}
80% {
-moz-transform:translateX(10px)
}
100% {
-moz-transform:translateX(0)
}
}
@-ms-keyframes bounceInRight { 0% {
opacity:0;
-ms-transform:translateX(2000px)
}
60% {
opacity:1;
-ms-transform:translateX(-30px)
}
80% {
-ms-transform:translateX(10px)
}
100% {
-ms-transform:translateX(0)
}
}
@keyframes bounceInRight { 0% {
opacity:0;
transform:translateX(2000px)
}
60% {
opacity:1;
transform:translateX(-30px)
}
80% {
transform:translateX(10px)
}
100% {
transform:translateX(0)
}
}
.bounceInRight { -webkit-animation-name: bounceInRight; -moz-animation-name: bounceInRight; -ms-animation-name: bounceInRight; animation-name: bounceInRight }
@-webkit-keyframes bounceOut { 0% {
-webkit-transform:scale(1)
}
25% {
-webkit-transform:scale(.95)
}
50% {
opacity:1;
-webkit-transform:scale(1.1)
}
100% {
opacity:0;
-webkit-transform:scale(.3)
}
}
@-moz-keyframes bounceOut { 0% {
-moz-transform:scale(1)
}
25% {
-moz-transform:scale(.95)
}
50% {
opacity:1;
-moz-transform:scale(1.1)
}
100% {
opacity:0;
-moz-transform:scale(.3)
}
}
@-ms-keyframes bounceOut { 0% {
-ms-transform:scale(1)
}
25% {
-ms-transform:scale(.95)
}
50% {
opacity:1;
-ms-transform:scale(1.1)
}
100% {
opacity:0;
-ms-transform:scale(.3)
}
}
@keyframes bounceOut { 0% {
transform:scale(1)
}
25% {
transform:scale(.95)
}
50% {
opacity:1;
transform:scale(1.1)
}
100% {
opacity:0;
transform:scale(.3)
}
}
.bounceOut { -webkit-animation-name: bounceOut; -moz-animation-name: bounceOut; -ms-animation-name: bounceOut; animation-name: bounceOut }
@-webkit-keyframes bounceOutUp { 0% {
-webkit-transform:translateY(0)
}
20% {
opacity:1;
-webkit-transform:translateY(20px)
}
100% {
opacity:0;
-webkit-transform:translateY(-2000px)
}
}
@-moz-keyframes bounceOutUp { 0% {
-moz-transform:translateY(0)
}
20% {
opacity:1;
-moz-transform:translateY(20px)
}
100% {
opacity:0;
-moz-transform:translateY(-2000px)
}
}
@-ms-keyframes bounceOutUp { 0% {
-ms-transform:translateY(0)
}
20% {
opacity:1;
-ms-transform:translateY(20px)
}
100% {
opacity:0;
-ms-transform:translateY(-2000px)
}
}
@keyframes bounceOutUp { 0% {
transform:translateY(0)
}
20% {
opacity:1;
transform:translateY(20px)
}
100% {
opacity:0;
transform:translateY(-2000px)
}
}
.bounceOutUp { -webkit-animation-name: bounceOutUp; -moz-animation-name: bounceOutUp; -ms-animation-name: bounceOutUp; animation-name: bounceOutUp }
@-webkit-keyframes bounceOutDown { 0% {
-webkit-transform:translateY(0)
}
20% {
opacity:1;
-webkit-transform:translateY(-20px)
}
100% {
opacity:0;
-webkit-transform:translateY(2000px)
}
}
@-moz-keyframes bounceOutDown { 0% {
-moz-transform:translateY(0)
}
20% {
opacity:1;
-moz-transform:translateY(-20px)
}
100% {
opacity:0;
-moz-transform:translateY(2000px)
}
}
@-ms-keyframes bounceOutDown { 0% {
-ms-transform:translateY(0)
}
20% {
opacity:1;
-ms-transform:translateY(-20px)
}
100% {
opacity:0;
-ms-transform:translateY(2000px)
}
}
@keyframes bounceOutDown { 0% {
transform:translateY(0)
}
20% {
opacity:1;
transform:translateY(-20px)
}
100% {
opacity:0;
transform:translateY(2000px)
}
}
.bounceOutDown { -webkit-animation-name: bounceOutDown; -moz-animation-name: bounceOutDown; -ms-animation-name: bounceOutDown; animation-name: bounceOutDown }
@-webkit-keyframes bounceOutLeft { 0% {
-webkit-transform:translateX(0)
}
20% {
opacity:1;
-webkit-transform:translateX(20px)
}
100% {
opacity:0;
-webkit-transform:translateX(-2000px)
}
}
@-moz-keyframes bounceOutLeft { 0% {
-moz-transform:translateX(0)
}
20% {
opacity:1;
-moz-transform:translateX(20px)
}
100% {
opacity:0;
-moz-transform:translateX(-2000px)
}
}
@-ms-keyframes bounceOutLeft { 0% {
-ms-transform:translateX(0)
}
20% {
opacity:1;
-ms-transform:translateX(20px)
}
100% {
opacity:0;
-ms-transform:translateX(-2000px)
}
}
@keyframes bounceOutLeft { 0% {
transform:translateX(0)
}
20% {
opacity:1;
transform:translateX(20px)
}
100% {
opacity:0;
transform:translateX(-2000px)
}
}
.bounceOutLeft { -webkit-animation-name: bounceOutLeft; -moz-animation-name: bounceOutLeft; -ms-animation-name: bounceOutLeft; animation-name: bounceOutLeft }
@-webkit-keyframes bounceOutRight { 0% {
-webkit-transform:translateX(0)
}
20% {
opacity:1;
-webkit-transform:translateX(-20px)
}
100% {
opacity:0;
-webkit-transform:translateX(2000px)
}
}
@-moz-keyframes bounceOutRight { 0% {
-moz-transform:translateX(0)
}
20% {
opacity:1;
-moz-transform:translateX(-20px)
}
100% {
opacity:0;
-moz-transform:translateX(2000px)
}
}
@-ms-keyframes bounceOutRight { 0% {
-ms-transform:translateX(0)
}
20% {
opacity:1;
-ms-transform:translateX(-20px)
}
100% {
opacity:0;
-ms-transform:translateX(2000px)
}
}
@keyframes bounceOutRight { 0% {
transform:translateX(0)
}
20% {
opacity:1;
transform:translateX(-20px)
}
100% {
opacity:0;
transform:translateX(2000px)
}
}
.bounceOutRight { -webkit-animation-name: bounceOutRight; -moz-animation-name: bounceOutRight; -ms-animation-name: bounceOutRight; animation-name: bounceOutRight }
@-webkit-keyframes rotateIn { 0% {
-webkit-transform-origin:center center;
-webkit-transform:rotate(-200deg);
opacity:0
}
100% {
-webkit-transform-origin:center center;
-webkit-transform:rotate(0);
opacity:1
}
}
@-moz-keyframes rotateIn { 0% {
-moz-transform-origin:center center;
-moz-transform:rotate(-200deg);
opacity:0
}
100% {
-moz-transform-origin:center center;
-moz-transform:rotate(0);
opacity:1
}
}
@-ms-keyframes rotateIn { 0% {
-ms-transform-origin:center center;
-ms-transform:rotate(-200deg);
opacity:0
}
100% {
-ms-transform-origin:center center;
-ms-transform:rotate(0);
opacity:1
}
}
@keyframes rotateIn { 0% {
transform-origin:center center;
transform:rotate(-200deg);
opacity:0
}
100% {
transform-origin:center center;
transform:rotate(0);
opacity:1
}
}
.rotateIn { -webkit-animation-name: rotateIn; -moz-animation-name: rotateIn; -ms-animation-name: rotateIn; animation-name: rotateIn }
@-webkit-keyframes rotateInUpLeft { 0% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(90deg);
opacity:0
}
100% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(0);
opacity:1
}
}
@-moz-keyframes rotateInUpLeft { 0% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(90deg);
opacity:0
}
100% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(0);
opacity:1
}
}
@-ms-keyframes rotateInUpLeft { 0% {
-ms-transform-origin:left bottom;
-ms-transform:rotate(90deg);
opacity:0
}
100% {
-ms-transform-origin:left bottom;
-ms-transform:rotate(0);
opacity:1
}
}
@keyframes rotateInUpLeft { 0% {
transform-origin:left bottom;
transform:rotate(90deg);
opacity:0
}
100% {
transform-origin:left bottom;
transform:rotate(0);
opacity:1
}
}
.rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; -moz-animation-name: rotateInUpLeft; -ms-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft }
@-webkit-keyframes rotateInDownLeft { 0% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(-90deg);
opacity:0
}
100% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(0);
opacity:1
}
}
@-moz-keyframes rotateInDownLeft { 0% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(-90deg);
opacity:0
}
100% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(0);
opacity:1
}
}
@-ms-keyframes rotateInDownLeft { 0% {
-ms-transform-origin:left bottom;
-ms-transform:rotate(-90deg);
opacity:0
}
100% {
-ms-transform-origin:left bottom;
-ms-transform:rotate(0);
opacity:1
}
}
@keyframes rotateInDownLeft { 0% {
transform-origin:left bottom;
transform:rotate(-90deg);
opacity:0
}
100% {
transform-origin:left bottom;
transform:rotate(0);
opacity:1
}
}
.rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; -moz-animation-name: rotateInDownLeft; -ms-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft }
@-webkit-keyframes rotateInUpRight { 0% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(-90deg);
opacity:0
}
100% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(0);
opacity:1
}
}
@-moz-keyframes rotateInUpRight { 0% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(-90deg);
opacity:0
}
100% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(0);
opacity:1
}
}
@-ms-keyframes rotateInUpRight { 0% {
-ms-transform-origin:right bottom;
-ms-transform:rotate(-90deg);
opacity:0
}
100% {
-ms-transform-origin:right bottom;
-ms-transform:rotate(0);
opacity:1
}
}
@keyframes rotateInUpRight { 0% {
transform-origin:right bottom;
transform:rotate(-90deg);
opacity:0
}
100% {
transform-origin:right bottom;
transform:rotate(0);
opacity:1
}
}
.rotateInUpRight { -webkit-animation-name: rotateInUpRight; -moz-animation-name: rotateInUpRight; -ms-animation-name: rotateInUpRight; animation-name: rotateInUpRight }
@-webkit-keyframes rotateInDownRight { 0% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(90deg);
opacity:0
}
100% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(0);
opacity:1
}
}
@-moz-keyframes rotateInDownRight { 0% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(90deg);
opacity:0
}
100% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(0);
opacity:1
}
}
@-ms-keyframes rotateInDownRight { 0% {
-ms-transform-origin:right bottom;
-ms-transform:rotate(90deg);
opacity:0
}
100% {
-ms-transform-origin:right bottom;
-ms-transform:rotate(0);
opacity:1
}
}
@keyframes rotateInDownRight { 0% {
transform-origin:right bottom;
transform:rotate(90deg);
opacity:0
}
100% {
transform-origin:right bottom;
transform:rotate(0);
opacity:1
}
}
.rotateInDownRight { -webkit-animation-name: rotateInDownRight; -moz-animation-name: rotateInDownRight; -ms-animation-name: rotateInDownRight; animation-name: rotateInDownRight }
@-webkit-keyframes rotateOut { 0% {
-webkit-transform-origin:center center;
-webkit-transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:center center;
-webkit-transform:rotate(200deg);
opacity:0
}
}
@-moz-keyframes rotateOut { 0% {
-moz-transform-origin:center center;
-moz-transform:rotate(0);
opacity:1
}
100% {
-moz-transform-origin:center center;
-moz-transform:rotate(200deg);
opacity:0
}
}
@-ms-keyframes rotateOut { 0% {
-ms-transform-origin:center center;
-ms-transform:rotate(0);
opacity:1
}
100% {
-ms-transform-origin:center center;
-ms-transform:rotate(200deg);
opacity:0
}
}
@keyframes rotateOut { 0% {
transform-origin:center center;
transform:rotate(0);
opacity:1
}
100% {
transform-origin:center center;
transform:rotate(200deg);
opacity:0
}
}
.rotateOut { -webkit-animation-name: rotateOut; -moz-animation-name: rotateOut; -ms-animation-name: rotateOut; animation-name: rotateOut }
@-webkit-keyframes rotateOutUpLeft { 0% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(-90deg);
opacity:0
}
}
@-moz-keyframes rotateOutUpLeft { 0% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(0);
opacity:1
}
100% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(-90deg);
opacity:0
}
}
@-ms-keyframes rotateOutUpLeft { 0% {
-ms-transform-origin:left bottom;
-ms-transform:rotate(0);
opacity:1
}
100% {
-ms-transform-origin:left bottom;
-ms-transform:rotate(-90deg);
opacity:0
}
}
@keyframes rotateOutUpLeft { 0% {
transform-origin:left bottom;
transform:rotate(0);
opacity:1
}
100% {
-transform-origin:left bottom;
-transform:rotate(-90deg);
opacity:0
}
}
.rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; -moz-animation-name: rotateOutUpLeft; -ms-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft }
@-webkit-keyframes rotateOutDownLeft { 0% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:left bottom;
-webkit-transform:rotate(90deg);
opacity:0
}
}
@-moz-keyframes rotateOutDownLeft { 0% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(0);
opacity:1
}
100% {
-moz-transform-origin:left bottom;
-moz-transform:rotate(90deg);
opacity:0
}
}
@-ms-keyframes rotateOutDownLeft { 0% {
-ms-transform-origin:left bottom;
-ms-transform:rotate(0);
opacity:1
}
100% {
-ms-transform-origin:left bottom;
-ms-transform:rotate(90deg);
opacity:0
}
}
@keyframes rotateOutDownLeft { 0% {
transform-origin:left bottom;
transform:rotate(0);
opacity:1
}
100% {
transform-origin:left bottom;
transform:rotate(90deg);
opacity:0
}
}
.rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; -moz-animation-name: rotateOutDownLeft; -ms-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft }
@-webkit-keyframes rotateOutUpRight { 0% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(90deg);
opacity:0
}
}
@-moz-keyframes rotateOutUpRight { 0% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(0);
opacity:1
}
100% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(90deg);
opacity:0
}
}
@-ms-keyframes rotateOutUpRight { 0% {
-ms-transform-origin:right bottom;
-ms-transform:rotate(0);
opacity:1
}
100% {
-ms-transform-origin:right bottom;
-ms-transform:rotate(90deg);
opacity:0
}
}
@keyframes rotateOutUpRight { 0% {
transform-origin:right bottom;
transform:rotate(0);
opacity:1
}
100% {
transform-origin:right bottom;
transform:rotate(90deg);
opacity:0
}
}
.rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; -moz-animation-name: rotateOutUpRight; -ms-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight }
@-webkit-keyframes rotateOutDownRight { 0% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(0);
opacity:1
}
100% {
-webkit-transform-origin:right bottom;
-webkit-transform:rotate(-90deg);
opacity:0
}
}
@-moz-keyframes rotateOutDownRight { 0% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(0);
opacity:1
}
100% {
-moz-transform-origin:right bottom;
-moz-transform:rotate(-90deg);
opacity:0
}
}
@-ms-keyframes rotateOutDownRight { 0% {
-ms-transform-origin:right bottom;
-ms-transform:rotate(0);
opacity:1
}
100% {
-ms-transform-origin:right bottom;
-ms-transform:rotate(-90deg);
opacity:0
}
}
@keyframes rotateOutDownRight { 0% {
transform-origin:right bottom;
transform:rotate(0);
opacity:1
}
100% {
transform-origin:right bottom;
transform:rotate(-90deg);
opacity:0
}
}
.rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; -moz-animation-name: rotateOutDownRight; -ms-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight }
@-webkit-keyframes hinge { 0% {
-webkit-transform:rotate(0);
-webkit-transform-origin:top left;
-webkit-animation-timing-function:ease-in-out
}
20%, 60% {
-webkit-transform:rotate(80deg);
-webkit-transform-origin:top left;
-webkit-animation-timing-function:ease-in-out
}
40% {
-webkit-transform:rotate(60deg);
-webkit-transform-origin:top left;
-webkit-animation-timing-function:ease-in-out
}
80% {
-webkit-transform:rotate(60deg) translateY(0);
opacity:1;
-webkit-transform-origin:top left;
-webkit-animation-timing-function:ease-in-out
}
100% {
-webkit-transform:translateY(700px);
opacity:0
}
}
@-moz-keyframes hinge { 0% {
-moz-transform:rotate(0);
-moz-transform-origin:top left;
-moz-animation-timing-function:ease-in-out
}
20%, 60% {
-moz-transform:rotate(80deg);
-moz-transform-origin:top left;
-moz-animation-timing-function:ease-in-out
}
40% {
-moz-transform:rotate(60deg);
-moz-transform-origin:top left;
-moz-animation-timing-function:ease-in-out
}
80% {
-moz-transform:rotate(60deg) translateY(0);
opacity:1;
-moz-transform-origin:top left;
-moz-animation-timing-function:ease-in-out
}
100% {
-moz-transform:translateY(700px);
opacity:0
}
}
@-ms-keyframes hinge { 0% {
-ms-transform:rotate(0);
-ms-transform-origin:top left;
-ms-animation-timing-function:ease-in-out
}
20%, 60% {
-ms-transform:rotate(80deg);
-ms-transform-origin:top left;
-ms-animation-timing-function:ease-in-out
}
40% {
-ms-transform:rotate(60deg);
-ms-transform-origin:top left;
-ms-animation-timing-function:ease-in-out
}
80% {
-ms-transform:rotate(60deg) translateY(0);
opacity:1;
-ms-transform-origin:top left;
-ms-animation-timing-function:ease-in-out
}
100% {
-ms-transform:translateY(700px);
opacity:0
}
}
@keyframes hinge { 0% {
transform:rotate(0);
transform-origin:top left;
animation-timing-function:ease-in-out
}
20%, 60% {
transform:rotate(80deg);
transform-origin:top left;
animation-timing-function:ease-in-out
}
40% {
transform:rotate(60deg);
transform-origin:top left;
animation-timing-function:ease-in-out
}
80% {
transform:rotate(60deg) translateY(0);
opacity:1;
transform-origin:top left;
animation-timing-function:ease-in-out
}
100% {
transform:translateY(700px);
opacity:0
}
}
.hinge { -webkit-animation-name: hinge; -moz-animation-name: hinge; -ms-animation-name: hinge; animation-name: hinge }
@-webkit-keyframes rollIn { 0% {
opacity:0;
-webkit-transform:translateX(-100%) rotate(-120deg)
}
100% {
opacity:1;
-webkit-transform:translateX(0px) rotate(0deg)
}
}
@-moz-keyframes rollIn { 0% {
opacity:0;
-moz-transform:translateX(-100%) rotate(-120deg)
}
100% {
opacity:1;
-moz-transform:translateX(0px) rotate(0deg)
}
}
@-ms-keyframes rollIn { 0% {
opacity:0;
-ms-transform:translateX(-100%) rotate(-120deg)
}
100% {
opacity:1;
-ms-transform:translateX(0px) rotate(0deg)
}
}
@keyframes rollIn { 0% {
opacity:0;
transform:translateX(-100%) rotate(-120deg)
}
100% {
opacity:1;
transform:translateX(0px) rotate(0deg)
}
}
.rollIn { -webkit-animation-name: rollIn; -moz-animation-name: rollIn; -ms-animation-name: rollIn; animation-name: rollIn }
@-webkit-keyframes rollOut { 0% {
opacity:1;
-webkit-transform:translateX(0px) rotate(0deg)
}
100% {
opacity:0;
-webkit-transform:translateX(100%) rotate(120deg)
}
}
@-moz-keyframes rollOut { 0% {
opacity:1;
-moz-transform:translateX(0px) rotate(0deg)
}
100% {
opacity:0;
-moz-transform:translateX(100%) rotate(120deg)
}
}
@-ms-keyframes rollOut { 0% {
opacity:1;
-ms-transform:translateX(0px) rotate(0deg)
}
100% {
opacity:0;
-ms-transform:translateX(100%) rotate(120deg)
}
} 
@keyframes rollOut { 0% {
opacity:1;
transform:translateX(0px) rotate(0deg)
}
100% {
opacity:0;
transform:translateX(100%) rotate(120deg)
}
}
.rollOut { -webkit-animation-name: rollOut; -moz-animation-name: rollOut; -ms-animation-name: rollOut; animation-name: rollOut }
.left{ float:left;}
.right{ float:right;}
.span110{ width:110px;}
.span80{ width:80px;}
.span115{ width:115px;}
.span195{ width:195px;}
.span285{ width:285px;}