body{
    background: #3F5EFB;
    background: radial-gradient(circle, rgba(63, 94, 251, 1) 0%, rgba(252, 70, 107, 1) 64%);
    
}
h1{
     font-family: "Roboto Slab", serif;
}
form{
    width: 700px;
}
fieldset{
    border: 5px solid black;
    border-radius: 10px;
}
legend{
    font-family: fantasy;
    color: darkgreen;
}
input[type]{
    border-radius: 10px;
}
input[name="fn"]{
    border: 2px solid rgb(153, 0, 255);
}
input[optional]{
    border: 2px solid rgb(77, 0, 128);
}
input:focus{
    background: #2A7B9B;
    background: linear-gradient(90deg, rgba(42, 123, 155, 1) 0%, rgba(87, 199, 133, 1) 0%, rgba(237, 221, 83, 1) 100%);
}
input[ value="TAP ACADEMY"]{
   background-color: #fb843f;
   color: aliceblue;
   font-weight: 200;
}
input:hover{
    background-color: crimson;
}
input+p{
    display: none;
}
input:hover+p{
    display: inline;
    font-weight: 700;
    font-size: 15px;
    background: #2A7B9B;
    background: linear-gradient(90deg, rgba(42, 123, 155, 1) 0%, rgba(87, 199, 133, 1) 73%, rgba(237, 221, 83, 1) 100%);
    color: indigo;
    border: 2px dotted rebeccapurple;
}
select:focus{
    background-color: aquamarine;
}
select:hover{
    background-color: yellowgreen;
}
input [type="file"]{
   background-color: black;
}
textarea{
    background-color: aquamarine;
    border-radius: 10px;
    resize: none;
}
select+p{
    display: none;
}
select:hover+p{
    display: inline;
    font-weight: 700;
    font-size: 15px;
    background: #2A7B9B;
    background: linear-gradient(90deg, rgba(42, 123, 155, 1) 0%, rgba(87, 199, 133, 1) 73%, rgba(237, 221, 83, 1) 100%);
    color: indigo;
}
img{
    display: none;
}
input[type="email"]:focus:valid ~ img#valid {
    display: inline;
    height: 20px;
    width: 20px;
}
input[type="email"]:focus:invalid ~ img#invalid{
    display: inline;
    height: 20px;
    width: 20px;
}
input[type="number"]:focus:invalid ~ img#invalid{
    display: inline;
    height: 20px;
    width: 20px;
}
input[type="number"]:focus:valid ~ img#valid{
    display: inline;
    height: 20px;
    width: 20px;
}
select{
    border-radius: 10px;
}
input[type="radio"]:checked{
    height: 20px;
    width: 20px;
}
input[type="radio"]:checked+label{
    font-size: 25px;
    color: chartreuse;
    font-weight: 600;
}