.pdt10{padding-top: 10px;}
.pdb10{padding-bottom: 10px;}
.pdt15{padding-top: 15px;}
.pdb15{padding-bottom: 15px;}
.pdt20{padding-top: 20px;}
.pdb20{padding-bottom: 20px;}
.pdt30{padding-top:30px;}
.pdb30{padding-bottom:30px;}

.pdl10{padding-left: 10px;}
.pdr10{padding-right: 10px;}
.pdl20{padding-left: 20px;}
.pdr20{padding-right: 20px;}
.pdl30{padding-left:30px;}
.pdr30{padding-right:30px;}

.mgt10{margin-top: 10px;}
.mgb10{margin-bottom: 10px;}
.mgt20{margin-top: 20px;}
.mgb20{margin-bottom: 20px;}
.mgt30{margin-top: 30px;}
.mgb30{margin-bottom: 30px;}
.mgt60{margin-top: 60px;}
.mgb60{margin-bottom: 60px;}

.marginLR{margin-left: 10px;	margin-right: 10px;}

.marginTB2{margin-top: 2px;	margin-bottom: 2px;}
.marginTB5{margin-top: 5px;	margin-bottom: 5px;}
.marginTB10{margin-top: 10px;	margin-bottom: 10px;}
.marginTB20{margin-top: 20px;	margin-bottom: 20px;}
.marginTB30{margin-top: 30px;	margin-bottom: 30px;}
.marginTB50{margin-top: 50px;	margin-bottom: 50px;}
.marginTB60{margin-top: 60px;	margin-bottom: 60px;}


a:link.noline {
	color: #008BDC;
	text-decoration: none;
}
a:visited.noline {
	color: #008BDC;
	text-decoration: none;
}
a:hover.noline {
	color: #DC6800;
	text-decoration: none;
	position:relative;
	top:2px;
	left:2px;
}
a:active.noline {
	color: #DC6800;
	text-decoration: none;
}

.sfont{
	font-size: 12px;
}

.bfont{
	font-weight: bold;
}

.greenfont{
	color: #5aa37c;
}

.redfont{
	color: red;
}


body{
	font-family: "微軟正黑體", "蘋果儷中黑", "Lucida Grande", "Arial", "Arial Narrow";
}

label {
	vertical-align: middle;
}


.veryTop_2StepVer{
	background-color: #f3f3f3;
	padding-right: 0px !important;
	padding-left: 0px !important;
	border-bottom: solid 2px #e6e6e6;
}

.titleArea_2StepVer{
	font-size: 18px;
	font-weight: 500;
	padding-top: 20px;
	padding-bottom: 20px;
}

.userameArea_2StepVer{
	text-align: right;
	padding-top: 30px;
	padding-bottom: 10px;
}


.loginField_2StepVer{
	padding-top: 20px;
	padding-bottom: 20px;
	margin-top: 60px;
	margin-bottom: 40px; 
}

.loginForm_2StepVer .form-group{
	margin-bottom: 30px; 
}


.loginForm_2StepVer .input-group-addon{
	border: 0px;
	padding-left: 15px;
	padding-right: 15px;
	background-color: #e8e8e8;
}

.loginSubmit{
	margin-top: 60px;
	margin-bottom: 0px !important;
}

#clean{
    color: #000;
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #eaeaea;
}
#clean:hover{
	background-color: #d2d2d2;
}


.btnLogout{
	padding-top: 2px !important;
	padding-bottom: 2px !important;
	padding-left: 5px !important;
	padding-right: 5px !important;
}

.btnDownload{
	margin-bottom: 10px;
}

.btnPrint{
	margin-bottom: 10px;
}

.btnCombine{
	margin-bottom: 10px;
}

.btnClean{
	margin-bottom: 10px;
}

.btnManage{
	background-color: #f0ad4e;
	color: #fff;
}

.btnCancel{
	padding-left: 30px;
	padding-right: 30px;
}

.btnSubmit{
	padding-left: 30px;
	padding-right: 30px;
}

