*{
	margin: 0;
	padding: 0;
	border: 0;
	font-family: 微軟正黑體;
}

#info-text {
    margin: 0.5rem 0;
}

#video-title {
    font-size: 1.5rem;
    word-break: break-word;
}

.container{
	width: 980px;
	margin: 0 auto;
	padding: 10px;
}
.content{
	width: 90%;
	margin: 0 auto;
	padding: 10px;
	max-width: 850px;
}
.form-control{
	width: 150px;
	padding: 5px;
	border: 1px solid #ccc;
	border-radius: 5px;
	/* text-align: center; */
}
.inputr{
	position: relative;
	left: -30px;
	color: #bbb;
}
.input2r{
	position: relative;
	left: -50px;
	color: #bbb;
}
.orangebt{
	background: #0080ff;
	color: #FFF;
	padding: 5px 14px;
	border-radius: 5px;
	cursor: pointer;
}
.orangebt:hover{
	background: #0000ff;	
	transition:all 0.3s;
}
.innericon{
	color: #FFF
}
#back-to-top{
	float: right;
	position: relative;
	right: 20px;
	bottom: 15px;
	cursor: pointer;
}
#back-to-top:hover{
	opacity: 0.8;
}
#back-to-top img{
	width: 50px;
}
/*header*/
.header{
	width: 100%;
}
.headerarea{
	width: 100%;
	margin: 0;
	padding: 0px 0 10px 0;
	
}
.headerarea li{
	display: inline-block;
	width: auto;
	vertical-align: top;
}
.headerarea li img{
	float: left;
	position: relative;
	top: 5px;
}
.logotitle{
	margin: 10px;
	position: relative;
	left: 10px;
	font-size: 22px;
	top: -5px;
}
.hright{
	text-align: right;
	padding-top: 8px;
	float: right;
}
.datainput{
	background: url(../img/cl.png) no-repeat;
	background-position: right;
}
.inputrow{
	width: 100%;
}
.inputrow li{
	display: inline-block;
	width:  auto;
	margin: 5px auto;
}
.vodlive{
	text-align: right;
	/*padding-top: 8px;*/
}

