html,body{height:100%;margin:0;padding:0}body{overflow-y:scroll}#root{height:100%;margin:0;padding:0}#app{min-height:100%;display:flex;flex-direction:column}#app>header{padding:1rem;display:grid;grid-template-columns:1fr 5fr;gap:2rem}#app>header>span{align-self:center}#app>main{flex-grow:1;padding:1rem}#logo{max-width:200px;max-height:110px;place-self:center}#grid{display:grid;grid-template-columns:1fr 4fr 1fr;gap:2rem}.search-box{width:100%;margin-bottom:1rem}@media screen and (max-width: 1024px){#grid{grid-template-columns:1fr 5fr;grid-template-rows:0fr 1fr}#grid>section:nth-of-type(1){grid-row:span 2}}@media screen and (max-width: 768px){#app>header{grid-template-columns:1fr;text-align:center}#logo{max-height:4rem}#grid{grid-template-columns:1fr 1fr}#grid>section:nth-of-type(1){order:2;grid-column:span 2}}@media screen and (max-width: 512px){#logo{max-height:3rem}#grid{grid-template-columns:1fr}#grid>section:nth-of-type(1){grid-column:span 1}}