.btnNewCC{
	padding-left: 15px;
	padding-right: 15px;
}

.btnDelete{
	font-size: 11px;
	padding: 2px 5px !important;

}

.buttonArea{
	margin-top: 10px;
	margin-bottom: 30px;
}

.checkboxArea{
	margin-top: 15px;
}

.btnAddArea{
	margin-top: 20px;
	margin-bottom: 30px;
}

.imgMenuArea_2StepVer{
	padding: 10px 10px 10px 10px;
	margin-top: 20px;
}

.imgMenuPage_2StepVer{
	margin-top: 120px;
	margin-bottom: 60px;
}


#GenerateKey{
	text-align: center;
}
#GenerateKey img{
	height: 60px;
	margin-right: 10px;
	margin-bottom: 5px;
	vertical-align: middle;
}
#GenerateKey button{
	font-size: 1.1em;
	text-align: center;
}

#ResetKey{
	text-align: center;
}
#ResetKey img{
	height: 60px;
	margin-right: 10px;
	margin-bottom: 5px;
	vertical-align: middle;
}
#ResetKey button{
	font-size: 1.1em;
	text-align: center; 
}

#generateConfirm img{
	height: 50px;
	margin-right: 10px;
	vertical-align: middle;
}



a:link.twoStepVer, a:visited.twoStepVer {
	color: #337ab7;
	font-weight: normal;
	text-decoration: none;
	font-size: 18px;
}

a:hover.twoStepVer {
	color: #337ab7;
	text-decoration: underline;
}

.result{
	font-size: 16px;
	margin-bottom: 30px;
}

.doneIconSamll{
	height: 50px;
}

.doneIconLarge{
	height: 85px;
}

.attentionIconLarge{
	height: 70px;
}

.status{
	margin-top: 10px;
}

.confirm{
	font-size: 24px;
	margin-bottom: 50px;
}

.imgQRcode img{
	height: 250px;
}

.redBlock{
	display: inline-block;
	background-color: #d9534f;
	border-radius: 4px;
	color: #fff;
	font-size: 12px;
	padding: 3px 6px;
	margin: 0 3px;
}

.blueBlock{
	display: inline-block;
	background-color: #337ab7;
	border-radius: 4px;
	color: #fff;
	font-size: 12px;
	padding: 3px 6px;
	margin: 0 3px;
}

.nopaddingR{
	padding-right: 0px !important;
}

.text-red{
	color: #ff4949;
}

.alignC{
	text-align: center;
}

.alignR{
	text-align: right;
}

/* breadcrumb
*---------------------*/
.breadcrumb_2StepVer{
	background-color: #fff !important;
	padding-left: 0px !important;
	padding-right: 0px !important;
	margin-bottom: 40px !important; 
}






/******************************************************以下是適應性*****************************************************/

/************************* = 適應性 直式螢幕  orientation: Portrait = ************************/

/* +width:768 ↓  直式螢幕Portrait
*----------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
	.loginField_2StepVer{
		padding-top: 20px;
		padding-bottom: 20px;
		margin-top: 30px;
		margin-bottom: 20px; 
	}

	.imgMenuPage_2StepVer{
		margin-top: 40px;
		margin-bottom: 30px;
	}
}

/* +width:375 ↓  直式螢幕Portrait
*----------------------------------------------------------------------------*/
@media screen and (max-width: 375px) {

	.loginField_2StepVer{
		padding-top: 20px;
		padding-bottom: 20px;
		margin-top: 30px;
		margin-bottom: 20px; 
	}

	.imgMenuPage_2StepVer{
		margin-top: 40px;
		margin-bottom: 30px;
	}



}


/* +width:320 ↓  直式螢幕Portrait
*----------------------------------------------------------------------------*/
@media screen and (max-width: 320px) {

	.loginField_2StepVer{
		padding-top: 20px;
		padding-bottom: 20px;
		margin-top: 30px;
		margin-bottom: 20px; 
	}

	.imgMenuPage_2StepVer{
		margin-top: 40px;
		margin-bottom: 30px;
	}



}