* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: Arial, sans-serif;
}
 
/* Body */
body {
  width: 100%;
}
 
/* Header*/
.header {
  width: 100%;
  height: 100px;
  background: #60c2ff;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
}
 
/* Navigation boxes */
.nav-box {
  width: 120px;
  height: 40px;
  background: #d9d9d9;
}
 
/* Grid */
.grid {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr 1.2fr;
  grid-template-rows: 250px 200px 200px;
  gap: 20px;
  padding: 20px;
}
 
/* Base box style */
.box {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 48px;
  font-weight: bold;
  color: white;
}
 
/* Individual boxes */
.box1 { background: #ff6060; }
 
.box2 { background: #D9D9D9; }
 
.box3 {
  background: #60c2ff;
  grid-row: 1 / 4;
  grid-column: 3 / 4;
  align-items: flex-start;  
  padding-top: 90px;        
}
 
.box4 {
  background: #ffc260;
  grid-column: 1 / 3;
}
 
.box5 { background: #60c2ff; }
 
.box6 { background: #D9D9D9 }