/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-image: url("background.jpg");
  background-color: black;
  padding: 10px;
  margin: 0 auto;
  font-family: "Ms Gothic", "sans serif";
  cursor: url('touhou_cursor_7.gif'),auto;
}
.holder {
  margin: 0 auto;
  width: 1100px;
  text-align: center;
}
.header {
  height: 50px;
  width: 903px;
  background-color: black;
  padding: 10px;
  position: relative;
  background-image: url('index-4.html');
  box-shadow: 0px 0px 150px inset white;
}
.main {
  width: 1120px;
  height: 930px;
  overflow:hidden;
  background:transparent;
  margin-top: 10px;
}
.text {
  color: black;
  font-weight:400;
  font-size: 15px;
}
.columnone {
  height:930px;
  width:200px;
  float: left;
  background-image: url('index-5.html');
  box-shadow: 0px 0px 200px inset white ;
  padding: 10px;
  position: relative;
  border-top: white;
  border-left: white;
  border-bottom: white;
}

.columntwo {
  width:700px;
  height:928px;
  background-color: white;
  background-image:url('index-6.html');
  float:left;
  border: 1px solid rgb(65, 55, 60);
}

.columnthree {
  width: 197px;
  height: 871px;
  float: right;
  background: transparent;
}

a {
color: black;

}

.article {
  background-color: transparent;
  box-shadow: 0px 0px 400px inset white ;
}
mark {
  color: black;
  background: rgb(255, 209, 231);
  opacity: 50;
  font-size: 18px;
}
.p1 {
  color: black;
  margin-bottom: 0px;
  margin-top: 2px;
  margin-left: 4px;
}
.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width:100%;
}



.parent {
  display: flex;
  justify-content: space-between; /* This will put space between the columns */
  margin: auto;
}

.columnone {
  flex-grow: 15;
  flex-shrink: 1;
  flex-basis: 15%;
  height: 90%;
  margin-right: 5px;
  margin-top: 5px;
}

.columntwo {
  flex-grow: 68.5;
  flex-shrink: 1;
  flex-basis: 68.5%;
  height: 90%;
}

.columnthree { /* Assuming you have a column three, I didn't see it in the given code. */
  flex-grow: 16.5; /* Adjust this value based on your requirement */
  flex-shrink: 1;
  flex-basis: 16.5%;
  height: 90%;
  /* Add other required styles here */
}

.logo-section {
  width:88.7%;
  height:30.5%;
  float:left;
  border:1px solid pink;
  padding:10px;
  background-image:url("background1.jpg")
}

.navigation-section {
  background-image:url('background2.jpg');
  width:100%;
  text-align:left;
  text-height:20px;
  margin:0px auto;
  font-size: 24px;
  line-height: 2;
}

.main-section {
  width:52%;
  height:30%;
  padding:10px;
  border:1px solid pink;
  background-image:url('background3.jpg');
  margin-top:3px;
  float:left;
  margin-left:5px;
}

.main-content {
  height:82%;
  border: 1px solid rgb(60, 30, 44);
  padding: 5px;position: relative;
  overflow-x:hidden;
  overflow-y:scroll;
  background-image:url('background4.jpg');
  margin-top:15px
}

.todolist-section {
  background-image:url('background4.jpg');
  width:100%;
  text-align:left;
  margin:0px auto;
  font-size: 11px;
}