:root 
{
    --accent: #2ecc71;
}
body {
    margin:0;
    height:100vh;
    background-color: #fafafa;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    
}
main{
    margin: 2%;
}
/* forms */
.input-int-style{
    width: 100%;
    text-align: center;
    font-weight: 400;
    background-color: #fdfdfd;
    font-size: 1.5em;
    padding: 0.4rem;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 2px rgb(0,0,0,0.03);
    border-radius: 15px;
    background:linear-gradient(to bottom,#fafafa,#f0f0f0) ;
}
.button-int-style{
     padding: 0.7rem 1.5rem;
    border: none;
    width: 90%;
    background: var(--accent);
    color: white;
    border-radius: 15px;
    font-weight: 600;
    box-shadow: 0 4px 15px rgb(46,205,113 ,0.4);
    cursor: pointer;
}
.center-text{
    text-align: center;
}

/* my form*/
.my-forms{
    display: flex;
    flex-direction:column;
     align-items: center;
     margin: 4%;
}

/* labels for forms*/
.label-forms{
     align-self: flex-start;
    color: #333;
}