
.grid-container {
display: grid;
grid-template-rows: auto;
grid-template-areas:
"header"
"navigation"
"main";

}

.main-header{
  display:grid;
}

/*DESKTOP*/

@media (min-width: 768px) {
			.grid-container {
				display:grid;
			grid-template-columns: 55px 1fr;
			grid-template-areas:
			"header header header"
			"navigation main main";
			}

			.container-for-chart{
				display: flex;
				flex-direction: row;
				width:50%;
			}

					

}




/*

.grid-container {
   display: grid;
   grid-auto-columns: repeat(3,1fr);

   grid-auto-rows: auto;
   grid-template-areas:
      "header header header"
      "navigation navigation navigation"
      "main main main";
}
*/