.mb-5 {margin-bottom:5px}
.mb-15 {margin-bottom:15px}
.mb-30 {margin-bottom:30px}
.pd-15 {padding:15px}
.w100 {width:100%}
.w100px {width:100px}
.w200px {width:200px}
.w100-100px{width:calc(100% - 100px) !important}
.w100-220px{width:calc(100% - 220px) !important}
.form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #c0c0bc;
	opacity: 1; /* Firefox */
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #c0c0bc;
}
::-ms-input-placeholder { /* Microsoft Edge */
	color: #c0c0bc;
}
a {color:#C79655;}
a:hover, a.active {color:#C79655;}

.popover-body {
	font-family: Helvetica, "Microsoft YaHei", 微軟雅黑體, "Microsoft Jhenghei", 微軟正黑體, sans-serif, "Hiragino Sans GB", "WenQuanYi Micro Hei", Simhei;
	font-size:14px;
	color: #4b4b3c;
	box-shadow: 1px 1px 10px rgba(0,0,0,0.8);
	border-radius:5px;
	background-image:linear-gradient(150deg, #fefefa, #f3f3ef, #fefefa);
}
html,body {
	font-family: Helvetica, "Microsoft YaHei", 微軟雅黑體, "Microsoft Jhenghei", 微軟正黑體, sans-serif, "Hiragino Sans GB", "WenQuanYi Micro Hei", Simhei;
	font-size:16px;
	color: #4b4b3c;
}
h1 {
	font-size:28px;
	color:#C79655;
	padding:10px 35px;
	background-image:url(/img/vote/2023/award_deco.png);
	background-size:180px;
	background-position: center center;
	background-repeat:no-repeat;
}
h2 {
	font-size:18px;
	/* color:#C79655; */
	color:#000000;
}
header {
	position:relative;
	left:-15px;
	width:calc(100% + 30px);
	top: -25px;
	/* padding:30px; */
	/* border-bottom: 5px solid #C79655;
	background-color:#0B3052;
	background-image:url(/img/vote/2023/bkg_01.jpg);
	background-size:cover;
	background-position:center center; */
}
header h2 {
	color:#f2f2f2;
	margin:0 5px;
	text-shadow: 2px 2px 5px rgba(0,0,0,1);
}
div.logo-wrapper{
	background-image:url(/img/vote/2023/band_2025.png?v=20241104);
	background-size:contain;
    background-repeat: no-repeat;
    background-position: center;
	margin-right:auto;
	margin-left:auto;
	width:100%;
	padding:30%;
}
.company-logo-wrapper {
	margin:0 auto;
	width:100%;
}

h2:before,
h2:after {
	content: " ____ ";
	position:relative;
	top:-8px;
}
h3 {
	color:#C79655;
	font-size:18px;
}
header p {
	font-size:14px;
	color:#f2f2f2;
	text-shadow: 2px 2px 5px rgba(0,0,0,1);
}
footer {
	position:relative;
	left:-15px;
	width:calc(100% + 30px);
	padding:30px;
	background-color:#000066;
	background-image:url(/img/award/2025/buttom.jpg);
	background-size:cover;
	background-position:center center;
}
footer h2 {
	color:#f2f2f2;
	margin:0 5px;
	text-shadow: 2px 2px 5px rgba(0,0,0,1);
}
footer h2:before,
footer h2:after {
	content:" ____ ";
	position:relative;
	top:-8px;
}
footer p {
	font-size:14px;
	color:#f2f2f2;
	text-shadow: 2px 2px 5px rgba(0,0,0,1);
}
footer a {color:#f2f2f2}
footer a:hover, footer a:active {color:#fcfcfc}
fieldset {
	margin:0 auto;
	border:3px solid #C79655;
	border-radius:15px;
	padding:15px 0;
}
fieldset > legend {
	width:unset;
	font-size:16px;
	padding:0 15px;
}
fieldset > p {
	padding:0 15px;
}
section {
	margin-top:30px;
	
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

}
span.label-c1 {
	display:block;
}
span.label-c2 {
	display:block;
	margin-top:15px;
}
.mandatory:after {
	content:"*";
	color:#aa0000;
	margin-left:5px;
}
button.btn-cat {
	background-color:#0B3052;
	color:#f2f2f2;
	letter-spacing: 1px;
	margin:5px;
	width:100%;
	padding-top:15px;
	padding-bottom:15px;
	border:3px solid #a6a6a0;
	border-radius:10px;
	box-shadow:0 0 5px 0 rgba(0,0,0,0.5);
}
button.btn-cat:hover,button.btn-cat:active {
	background-color:#0F416F;
}
button.btn-cat>img {
	height:24px;
	float:right;
}
button.btn-submit {
	background-color:unset;
	color:#C79655;
	border:3px solid #C79655;
	border-radius:10px;
	padding:10px 75px;
}
button.btn-sm {
	background-color:unset;
	color:#C79655;
	border-top:0;
	border:0;
	border-radius:0;
}

button.btn-submit:hover,button.btn-submit:active,
button.btn-sm:hover,button.btn-sm:active {
	color:#C79655;
	border-color:#C79655;
}

button.btn-circle {
	margin:15px;
	background-color:unset;
	color:#a6a6a0;
	border:0;
}
button.btn-circle>i.fa {
	display:block;
	font-size:52px;
	width:96px;
	height:96px;
	line-height:86px;
	text-align:center;
	border-radius:50%;
	border:5px solid #a6a6a0;
}
button.btn-circle:hover,button.btn-circle:active {
	color:#C79655;
}
button.btn-circle:hover>i.fa,button.btn-circle:active>i.fa {
	border-color:#C79655;
}

#cat_description_wrapper {
	min-height:110px;
	display:none;
}
.form-group.has-error input, .form-group.has-error textarea , .form-group.has-error select {border-color:#aa0000} 
div.flow-box{
	background-image:linear-gradient(150deg, #4D8EB6, #18598F, #187EB6);
	color:#f2f2f2;
	width:75%;
	min-height:unset;
	padding:15px 0;
	margin-right:auto;
	margin-bottom:10px;
	margin-left:auto;
	border:3px solid #a6a6a0;
	border-radius:10px;
	box-shadow:0 0 5px 0 rgba(0,0,0,0.5);
	display:block;
}
i.flow-arrow {
	color:#a6a6a0;
	font-size:28px;
	position:relative;
	top:-5px;
	margin:0 5px 0 10px;
}
.fa-angle-right {display:none !important}
.fa-angle-down {display:block !important}
div.b-box {
	border-top:1px dashed #C79655;
	border-bottom:1px dashed #C79655;
	padding:15px 0;
	margin:0 auto;
	color:#C79655;
	font-size:18px;
}
.img_qrcode {
	width:180px;
	height:180px;
}
div.input-group button.btn-search {
	background:unset;
	border:1px solid #ced4da;
	color:#4b4b3c;
}
div.vote-item-wrapper {
	border-top:0px solid #c6c6c6;
	border-right:4px solid #c6c6c6;
	border-bottom:1px solid #e6e6e6;
	border-left:4px solid #c6c6c6;
	box-shadow:3px 3px 15px rgba(0,0,0,0.5);
	padding:10px;
	background: rgb(11,48,82);
	background: linear-gradient(135deg, rgba(11,48,82,1) 45%, rgba(25,80,114,1) 45%, rgba(11,48,82,1) 95%);
}
#vote_item_container div:first-child>div.vote-item-wrapper {
	border-top:4px solid #c6c6c6;
}
#vote_item_container div:last-child>div.vote-item-wrapper {
	border-bottom:4px solid #c6c6c6;
}
div.vote-item-wrapper > div.rank {
	font-size:56px;
	font-weight:800;
	font-style:italic;
	color:#0d5d8b;
	line-height:1.2em;
}
div.vote-item-wrapper button {
	background:unset;
	color:#f2f2f2;
	border:none;
	padding:0 10px;
	/*height:65px;*/
	font-size:14px;
	transition:color 0.3s;
	-webkit-transition:color 0.3s;
	-moz-transition:color 0.3s;
	-o-transition:color 0.3s;
}
div.vote-item-wrapper button:hover, div.vote-item-wrapper button:active {
	color:#C69C6D;
}
div.vote-item-wrapper button>i.fa {
	font-size:28px;
}
div.vote-item-wrapper div.vote-item {
	padding:5px 0;
}
div.vote-item-wrapper > div.vote-item > span.vote-item-name a {
	display:block;
	font-size:18px;
	color:#f2f2f2;
	margin:0 125px 0 75px;
	transition:color 0.5s;
	-webkit-transition:color 0.5s;
	-moz-transition:color 0.5s;
	-o-transition:color 0.5s;
}
div.vote-item-wrapper > div.vote-item > span.vote-item-seccode a {
	display:block;
	font-size:14px;
	color:#f2f2f2;
	margin:0 125px 0 75px;
	transition:color 1s;
	-webkit-transition:color 1s;
	-moz-transition:color 1s;
	-o-transition:color 1s;
}
.vote-btn-info {
	text-align:right;
	color: #f2f2f2;
	font-size: 12px;
	letter-spacing:1px;
	position: relative;
	top: -7px;
	right:10px;
}
.vote-info {
	color: #dc2a2a;
	font-size:2em;
	margin:0 5px;
}
blockquote.blockquote {
	font-size:inherit;
	border-top:1px solid #4b4b3c;
	border-bottom:1px solid #4b4b3c;
	padding:15px;
	margin:15px auto;
	max-width:920px;
}
.sign-text-wrapper {
	border: 2px solid #c79655;
    border-radius: 15px;
    padding: 15px;
    max-width: 500px;
    margin: auto;
}
.sign-icon {
	font-size: 52px;
    margin: 15px;
    color: #c79655;
}
div.vote-item-wrapper:hover > div.vote-item > span.vote-item-name a,
div.vote-item-wrapper:hover > div.vote-item > span.vote-item-seccode a {
	color:#C69C6D;
	text-decoration:none;
}

.candidate-wrapper {
	max-width:500px;
	margin-right:auto;
	margin-bottom:45px;
	margin-left:auto;
}
div.candidate-item {
	padding:5px;
	font-size:24px;
	border:3px solid #C79655;
	border-radius:15px;
}
.modal-body .modal-sns {
	font-size:36px;
	width:48px;
	height:48px;
	line-height:48px;
	margin:15px;
	color:rgb(25,80,114);
	background-color:#f2f2f2;
	border-radius:8px;
}
#hktop100rcorgmodal .modal-body {
	border:5px solid #d0d0d0;
	background: rgb(11,48,82);
	background: linear-gradient(0deg, rgba(25,80,114,1) 0%, rgba(11,48,82,1) 95%);
	color:#f2f2f2;
}
#hktop100rcorgmodal .modal-body i.fa {
	margin:15px;
	font-size: 48px;
    border: 5px solid #f2f2f2;
    border-radius: 50%;
    width: 105px;
    height: 105px;
	line-height: 95px;
}
.p1{
	padding: 20px 60px;
}
label p{
	font-size: 10px;
	margin-bottom: 0px;
}
@media only screen and (min-width:360px) {
	h2:before, h2:after,
	footer h2:before, footer h2:after {
		content: " ________ ";
		position:relative;
		top:-8px;	
	}
}

@media only screen and (max-width:479px) {
	fieldset {
		padding:15px;
	}
	button.btn-cat > img {
		margin-right:5px;
	}
	.p1{padding: 10px;}
	h2:before, h2:after,
	footer h2:before, footer h2:after {
		content: " __ ";
		position:relative;
		top:-8px;	
	}
}
@media only screen and (min-width:480px) {
	button.btn-cat {
		width:45%;
	}
}
@media only screen and (min-width:768px) {
	div.container {
		border-left:0 solid #f2f2f2;
		border-right:0 solid #f2f2f2;
		box-shadow:0 0 10px 0 rgba(0,0,0,0.2);
	}
	div.logo-wrapper{
		/* width:650px;
		padding:195px; */
	}
	.company-logo-wrapper {
		width:640px;
	}

	fieldset.w500px {
		width:500px;
	}
	/* section p {
		padding-left:15%;
		padding-right:15%;
	} */
	div.b-box {
		width:75%;
	}

}
@media only screen and (min-width:992px) {
	.company-logo-wrapper {
		width:800px;
	}
	span.label-c1 {
		display:inline;
	}
	span.label-c2 {
		display:inline;
		margin-top:0;
		margin-left:45px;
	}
	div.flow-box{
		/*min-height:110px;*/
		display:inline-block;
		width:200px;
	}
	.fa-angle-right {display:inline !important}
	.fa-angle-down {display:none !important}
	
	fieldset.w920px {
		width:920px;
	}

	#vote_item_container div:nth-child(2) >div.vote-item-wrapper {
		border-top:4px solid #c6c6c6;
	}
	#vote_item_container div:nth-last-child(2) >div.vote-item-wrapper {
		border-bottom:4px solid #c6c6c6;
	}

}