meme.css

body {
    background-image: linear-gradient(to right, rgb(195, 20, 50), rgb(36, 11, 54));
    min-width: 99vw;
    min-height: 99vh;
    background-repeat: no-repeat;
}





#meme-header {
    text-align: center;
    color: rgb(202, 199, 199);
    letter-spacing: .5em;
    font-size: 3em;
    margin-bottom: 10%;
    font-family: 'Permanent Marker', serif;
}

.meme-form {
    text-align: center;
  }

#complete {
    display: flexbox;
}

.complete-image {
    width: 100%;
    position: relative;
    

}



 .header {
    position: relative;
    color:white;
    width:100%;
    height: 100%;
    font-size: 1em;;
    line-height: 25px;
    top: -180px;
    font-family: 'Permanent Marker', serif;
  
}

.footer {
    position: relative;
    color: white;
    width:100%;
    height: 100%;
    font-size: 1em;
    line-height: 25px;
    top: -75px;
    font-family: 'Permanent Marker', serif;
}

img {
    border: 5px solid black;
}

img:hover {
    
    opacity: .5;
    cursor: pointer;
    
}


input[type=submit] {
    margin-bottom: 1em;
    transition-duration: 0.4s;
    border-radius: 50%;
}

input[type=submit]:hover {
    background-color: rgb(128, 114, 127); /* Green */
    color: white;
    cursor: pointer;
}


input[type=text] {
    width: 50%;
    background-color: rgb(85, 80, 80);
    padding: 10px;
    color: white;
}

input[type=url] {
    width: 50%;
    background-color: rgb(85, 80, 80);
    padding: 10px;
    color: white;
}