@font-face{
	font-family:"SBModern";
	src:url('SBModern.eot');
	src:url('SBModern.eot?#iefix') format('eot'),
	url('SBModern.ttf') format('truetype'),
	url('SBModern.woff') format('woff'),
	url('SBModern.svg#SBModern') format('svg');
}
body{
	font-family:"SBModern";
	font-size:23px;
	color:#000;
	margin:0;
}
a{
	color:#000;
	text-decoration:none;
}
a:hover{
	color:#dc0084;
}
img{
	border:none;
	max-width: 100%;
	height: auto;
}
@media \0screen {
  img { 
  	width: auto; /* for ie 8 */
  }
}
input[type='text'], textarea, select{
	width:95%;
	height:2em;
	margin-top:2px;
	border:solid 1px #e0e0e0;
	background-color:#f9f9f9;
	color:#1b3146;
	padding:3px 10px;
}
textarea{
	height:auto;
}
h1{
	font-size:35px;
	color:#ff0099;
	font-weight:normal;
	padding:0;
	margin:0;
}
.font25{
	font-size:25px;
}
.font30{
	font-size:30px;
}
.white, .white a{
	color:#FFFFFF;
}
.white a:hover{
	color:#dc0084;
}
.pink, .pink a{
	color:#ff0099;
	text-decoration:none;
}
.pink a:hover{
	color:#000000;
}
.red{
	color:#FF0000;
}
.cover{
	width:1200px;
	height:auto;
	margin:0 auto;
}
#top{
	width:100%;
	padding:15px 0;
}
#logo{
	width:399px;
	height:104px;
	background-image:url(../images/template/logo.jpg);
	float:left;
}
#listmenu{
	float:right;
	margin-top:40px;
}
#slideshow{
	width:100%;
}
#bg_slogan{
	width:100%;
	background-color:#ff0099;
	text-align:center;
	padding:20px 0;
	font-size:30px;
	color:#FFF;
	overflow:hidden;
}
.p-element{
	display:block;
}
.m-element{
	display:none;
}
#bottom{
	width:100%;
	background-color:#000000;
	text-align:center;
	padding:20px 0;
	margin-top:25px;
	font-size:20px;
}
.row{
	width:100%;
	margin:10px 0;
	overflow:hidden;
}
.col2{
	width:45%;
	margin:2.5%;
	float:left;
}
.col3{
	width:30%;
	margin:1.6%;
	float:left;
}
.col4{
	width:22%;
	margin:1.5%;
	float:left;
}
.col5{
	width:17%;
	margin:1.5%;
	float:left;
}
.left-side{
	float:left;
}
.right-side{
	float:right;
}
.btngray{
	font-family:"SBModern";
	background-color:#f0f0f0;
	color:#ff0099;
	padding:5px;
	cursor:pointer;
	border:none;
}
.btnwhite{
	font-family:"SBModern";
	background-color:#FFF;
	color:#ff0099;
	padding:5px;
	cursor:pointer;
	border:none;
}
.btnpink{
	font-family:"SBModern";
	font-size:20px;
	background-color:#ff0099;
	color:#FFFFFF;
	padding:5px 12px;
	cursor:pointer;
	border:none;
}
.bggray{
	width:100%;
	background-color:#222222;
	padding:10px 0;
	overflow:hidden;
}
.bglightgray{
	width:100%;
	background-color:#f1f1f1;
	padding:10px 0;
	overflow:hidden;
	margin:30px 0;
}
.bgblack{
	width:100%;
	background-color:#000;
	padding:10px 0;
	overflow:hidden;
	margin:30px 0;
}
.w20{
	width:5%;
	float:left;
}
.w80{
	width:90%;
	float:right;
}
table.chart th{
	text-indent:10px;
	text-align:left;
	background-color:#3b743f;
	font-weight:bold;
	color:#FFF;
	height:40px;
	border-bottom:dashed 1px #FFF;
}
table.chart td{
	padding:8px;
	border-bottom:dashed 1px #c8c8c8;
}
table.tbline th{
	text-align:center;
	font-weight:bold;
	height:40px;
	border-bottom:solid 1px #bebebe;
}
table.tbline td{
	padding:12px 8px;
	border-bottom:solid 1px #bebebe;
}
/* Start Page*/
a.paginate {
	background-color:#f3f4f4;
	padding: 0 12px;
	text-decoration: none;
}
a.paginate:hover {
	background-color: #dbdbdb;
	text-decoration: none;
	color:#000000;
}
a.current {
	padding: 0 12px;
	cursor: pointer;
	background:#dbdbdb;
	font-weight:bold;
	text-decoration: none;
	color:#000000;
}
span.inactive {
	padding: 0 12px;
	cursor: pointer;
	vertical-align:middle;
}
/*End Page*/
.gallery{
	list-style:none;
	margin:0;
	padding:0;
}
.gallery img{
	width:18%;
	margin:1%;
	float:left;
}
.play-icon{
	position:absolute;
	z-index:99;
	margin:4% 7%;
}
ul.list li{
    margin-bottom: 20px;
}
@media only screen and (max-width: 900px) {
	h1{
		font-size:30px;
	}
	.cover{
		width:100%;
	}
	.detail{
		width:95%;
		margin:0 auto;
	}
	#logo{
		width:300px;
		height:78px;
		background-image:url(../images/template/slogo.jpg);
		float:none;
		margin:0 auto;
	}
	#listmenu{
		width:100%;
		margin:10px 0;
	}
	#bg_slogan{
		width:95%;
		font-size:20px;
		padding:20px 2.5%;
	}
	.p-element{
		display:none;
	}
	.m-element{
		display:block;
	}
	#bottom{
		font-size:18px;
		width:95%;
		padding:20px 2.5%;
	}
	.col2, .col3, .col4, .col5, .w20, .w80{
		width:100%;
		margin:15px 0;
		float:none;
	}
	.gallery img{
		width:47%;
		margin:1.5%;
		float:left;
	}
	.play-icon{
		margin:25% 37%;
	}
}
@media only screen and (min-width: 901px) and (max-width: 1200px) {
	.cover{
		width:98%;
	}
	#logo{
		width:350px;
		height:91px;
		background-image:url(../images/template/mlogo.jpg);
	}
	.gallery img{
		width:18%;
		margin:1%;
		float:left;
	}
}