﻿/*==========================================*/
/*			   	General Style 				*/
/*==========================================*/

	/*========== Global CSS ==========*/
	.form-inline.filter-container [class^='col-'] {
	    /*white-space: nowrap;*/
	}

	.btns-container {
	  text-align: right;
	}

	.custom-date-picker .form-control {
	  background: #fff;
	}

	.custom-date-picker .input-group-addon{
	  width:40px !important;
	}

	.filter-container {
	  margin-bottom: 20px;
	}
		.filter-container .row {
		  margin-bottom: 15px;
		}
		
	.btn-group.input-group, .form-inline .input-group {
	  	width: calc(-125px + 100%) !important;
		white-space: normal;
		display: inline-flex;
	}

		/*---------- Page CSS ----------*/

		/*statements*/
		.statements .form-section-header .btns-container{
		  display: inline-block;
		  float: right;
		  margin-top: -10px;
		}

		.statements .filter-container label {
		  width: 120px;
		}

		.statements #monthly-statement, .statements #daily-statement {
			background: #003664;
			border-color: #003664;
			font-size: 16px;
		}
			/*ae*/
			.statements.ae .contentwrapper{
				overflow: initial;
			}
				/*statements-daily-ae*/
				.statements.ae.daily .input-group-btn{
					width:40px !important;
				}
							
				/*statements-monthly-ae*/
				.statements.ae.monthly .input-group-btn{
					width:37px !important;
				}

				.statements.ae.monthly .text-center {
					color: #333;
					text-align:center;
				}
				
			/*statements-daily*/

			/*statements-monthly*/

		/*records*/
		.records .filter-container label {
			width: 120px;
		}

			/*ae*/
			
				/*deposit-records-ae*/
				
				/*withdrawal-records-ae*/
				
				/*ipo-search-ae*/
			
			/*deposit-records*/

			/*withdrawal-records*/

			/*ipo-search*/

		/*research-report*/
		.research .filter-container label {
			min-width: 80px;
		}

		.research input.input-search-keyword {
			font-weight: initial;
			/*
			font-size: 1rem;
			line-height: 1.7rem;
			*/
			padding: 0.3rem 0.8rem;
			height: 34px;
			color: #555;
			background-color: #fff;
			background-image: none;
			border: 1px solid #ccc;
			border-radius: 4px;
		}

		.research .btn-group.input-group, 
		.research #search-text {
			width: calc(-87px + 100%) !important;
		}
		
		/* ~~ Master ~~ */
		/*.guest*/
			/*.securities*/
			.guest.securities .filter-container label {
				min-width: 85px;
			}
				/*.hk*/
					/*.margin-ratio*/
				/*.cn*/
					/*.cnstock*/
				/*.us*/
					/*.usstock*/
					
			/*.futures*/
				/*.product*/
				.guest.futures.product .keysearch-label{
					padding-right: 0px !important;
				}
				
				.guest.futures.product .three-columns .select-style button.btn.dropdown-toggle.btn-default {
					height: 34px;
				}
				
				.guest.futures.product .selectpicker-container {
					display: inline-block;
					float: none;
					padding-left: 0px;
					padding-right: 0px;
				}
				
				.guest.futures.product .product_filter_wrapper .select-style .selecttitle {
					min-width: 90px;
				}
				
				.guest.futures.product .product_filter_wrapper .button-style {
					text-align: center;
					padding-top: 15px;
				}
				
				.guest.futures.product .product_filter_wrapper .button-style input.input-search-keyword {
					font-weight: initial;
					font-size: 1rem;
					line-height: 1.7rem;
					padding: 0.3rem 0.8rem;
					height: 34px;
					width: calc(100% - 110px);
					color: #555;
					background-color: #fff;
					background-image: none;
					border: 1px solid #ccc;
				}
				
				.guest.futures.product div.btns-container button.resetbutton {
					margin-right: 15px;
					background: #777;
					border-color: #777;
				}
				
				/*.calendar*/
				.guest.futures.calendar .input-col, 
				.guest.futures.calendar .button-col {
					display: table-cell;
					vertical-align: top;
				}

				.guest.futures.calendar .button-col {
					width: 80px;
					text-align: right;
				}
				
				.guest.futures.calendar .product-filter-table {
					display: table;
					width: 100%;
					table-layout: fixed;
				}

				.guest.futures.calendar div.btns-container button.resetbutton {
					margin-right: 0px;
				}
				
			/*.market*/
			.guest.market .filter-container label {
				min-width: 80px;
			}

			.guest.market input.input-search-keyword {
				font-weight: initial;
				font-size: 1rem;
				line-height: 1.7rem;
				padding: 0.3rem 0.8rem;
				height: 34px;
				color: #555;
				background-color: #fff;
				background-image: none;
				border: 1px solid #ccc;
				border-radius: 4px;
			}

			.guest.market .btn-group.input-group {
				width: calc(-86px + 100%) !important;
			}

			.guest.market .page-title.news-style-title {
				width: 100%;
				line-height: 45px;
				color: #ff5f1b;
				font-size: 30px;
				margin-bottom: 0px;
			}
				/*.research-report*/
				.guest.market.research #search-text			{
					width: calc(-86px + 100%) !important;
				}
		/* ~~ End Master ~~ */
		

/*==========================================*/
/*			   Responsive Style 			*/
/*==========================================*/
@media only screen and (max-width: 1022px) {

	.main-container.guest.securities .keysearch-input {
		width: 100% !important;
	}
	
}

