#sidebar{
  /* min-height:100vh; */
  background-color: #f5f7f2;
  border:1px solid black;
  border-radius: 15px;
  border-spacing: 0;
  transition-property: margin-left;
  transition-duration: 0.05s ;            /* change transition time */
  transition-timing-function: linear;
  margin-left: 0.3125em;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
  z-index: 1;
}

.leftpane-close-nav {
    margin-left: -25%!important;
}

span.openArrow-close {
  display: none;
}

span.closeArrow-close {
  display: none;
}

.step{
  width:100%;

  padding-top: 1em;
  padding-bottom:1em;
}
.step:hover{
  background-color: lightgray;
  border-radius: 15px;
}

.stepname{
  width:70%;
  font-weight: bold;
  font-size: 1em;
  text-align:left;
}
.sub_stepname{
  width:70%;
  font-weight: bold;
  font-size: 1em;
  text-align:left;
  padding-left: 10%;

}
.dropdown_content{
  display:none;
  position:relative;
  width:100%;
  word-wrap: break-word;
  color:black;
  padding-left: 3%;
}
.show{
  display:block;

}
.highlight{
  background-color: #f9dea1;
}
.sidebar .btn {
    border-radius:0!important;
    color:black;
}
.entire_step{
  min-width: 100%;
  border-top:1px solid black;
  border-spacing: 0;
}
.openbtn {
  background-color: #f5f7f2;
  color: black;
  padding: 0.3125em 0.3125em 0em 1.5625em;
  border: 1px solid black;
  border-radius: 16px;
  transform: translateX(-1.6em);
}

.rightpane-content {
  width:100%;
  height: 100%;
}

.webpage{
  width:100%;
  border:1px solid black;
  height: 100vh;
}

.leftpane{
  width:20%;
  float:left;
}

.rightpane{

  margin-left: 20%;
  transition-property: margin-left;
  transition-duration: 0.05s ;            /* change transition time */
  transition-timing-function: linear;
  padding-left: 3.125em;
  padding-right: 3.125em;
  padding-bottom: 4em;
}
.rightpane_navbar_close{
    margin-left: 0!important;
}

@media screen and (max-width:780px){
  .open_nav_btn{
    display: block;
  }
.leftpane{
  height:100%;
  width: 96%;
  transition: 0.5s;
}
.leftpane-close-nav-small-screen-on-load{
  margin-left: -100%!important;
  transition-duration: 0s!important ;
}
  .leftpane-close-nav {
      margin-left: -100%!important;
  }
  .rightpane{
    display: none;
  }
  .rightpane-close-nav-small-screen-on-load{
    display: block!important;
  }
  .rightpane_navbar_close{
  display: block!important;
  }

  span.openArrow-close {
    display: none;
  }
  
  span.closeArrow-close {
    display: none;
  }

}

#next-prev-buttons{
  position: relative;
  padding-top: 0.625em;
}

.page-item .page-link {
  color: white !important;
  background: #f9dea1 !important;
}