* {
    margin: 0%;
    padding: 0%;
}

html {
    scroll-behavior: smooth;
}

body {
    display: flex;
    justify-content: center;
    align-items: center;
    /* background-color: rgb(201, 164, 231); */
    background: linear-gradient(rgba(238, 3, 3, 0.744), #0a7ff4f6) no-repeat;
    height: 100vh;
}

#container {
    background-color: #2195f3ea;
    border: 2px solid rgb(57, 31, 31);
    border-radius: 12px;
    height: 44%;
    width: 84%;
    padding: 16px;
    box-shadow: -4px -2px 10px 2px rgb(40, 31, 44);
}

.row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    grid-gap: 16px;
    margin: 4% 4%;
    padding: 4% 8%;
}

#container h3 {
    text-align: center;
    padding: 4px;
    margin: 6px;
    font-size: 1.94rem;
}

#container input {
    padding: 6px;
    margin: 4px;
    font-size: 1.1rem;
    border-radius: 4px;
}

/* --------------------Phone.css--------------------- */
@media only screen and (max-width: 600px) {

.row{
    margin: 6% 6%;
    padding: 6% 8%;
    overflow: hidden;
}
#container {
    border:none;
    height: 58%;
    width: 92%;
    padding: 8px;
    box-shadow: -4px -2px 10px 2px rgb(40, 31, 44);
}

#container h3 {
    text-align: center;
    padding: 4px;
    margin: 4px;
    font-size: 1.7rem;
}

#container input {
    padding: 5px;
    margin: 4px;
    font-size: 1.04rem;
    border-radius: 4px;
}

}