@charset "utf-8";
/* CSS Document */

/* News Start*/
#NewsForm{
	width: 100%;
	padding-bottom: 200px;	
}
.TitleName{
	width: 100%;
	height: 120px;	
	padding-top:50px;

	margin-bottom: 20px;
	text-align: center;	
	background: url("/Templates/Images/Web/TitleLine.png") center bottom no-repeat;
}
.TitleNameText1{
	height: 30px;
	font-size: 16px;
	letter-spacing: 10px;
	text-align: center;
	font-weight: bolder;
	color: #50AEF3;
}
.TitleNameText2{
	font-size: 20px;
	letter-spacing: 10px;
	color: #134F8E;
}
#NewsList{
	width: calc(100% - 70px);
	padding-top: 50px;	
	margin: 0 auto;

}
.NewsItem{
	
	margin: 8px;		
}
.NewsImg{
	padding: 5px;
	border: 3px solid #228CA2;
	overflow: hidden;
	transition: all .5s;
	cursor: pointer;
}
.NewsImg:hover{
	background: #000;
}
.NewsImg:before{	
	position:absolute;
	z-index: 999;	
	opacity: 0;
	color: #FFF;
	transition: all .5s;
}	
.NewsImg:hover:befor{
	opacity:1;
}
.NewsImg img{
	width: 100%;
	transition: all .5s;
}
.NewsImg:hover img{
	opacity: 0.4;
	transform: scale(1.2);
}

.NewsLink{
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: absolute;
	z-index: 3000;
	color: #FFFFFF;
	font-size: 16px;
	opacity: 0;		
	transition: all .5s;
	font-weight: bolder;	
	letter-spacing: 5px;
	text-decoration: none;
}	
.NewsLink:active{
	color: #FFFFFF;
}
.NewsLink:hover{
	opacity: 1;
	transition: all .5s;
}
.NewsLink:link{
	color: #FFFFFF;
	text-decoration: none;
}
.NewsItemTitle{
	width: 100%;
	padding-top: 10px;
}
.NewsDate {
	width: 100%;
	height: 30px;
	line-height: 30px;
	font-size: 14px;
	color: #425EE4;
	padding-left: 10px;
}
.NewsSubject{
	width: 100%;
	height: 30px;
	line-height: 30px;
	overflow: hidden;
	font-size: 18px;
	font-weight: bolder;
}
.NewsDec{
	width: 100%;
	height: 30px;
	overflow: hidden;
	font-size: 14px;
}
.MarginTop100{
	margin-top: 100px;
}
.NewsButton{
	width: 100%;
	height: 0px;
	position:absolute;
	color:#838383;
}
.BtnNext{
	font-size: 40px;
	float: right;
	cursor: pointer;
}
.BtnPrev{
	font-size: 40px;
	float: left;
	cursor: pointer;
}

/* News End*/
/* Room Start*/
#RoomForm{
	width: 100%;
	background:rgba(255,207,208,0.2);
	padding-bottom: 100px;
}
#FoomTitle{
	width: 100%;
	height: 100px;
	line-height: 100px;
	text-align: center;
	font-size: 24px;
	font-weight: bolder;
	color: rgba(76,153,209,1.00);
}
.RoomItem{
	position: relative;
	overflow: hidden;
	width: calc(100% / 4);
	cursor: pointer;
}
.RoomItem:hover .RoomImg img{
	opacity: 1;
	transform: scale(1.1);
}
.RoomImg img{
	display: block;
	width: 100%;
	opacity: .2;
	transition: all .5s ease-in-out;
}
.RoomText{
	width: 100%;
	height: 100%;
	display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-content: center;
	  -ms-flex-line-pack: center;
		  align-content: center;
  -webkit-justify-content: center;
	  -ms-flex-pack: center;
		  justify-content: center;
  -webkit-flex-wrap: wrap;
	  -ms-flex-wrap: wrap;
		  flex-wrap: wrap;
	position: absolute;
	left: 0;	
	top: 0;
	font-size: 20px;
	transition: all .5s ease-in-out;
}
.RoomItem:hover .RoomText{
	opacity: 0;
	transform: scale(1.3);
}
.RoomName{
	width: 100%;
	height: 40px;
	color: #999;
	text-align: center;

}
.RoomEname{
	width: 100%;
	height: 40px;
	text-align: center;
	color: #AAA;
}
#TravelForm{
	width: 100%;
	padding-bottom: 100px;
}
#MapForm{
	width: 100%;
	padding-bottom: 80px;
	background:rgba(255,207,208,0.2);
}
.NewsImg a{
		text-decoration: none;
		color: #FFFFFF;
	}	

.RoomButton{
	width: calc(100% - 30px);
	height: 0px;
	position:absolute;
	color:#838383;

}
.Btn1Next{
	font-size: 40px;
	float: right;
	cursor: pointer;
}
.Btn1Prev{
	font-size: 40px;
	float: left;
	cursor: pointer;
}
/* News End*/
@media only screen and (max-width: 991px) {
	#NewsForm{
		padding-bottom: 50px;	
	}

}