/* ####################################################
/* Nom : simtrade.css
/* ####################################################
/*
/* Créé le 24/04/2019 par SimTrade Développement (Patrick Ségalou) et PAO BANG
/* Mis à jour le 27/10/2015 par SimTrade Développement (Patrick Ségalou) : 
/* Mis à jour le 26/10/2018 par SimTrade Développement (Patrick Ségalou) : 
*/

body
{

}

logo {
  grid-area: logo;
  background-color: #fed330;
  padding: 20px;
}
header {
  grid-area: header;
  background-color: #fed330;
  padding: 20px;
}
article {
  grid-area: content;
  background-color: #20bf6b;
  padding: 20px;
}
aside {
  grid-area: sidebar;
  background-color: #45aaf2;
}
footer {
  padding: 20px;
  grid-area: footer;
  background-color: #fd9644;
}
.wrapper {
  display: grid;
  grid-gap: 20px;
  grid-template-columns: 1fr 3fr;
  grid-template-areas:
    "logo  header"
    "sidebar content"
    "footer  footer";
}

#outer-grid {
  display: grid;
  grid-template-rows: 1fr 1fr;
  grid-template-columns: repeat(12fr, auto);
  grid-gap: 10px;
}
#outer-grid > div {
  background-color: red;
  color: white;
  font-size: 4vw;
  padding: 10px;
}
#inner-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 5px;
}
#inner-grid > div {
  background: salmon;
  padding: 10px;
}

#inner-grid2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 5px;
}
#inner-grid2col > div {
  background: lightgreen;
  padding: 10px;
}

#inner-grid3col {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 5px;
}
#inner-grid3col > div {
  background: lightgreen;
  padding: 10px;
}