/*banner*/
.banner{
	background-size: cover;
	height: auto;
}
.bannerli{
	width: 100%;
	background:rgba(100%,100%,100%,0.7);
}
.bannerli li{
	display: inline-block;
	vertical-align: top;
}
.video{
	width: 100%;
	padding: 0;
}
.video iframe{
	margin: 0;
	margin-bottom: -4px;
	min-height: 40vw;
	height: 615px;
	width: 60%;
}
.videofont{
	width: 28%;
}
.videotitle{
	font-size: 18px;
	font-weight: bold;
}
.bmcolor{
	border-bottom: 2px solid #ccc;
	width: auto;	
	padding-bottom: 5px;
}
.orangebom{
	border-bottom: 2px solid #f39700;
	width: auto;	
	padding-bottom: 5px;
}
.fontlist{
	width: 100%;
	margin: 15px auto;
}
.fontlist li{
	display: inline-block;
	vertical-align: top;
	font-size: 14px;
	color: #555;
}
/*content*/
.marqueerow{
	width: 100%;
	margin: 10px auto;
	border-bottom: 1px solid #f39700;
	padding-bottom: 10px;
}
.marqueerow li{
	display: inline-block;
}
.marqueetit{
	width: 15%;
}
.orgbt{
	background: #f39700;
	color: #FFF;
	border-radius: 5px;
	width: auto;
	text-align: center;
	font-size: 14px;
	padding: 5px 10px;
}
.marqueecontent{
	width: 83%;
}
.marquee{
	color: #888;
	position: relative;
	top: 13px;
}
.mocuntlist{
	color: #555;
	font-size: 16px;
	font-weight: bold;
}
.mocuntlist span{
	color: #eb6000;
}
.maincontent{
	width: 100%;
}
.maincontent li{
	display: inline-block;
	vertical-align: top;
}
.contentinformation{
	width: 100%;
}
.contentbanner{
	width: 18%;
}
.videolist{
	width: 100%;
	margin: 10px auto;
}
.videolist li{
	display: inline-block;
	width: 30% !important;
	margin: 10px 1%;
}
.innervideolist{
	border:1px solid #CCC;
	-moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.3);
	-webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.3);
	box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.3);
}
.videocontent{
	width: 90%;
	padding: 5px;
	margin: 0 auto;
	font-size: 14px;
}
.videocontent a{
	text-decoration: none;
	color: #888;
}
.videocontent a:hover{
	color: #555;	
}
.datatext{
	color: #ef6100 !important;
	font-weight: bold;
}
.contenttext{
	color: #888;
}
.bnrow{
	width: 100%;
	margin: 0 auto;
	background: url(../img/line.png) #f39700;
	background-position: center;
	color: #FFF;
	position: relative;
	top: 18px;
	border-radius: 3px;
	text-align: center;
	padding: 2px 5px;
}
.bnrow span{
	background: #f39700;
	font-size: 14px;
	padding: 0 10px;
}
.bannerarea{
	border-radius: 5px;
	background: #eeeeee;
	width: 100%;
	margin: 0 auto;
	padding: 5px;
	position: relative;
	top: 20px;
}
.bannerarea img{
	width: 100%;	
	padding: 2px 0;
}
.pages{
	width: 100%;
	margin: 5px auto;
	text-align: center;
}
.pages li{
	display: inline-block;
	text-align: center;
	margin: 5px 2px;
}
.pages button{
	background: #FFF;
	padding: 2px 7px 3px 7px;
	-moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.3);
	-webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.3);
	box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.3);
	font-weight: bold;
	cursor: pointer;
}
.pages button:hover{
	background: #efefef;
}
.bunact{
	border: 1px solid;
	border-radius: 5px;
	color: #c30d22;
}
/*footer*/
.footer{
	border-top: 10px solid #42474d;
	background: #545b61;
	text-align: center;
	color: #fff;
	padding: 15px 5px;
}
/*台中市議會影片內容*/
.videomainbox{
	width: 95%;
	margin: 10px auto;
	padding: 15px;
	background: #efefef;
}
.videomainbox b{
	color: #ea5414;
}
.videomainbox p{
	color: #555;
	font-size: 14px;
	line-height: 22px;
	text-align: justify;
}
.goback{
	background: #555;
	color: #fff;
	padding: 5px 15px;
	border-radius: 5px;
	cursor: pointer;
}
.goback:hover{
	background: #333;
	transition: all 0.3s;
}
@media (max-width: 1200px){
	.container{
		width: 95%;	
		padding: 10px 0;	
	}
	.video iframe{
		height: 420px;
	}	
}
@media (max-width: 1120px){	
	.headerarea{
		width: 100%;
		margin: 0;
		height: 80px;
	}
	.headerarea>li{
		display: inline-block;
		width: 100%;
		vertical-align: top;
	}	
	.hright{
		text-align: center;
	}
	.video iframe{
		height: 390px;
	}	
	.vodlive{
		text-align: center;
	}	
}
@media (max-width: 850px){
	.bannerli li{
		width: 100%;
	}
	.videofont{
		background: rgba(100%,100%,100%,0.7);
	}	
	.banner{
		background:url(../img/bg-inner.jpg);
		background-size: 100%;
		height: auto;
	}
	.bannerli{
		width: 100%;
		background:none;
	}
	.bannerli li{
		display: inline-block;
		vertical-align: top;
		width: 100%;
	}
	.video{
		width: 100%;
		padding: 0;
	}
	.video iframe{
		margin: 0;
		margin-bottom: -4px;
	}
	.contentinformation{
		width: 100%;
		margin: 0 auto;
		text-align: center;
	}
	.contentbanner{
		width: 100%;
		text-align: center;
	}
	.bannerarea img{
		width: 80%;	
		padding: 2px 0;
	}
	.marqueetit{
		width: 25%;
	}
	.marqueecontent{
		width: 73%;
	}
	.pages{
		margin: 30px auto 10px auto;
	}
	.mbfulllidt{
		width: 100% !important;
		margin: 5px 0;
	}
	.mbfulllidt .orgbt{
		max-width: 180px;
	}
	.video iframe{
		height: 370px;
	}	
}
@media (max-width: 700px){	
	.videolist li{
		width: 40% !important;
	}
	.orgbt{
		width: auto;
	}
	.marqueetit{
		width: 30%;
	}
	.marqueecontent{
		width: 68%;
	}
	.orangebt{		
		padding: 5px 7px;		
	}
	.form-control{
		width: 80px;	
	}	
	.datainput{
		background: none;
	}
}
@media (max-width: 600px){			
	.video iframe{		
		height: 370px !important;
	}
}
@media (max-width: 520px){	
	.videolist li{
		width: 80% !important;		
	}	
	.headerarea li img{
		float: none;
		width: 100%;
	}
}
@media (max-width: 450px){		
	.banner{
		margin-top: 25px;
	}
}
@media (max-width: 430px){		
	.form-control{
		width: 80px;
	}
	.mbhide{
		display: none !important;
	}	
}
@media (max-width: 360px){	
	.form-control{
		width: 70px;
	}
	.orangebt{
		padding: 5px;
		font-size: 8px !important;
	}	
	.headerarea{		
		height: 80px;
	}
	.video iframe{		
		height: 250px !important;
	}
}
@media (max-width: 350px){	
	.orgbt{
		font-size: 10px;
	}
	.marquee{
		font-size: 14px;
		position: relative;
		top: 15px;
	}
}
.liveOnline_footer li {
	color:#494949;
	text-indent:28px;
	line-height:1.8;
	font-size:13px;
	letter-spacing:1px;
	display: block;
}
.liveOnline_footer li.name {
	display: block;
	font-size:15px;
	font-weight:bold;
	line-height:1.2;
	color:#084da9;
}
.text_blue {
	color:#0b63d7;
}
.text_darkblue {
	color:#003399;
	font-size:16px;
	font-weight:bold;
}