@font-face {
    font-family: "Journelle Light";
    src: url(ywft-journelle-light-demo.ttf);
}
@font-face {
    font-family: "Wisterria";
    src: url(wistteria-sans-regular.ttf);
}
@font-face {
    font-family: "concise";
    src: url(concise-regular-demo.ttf);
}
@font-face {
    font-family: "Creato Display";
    src: url(creato_display/CreatoDisplay-Regular.otf);
}
h1{
    font-family: "Wisterria";
    font-size: 67px; 
}
p{
    font-family: "Creato Display";
    font-size: 16px;
    word-spacing: 20%;
    

}
button{
    font-family: "Journelle Light";
    text-align: center;
    font-size: 18px;
    color: rgb(243, 243, 243);
    margin: auto;
    padding: 1em,3em;
    border-width: 3px;
    background: linear-gradient(to right, rgb(120, 188, 225), rgb(51, 157, 162));
    border-radius: 22px;
    border-color:rgb(33, 22, 67);
    width: 10%;
    height: 40px;
    position: relative;
    font-weight: 300;
    cursor: pointer;

}
button::after{
     content: "";
     height: 100%;
    transition: 1.5s ease-in-out;
    transform: scale(1.5);
    
}
button::after :hover{
   width: 100%;
}