@import url("assets/fonts/comicsans.css");

#Button1 {
    background-color: lightgreen;
    border-style: solid;
    border-color: red;
    border-radius: 25%;
    background: #73AD21;
    padding: 20px;
    width: 100px;
    height: 50px;
    background-image: linear-gradient(to right, #9A98B5 , #FF5154);
}

#Button2 {
    background-color: lightgreen;
    border-radius: 10px;
    background: #73AD21;
    padding: 20px;
    width: 100px;
    height: 50px;
    
}

#Button3 {
  display: inline-block;
  padding: 15px 25px;
  font-size: 24px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  color: #fff;
  background-color: #04AA6D;
  border: none;
  border-radius: 15px;
  box-shadow: 0 9px #999;
}

#Button3:hover {background-color: #3e8e41}

#Button3:active {
  background-color: #3e8e41;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}

#Head {
    color:Tomato;
}

#Print {
    color: Orange;
}

#Head {
    text-decoration-line: underline overline;
    font-family: "Jacquard 12", system-ui;
    text-shadow: 2px 2px lightblue;
    font-size: 40px;
}
#Tex {
    font-family: "Agbalumo", system-ui;
    text-align: center;
}

#Print {
    font-family: "Jersey 25 Charted", sans-serif;
    text-align: center;
}

#Paragraph1 {
    font-family: "Aclonica", sans-serif;
    text-align: center;
}
#Paragraph2 {
    font-family: "Aclonica", sans-serif;
    text-align: center;
}

#Intro {
    font-family: "Comic Sans", sans-serif;
    text-align: center;
}

#Transition {
    height: 80px;
    width: 50px;
    background: lightblue;
    transition: width 2s, height 3s;
}

#Transition:hover {
    width: 300px;
    transition-delay: 1s;
    height: 300px;
}


#Transition2 {
    height: 80px;
    width: 75px;
    background: lime;
    transition: width 5s;
}

#Transition2:hover {
    width: 400px
}