/* Base Styles */
@import url(reset_pg.css);
@import url(TaskMaster_General.css);
@import url(grid_structure.css);

/* Mobile Styles */
@media screen and (max-width: 480px){
    div[class^="col-"] {
        width: 100%;
    }
        
    .home-button-container{
        
        display: flex;
        justify-content: center;
        gap: 10px;
    }

    button.LHomebtn,
    button.SHomebtn{
      
        width: 100%;
        font-size: 18px;
    }
    
    .signupbtn,
    .deleteA-btn{
        
        width: 50%;
    }
    
    .form-popup{
        width: 85%;
    }
    
     .open-button{
        width: 30%;
    }
    
   
    
}


/* Tablet Styles */
@media screen and (min-width: 481px){ 
    div[class^="col-"] {
        width: 100%;
    }
  
    .home-button-container{
        
        display: flex;
        justify-content: center;
        gap: 10px;
    }
    
    .form-popup{
        width: 70%;
    }
   
}
/* Desktop Styles */
@media screen and (min-width: 769px){
    
    div.col-1-2{
        width: 50%;
    }
    
    div.col-1-1{
        width: 100%;
    }
    
  
    .home-button-container{
      
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 20px;
        margin-top: 40px;
    }
    
    .form-popup{
        width: 50%;
    }

}