body{
    background-color: #280239;
    font-family: Arial, Helvetica, sans-serif;
    color: #37d559;
}

.article-container{
    background-color:  #dd63f0;
    color: #0c276b;
    width: 900px;
    padding: 30px;
    border-radius: 12px;
}

.article-box{
    padding: 20px;
    background-color:  #0c276b;
    color: #dd63f0;
    width: 95%;
    border: 4px inset #37d559;
    border-radius: 12px;
}

.fullarticalbox{
    margin: 70px auto;
    width:60%;
}

.texttitles{
    border:4px groove #dd63f0;
    width: 900px;
    text-align: center;
    margin: auto;
    background-image:linear-gradient(180deg, #dd63f0, #37d559);
}
h1, h2{
    color:#0c276b;
}

input{
    padding: 0px 20px;
    width: 300px;
    height: 40px;
    font-size: 22px;
}

button{
    width: 100px;
    height: 44px;
    font-size: 22px;
}

.resultcount{
    font-size: 22px;
    text-align: center;
    margin: 50px 0;
    border: 4px double #37d559;
    width: 300px;
}


/*styles for the footer that holds validation links*/
footer{
    text-align: center;
    font-size: 1rem;
    margin: 50px 0;
}

a:link{
    color:#8633d4;
    font-size:1rem;
}

a:visited{
    color:#8633d4;
    font-size:1rem;
}

a:hover{
    text-decoration:line-through;
    color:#dd63f0;
    font-size: 1rem;
}