@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@600&family=Noto+Sans+TC:wght@100;300;400;600;700&family=Poppins:wght@300;400;500;600&display=swap');
:root {
  --header-height: 3rem;
  --main-color: #8fa842;
  --green-light: #b2dd90;
  --blue: #0066a5;
  --blue-light: #008cff;
  --red: #f00;
  --pink: rgb(254, 75, 243);
  --brown:rgb(199, 115, 4)0;
  --white: #fff;
  --black: #000;
  --grey: #666;
  --grey-light: #E1E1E1;
  --border:.1rem solid rgba(0,0,0,.1);
  --box-shadow:0 .2rem .3rem rgba(0,0,0,.1);
}
*{
  font-size: 14px;
  font-family: 'Poppins', sans-serif;
  }
body{
    /* background-color:var(--bs-body-bg) */
    background-color:var(--main-color);
}
#auth{
    height:100vh;overflow-x:hidden;
}
#auth #auth-right{
    height:100%;
    background:url(./auimg/4853433.png),linear-gradient(90deg,#2d499d,#3f5491)
}
#auth #auth-left{
    padding:5rem
}
#auth #auth-left .auth-title{
    font-size:4rem;margin-bottom:1rem
}
#auth #auth-left .auth-subtitle{
    font-size:1.7rem;
    line-height:2.5rem;
    color:#a8aebb
}
#auth #auth-left .auth-logo{
    margin-bottom:7rem
}
#auth #auth-left .auth-logo img{
    height:2rem
}
@media screen and (max-width: 1399.9px){
        #auth #auth-left{padding:3rem}
    }
@media screen and (max-width: 767px){
    #auth #auth-left{padding:5rem}
    .container {
        width: 80%;
    }
}
@media screen and (max-width: 576px){
    #auth #auth-left{padding:5rem 3rem}
}