@font-face {
	font-family: 'GenRyuMin2TW'; /* 自定義字體名稱 */
	src: url('../../fonts/genkimin/GenRyuMinTW-R.woff2') format('woff2'); /* 指向字體文件位置 */
	font-weight: normal; /* 字體粗細 */
	font-style: normal; /* 字體樣式 */
} 
@font-face {
	font-family: 'fb'; 
	src: url('../../fonts/genkimin/17.woff2') format('woff2');
	font-weight: normal; 
	font-style: normal; 
} 

h1,h2,h3{
	font-family: 'GenRyuMin2TW', sans-serif !important;
}
.message{
    font-family: 'GenRyuMin2TW', sans-serif;
    font-size: 20px;
    line-height: 2.4;
    margin-top: 20px;
    margin-bottom: 0px;
}
body{
	background: #EBF0F5;
	text-align: center;
	font-family: 'fb', sans-serif;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	overflow: auto;
	color: #816c5c;
	background-image: url(../../form/img/da/bg.jpg);
	font-weight: 400;
}
.input-group-append {
	margin-left: -1px !important;
	position: absolute !important;
	right: 0px !important;
	top: 1px !important;
}
.input-group-append a{
	border-radius: 20px !important;
	background: linear-gradient(89deg, #a5a7a678, #ffffff78) !important;
	color: #7f6d5f !important;
	font-size: 20px !important;
	border-color: #7f6d5f75 !important;
}
div.db-show{
	border-radius: 15px !important;
	border-width: 0px !important;
	padding: 15px !important;
}
div.db-show h5{
	font-size: 18px !important;
}
div.db-show .navbar{
	padding: 0px;
	
}
.font-weight-bold{
	font-weight: 100 !important;
}
.btn-group-sm>.btn, .btn-sm {
	border-color: #c7a68d !important;
	color: #816c5c !important;
}
div.db-show .navbar.bg-dark{
	background-color: #d4c6bd !important;
}
div.db-show .navbar .dbCloser {
	border-color: #ffffff !important;
	color: #fff !important;
	padding: 0px;
	position: absolute;
	right: 0px;
	border-width: 0px;
}
div.db-show .navbar:before{
	text-align: center;
	color: #fff;
	font-weight: 100;
	display: block;
	width: 100%; 
}
option{
	color: #826c5c;
	font-size: 20px;
}
.btn-outline-primary.focus, .btn-outline-primary:focus{
	box-shadow: 0 0 0 .2rem rgb(212 198 189) !important;
}
.mr-2, .mx-2 {
	padding: 0px !important;
	border-width: 0px !important;
	background-color: #f2e8dc !important;
	color: #fff !important;
	border-radius: 30px !important;
	width: 20px !important;
	height: 20px !important;
	margin-right: .5rem !important;
}
.btn-info.disabled, .btn-info:disabled, .btn-success.disabled, .btn-success:disabled{
	color: #bc9e87 !important;
	background-color: #d8c2a5 !important;
	border-color: #c7a68d !important;
}
.mr-2, .mx-2>span{
	margin-top: -1px !important;
	display: block;
	margin-left: -1px !important;
}
.btn-success.focus, .btn-success:focus{
	box-shadow: 0 0 0 .2rem rgb(212 198 189) !important;
}
.input-group-append svg{
	margin: 1px !important;
	zoom: 1.9 !important;
}
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
	color: #bc9e87 !important;
	background-color: #d8c2a5 !important;
	border-color: #c7a68d !important;
}
.btn-success, .btn-outline-primary:hover{
	background-color: #ffcd76 !important;
	border-color: #d4c6bd !important;
	color: #fff !important;
}
.btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, .show>.btn-success.dropdown-toggle{
	background-color: #d3b176 !important;
}
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled{
	background-color: #cfc8c3 !important;
	border-color: #a5a5a5 !important;
	color: #a5a5a5 !important;
}
.btn-info {
	color: #7e6a5a !important;
	background-color: #e4d5c27d !important;
	border-color: #d4c6bd !important;
}
.btn-info:hover {
	color: #7e6a5a !important;
	background-color: #e4d5c27d !important;
	border-color: #d4c6bd !important;
}

