/* CSS Document */

.container {
  display: grid;
  width: 1050px;
  height: 600px;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows:  1fr 1fr 1fr;
  grid-gap: 1rem;
}

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

.content-1 {
  grid-row: 3 / 5;
  grid-column: 1 / 2;
}

.content-2 {
  grid-row: 3 / 5;
  grid-column: 2 / 3;
}

.content-3 {
  grid-row: 3 / 5;
  grid-column: 3 / 4;
}

.footer {
  grid-row: 5 / 6;
  grid-column: 1 / 4;
}





/* OTHER STYLES */

body {
  padding: 200px;
  background-color: #3b404e;
  display: grid;
  justify-content: center;
  padding: 20px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

.item {
  background-color: ;
  background-image: ;
  color: #ffffff;
  border-radius: 4px;
  display: grid;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  font-weight: bold;
}

.header {
  background-color: #1E1E1E;
  
}

.sidebar {
  background-image: linear-gradient(203deg, #3EDFD7 0%, #29A49D 90%)
}

.content-1,
.content-2,
.content-3 {
  background-image: linear-gradient(130deg, #6C52D9 0%, #1EAAFC 85%, #3EDFD7 100%);
}

.footer {
  background-color: #6C52D9;
  background-image: linear-gradient(160deg, #6C52D9 0%, #9B8AE6 127%);
}