/* Smartphones and smaller screen devices 320px */
.about-container{
    width: 100%;
    height:100%;
    min-height:450px;
    padding-top:10px;
    margin-top: 100px;  
    margin-bottom:5px; 
    background-color: #ECEFF1;
}

.about-content{
    width: 70%;
    height:100%;
    margin: 5px auto;
    box-shadow: 2px 2px 20px 8px rgba(0,0,0,0.1);
    padding:7px;
    border-radius:4px;
    background-color: white;
}

.about-container p {
    font-size: 9pt;
    padding: 10px;
    text-align: justify; 
    width:70%;
    margin:10px auto;
    width:70%;
    margin:10px auto;
    
}


.about-container h2 {
    text-align: center;
    font-size: 10pt;
}


/* Ipads and Tablets */
@media only screen and (min-width:768px){
        .about-container{
            width: 100%;
            height:100%;
            min-height:450px;
            padding-top:20px;
            margin-top: 120px;   
        }
        
        .about-content{
            width: 80%;
            height:520px;
            margin: 2px auto;
            text-align: left;
            padding:20px;
            border-radius:4px;
         
        }
         
        .about-container p {
            font-size: 13pt;
            padding: 10px;
            text-align: justify; 
            width:70%;
            margin:10px auto;
        }
        
        .about-container h2 {
            text-align: center;
            font-size: 14pt;
        }

    }


    /* Desktop and Bigger Screens */
    @media only screen and (min-width:1366px){
            .about-container{
                width: 100%;
                height:100%;
                min-height:800px;
                margin-top: 140px;   
                background-color: #ECEFF1;
            }
            
            .about-content{
                width: 70%;
                height:100%;
                min-height:600px;
                margin: 100px auto;
                margin-top: 50px;   
                padding: 20px;
                background: linear-gradient(to right bottom, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.3));
                backdrop-filter: blur(3rem);
            }
             
            .about-container p {
                font-size: 14pt;
                width:70%;
                margin:10px auto;
                text-align: justify;
            }
            
            .about-container h2 {
                text-align: center;
                font-size: 16pt;
            }

        }