.form-control {
	display: block !important;
	width: 100% !important;
	padding: 6px 20px !important;
	font-size: 18px !important;
	line-height: 1.5 !important;
	color: #826c5c !important;
	background: linear-gradient(89deg, #a5a7a678, #ffffff78) !important;
	background-clip: padding-box !important;
	border: 1px solid #816c5ca8 !important;
	border-radius: 20px !important;
	outline: none;
	transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !important;
	letter-spacing: 1px;
	font-weight: 100;
}
.form-control:focus {
	background: linear-gradient(89deg, #a5a7a678, #ffffff78) !important;
}
.btn-appointment[type="submit"]{
	padding: 7px 50px 7px 50px !important;
}
[type="submit"]{
	padding: 5px 0px 5px 0px;
	margin-bottom: 15px;
	background-color: #f0e9e278 !important;
	border-radius: 20px;
	border-width: 0px;
	color: #816c5c !important;
	font-size: 22px;
}
[type="submit"]:hover{
	background-color: #f0e9e2a8;
	color: #816c5c !important;
}
[type="submit"]:active{
	background-color: #f0e9e27d;
	color: #816c5c !important;
}
[readonly="readonly"]{
	background: linear-gradient(89deg, #a5a7a678, #ffffff78);
}
form{
	max-width: 780px;
	width: 98%;
	display: inline-block;
	text-align: left;
	padding: 35px 30px;
	margin: 5px;
	border-radius: 50px;
	background: linear-gradient(89deg, #a5a7a678, #ffffff78);
	font-weight: 100;
	font-size: 18px;
}
form.part-2{
	max-width: 680px !important;
}
button[type="submit"]{
	width: 100%;
	margin-top: 20px;
}
.add{
	margin-bottom:4px;
}
h2{
	font-size: 43px;
	font-weight: 100;
	padding-bottom: 40px;
	background-image: url(../../form/img/da/logo.png?);
	background-position: right top;
	background-size: 42% auto;
	background-repeat: no-repeat;
}
.date{
	height: 40px;
}
h2.part-2{
	font-size: 33px;
    font-weight: 100;
    padding-top: 30px;
    padding-bottom: 40px;
    background-image: url(../../form/img/da/logo.png?);
    background-position: right top +20px;
    background-size: 39% auto;
    background-repeat: no-repeat;
}
h2.part-1{
	font-size: 43px;
	font-weight: 100;
	text-align: center;
	padding-bottom: 45px;
}
svg{
	margin: 5px;
}
.loader {
	border: 10px solid #d9d6d2e8;
	border-top: 10px solid #826c5cde;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	animation: spin 2s linear infinite;
	display: inline-block;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.submit-loader{
	width: 100%;
	text-align: center;
	margin-bottom: 18px;
	margin-top: 23px;
	display: inline-block;
}

p {
  color: #404F5E;
  font-family: "Nunito Sans", "Helvetica Neue", sans-serif;
  font-size:20px;
  margin: 0;
}
i {
	color: #77c939;
	font-size: 100px;
	margin-left:-15px;
}
.card {
	max-width: 780px;
	width: 98%;
	display: inline-block;
	text-align: center;
	padding: 45px 10px;
	margin: 5px;
	border-radius: 50px;
	background: linear-gradient(89deg, #a5a7a678, #ffffff78);
	font-weight: 100;
	font-size: 18px;
}

.card.success{
	max-width: 980px !important;
}

.card .row{
	letter-spacing: 2;
	margin-left: 0px;
	background: #ffffff87;
	border: 1px solid #c7a68d7d;
	padding: 8px 0px 8px 0px;
	border-radius: 10px;
	margin-top: 7px;
	margin-bottom: 0px;
}
.print{
	margin-top: 10px;
}
.logo{
	font-size: 43px;
	font-weight: 100;
	padding-bottom: 10px;
	background-image: url(../../form/img/da/logotop.png);
	background-position: center top;
	background-size: auto 100%;
	background-repeat: no-repeat;
	height: 160px;
}

.checkmark{
	font-size: 110px;
	padding: 50px 60px;
}
div.container {
	width: inherit;
	font-size: 16px;
	padding: 0px 0px 0px 0px;
}
div.container .row div:nth-child(1){
	color: #816c5c;
	padding-right: 0px !important;
	text-align: left;
	font-size: 16px;
	font-weight: 100;
	padding-left: 10px !important;
}
div.container .row div:nth-child(2){
	  color: #816c5c;
	  text-align: right;
	  font-weight: 100;
	  font-size: 16px;
	  padding-right: 10px !important;
}
.logo-top{
	font-size: 43px;
	font-weight: 100;
	padding-bottom: 10px;
	background-image: url(../../form/img/da/logotop.png);
	background-position: center top;
	background-size: auto 100%;
	background-repeat: no-repeat;
	height: 160px;
}
h1 {
	color: #816c5ced;
	font-weight: 100;
	margin-bottom: 10px;
	margin-top: 20px;
	padding: 20px 0px 30px 0px;
}
h1.success{
	font-size: 20px;
}
.card-img{
	height: 100px;
    width: 100%;
    margin: 0 auto;
    background-image: url(../../form/img/da/logo.png);
    background-size: 30% auto;
    background-repeat: no-repeat;
    background-position: center;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.submit-loader{
	width: 100%;
	text-align: center;
	margin-bottom: 18px;
	margin-top: 23px;
	display: inline-block;
}
.iti{
	width: 100%;
	padding: 0px !important;
	border-width: 0px !important;
}
.iti input[type=text]{
	position: relative;
	z-index: 0;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-left: 105px !important;
	margin-right: 0;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	/* display: none; <- Crashes Chrome on hover */
	-webkit-appearance: none;
	margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

input[type=number] {
	-moz-appearance:textfield; /* Firefox */
}

.dob{
	height: 40px;
}
.part-2{
	display: none;
}
.card-img-red {
    border-radius: 200px;
    height: 200px;
    width: 200px;
    background: #fff2f280;
    margin: 0 auto;
}
.checkmark-red{
	font-size: 110px;
	padding: 50px 60px;
}
.card-img-red i {
	color: #ff5079 !important;
	font-size: 100px !important;
	margin-left: -5px !important;
	margin-top: -5px !important;
}
.addcontact-logo{
	font-size: 43px;
	font-weight: 100;
	padding-bottom: 10px;
	background-image: url(../../form/img/da/logo.png);
	background-position: center top;
	background-size: auto 100%;
	background-repeat: no-repeat;
	height: 120px;
	margin-bottom: 80px;
}
@media (max-width: 450px) {
    .addcontact-logo{
		height: 10vh;
		margin-bottom: 30px;
	}
	
}
@media (max-width: 650px) {
    h2.part-2 {
        font-size: 25px; /* 改變文字大小 */
    }
	h2.part-1 {
        font-size: 32px; /* 改變文字大小 */
    }
}
@media (max-width: 450px) {
    h2.part-2 {
        font-size: 18px; /* 改變文字大小 */
    }
	h2.part-1 {
        font-size: 28px; /* 改變文字大小 */
    }
	.card-img{
		background-size: 80% auto;
	}
}