.blossom_btn {
    padding: 5px 5px;
    background-color: rgb(96, 156, 212);
    margin: 5px;
    transition: 1s;
    box-shadow: 0 0 5px 5px rgb(96, 156, 212);
    color: white;
  	width:100%;
}

.blossom_btn:hover {
    background-color: var(--clr);
    box-shadow: 0 0 10px 10px var(--clr);
}

.btn_div {
  width:208px;
  height:57px;
}

.blossom_btn {
  width:208px;
  height:57px;
}

.blossom_btn2 {
    position: absolute;
    margin:auto;
     width:190px;
     height: 50px;
     left: 5%;
     text-align: center;
     line-height: 50px;
     color: #fff;
     font-size: 18px;
     text-decoration: none;
     box-sizing: border-box;
     background: linear-gradient(90deg, #03a9f4,#f441a5,#b6a828,#03a9f4);
     background-size: 400%;
     border-radius: 10px;
     margin: 0;
     padding: 0;
     z-index: 1;
     border-color: transparent;
     background: blur(5px);
     animation: animate 8s linear infinite;
     font-family: 'Calibri', 'Calibri_XP', 新細明體, PMingLiu;
     font-weight: bold;
     text-decoration: none;
}

.blossom_btn2_div {
    width:208px;
    height: 65px;
    position: relative;
    text-decoration: none;
}


@keyframes animate {
    0%
    {
        background-position: 0%;
    }
    100%
    {
        background-position: 400%;
    }
}

.blossom_btn2::before {
    content: '';
    position: absolute;
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    z-index: -1;
    background: linear-gradient(90deg, #03a9f4,#f441a5,#ffeb3b,#03a9f4);
    background-size: 400%;
    border-radius: 20px;
    opacity: 0;
    transition: 0.5s;
border-color: transparent;
}

.blossom_btn2:hover:before {
    filter: blur(10px);
    opacity: 1;
}