:root{
    background-color:darkgrey;
}

body{
    border:2px solid black;
}

footer{
    justify-content:center;
    text-align:center;
    border:1px solid orange;
    background-color:black;
    font-size:13px;
    color:pink;
}
p{
    margin-left: 150px;
    padding-top: 5px;
    margin-right: 100px;
    text-align:center;
    justify-content:center;
    font-weight:bold;
    font-size:19px;
}
@media (min-width:1024px) and  (max-width:1920px){
h1{
    
    margin-left: 150px;
    padding-top: 5px;
    margin-right: 100px;
    color:green;
    text-align:center;
    text-wrap:normal;
    font-family:garamond, serif;
}

.reg-form{
    justify-content:center;
    display:flex;
    border:2.5px solid red;
    background-color:lightgrey;
    margin-left:280px;
    height:525px;
    width:395px;
}

.form{
    flex:auto;
        justify-content:center;
        text-align:center;
        flex-direction:column;
        margin-top:10px;
        margin-bottom:10px;
        padding-top:5px;
        padding-bottom:5px;
        border:2px dashed orange;
        color:#EEF527;
    }
}
@media (min-width:360px) and (max-width:896px){ 
    

    .reg-form{
        justify-content:center;
        display:flex;
        border:5px solid red;
        background-color:lightgrey;
        height:400px;
        width:395px;
    }
    
    .form{
        flex:auto;
        justify-content:center;
        margin-top:10px;
        margin-bottom:10px;
        padding-top:5px;
        padding-bottom:5px;
        text-align:center;
        flex-direction:column;
        margin:10px;
        border:2px dashed orange;
        color:#EEF527;
    }
}