*{margin:0px;padding:0px;}
body{font-size:12px;}
.activities_wrapper  h2:nth-child(1){font-weight:900;}
.content-detail{width:77%;margin:auto;}
.activity_time{font-size:1.25em;padding:5px;}
.activities_detail{background-color:#fff;width:100%;margin:auto;}
.activities_detail img{width: 170px;height: 85px;/*height:50px;margin-right:20px;*/}
.activities_detail p{font-size:1.5em;}
.activity_detail{display:flex;flex-direction:column;}
.leftbox{width:100%;display:flex;}
.rightbox{display:flex;}

.activities_box{width:100%;border-radius:10px;border:3px solid #2c5196;padding:10px 20px;background-color:#fff;}
.search-bar{width:100%;margin:auto;margin-bottom:20px;text-align:center;}
.search-bar-container{position:relative;}
.search-bar-container button{position:absolute;right:0px;border-top-left-radius:0px;border-bottom-left-radius:0px;}
.search-bar input{border-radius:5px;border:1px solid #2c5196;width:100%;margin-bottom:20px;height:60px;padding:10px;font-size:1.25em;}
.search-bar input:focus{outline:none;}
.search-bar button{background-color:#0248A8;border:0;height:60px;padding:10px 20px;font-size:1.5em;}
.search-bar button:hover{background-color:#8344b8;}

.search-day{margin:0;padding:0;height:80px;width:60px;}
.activities_date{width:100%;}
.activities_date a.active{background-color:#9e9e9e;color:#fff;}
.activities_date a{background-color:#fafafa;width:100%;text-align:center;padding:20px 1%;color:#8f8f8f;resize:horizontal;}
.activities_date a:not(:last-child){border-right:1px solid #ccc;}
.activities_date div{width:100%;}
.date_wrapper{margin:auto;width:100%;}
.title_content i:hover{color:#8344b8;}
.activity_box_date{display:flex;position:relative;color:black;}
.activity_box_date_p{margin-left:10px;}
.activity_box_inContainer_activity_title>a{text-decoration:none;}
.activity_box_inContainer_organiser{color:black;}
.activity_box_date_line{position:absolute;top:50%;right:0;height:2px;background-color:rgba(200,135,255,255);}
.activity_box_inContainer{display:flex;box-sizing:content-box;margin:0px 100px;justify-content:space-between;}
.activity_box_inContainer_textContent{line-height:40px;}
.date-border{height:1px;width:100%;background-color:rgba(2, 72, 168, 1);display:none;}
.activities-logo{display:flex;flex-direction:column;justify-content:center;}
.activities-logo > img{height:80px;display:block;}
.logo-item{display:inline-block;}

@media screen and (min-width:1024px){
	/* desktop view */
	.activities_date div::-webkit-scrollbar{display:none;}
	.activities_date a{font-size:1.2vw;}
	.activities_detail{width:100%;margin:auto;}
	.search-bar{width:100%;}
}

@media screen and (min-width:768px) and (max-width:1023px){
	/* tablet view */
	.activities_date div::-webkit-scrollbar{display:none;}
	.activities_date a{font-size:1.5vw;}
	.activities_detail{padding:20px;width:100%;margin:auto;}
	.search-bar{width:80%;}
}

@media screen and (max-width:767px){
	/* mobile view */
	.activities_date div::-webkit-scrollbar{display:none;}
	.activities_date div{white-space:nowrap;}
	.activities_date a{font-size:2vw;}
	.activities_detail{padding:20px;width:100%;margin:auto;}
	.search-bar{width:100%;}

	.activity_detail{flex-direction:column;flex-direction:column-reverse;}
	.leftbox{width:100%;}
	.leftbox img{width:100%;height:auto;margin:7px auto;}
	.rightbox{width:100%;text-align:center;margin-top:20px;margin-bottom:20px;}
	.rightbox img{width:42.5%;height:auto;margin:7px auto;}
	
	.logo{width:100%;}
	.logo-item{display:block;height:200px;width:100%;border:1px solid #ccc;position:relative;}
	.logo-item > a{display:inline-block;}
	.logo-item > a > img{max-width:250px;max-height:180px;width:70%;position:absolute;top:50%;left:50%;transform:translate(-50% , -50%);}
	.HKSU > a > img{height:100px !important;}
}