@import url(http://fortawesome.github.io/Font-Awesome/assets/font-awesome/css/font-awesome.css);
@import url(https://fonts.googleapis.com/css?family=Varela+Round);
/* CSS Document */
body,ul,li,ol,dt,dd{list-style:none;margin:0;padding:0;}
body{font-family: 'Varela Round','微軟正黑體';color:#333;}
i{font-style:normal;}
a,button,img{transition:all .5s}

img{max-width:100%;width:auto;}
a{text-decoration:none;color:#666;cursor:pointer;}
a.underline{text-decoration:underline}
a:hover{color:#a40000; text-decoration: none;}
a img:hover,button:hover{opacity:0.8;transition:all .5s}


input[type=checkbox],input[type=radio]{width:20px;height:20px;vertical-align:middle;display:inline-block;margin:0 5px;}
input[type="text"],select{padding:8px 15px;margin:1px;border:1px solid #ccc;vertical-align:middle;width:auto;}

input,select,button,img{vertical-align:middle;display:inline-block;}

hr{clear:both;margin:15px 0}
hr.dottedLine{border-style:dotted;}


.btnAll{margin:30px auto}

button{padding:8px 30px;box-shadow:none;border:none;}
button:hover{box-shadow:inset #999 0 0 5px}
button.smallBtn{padding:3px 10px;font-size:12px;}
button.largeBtn{padding:5px 10px;font-size:25px;}

button.largeBtn:hover{box-shadow:inset #000 0 0 8px;}

.redBtn{color:#fff;border:1px solid #830B0D;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f67171+0,cf3938+100 */
	background: #f67171; /* Old browsers */
	background: -moz-linear-gradient(top, #f67171 0%, #cf3938 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #f67171 0%,#cf3938 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #f67171 0%,#cf3938 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f67171', endColorstr='#cf3938',GradientType=0 ); /* IE6-9 */
}
.orangeBtn{color:#fff;box-shadow:none;border:none;background:#ec6c00;}
.blueBtn{color:#fff;box-shadow:none;border:none;background:#3b9098;}

/*LightBox*/
.LightBox{width:100%;height:100%;background:rgba(0,0,0,.9);position:fixed;left:0;top:0;text-align:center;z-index:9999;display:none;}

.LightBox>section{display:inline-block;vertical-align:middle;max-width:950px;width:95%;text-align:left;box-sizing:border-box;background:#ddd;
	position:relative;max-height:95%;overflow:auto;box-shadow:#666 0 0 10px;padding:30px;color:#666;border:5px solid #b25900;}

.LightBox:before{content:"";display:inline-block;vertical-align:middle;height:100%;}

/*
.LightBox section dt{display:inline-block;vertical-align:middle;text-align:right;width:30%;margin:0;}
.LightBox section dd{display:inline-block;vertical-align:middle;text-align:left;width:60%;margin:0;margin-left:5%;}
.LightBox section dd>input[type="text"]{width:100%;max-width:250px;margin-right:10px;}
*/

.LightBox #btnClose{font-size:30px;text-align:right;cursor:pointer;position:absolute;top:20px;right:25px;color:#333}
.LightBox #btnClose:hover{color:#A72326 !important}
.LightBox hr{border-color:#ccc;}

/*inlineBlock*/
.inline-Block{
	display:inline-block;
	*display:inline;
	*zoom:1;
}
.inlineBlock{
	font-size:0;
[;font-size:12px;];
	*font-size:0;
	font-family:arial;
[;letter-spacing:-3px;];
	*letter-spacing:normal;
	*word-spacing:-1px;
}
.inlineBlock li{
	display:inline-block;
	*display:inline;
	*zoom:1;
	letter-spacing:normal;
	word-spacing:normal;
	font-family:Arial,"微軟正黑體";
}

/*table*/
table{width:100%;margin-bottom:10px;}
table td{padding:5px 2px;border-bottom:1px solid #eee;}

table tr:nth-child(odd){background:#fff;}
table tr:nth-child(even){background:#f5f5f5}
table th{background:#333;color:#ccc;font-size:12px;padding:5px 2px;border:1px solid #444;}

.tb1 td{padding:2px;font-size:90%;}

/*list*/
.noStyleList{list-style:none;}

/*noboder*/
.noborder{border:none}

/*bgColor*/
table tr.grayBg{background-color:#888;color:#fff;}
table tr.purpleBg{background-color:#9099b1;color:#fff;}
table tr.yellowBg{background-color:#FFC}
table tr.redBg{background-color:#F00;color:#fff;}
.purpleBg{background:#d8dce4;color:#4c5976;}
.grayBg{background:#666;}
.gray2Bg{background:#666;}
.greenBg{background:#589199;}

/*color*/
.yellowColor{color:#faff6a}
.redColor,a.redColor{color:#F00}
.blueColor,a.blueColor{color:#40a2b4;}
.greenColor,a.greenColor{color:#396;}

.primaryColor{color:#3b9098}
.grayColor{color:#888}
.orangeColor{color:#f57900;}


/*align*/
.alignCenter{text-align:center;}
.alignLeft{text-align:left;}
.alignRight{text-align:right}

/*font*/
.bold{font-weight:bold;}
.letter_1px{letter-spacing:1px;}
.letter_2px{letter-spacing:2px;}
.letter_3px{letter-spacing:3px;}
.letter_4px{letter-spacing:4px;}
.letter_5px{letter-spacing:5px;}

/*border*/
.borderBottom{}
.borderBrown{border-color:#B49E73}
.borderGrayR{border-right:1px solid #BDBDBD;}

/*width*/
.w100{width:100% !important}
.w98{width:98% !important}
.w70{width:70% !important}
.w65{width:65% !important}
.w66{width:66% !important}
.w60{width:60% !important}
.w55{width:55% !important}
.w50{width:50% !important}
.w48{width:48% !important}
.w45{width:45% !important}
.w40{width:40% !important}
.w33{width:33% !important}
.w30{width:30% !important}
.w20{width:20% !important}
.w15{width:15% !important}
.w10{width:10% !important}

/*margin*/
.MTR0{margin:0 !important;}

.MT5{margin-top:5px !important;}
.MT10{margin-top:10px !important;}
.MT15{margin-top:15px !important;}
.MT20{margin-top:20px !important;}
.MT30{margin-top:30px !important;}
.MT50{margin-top:50px !important;}

.MB5{margin-bottom:5px !important;}
.MB10{margin-bottom:10px !important;}
.MB15{margin-bottom:15px !important;}
.MB20{margin-bottom:20px !important;}
.MB30{margin-bottom:30px !important;}

.MR5{margin-right:5px !important;}
.MR10{margin-right:10px !important;}
.MR15{margin-right:15px !important;}
.MR20{margin-right:20px !important;}
.MR30{margin-right:30px !important;}
.MR40{margin-right:40px !important;}
.MR50{margin-right:50px !important;}
.MR60{margin-right:60px !important;}
.MR70{margin-right:70px !important;}
.MR100{margin-right:100px !important;}

.ML5{margin-left:5px !important;}
.ML10{margin-left:10px !important;}
.ML15{margin-left:15px !important;}
.ML20{margin-left:20px !important;}
.ML30{margin-left:30px !important;}
.ML40{margin-left:40px !important;}
.ML50{margin-left:50px !important;}

.MTB5{margin-top:5px;margin-bottom:5px !important;}
.MTB10{margin-top:10px;margin-bottom:10px !important;}
.MTB15{margin-top:15px;margin-bottom:15px !important;}

.MLR10{margin-right:10px !important;margin-left:10px !important}
.MLR15{margin-right:15px !important;margin-left:15px !important}
.MLR20{margin-right:20px !important;margin-left:20px !important}

.PTB5{padding-top:5px !important;padding-bottom:5px !important;}
.PTB10{padding-top:10px !important;padding-bottom:10px !important;}
.PTB20{padding-top:20px !important;padding-bottom:20px !important;}
.PTB30{padding-top:30px !important;padding-bottom:30px !important;}

.PLR5{padding-left:5px !important;padding-right:5px !important;}
.PLR10{padding-left:10px !important;padding-right:10px !important;}
.PLR15{padding-left:15px !important;padding-right:15px !important;}

.FR{float:right !important}
.FL{float:left !important}
.clearAll{clear:both !important;}

.bdrCircle{border-radius:50% !important;}
.bdr5{border-radius:5px !important;}
.bdr10{border-radius:10px !important}
.bdr15{border-radius:15px !important}
.bdr20{border-radius:20px !important}

.blue_bd5{border:5px solid #2c3a44 !important;}

a.Line{text-decoration:underline}

.font_12{font-size:12px !important;}
.font_13{font-size:13px !important;}
.font_15{font-size:15px !important;}
.font_18{font-size:18px !important;}

.font_80{font-size:80% !important;}
.font_120{font-size:120% !important;}
.font_150{font-size:150% !important;}

/*icon*/
.ico_blue{padding:2px 5px;background:#235c63;color:#fff;border-radius:3px;}
.icon_add{width:20px;height:20px;line-height:20px;background:#65a1a8;color:#fff;display:inline-block;border-radius:50%;font-size:20px;text-align:center;font-family:Arial, Helvetica, sans-serif;letter-spacing:0;z-index:999;}
.icon_discount{display:block;background-color:#ff4500;color:#fff;width:40px;height:40px;line-height:40px;font-style:normal;position:absolute;left:0;top:0;z-index:999;}
.icon_new{display:block;background-color:#C8BC8C;color:#fff;border-radius:50%;width:40px;height:40px;line-height:40px;font-style:normal;position:absolute;left:10px;top:10px;z-index:999;}
.icon_num{display:block;background-color:#BDBDBD;color:#fff;width:23px;height:23px;line-height:23px;font-style:normal;position:absolute;left:0px;top:0px;z-index:999;}


/*bootStrap Add*/
/* define bootstrap 5 columns */
.col-xs-1-5,
.col-sm-1-5,
.col-md-1-5,
.col-lg-1-5 {
	position: relative;
	min-height: 1px;
	padding-right: 10px;
	padding-left: 10px;
}

.col-xs-1-5 {
	width: 20%;
	float: left;
	padding:0 3px;
}

@media (min-width: 768px) {
	.col-sm-1-5 {
		width: 20%;
		float: left;
	}
}
@media (min-width: 992px) {
	.col-md-1-5 {
		width: 20%;
		float: left;
	}
}
@media (min-width: 1200px) {
	.col-lg-2-5 {
		width:40%;
		float: left;
	}
	.col-lg-3-5 {
		width: 60%;
		float: left;
	}
	.col-lg-4-5 {
		width: 80%;
		float: left;
	}
	.col-lg-1-5 {
		width: 20%;
		float: left;
	}
}
.graybd { background: #eee;}

.wtcolor {color:white;}

/*pagination*/

.pagination {
	display: inline-block;
	padding-left: 0;
	margin: 20px 0;
	border-radius: 4px;
}
.pagination > li {
	display: inline;
}
.pagination > li > a,
.pagination > li > span {
	position: relative;
	float: left;
	padding: 6px 12px;
	margin-left: -1px;
	line-height: 1.42857143;
	color: #f57900;
	text-decoration: none;
	background-color: #fff;
	border: 1px solid #ddd;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
	margin-left: 0;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
	z-index: 3;
	color: #f57900;
	background-color: #eee;
	border-color: #ddd;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
	z-index: 2;
	color: #fff;
	cursor: default;
	background-color: #f57900;
	border-color: #f57900;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
	color: #777;
	cursor: not-allowed;
	background-color: #fff;
	border-color: #ddd;
}
.pagination-lg > li > a,
.pagination-lg > li > span {
	padding: 10px 16px;
	font-size: 18px;
	line-height: 1.3333333;
}
.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
	border-top-left-radius: 6px;
	border-bottom-left-radius: 6px;
}
.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
	border-top-right-radius: 6px;
	border-bottom-right-radius: 6px;
}
.pagination-sm > li > a,
.pagination-sm > li > span {
	padding: 15px 10px;
	font-size: 12px;
	line-height: 1.5;
}
.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}
.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
}

img.venue_img {
	width: 90px;
	height: 90px;
	-webkit-border-radius: 80px;
	-moz-border-radius: 80px;
	border-radius: 80px;
	border: 2px #ffffff solid;
}

img.venue_sport_img {
	width: 73.5px;
	height: 73.5px;
	-webkit-border-radius: 80px;
	-moz-border-radius: 80px;
	border-radius: 80px;
	border: 2px #ffffff solid;
}

a.intro_cate {
	background-color: #ffffff;
}

.photoList a.photoList-a{
	display:block;
	height:231.69px;
	overflow:hidden;
}
.photoList aside{
	width:100%;
	height:100%;
	background:no-repeat center center;
	background-size:cover;
}
