html, body {
    margin: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}


.layout {
    height: 100vh;
    display: grid;
    grid-template-columns:  repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    
    border: 3px solid red;
}

.first_container {
    grid-column: 1;
    grid-row: 1;
   
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);

    border: 3px solid red;


    
}

.second_container {
    grid-column: 2;
    grid-row: 1 / 4;

    display: grid;
    
    grid-template-rows: repeat(5, 1fr);

    border: 3px solid red;
    
}

.third_container {
    grid-column: 3;
    grid-row: 1;

    overflow-y: auto;
    
}



.google_information {
    grid-row: 1;
    grid-column: 1; 
    
}

.button_login {
    grid-row: 2;
    grid-column: 1;
}

.button_logout {
    grid-row: 2;
    grid-column: 2;
}





.second_bottom{ 

    
    
    display: grid;
    
    


   
    grid-row: 2;

  
}


.write_box_first {

    width: 100%;
    height: 200px;

    border: 1px solid black;


    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(4, 1fr);

    
}

.profile_image
{
   grid-row: 1 / 3;
   grid-column: 1;
}

.profile_nickname
{
   grid-row: 1;
   grid-column: 2;

}


.profile_date
{
   grid-row: 2;
   grid-column: 2;

}