@media only screen and (max-width: 991px) {

	/*============ Global CSS ============*/

	/*research-report*/
	.main-container.research .input-container {
		margin-top: 10px;
	}

		/*---------- Page CSS ----------*/
		
		/* ~~ Master ~~ */
		/*.guest*/
			/*.securities*/
			.main-container.guest.securities .input-container{
				margin-top:10px;
			}
				/*.hk*/
					/*.margin-ratio*/
					
				/*.cn*/
					/*.cnstock*/
				/*.us*/
					/*.usstock*/
					
			/*.futures*/
				/*.product*/
				/*.calendar*/
				
			/*.market*/
			.main-container.guest.market .input-container{
				margin-top:10px;
			}
				/*.research-report*/
		
		/* ~~ End Master ~~ */
}

@media only screen and (max-width: 767px) {

	/*============ Global CSS ============*/

	.main-container .filter-container label {
		display: block;
	}

	.main-container .filter-container .row {
		margin-bottom: 0px;
	}

	.main-container .filter-container .input-group{
		margin-bottom: 10px !important;
		width: 100% !important;
	}

		/*---------- Page CSS ----------*/

		/*statements*/
		.main-container.statements #table_statement th:nth-child(3), .main-container.statements #table_statement td:nth-child(3) {
			display: none !important;
		}

		/*research-report*/
		.main-container.research .input-container {
			margin-top: 0px;
		}

		.main-container.research .filter-container .row {
			overflow: visible;
		}

		.main-container.research #search-text {
			margin-bottom: 10px !important;
			width: 100% !important;
		}
		
		/* ~~ Master ~~ */
		/*.guest*/
			/*.securities*/
			.main-container.guest.securities .input-container{
				margin-top:0px;
			}
				/*.hk*/
					/*.margin-ratio*/
				/*.cn*/
					/*.cnstock*/
					.main-container.guest.securities.cn.cnstock .filter-container label.type-inline {
						display: inline-block;
					}
				/*.us*/
					/*.usstock*/
					
			/*.futures*/
				/*.product*/
				.main-container.guest.futures.product .product_filter_wrapper .button-style input.input-search-keyword {
					width: 100%;
				}
				
				.main-container.guest.futures.product .product_filter_wrapper .select-style .col-form-label {
					text-align: left;
				}
				
				.main-container.guest.futures.product #btnfilter {
					margin-top: 0px;
				}
				
				.main-container.guest.futures.product .button-style {
					text-align: center !important;
				}
				
				.main-container.guest.futures.product .selecttitle {
					padding-top: 0;
					padding-bottom: 0;
					float: left;
				}
				
				.main-container.guest.futures.product .selectpicker-container {
					padding-bottom: 10px;
				}
				
				.main-container.guest.futures.product .product_filter_wrapper .button-style {
					padding-top: 0;
				}
				
				.main-container.guest.futures.product .input-container {
					padding-bottom: 10px;
				}
				/*.calendar*/
				
				
			/*.market*/
			.main-container.guest.market .input-container{
				margin-top:0px;
			}

			.main-container.guest.market .filter-container .row {
				overflow: visible;
			}
			
			.main-container.guest.market .btn-group.input-group,
			.main-container.guest.market #search-text{
				width: 100% !important;
			}
				/*.research-report*/
				
		/* ~~ End Master ~~ */
}

@media (min-width: 768px) {

	/*============ Global CSS ============*/

		/*---------- Page CSS ----------*/
		
		/*records*/
		
			/*ae*/
			.main-container.records.ae .form-inline .input-group .input-group-btn {
				width: 1%;
			}
				/*deposit-records-ae*/
				
				/*withdrawal-records-ae*/
				
				/*ipo-search-ae*/
				
			/*deposit-records*/
			
			/*withdrawal-records*/
			
			/*ipo-search*/

		/* ~~ Master ~~ */
		/*.guest*/
			/*.securities*/
			
				/*.hk*/
					/*.margin-ratio*/
				/*.cn*/
					/*.cnstock*/
				/*.us*/
					/*.usstock*/
					
			/*.futures*/
				/*.product*/
				.main-container.guest.futures.product .product_filter_wrapper {
					margin-bottom: 40px;
				}
				
				.main-container.guest.futures.product .ddl_product_name_container {
					text-align: left;
					padding-right: 0px;
				}
				
				.main-container.guest.futures.product .ddl_product_type_container {
					text-align: center;
					padding-left: 0;
					padding-right: 0;
				}
				
				.main-container.guest.futures.product .ddl_product_type_lbl {
					margin-left: 18px;
				}
				
				.main-container.guest.futures.product .ddl_market_container {
					text-align: right;
					padding-left: 0;
				}
				
				.main-container.guest.futures.product .input-container {
					left: 0;
					text-align: left;
					height: 34px;
					width: calc(100% - 180px);
					display: inline;
					padding-bottom: 10px;
				}
				
				.main-container.guest.futures.product .two-columns.btns-container {
					text-align: right;
					display: inline;
					width: auto;
					padding-top: 4px;
				}
				/*.calendar*/
				
			/*.market*/
				/*.research-report*/			
		/* ~~ End Master ~~ */
}

@media only screen and (min-width: 1023px) {

	/*============ Global CSS ============*/

		/*---------- Page CSS ----------*/	
		/*.guest*/
			/*.securities*/	
			.main-container.guest.securities .input-container {
				padding-bottom: 5px;
			}

			.main-container.guest.securities .keysearch-input {
				width: calc(100% - 91px) !important;
			}

}
