h1 {
  color: #000000;
}
p {
  color: #000000;
}
ul {
  color: #f2ee7e;
}
.myButton1 {
  background-color: #5d4078;
  text-align: center;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  color: white; /* White text */
  padding: 10px; /* Space inside the button */
  font-size: 35px; /* Text size */
  cursor: pointer; /* Change cursor on hover */
  display: block;
  /* Add a smooth transition for hover effects */
  transition: background-color 0.3s;
  border-radius: 0px;
  border-style: solid;  /* Required: without a style, no border will appear */
  border-width: 3px;
  border-color: #4f3061;
}
.myButton1:hover {
  background-color: #a16dd1; /* Color changes to a darker blue when hovered */
}

.myButton1:active {
  background-color: #fff269; /* Color changes when clicked/active */
}

.myButton1:focus {
  outline: none;             /* Optional: remove default focus outline */
  box-shadow: 0 0 0 3px #5a01a7; /* Add a custom focus ring for accessibility */
}
.myButton2 {
  background-color: #5d4078;
  text-align: center;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  color: white; /* White text */
  padding: 10px 20px; /* Space inside the button */
  font-size: 16px; /* Text size */
  cursor: pointer; /* Change cursor on hover */
  display: block;
  /* Add a smooth transition for hover effects */
  transition: background-color 0.3s;
  border-radius: 0px;
  border-style: solid;  /* Required: without a style, no border will appear */
  border-width: 3px;
  border-color: #4f3061;
}
.myButton2:hover {
  background-color: #a16dd1; /* Color changes to a darker blue when hovered */
}

.myButton2:active {
  background-color: #fff269; /* Color changes when clicked/active */
}

.myButton2:focus {
  outline: none;             /* Optional: remove default focus outline */
  box-shadow: 0 0 0 3px #5a01a7; /* Add a custom focus ring for accessibility */
}

.VentJournalButton {
  background-color: #110024;
  text-align: center;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  color: white; /* White text */
  padding: 10px 20px; /* Space inside the button */
  font-size: 16px; /* Text size */
  cursor: pointer; /* Change cursor on hover */
  display: block;
  /* Add a smooth transition for hover effects */
  transition: background-color 0.3s;
  border-radius: 0px;
  border-style: solid;  /* Required: without a style, no border will appear */
  border-width: 3px;
  border-color: #4f3061;
}
.VentJournalButton:hover {
  background-color: #5000a6; /* Color changes to a darker blue when hovered */
}

.VentJournalButton:active {
  background-color: #edff66; /* Color changes when clicked/active */
}

.VentJournalButton:focus {
  outline: none;             /* Optional: remove default focus outline */
  box-shadow: 0 0 0 3px #5a01a7; /* Add a custom focus ring for accessibility */
}
body {
            display: flex;
            height: 100vh; /* Viewport Height */
            margin: 0; /* Remove default body margin */
            background-image: url("Background1.jpeg");
            background-size: cover;
            background-repeat: no-repeat;
            background-attachment: fixed;
        }
.left-box-flex {
            justify-content: center;
            align-items: center;
            width: 250px;
            height: 1000px;
            background-color: #bfb18a;
            color: white;
            text-align: center;
            padding: 20px;
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
            margin-top: 20px;
            margin-left: 20px;
            margin-bottom: 20px;
}

.left-box-flex{
            border-radius: 0px;
            border-style: solid;  /* Required: without a style, no border will appear */
            border-width: 3px;
            border-color: #a39264;
            padding: 20px;
            width: 200px;
}

.main-content-flex{
            border-radius: 0px;
            border-style: solid;
            border-width: 3px;
            border-color: #a39264;
            padding: 20px;
            width: 200px;
            margin-top: 20px;
            margin-bottom: 20px;
}
/*#bfb18a*/
.main-content-flex {
    width: 700px;
    height: 800px;
    background-color: #ded0ab;
    color: white;
    text-align: left;
    padding: 20px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);

}