@media (max-width: 1920px) {
	.function-box {
        width: 512px;
        height: 295px;
    }
	.login-box .login-box-table td img{
		height:20px
	}
}
@media (max-width: 1720px) {
	.function-box {
        width: 448px;
        height: 277px;
    }
}
@media (max-width: 1600px) {
	.main-content{
        max-width: 1300px;
    }
	.function-box {
        width: 416px;
        height: 257px;
    }
	.header-holder .section-nav a{
        padding:0 8px;
    }
}
@media (max-width: 1490px) {
	.header-holder .section-nav{
		/*max-width: 45%; /*width: 60%; changed by Benson, HKIRC*/
		margin: 0 1%;
	}
}
@media (max-width: 1400px) {
    .main-content{
        max-width: 1024px;
        font-size: 1.1em;
    }
    .case-box .case-screen img {
        max-width: 560px;
    }   
    .case-box .case-details{
        width: 44%;
    }
    .case-box .case-screen{
        width: 55%;
    }
    .home-search-holder{
        font-size: 3.7em;
    }
    .read-more-holder .main-content p{
        font-size: 1.3em;
    }
	.function-box {
        width: 320px;
        height: 198px;
    }
	.header-holder .func-nav{
        right: 1%;
    }
	.header-holder .section-nav{
		max-width: 45%;
		
	}
}

@media (max-width: 1280px) {
    .main-content {
        max-width: 980px;
    }      
    .case-box .case-screen img{
        max-width: 500px;
    }
    .case-box .case-details {
        width: 47%;
    } 
    .case-box .case-screen {
        width: 52%;
    }
    .home-search-holder{
        top: 33%;
    }
	.function-box {
        width: 640px;
        height: 396px;
    }
	.header-holder .func-nav{
        max-width: 55%;
    }
	.header-holder .section-nav{
		max-width: 40%;
		font-size:24px;
	}
}

@media (max-width: 1200px) {
	.header-holder .section-nav{
		max-width: 40%;
		font-size:20px;
	}
}

@media (max-width: 1200px) {
	.header-holder .section-nav{
		max-width: 30%;
	}
}

@media (max-width: 1024px) {
    .main-content {
        max-width: 980px;
    }   
    .header-holder{
        position: absolute;
        background-color: #ee6c39; /*#494848; Changed by Benson, HKIRC*/
        box-shadow: 0 4px 13px 0 rgba(0,0,0,.25);
    } 
    .header-content-holder{
        padding: 30px 2% /*5px 2% changed by Benson, HKIRC*/;
    }
    .header-holder .func-nav{
        top: 10px;
		right: 2%;
    }
    /*.header-holder .func-nav .btn-help, .header-holder .func-nav .btn-lang{
        display: none;
    }*/
    .header-holder .func-nav .btn-menu{
        display: inline-block;
    }    
    .header-holder .section-nav{
        display: none;
    }    
    .dnr-logo img{
        width: 80px;
    }
    .banner-holder{
        margin-top: 90px;
    }
    .banner-img-holder{
        min-width: 1024px;
        left: 50%;
        margin-left: -512px;    
    }
    .nivo-controlNav{
        bottom: 90px;
    }       
    /*///// search bar ////////////*/
    .home-search-conatiner{
        margin: 2% auto;
        height: 40px;
    }
    .theme-default .nivo-controlNav{
        max-width: 1024px;
    }
    .home-search-holder input {
        width: 90%;
        height: 40px;
    }
    .btn-home-search{
        position: absolute;
        height: 40px;
        right: 0;
        float: none;
    }
    .btn-home-search img{
        width: 30px;
        height: 30px;
    }
    /*/////end of search bar ////////////*/
    .read-more-holder{
        /*margin-top: -40px;*/
    }    
    .case-box .case-details{
        margin-left:5%;
    }
    .case-box .case-screen{
        width: 42%;
    }
    .case-box .case-screen img{ 
        max-width: 400px;
    }
    .case-box{
        margin-bottom: 5%;
    }
    .case-box .btn-learn-more{
        width: 40%;
    }
    /*///////// footer /////////////*/
    .footer .main-content{
        text-align: center;
        width: 90%;
        margin: 0 auto;
    }
    .footer .quicklink-tbl{
        width: 32%;
        margin: 2% auto 5% auto;
    }
    .footer-logo-conatiner{
        margin-top: 0;
    }
    .footer .quicklink-tbl{
        display: none;
    }
    /*///////////// mobile nav menu /////////////////////*/
    .subnav-selection li{
        width: 100%;
        padding: 0 0;
    }
    .subnav-selection .sub-menu-col{
        width: 100%;
        margin: 0 0%;
        display: none;
        border-bottom: 1px solid #fff;
    }
    .subnav-selection .sub-menu-col li{
        width: 96%;
        padding: 10px 2%;
    }
    .subnav-selection .sub-menu-col li a {
        padding: 10px 0;
    }  
    .subnav-selection li .section-title{
        width: 96%;
        margin: 0 0%;
        padding: 2% 2%;
        border-bottom: 1px solid #fff;
    }
    .menu-col >li > a{
        background-color: #e8e8e8;
    }
    .menu-col >li > a:hover, .menu-col >li > a.selected{
        background-color: #bbbbbb;
    }
    .icon-arrow{
        display: block;
    }
    .panel-site-search input.gsc-input {/*added by Benson, HKIRC*/
		width: 100%;
    	/*height: 20px;*/
	}
	.header-holder .func-nav{/*added by Benson, HKIRC*/
		max-width:80%;
	}
	.main-content-holder{/*added by Benson, HKIRC*/
		margin-top:115px;
	}
	.inner-page .main-content{/*added by Benson, HKIRC*/
		padding-top: 115px;
	}
	.press-release-banner > img{/*added by Wing, HKIRC*/
		width:100%;
	}
	.press-release-content > img{/*added by Wing, HKIRC*/
		width:100%;
	}
	.press-release-footer > img{/*added by Wing, HKIRC*/
		width:100%;
	}
}

