@charset "utf-8";
/* CSS Document */
.clearfix{
	/*clear:both;*/
}
#content{
	width:770px;
}
#featurecontainer{
/*	width:770px;*/
}
#sectionname{
	font-weight:bold;
}
#feature{
	
	min-height:300px;
	letter-spacing:1px;
	float:left;
}
#featurebkgd{
	background-color:#aa9853;
	padding: 15px;
	color:#fff;
}
#feature ul{
	margin:0px;
	padding:10px 20px;
}
#feature li{
	list-style-type:none;
	line-height:18px;
}
#feature a{
   color: #ffd200;
}
#feature #magdate{
	text-align:right;
}
#feature #featuretitle{
	font-size:20px;
	line-height: 28px;
	font-weight:bold;
	margin-bottom:10px;
}
#feature #featurevideopic{
	float:right;
	padding-left: 0px;
}

#feature #featurepic{
	float:right;
	padding-left:10px;
}

#cover{
/*
	float:left;
	margin-left:20px;
*/
	
}
#cover .col-md-12{padding: 0px;}

#cover img{
    width: 100%;
	/*margin-top:20px;*/
}
#cover ul{
	margin:0px;
	padding:0px;
}
#cover li{
	list-style-type:none;
}
#cover #download{
	margin: 15px 0px;
}
#subsectioncontainer{
/*	width:770px;*/
}
#subsectioncontainer ul{
	margin:0px;
	padding:0px;
}
#subsectioncontainer li{
	list-style-type:none;
}
#subsectioncontainer .subsection{
/*	height:260px;*/
	float:left;
	margin:10px 0px;
	padding-top: 15px;
}
#subcontainer{
	/*width:770px;*/
	height:540px;
	display:block;
}
#subsectioncontainer #sub1, #subsectioncontainer #sub5{
/*	margin:10px 0px 10px 0px;*/
}
#subsectioncontainer .subtitle{
	font-family: "微軟正黑體", Arial, Helvetica, Verdana;
	font-size:16px;
	color:#fff;
	line-height:28px;
	background-color:#D9AD00;
}

#subsectioncontainer .subphoto{
	
	padding: 0px;
}

#subsectioncontainer .subcontent{
	font-family: "微軟正黑體", Arial, Helvetica, Verdana;
	color:#000;
	letter-spacing:1px;
	min-height: 210px;
	padding: 0px;
	padding-top: 5px;
}

.subcontent img{
    width: auto !important;
}

.subsection img{
    width: 100%;
}

#subsectioncontainer .subcontent a{
	color:#000;
	text-decoration:none;
}

#divider{
	height:1px;
	margin:20px 0px;
	background-color:#CCC;
}
#archivecontainer{
	font-family: "微軟正黑體", Arial, Helvetica, Verdana;
	font-size:14px;
/*	width:770px;*/
	letter-spacing:1px;
}
#archivetitle{
	color: #D9AD00;
	font-weight:bold;
    font-size: 16px;
}
.archivelist{
/*
	width:133px;
	height:250px;
*/
/*	float:left;*/
	margin:10px 0px;
}
#archivecontainer  img{
	width: auto;
}
#archivecontainer ul{
	margin:0px;
	padding:0px;
}
#archivecontainer li{
	list-style-type:none;
}
.arcdate{
	color: #D9AD00;
}
.arccover{
	margin:10px 0px;
}
.arcpdf a{
	color: #D9AD00 !important;
	text-decoration:none;
}
.arcpdf a:hover{
	text-decoration:underline;
}
#detailcontainer{
	width:770px;
	height:510px;
	margin-top:30px;
	display:none;
}
#detailsection{
	font-family: "微軟正黑體", Arial, Helvetica, Verdana;
	font-size:16px;
	color:#fff;
	line-height:26px;
	height:26px;
	text-indent:5px;
	/*width:175px;
	margin-left: 15px;*/
	background-color:#D9AD00;

}
#detailbkgd{
	background-color:#f2e4ad;
}
#detailbkgd a{
	color:#D9AD00;
}
#btnclose{
	text-align:right;
}
#btnclose img{width: auto !important;}
#detailcontent{
	padding:20px;
}
#detailcontent-text{
	font-family: "微軟正黑體", Arial, Helvetica, Verdana;
	color:#000;
	letter-spacing:1px;
	/*margin-right:10px;*/
}
#detailcontent > div{
	float: left;
}
#detailcontentvideopic{
	width:280px;
	margin-left:20px;
	float:left;
}

#detailcontentcontentpic{
	width:280px;
	margin-left:20px;
	float:left;
}
#bottomvisual{
	margin-bottom:20px;
}
#bottomvisual img{
	margin-top:-12px;
    width: 100%;
}

.subsection:hover{
	-webkit-transition : all 0.3s ease-in-out;
	-moz-transition : all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	background-color:#f2e4ad;
}

#archivecontainer:after {
  	content: ".";
  	display: block;
  	clear: both;
	visibility: hidden;
}

.video_open img{width: 100%;}

.arcpdf img {
    width: 11px !important;
}

.btn-charities-brown {
    /*background: rgba(213,196,126,1);
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zd…B5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2cxODEpIiAvPgo8L3N2Zz4=);*/
    background: rgba(213,196,126,1);
background: -moz-linear-gradient(top, rgba(213,196,126,1) 0%, rgba(170,152,83,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(213,196,126,1)), color-stop(100%, rgba(170,152,83,1)));
background: -webkit-linear-gradient(top, rgba(213,196,126,1) 0%, rgba(170,152,83,1) 100%);
background: -o-linear-gradient(top, rgba(213,196,126,1) 0%, rgba(170,152,83,1) 100%);
background: -ms-linear-gradient(top, rgba(213,196,126,1) 0%, rgba(170,152,83,1) 100%);
background: linear-gradient(to bottom, rgba(213,196,126,1) 0%, rgba(170,152,83,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d5c47e', endColorstr='#aa9853', GradientType=0 );
    border-radius: 12px;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 12px;
    -moz-border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
    border: 0px solid #000000;
    width: 100%;
    margin-bottom: 15px;
    margin-top: 15px;
    display: block;
    text-align: center;
    text-decoration: none !important;
}

.btn-container-text {
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
    font-size: 1em;
    text-decoration: none !important;
    width: 100%;
    min-height: 20px;
    display: block;
    padding: 8px 12px;
}


@media(max-width: 767px) and (min-width: 480px){
	
	#cover {
		margin-left: 25%;
	}
	
	.subsection{
		width: 100% !important;
	}
	
	#subsectioncontainer .subphoto{
		padding: 10px 0px;	
	}	
	
	#subsectioncontainer .subcontent {
        min-height: 0px;
		padding: 10px;
    }
	
	#feature {
		float: none;
	}
}	


@media(max-width: 480px){
	
	#cover {
		width: 83.33333333%;
	}
	
    #subsectioncontainer .subphoto{
		padding: 10px;	
	}	
	
	#subsectioncontainer .subcontent {
        min-height: 0px;
		padding: 10px;
    }
	
	#feature #featurevideopic{
		padding-left: 15px;
		float: none;
	}
	
	#feature #featurecontent{
		padding-top: 10px;
	}
	
	#feature {
		float: none;
	}

}
@media(max-width: 414px){
	
	#cover {
		margin-left: 8.33333%;
	}
	
    #subsectioncontainer .subcontent {
        min-height: 0px;
    }
}