@charset "utf-8";
/* 全域設定 */
a {
	text-decoration: none;
}

img {  
	image-rendering: -moz-crisp-edges; /* Firefox */     
	image-rendering: -o-crisp-edges; /* Opera */      
	image-rendering: -webkit-optimize-contrast; /*Webkit (non-standard naming) */ 
	image-rendering: crisp-edges;
	-ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
	}
p{
	font-size: 18px;
	padding-left: 25px;
	padding-right: 20px;
}

/* 漢堡圖示的設定 */
.burgar_top{

	display: none;
	width:100%;
	text-align:right;
	background-color: #511b86;
	padding:5px;
	z-index: 998;
}
.burgar_btn{
	font-size: 30px;
	border-radius: 6px;
	border: 1px solid #FFF;
	color:#FFF;
	padding:3px 10px;
	margin:5px 10px;
}

.burgar_btn::before{
   content: '\9078\55AE';
   position: absolute;
   right:70px;
 }

/* offcanvas的設定 */
.offcanvas-title{
	font-weight: 900;
}
.offcanvas-body ul{
	list-style: none;
	margin-left: 0.5em;
	border-left: 1px solid;
}
	
.offcanvas-body ul li{
	list-style: "→ ";
	text-align: left;
	
}
	
.offcanvas-body ul li a{
	font-size: 1em;
	color:rgb(85, 85, 85);
	font-weight: 800;
}
	
.offcanvas-body ul li a:hover{
	color:#511b86;
}
	
.offcanvas-start{
	background-color: #efe3fc;
	width:300px;
}
.div-nav{
	background-color:rgb(244, 234, 253);
	margin-bottom: 50px;
}

/* 導航列的設定 */
#float-nav{
	width:100%;
	position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
	top: 0px;  /*設置垂直位置*/
	left: 0px;
	/* right: 50%;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/ 
	z-index:999;
}

.main-header{
	background-color: rgb(244, 234, 253);
}

.main-nav{
	margin: 0px;
	border-radius:0px 0px 10px 10px;
}
.main-nav li:hover{
	background-color: #b06af5;
}
.main-nav li a{
	color:#511b86;
}
.main-nav li a:hover{
	color: #FFF;
}
.dropdown-item:hover{
	background-color: #b06af5;
}
.dropdown-item a:hover{
	color: #FFF;
}

/* 主標題列的設定 */

.main-title{
	/* margin:30px; */
	padding: 20px 0px;
	color: #511b86;
	font-size: 36px;
	font-weight: 900;
	float: left;
}

.main-title img{
	width: 200px;
}

.main-social{
	vertical-align: bottom;
	padding: 0px;
	font-size: 40px;
	float: right;
}

.logo-right-text{
	margin-top: 30px;
	list-style: none;
}

.logo-right-text a{
	color: #511b86;
	font-size: 22px;
	font-weight: 700;
	padding: 10px;
}

.logo-right-text a:hover{
	color:#5c5c5c;
}
	

/* 區塊設定 */

.main-text{
	margin: 40px 0px;
}

.main-text h3{
	padding: 20px 0px;
}

.main-text img{
	border: 1 solid #c695f8;
	border-radius: 5px;
	margin-right: 20px;
	float:left;
	
}

.main-pic{
	overflow: hidden;
	border-radius: 5px;
	width:100%;
}

.main-pic img{
	width:100%;
 	transition: .5s;
 	object-fit: cover;
}
.main-pic:hover img{
 	transform: scale(1.2);
}


/* 區塊顏色 */
.box-0{ /* logo標題區塊 */
	/* margin-top:50px ; */
	background-image: url(../images/top_bg.png);
	color: #511b86;
}
.box-1{ /* 事工理念 */
	background-image: url("../images/logo_back_transparent.png");
	background-color: #904ed1;
	color: #efe3fc;
}
.box-2{ /* 事工契機 */
	/* background-color: #511b86; */
	color: #585858;
}
.box-3{ /* 歷史沿革 */
	background-image: url("../images/logo_back_transparent.png");
	background-color: #904ed1;
	color: #efe3fc;
}
.box-4{ /* 活動消息 */
	background-color: #FFF;
	color: #202020;
}
.box-5{ /* 活動照片 */
	background-color: #c695f8;
	color: #202020;
}
.box-6{ /* 合唱研習會報名資訊 */
	background-color: #511b86;
	color: #efe3fc;
}
.box-6 a{ 
	color: #bbbbbb;
}
.box-6 a:hover{ 
	color: #fffb00;
}
.box-7{ /* 事工展望 */
	background-color: #FFF;
	color: #202020;
}
.box-8{ /* 聯絡我們 */
	background-image: url("../images/contact_us.jpg");
	background-size: cover;
	background-color: #c695f8;
	color: #202020;
}

