
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@300;400;500;600;700;900&display=swap');
body {
	font-family: 'Noto Serif TC', serif;
    margin: 0;
    padding: 0;
}

body, .button {
    color: rgba(0, 0, 0, .9);
}


.cta {
    margin-top: 100px;
}

.buttons {
    margin-top: 100px;
}

.button {
    display: inline-block;
    text-decoration: none;
    background: #fff;
    border: 2px solid rgba(0, 0, 0, .9);;
    height: 50px;
    line-height: 50px;
    padding-left: 32px;
    padding-right: 32px;
    transition: all, .4s;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 20px;

}

.button:hover {
    
    background-color: rgba(0, 0, 0, .9);;
    color: #fff;
    
}

.avatar {
    margin-top: 40px;
}

.hamburger__icon, 
.hamburger__icon:before, 
.hamburger__icon:after {
    background-color: #666;
}

.text-center {
    text-align: center;
}


.fat-nav{display: none;}

.fat-nav,.hamburger__icon,.hamburger__icon:after,.hamburger__icon:before{-moz-transition-duration:.4s;-o-transition-duration:.4s;-webkit-transition-duration:.4s}

.hamburger{
	display:none;
	width:60px;
	height:60px;
	position: fixed;
	top:-.5rem;
	right:.5rem;
	z-index:10000;
	padding:12px;
	/*background-color: rgba(255, 255, 255,.6);*/
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-tap-highlight-color:transparent;
	-ms-touch-action:manipulation;
	touch-action:manipulation;
}


.hamburger__icon{position:relative;margin-top:18px;margin-bottom:18px;}/*漢堡選單上下間距*/

.hamburger__icon,.hamburger__icon:after,.hamburger__icon:before{display:block;width:36px;height:4px;background-color:rgba(168,190,90,1);border-radius: 2px;-moz-transition-property:background-color,-moz-transform;-o-transition-property:background-color,-o-transform;-webkit-transition-property:background-color,-webkit-transform;transition-property:background-color,transform;transition-duration:.4s}

.hamburger__icon:after,.hamburger__icon:before{position:absolute;content:""}

.hamburger__icon:before{top:-10px}

.hamburger__icon:after{top:10px}

.hamburger.active .hamburger__icon{background-color:transparent;}

.hamburger.active .hamburger__icon:after,.hamburger.active .hamburger__icon:before{background-color:#fff;}

.hamburger.active .hamburger__icon:before{-moz-transform:translateY(10px)rotate(45deg);-ms-transform:translateY(10px)rotate(45deg);-webkit-transform:translateY(10px)rotate(45deg);transform:translateY(10px)rotate(45deg)}

.hamburger.active .hamburger__icon:after{-moz-transform:translateY(-10px)rotate(-45deg);-ms-transform:translateY(-10px)rotate(-45deg);-webkit-transform:translateY(-10px)rotate(-45deg);transform:translateY(-10px)rotate(-45deg)}

.fat-nav{top:0;left:0;z-index:9999;position:fixed;display:none;width:100%;height:100%; 
	/*background: rgba(100, 130, 40, .9);*/
	background: linear-gradient(45deg, #a8be5a, #5c7604);
  background: -moz-linear-gradient(45deg, #a8be5a, #5c7604);
  background: -webkit-linear-gradient(45deg, #a8be5a, #5c7604);
  background: -o-linear-gradient(45deg, #a8be5a, #5c7604);
  background: -ms-linear-gradient(45deg, #a8be5a, #5c7604);
	-moz-transform:scale(1.4);-ms-transform:scale(1.4);-webkit-transform:scale(1.4);transform:scale(1.4);-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-webkit-transition-property:-webkit-transform;transition-property:transform;transition-duration:.4s;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}

.fat-nav__wrapper{ width:100%; height:100%; display:table; table-layout:fixed;}

.fat-nav.active{-moz-transform:scale(1);-ms-transform:scale(1);-webkit-transform:scale(1);transform:scale(1)}

.fat-nav ul{display:table-cell;vertical-align:middle;margin:0;padding:0;}

.fat-nav li {
    list-style-type: none;
    text-align: center;
    padding: 15px;
    font-size: 20px;
	letter-spacing: 1px;
}
.fat-nav li img {
	padding-bottom: .75rem;
	border-bottom: 1px solid rgba(255,255,255,.2);
	max-width: 75%;
	margin: 0 auto;
}


.fat-nav li,.fat-nav li a{color:rgba(255,255,255,.95); letter-spacing: 2px;font-weight: 500;text-decoration:none;}

.fat-nav li span {font-size: 24px;
    margin-left: .25rem;
	padding-top: .25rem;
	font-weight: 700;}

.fat-nav li a i {
    color: #fdeb89; font-size:16px; /*margin-right:8px; color:#f0a926;*/
}

.fat-nav li a small{
	display: block;
    color: rgba(255,255,255,.75); font-size:.75rem; margin-top:.45rem;  letter-spacing: 3;font-weight: 500;
}
.fat-nav li a.res{
	font-size: 1rem;
  color: #fdeb89;
  line-height: 2;
   text-align: center;
}

.nologin{ display:none;}


@media screen and (max-width:820px){
.hamburger{display:block;}
.hamburger__icon, .hamburger__icon::after, .hamburger__icon::before {
  display: block;
  width: 40px;
	height: 4px;}
	.hamburger__icon {
  position: relative;
  margin-top: 28px;
  margin-bottom: 18px;
}
}
@media screen and (max-width:500px){
.hamburger__icon {
  margin-top: 30px;
}
	
}


