﻿@charset "utf-8";
/*  css animation  */
.trans {
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	-ms-transition: all .5s ease;
	transition: all .5s ease;
}
/* page animation  */

.ani-view {
	-webkit-animation-duration: 1s;
	-moz-animation-duration: 1s;
	-o-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
 @-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)
}
}
@-o-keyframes fadeInDown {
 0% {
 opacity:0;
 -o-transform:translateY(20px)
}
 100% {
 opacity:1;
 -o-transform:translateY(0)
}
}
@keyframes fadeInDown {
 0% {
 opacity:0;
 transform:translateY(20px)
}
 100% {
 opacity:1;
 transform:translateY(0)
}
}
.ani-view.fade-in-down {
	opacity: 0;
	-webkit-transform: translateY(20px);
	-moz-transform: translateY(20px);
	-o-transform: translateY(20px);
	transform: translateY(20px);
}
.ani-view.fadeInDown {
	-webkit-animation-name: fadeInDown;
	-moz-animation-name: fadeInDown;
	-o-animation-name: fadeInDown;
	animation-name: fadeInDown;
}
 @-webkit-keyframes fadeInLeft {
 0% {
 opacity:0;
 -webkit-transform:translateX(-100px)
}
 100% {
 opacity:1;
 -webkit-transform:translateX(0)
}
}
@-moz-keyframes fadeInLeft {
 0% {
 opacity:0;
 -moz-transform:translateX(-100px)
}
 100% {
 opacity:1;
 -moz-transform:translateX(0)
}
}
@-o-keyframes fadeInLeft {
 0% {
 opacity:0;
 -o-transform:translateX(-100px)
}
 100% {
 opacity:1;
 -o-transform:translateX(0)
}
}
@keyframes fadeInLeft {
 0% {
 opacity:0;
 transform:translateX(-100px)
}
 100% {
 opacity:1;
 transform:translateX(0)
}
}
.ani-view.fade-in-left {
	opacity: 0;
	-webkit-transform: translateX(-100px);
	-moz-transform: translateX(-100px);
	-o-transform: translateX(-100px);
	transform: translateX(-100px);
}
.ani-view.fadeInLeft {
	-webkit-animation-name: fadeInLeft;
	-moz-animation-name: fadeInLeft;
	-o-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
}
 @-webkit-keyframes fadeInRight {
 0% {
 opacity:0;
 -webkit-transform:translateX(100px)
}
 100% {
 opacity:1;
 -webkit-transform:translateX(0)
}
}
@-moz-keyframes fadeInRight {
 0% {
 opacity:0;
 -moz-transform:translateX(100px)
}
 100% {
 opacity:1;
 -moz-transform:translateX(0)
}
}
@-ms-keyframes fadeInRight {
 0% {
 opacity:0;
 -ms-transform:translateX(100px)
}
 100% {
 opacity:1;
 -ms-transform:translateX(0)
}
}
@-o-keyframes fadeInRight {
 0% {
 opacity:0;
 -o-transform:translateX(100px)
}
 100% {
 opacity:1;
 -o-transform:translateX(0)
}
}
@keyframes fadeInRight {
 0% {
 opacity:0;
 transform:translateX(100px)
}
 100% {
 opacity:1;
 transform:translateX(0)
}
}
.ani-view.fade-in-right {
	opacity: 0;
	-webkit-transform: translateX(100px);
	-moz-transform: translateX(100px);
	-o-transform: translateX(100px);
	transform: translateX(100px);
}
.ani-view.fadeInRight {
	-webkit-animation-name: fadeInRight;
	-moz-animation-name: fadeInRight;
	-o-animation-name: fadeInRight;
	animation-name: fadeInRight;
}
.page {
	font-size: 0;
	text-align: center;
	padding: 10px 0px 100px 0px;/* Modify the code --time:1.15  --by:stone*/
}
.page a {
	display: inline-block;
 *display: inline;
	zoom: 1;
	/*width: 39px;*/
	height: 39px;
	border: 1px solid #d2d2d2;
	font-size: 21px;
	color: #9fa0a0;
	margin: 0 5px;
	line-height: 39px;
	vertical-align: top;
	transition: all .3s linear;
	padding:0 15px;
}
.page a.prev {
}
.page a.next {
	width: 90px;
}
.page a.active, .page a:hover {
	/*	background: #3651a8;*/
/*	border-color:#3651a8;*/
	color: #45b035;
}

/*Modify the code for download  --time:1.16   --by:stone*/
.page_download {
	font-size: 0;
	text-align: center;
	padding: 105px 0px 0px 0px;
}
.page_download a {
	display: inline-block;
	zoom: 1;
	height: 39px;
	border: 1px solid #d2d2d2;
	font-size: 21px;
	color: #9fa0a0;
	margin: 0 5px;
	line-height: 39px;
	vertical-align: top;
	transition: all .3s linear;
	padding:0 15px;
}
.page_download a.prev {
}
.page_download a.next {
	width: 90px;
}
.page_download a.active, .page_download a:hover {
	color: #45b035;
}
/*the end*/
.pagel {
	font-size: 0;
	text-align: center;
	padding: 30px 0px 130px 0px;
}
.pagel a {
	display: inline-block;
 *display: inline;
	zoom: 1;
	/*width: 39px;*/
	padding:0 15px;
	height: 39px;
	border: 1px solid #d2d2d2;
	font-size: 21px;
	color: #9fa0a0;
	margin: 0 5px;
	line-height: 39px;
	vertical-align: top;
	transition: all .3s linear;
}
.pagel a.prev {
}
.pagel a.next {
	width: 90px;
}
.pagel a.active, .pagel a:hover {
	/*	background: #3651a8;*/
/*	border-color:#3651a8;*/
	color: #45b035;
}
.sub-banner .text-box{
	width:100%;
	color:#fff;
	position: absolute;
	left:0;
	top:48%;
}

.sub-banner .text-box .desc{
	/*width:490px;*/
	font-size: 50px;
	line-height: 98px;
	position: relative;
	top:35px !important;
	opacity: 0;
	filter: alpha(opacity=0);
	margin-bottom: 20px;
}

.sub-banner .text-box .hottel{
	font-size: 26px;
	position: relative;
	top:35px;
	opacity: 0;
	filter: alpha(opacity=0);
}

.sub-banner .text-box .hottel span{
	font-family: arial;
}