.box-8 a{ 
	text-decoration: none;
	color: #511b86;
}
.box-8 .fb-link{ 
	background-color: blueviolet;
	border-radius: 5px;
	padding: 10px;
	color: aliceblue;
}
.box-8 a:hover{ 
	color: #fffb00;
}
.box-10{ /* 現有出版品介紹 */
	background-color: #FFF;
	color: #202020;
}
.box-9{ /* 聖樂事工 捐款支持 */
	background-image: url("../images/donation.png");
	background-color: #904ed1;
	background-size: cover;
	color: #525252;
}
.box-9 a{ 
	text-decoration: none;
	color: #904ed1;
}
.box-9 a:hover{ 
	color: #cc9707;
}
.box-9 h3{ 
	padding: 20px 0px 0px 20px;
}

.box-9 .main-text{
	border-radius: 20px;
    background-color: rgb(255 255 255 / 85%);
	padding: 10px;
}
.box-10{ /* 現有出版品介紹 */
	background-color: #FFF;
	color: #161515;
}


#float-nav{visibility:hidden;}

/* 浮動按鈕，回到最上方 */
.float-link{
	width:72px;
	position: fixed;  /*固定在網頁上不隨卷軸移動，若要隨卷軸移動用absolute*/
	top: 90%;  /*設置垂直位置*/
	right: 0px;  /*設置水平位置，依所放的內容多寡需要自行手動調整*/
	z-index:99;
	visibility:hidden;
}
.float-link a{
	display: block;
	width: 50px;
	height: 50px;
	padding: 5px;
	border: 2px solid #be8cf0;
	border-radius: 25px;
	font-size: 6px;
	color: #FFF !important;
	text-align: center;
	background-color: #511b86;
	transition: all 0.4s ease;
	text-decoration: none;
	box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);
}
.float-link a i{
	display: block;
	margin-bottom: 3px;
	font-size: 20px;
	letter-spacing: 0.6px;
}
.float-link a + a{
	margin-top: 5px;
}

/* 最底下的footer */
.div-footer{
	color: #efe3fc;
	font-size: 18px;
	padding: 20px;
	text-align: center;
}

.div-footer a{
	color: #efe3fc;
	font-size: 18px;
}
.div-footer a:hover{
	color: #fffb00;
	font-size: 18px;
}
.pub-text{
	font-size: large;
	font-weight: 600;
	color: #511b86;
}

#publications .col-md-6{
	margin-top:50px ;
}

.pic-block{
	display: block;
	width:100%;
}

.table-link{
	cursor: pointer;
}

.pub-text{padding-left: 0px;}

.top_list_a{
   display: inline;
}
.top_list_b{
   display:none ;
}

/*紫底的黃色超連結*/
.yellow-text{color:rgb(255, 255, 0)}
.yellow-text:hover{color:rgb(91, 181, 255)}

@media screen and (max-width: 576px) {
	.box-9 .main-text{
		margin: 10px 10px;
		width: 94%;
	}
}

@media screen and (max-width: 900px) {
	.burgar_top{
	
	display:inline-block;
	}
	header{
		display: none;
	}
	.main-title img{
		width: 200px;
	}
	.main-title{
		/* margin:30px; */
		padding: 20px 0px;
		color: #511b86;
		font-size: 30px;
		font-weight: 900;
		float: left;
	}
	.box-0{ /* logo標題區塊 */
		margin-top:0px ;
		
	}
	.box-8{ /* 聯絡我們 */
		background-image: url("../images/contact_uss.jpg");
		background-size: cover;
		background-color: #c695f8;
		color: #202020;
	}
	.pic-block{
		display: none;
	}

	a {
		text-decoration: none;
	}

	.logo-right-text{
		margin-top: 35px;
	}
	
	.logo-right-text a{
		font-size: 16px;
		font-weight: 600;
		padding: 2px;
	}
   .top_list_a{
      display: none;
   }
	.top_list_b{
      display:inline ;
   }
}