.column_container{
  width: 85vw;
  margin: 0 auto;
  max-width: 1080px;
  display: flex;
  flex-direction: row;
}

.sidebar {
  border-style: solid;
  border-width: 1px;
  border-color: #783d9f;
  background-color: #d6cceb;
  padding: 20px;
}

.sideframe{
  width: 220px;
  margin-left: 0px;
  position: fixed;
  padding: 0;
  margin-top: 20px;
}

.content {
  margin-left: 240px;
  margin-top: 20px;
  height: auto;
  border-style: solid;
  border-width: 1px;
  border-color: #783d9f;
  padding: 20px;
  background-color: #d6cceb;
  width: 100%;
}

@media screen and (max-width: 1080px) {
  .column_container {width: 95vw}
}

@media screen and (max-width: 700px) {
  .sideframe {
    width: auto;
    height: auto;
    position: relative;
    margin: 0;
    min-height: 0;
    margin-top: 20px;
  }
  .content {
    margin-left: 0;
    width: auto;
  }
  .column_container { 
    width: auto;
    flex-direction: column-reverse;
  }
}

body {
	font-family:
		system-ui,
		-apple-system,
		'Segoe UI',
		Roboto,
		Helvetica,
		Arial,
		sans-serif,
		'Apple Color Emoji',
		'Segoe UI Emoji';
  background-color: #ffffcc;
  color: #580192;
}

html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}