@media (max-width: 980px) {
    .lang-selection{
        font-size: 1.3em;
    }       
    .main-content {
        max-width:780px;
    }
    .case-box .case-details .case-num{
        font-size: 1.2em;    
    }
    .case-box .case-details .case-url{
        font-size: 2.3em;    
    }
    .case-box .case-screen img{
        max-width: 320px;    
    }
	
}

@media (max-width: 830px) {
    .main-content {
        max-width:640px;
    }   
    .function-box.contact-box .box-contents{
        font-size: 1.2em;    
    } 
    .read-more-holder {
        /*margin-top: -40px;*/
    } 
    .home-search-holder {
        font-size: 3em;
    }
    .case-box .case-screen img{
        max-width: 300px;
    }
}

@media (max-width: 780px) {
    .case-box .case-details, .case-box .case-screen{
        width: 90%;
        margin: 2% 5%;
    }
    .case-box .case-details p{
        width: 100%;
    }
    .case-box .case-screen img{
        max-width: 700px;
        width: 100%;   
    }
    .subnav-selection li .section-title{
        padding: 3% 2%;    
    }
	.section-block-tbl {
    	width: 100%;
	}
	.inner-page .section-block-col .section-block-holder{
		width: 96%;
	}
	.section-block-tbl .spacer{
		display:none;
	}
	.price-block-col{
		position: relative;
		width: 94%;
		float:left;
		margin-left:3%;		
		margin-right:3%;
		min-height:43px;
	}
	.section-block-tbl .year-select{
		width: 94%;		
		margin: 5px auto;
		margin-left:3%;		
		margin-right:3%;
		display: block;
	}
	.section-block-tbl .url-txtfield{
		width: 94%;
		margin-left:3%;		
		margin-right:3%;
	}
	#btnRemoveCoupon{
	
	display:block;}
	
	.chkbox span{
	
	width:95%;
	}	
	
}
/*Special for search panel*/
@media (max-width: 680px) {
	#site-search-panel {
		display:none;
	}
}
@media (max-width: 640px) { 
    .home-search-conatiner{
        min-width: 0;  
        width: 80%;
    }
    .read-more-holder .main-content p{
        width: 90%;
        margin: 0 auto;
    }
    .read-more-holder .btn-read-more{
        /*margin: 5% auto;*/
		margin: 15px auto;
    }
    .lang-selection li{
        width: 100%;
    }
	.inner-page .section-block-col .section-block-holder{
		width: 96%;
	}
	.section-block-tbl .spacer{
		display:none;
	}
	.price-block-col{
		position: relative;
		width: 94%;
		float:left;
		margin-left:3%;		
		margin-right:3%;
		min-height:43px;
	}
	.pay-by{
		width: 100%;
		margin: 20px 0;
	}
	.checkout-col{
		text-align: right;
	}	
    /*///////////// mobile nav menu /////////////////////*/
    .subnav-selection li .section-title{
        padding: 4% 2%;     
    }
	/*/////////////// inner form //////////////*/
	.section-block-tbl .year-select{
		width: 94%;		
		margin: 5px auto;
		margin-left:3%;		
		margin-right:3%;
		display: block;
	}
	.section-block-tbl .url-txtfield{
		width: 94%;
		margin-left:3%;		
		margin-right:3%;
	}
	#btnRemoveCoupon{
	
	display:block;}
	
	.chkbox span{
	
	width:95%;
	}	
	
	.section-block-col .contact-form .left-col{
		width:88%;
		margin:3%;
		padding:2%;
		border:#ee6c39 solid 1px;
	}
	.section-block-col .contact-form .right-col{
		width:94%;
		margin:3%;
	}
	.section-block-col .contact-form .btn-copy {right:10px;}
	
	
	.multiColumns div { /*added by Benson, HKIRC*/
		display:block;
		padding: 0px;
	}
	.multiColumns div p { /*added by Benson, HKIRC*/
		padding: 5px 0px;
	}
	.twoColumnsItem { /*added by Benson, HKIRC*/
		width:auto;
	}
	.function-box {
        width: 512px;
        height: 317px;
    }
	
}


@media (max-width: 480px) {
    .header-holder .func-nav a.btn-login.btn-func-nav{
    	display:none;
    }
    .footer .quicklink-tbl{
        width: 42%;
        padding: 0 2%;
    }
	.inner-page .main-content{
		padding-top: 130px;/*115px; changed by Benson, HKIRC*/
	}
	.function-box {
        width: 448px;
        height: 238px;
    }
}

@media (max-width: 414px) {
    .header-holder .func-nav .btn-func-nav{
        width: 35px;
        height: 35px;   
        margin: 0 10px
    }
	.function-box {
        width: 384px;
        height: 192px;
    }
}

@media (max-width: 375px) {
    .case-box .btn-learn-more{
        width: 50%;
    }
    /*///////////// mobile nav menu /////////////////////*/
    .subnav-selection li .section-title{
        padding: 15px 2%;     
    }   
	.function-box {
        width: 320px;
        height: 198px;
    }	
}

@media (max-width: 320px) {
    body, .wrapper, .header-holder, .main-content{
        width: 320px;
    }
    .subnav-selection li .section-title{
        padding: 20px 2%;    
    }
    .icon-arrow{
        top: 20px;
    }
		
}

/* Default 3 Years Enhancement UI - Added by James Chan 27/11/2023 */
@media (min-width: 480px) {
    .rnw_padding{
        position: relative;
        top: -14px;
        padding-right: 4px;
    }
}