/* Mobile */
@media only screen and (max-width: 768px) {
    h1, h2, h3, h4{
        font-family: 'Poppins', sans-serif;
        padding-bottom:15px;
    }
    
    h3{
        font-weight:700;
    }
    
    p{
        font-family: 'Poppins', sans-serif;
    }
    
    body{
        background-color:#333333;
    }
    
    label{
        font-family: 'Poppins', sans-serif;
    }
    
    .container {
        margin-top: 40px;
        background-color:#333333;
    }
    
    #logo{
        padding:3%;
        text-align:center;
    }
    
    #icon{
        width:180px;
        height:auto;
        padding:3%;
    }
    
    .heading{
        background-color:white;
        padding:10px;
        color: black;
        font-size:24px;
        font-family: 'Poppins', sans-serif;
        font-weight:600;
    }
    
    .btn-primary{
        margin-top:10%;
        background-color:#e3493d;
        border-color:#e3493d;
        font-family: 'Poppins', sans-serif;
        font-size:18px;
        width:100%;
    }
    
    #form{
        padding:1%;
        margin-bottom:2%;
        background-color:white;
        border-radius:15px;
    }
    
    .panel-primary{
        background-color:white;
    }
    
    .panel{
        border-radius:2vw;
        padding-top:20px;
        padding-bottom:20px;
    }
    
    .heading{
        padding:20px;
        background-color:#f0f0f5;
        border-radius:2vw;
    }
    
    .form-control{
        font-family: 'Poppins', sans-serif;
    }
    
    .btn-primary:hover{
        background-color:#e3493d;
    }
    
    .atbottom{
        bottom: 0;
    }

    .perfectheight{
        min-height:fit-content;
        height:1500px;
    }
}


/* Desktop */
@media only screen and (min-width: 768px) {
h1, h2, h3, h4{
    font-family: 'Poppins', sans-serif;
    padding-bottom:15px;
}

h3{
    font-weight:700;
}

p{
    font-family: 'Poppins', sans-serif;
}

body{
    background-color:#333333;
}

label{
    font-family: 'Poppins', sans-serif;
}

.container {
    margin-top: 40px;
    background-color:#333333;
}

#logo{
    padding:3%;
    text-align:center;
}

#icon{
    width:300px;
    height:auto;
    padding:3%;
}

.heading{
    background-color:white;
    padding:10px;
    color: black;
    font-size:32px;
    font-family: 'Poppins', sans-serif;
    font-weight:600;
}

.btn-primary{
    margin-top:5%;
    background-color:#e3493d;
    border-color:#e3493d;
    font-family: 'Poppins', sans-serif;
    font-size:18px;
    width:100%;
}

#form{
    padding:1%;
    margin-bottom:2%;
    background-color:#f4f4f4;
    border-radius:15px;
}

.panel-primary{
    background-color:#f4f4f4;
}

.panel{
    border-radius:2vw;
    padding-top:20px;
    padding-bottom:20px;
}

.heading{
    padding:20px;
    background-color:#f4f4f4;
    border-radius:2vw;
}

.form-control{
    font-family: 'Poppins', sans-serif;
}

.btn-primary:hover{
    background-color:#e3493d;
}

.atbottom{
    bottom: 0;
}

.placing{
    margin-top:20%;
}

.perfectheight{
    min-height:fit-content;
    height:1450px;
}

}