.topbar{
	background-color: #313332;
}
.tophight{
	margin-top: 100px;
	padding-top:20px;
	padding-bottom:15px;
	vertical-align:middle;
}
.maxheight{

}
.maxwidth{
	max-width: 1600px;
}
.footbar{
	background-color: #313332;
	color: #ffffff;
	text-align: center;
	font-size: 10px;
	padding-top: 10px;
}
.footbar p{
		 letter-spacing: 2px;
	}
.logo-bar  .navbar-brand {
    padding: 0px;
}
.logo-bar .navbar-brand-ceter{
	vertical-align: middle;
}
.banner{
	background-color: #2DA3BF;
	border:0px;
}
.container-fluid .max{
	
}
.text-yellow{
	color:#fff100;
}
a.text-yellow:hover{
	color:#fff100;
}
img.Img3:hover{
	content: url("images/image-1_02-1.jpg");		
}
.step1{
	background-color: #ffffff;
	vertical-align:middle;
}
.card-container .nav-link{
	font-size:40px;
	font-weight: bold;
	color:#cc0000;
	background-color:#eeeeee;
}
.card-container .badge {
    padding: 8px 12px;
    background-color: #cc0000;
    border-radius: 35px;
}
.card-container{
	margin:20px;
	border:1px solid #dddddd;
	border-radius: 6px;
	background-color: #eeeeee;
	padding:8px;
}
.card-container p{
	margin: 20px;
}

.step1 .card{
	margin-top:8px;
}

.step1 .card-body{    
	text-align: center;
    font-size: 24px;
	
}

.step2{
	background-color: #EEEEEE;
	padding:0px;
	vertical-align:middle;
	}

.txt-prepare{
	width: 40%;
    position: relative;
    top: -180px;
    left: 0px;
}
.step3{
	background:#7FCEF5;
	padding:0px;
	align:center;
	border:0px;
}

.step4{
	background-color: #EEEEEE;
	border:0px;
	vertical-align:middle;
}
.step5{
	background-color: #EEEEEE;
	padding-bottom:30px;
	vertical-align:middle;
}
.step4 .title{
	color:#666666;
	font-size:35px;
	font-weight: bold;
}
.step4 img{
	margin-top: 0px;
	border:0px;
}

.TextDiv1{
    border:0px;
    width:220px;
    height:120px;
    padding:30px;
    background-image:url(images/image_16.jpg);
    background-repeat:no-repeat;
    background-origin:border-box;
   }
   


/*	行動裝置	*/
@media (max-width:768px) {
	.navbar .paddingH
	{
		padding:0px;
	}
	.tophight{
		margin-top:45px;
		padding-bottom:15px;

	}
	.topbar{
		padding-top:8px;
		padding-bottom:5px;
	}
	.topbar img {
		width:80%;
	}
	.footbar{
	font-size: 9px;
	padding-top: 10px;
	}
	.footbar p{
		 letter-spacing: 2px;
	}
}
@media (min-width: 300px) and (max-width: 360px)
{
		.navbar .paddingH
	{
		padding:0px;
	}
	.tophight{
		margin-top:45px;
		padding-bottom:15px;

	}
	.topbar{
		padding-top:8px;
		padding-bottom:5px;
	}
	.topbar img {
		width:90%;
	}
	.footbar{
	font-size: 9px;
	padding-top: 10px;
	}
	.footbar p{
		 letter-spacing: 2px;
	}
}
@media (min-width: 600px) and (max-width: 1050px)
{
	.navbar .paddingH
	{
		padding:0px;
	}
	.tophight{
		margin-top:50px;
		padding-bottom:15px;

	}
	.topbar{
		padding-top:8px;
		padding-bottom:5px;
	}
	.topbar img {
		width:55%;
	}
	.footbar{
	font-size: 9px;
	padding-top: 10px;
	}
	.footbar p{
		 letter-spacing: 2px;
	}
}
@media (min-width:1800px) {
	.navbar .paddingH
	{
		padding:0px;
	}
	
	.tophight{
		margin-top:100px;
		padding-top: 50px;
		padding-bottom:15px;
		
	}
	.step3{
		
	}
	.footbar{
	font-size: 20px;
	padding-top: 10px;
	}
	.footbar p{
		 letter-spacing: 3px;
	}
}