html, body{
  font-family: Poppins, helvetica, 微軟正黑體, "Microsoft Yahei";
  font-size: 20px;
}
a{
    text-decoration: none;
}
.fade {
  transition: opacity 0.2s linear; 
}
.fixed-top {
  z-index: 9999;
}
.navbar-dark .navbar-toggler {
  color: rgba(255, 255, 255, 1);
}
.font50{
  font-size: 50px;
  color:#000;
  font-family: Poppins, helvetica, 微軟正黑體, "Microsoft Yahei";
}
.font20{
  font-size: 20px;
  color:#666;
  font-family: Poppins, helvetica, 微軟正黑體, "Microsoft Yahei"; 
}
.font25{
  font-size: 25px;
  color:#000;
  font-family: Poppins, helvetica, 微軟正黑體, "Microsoft Yahei";
}
.btn-career{
  font: 22px #666 Poppins, helvetica, 微軟正黑體, "Microsoft Yahei";
  border: 2px solid #666;
  border-radius: 50px;
  background-color: #fff;
  width: 170px;
  height: 50px;
  cursor: pointer;
  -webkit-transition: all .3s; 
  -moz-transition: all .3s; 
  -ms-transition: all .3s; 
  -o-transition: all .3s; 
  transition: all .3s;
}
.btn-career:hover{
  background-color: #666;
  color:#fff
}
.career-row{
  text-align: center;line-height: 1.5;margin-bottom: 100px;
}
.copyright{
  font: 22px Verdana;
  background-color: #00112a;
  color: #fff;
  padding:44px 0;
  text-align: center;
}
.navbar{
  height: 100px;
  background-color: rgb(0,17,42,.8);
  padding: 0px 28px 0 50px;
}
.nav li a{
  font-size: 23px;
  font-family:Verdana;
}
.nav-link{
  color: #fff;
  padding: .5rem 5px;
}
.nav-link:hover{
  color: #fdec74;
}
.nav-link:after {
  content: ' | ';
  color: #fff;
}
.active2{
  color: #fdec74;
}
.nav-item:last-child a:after {
  content: "";
}
.mapouter{
  margin: 20px auto;
}
.mapouter:nth-last-child(1){
  margin: 20px auto 20px auto;
}
.map_info{
  color: #666;
  text-align: left;
  padding-left: 0;
  font-size: 22px;
}
.map_info div{
  padding-top: 5px;
  margin-bottom: 8px;
}
.show{
  background-color: rgb(0,17,42,.8); 
}
#about{
  padding: 150px 490px;
}
#service, #career{
  padding: 140px 490px;
}
#contact{
  padding: 140px 120px;
}
@media(min-width: 1025px) and (max-width: 1600px) {
  .navbar{
    padding: 0px 28px 0 50px;
  }
  #about{
    padding: 150px 260px;
  }
  #service, #career{
    padding: 140px 260px;
  }
  #contact{
    padding: 140px 120px;
  }
}
@media(min-width: 768px) and (max-width: 1024px) {
  .navbar{
    padding: 0px 28px 0 28px;
  }
  .font50{
    font-size: 38px;
  }
  .font25{
    font-size: 25px;
  }
  #about{
    padding: 110px 60px;
  }
  #service{
    padding: 110px 60px;
  }
  #career{
    padding: 110px 60px;
  }
  #contact{
    padding: 110px 0.5em 0.5em 0.5em;
  }
  .map_info{
    margin-bottom:70px;
  }

}    
@media(min-width: 0px) and (max-width: 767px) {
  .logo{
    width: 100%;
    text-align: center;
    padding-left: 0px;
    padding-right: 0px;

  }
  .navbar{
    height: 60px; 
    padding: 0px;
  }
  .navbar-brand{
    margin-right: 0px;
  }
  .nav-logo{
    width: 55%;
  }
  .mobile-link{
    font-size: 25px;
    font-family:Verdana;
    color: #fff;
    padding-bottom: 5px;
  }
  .nav-items{
    margin: 1em 0;
  }
  .active{
    border-bottom: 2px solid #fff;
  }
  .moble-link:after {
    content: '';
  }
  .font50{
    font-size: 23px;
  }
  .font25{
    font-size: 25px;
  }
  .career-row{
    text-align: center;line-height: 1.5;margin-bottom: 30px;
  }
  .btn-career{
    width: 190px;
  }
  .map_info{
    margin-bottom:70px;
    font-size: 18px;
  }
  .home_img, .phone_img{
    width: 20px;
    height: 20px;
  }
  #about{
    padding: 75px 30px;
  }
  #service{
    padding: 75px 30px;
  }
  #career{
    padding: 75px 30px;
  }
  #contact{
    padding: 75px 0.2em 0.2em 0.2em;
  }
  .mobileNavBtn{
    color:#fff;background-color: rgb(0,0,0,0);border: none; height: 50px; width: 50px;
    position: fixed;
    z-index: 9999;
    top: 0;
    right: 2%;
  }
  .copyright{
    font: 14px Verdana;
    height: 60px;
    padding-top: 1em;
  }
}