@charset "utf-8";

/* 動態 Menu  */
.btn-menu {
	border: 1px solid black;
	border-radius: 5px;
	background-color: white;
	color: black;
	padding: 3px 12px;
	font-size: 16px;
	cursor: pointer;
  }
  
  .success {
	border-color: #2196F3;
	color: dodgerblue
  }
  
  .success:hover {
	background-color:#2196F3;
	color: white;
  }  
  /* --漸漸動態文字---*/ 

.shape-ex2{
    width: 0px;
    height: 0px;
    background-color: #666;
    margin: 0 auto;
    animation: fadeOut 5s linear 3s infinite;
}
@keyframes fadeOut {
    from {
        opacity: 5;
    }
    to {
        opacity: 0;
    }
}
 /* --文字左右移動---*/ 
 .animation-1 {
	width: 0px;
	height: 0px;	
	position: relative;
	animation: mymove 10s infinite;
  }  
  @keyframes mymove {
	from {left: -50px;}
	to {left: 20px;}
  }

/**/

.animation-type1 {
  width: 15em;
  overflow: hidden;
  white-space: nowrap;
  animation: typing 7s steps(15) infinite;
  }  
  @keyframes typing {
	from { width: 0 }
  }

 /* --Slide Images---*/ 

 .mySlides {display:none;}

  /* --Img Center---*/ 

.center-btn {
	margin: 0;
	position: absolute;
	top: 95%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
  } 

  /* --colorblack---*/ 

.bg-colorblack {
	border: 1px solid black;
	border-radius: 5px;
	background-color: white;
	color: black;
	padding: 3px 12px;
	font-size: 16px;
	cursor: pointer;
  }

.single-ellipsis {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;	
	font-family: impact;
	font-weight: bold;
	text-shadow: 6px 6px 0px rgba(0,0,0,0.2);
  }


.p-1 {
	text-transform: uppercase;
	letter-spacing: .5em;
	display: inline-block;
	border: 1px double rgba(255,255,255,.25);
	border-width: 1px 0;
	padding: 1.5em 0em;
	position: absolute;
	top: 18%;
	left: 50%;
	width: 40em;
	margin: 0 0 0 -20em;
  
  span {

  	font: 700 4em/1 "Oswald", sans-serif;
  	letter-spacing: 0;
  	padding: .25em 0 .325em;
	  display: block;
	  margin: 0 auto;
  	text-shadow: 0 0 10px rgba(255,255,255,.5);

/* Clip Background Image */

	  background: url(https://i.ibb.co/RDTnNrT/animated-text-fill.png) repeat-y;
	  -webkit-background-clip: text;
	  background-clip: text;

/* Animate Background Image */

	  -webkit-text-fill-color: transparent;
	  -webkit-animation: aitf 80s linear infinite;

/* Activate hardware acceleration for smoother animations */

	  -webkit-transform: translate3d(0,0,0);
	  -webkit-backface-visibility: hidden;

  }
}

/* Animate Background Image */

@-webkit-keyframes aitf {
	0% { background-position: 0% 50%; }
	100% { background-position: 100% 50%; }
}  

/*  font size */
.font-w1 {
	font-weight: bold;
	font-size:2.5em;
	
  }