@import url(../Components/Alerts/alerts.css);
@import url(../Components/Avatar/avatar.css);
@import url(../Components/Badges/badges.css);
@import url(../Components/Buttons/buttons.css);
@import url(../Components/Cards/cards.css);
@import url(../Components/image/image.css);
@import url(../Components/Input/input.css);
@import url(../Components/Snackbar/snackbar.css);
@import url(../css/landing.css);
@import url(../css/nord.min.css);

*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
.content-bar{
    width: 60vw;
}
.doc-content{
    display: flex;
    width: 97vw;
    padding: 0 5rem 2rem 4rem;
    padding-right: 2rem;
    padding-bottom: 3rem;
  }
.content-title {
    padding: 1rem 0;
    font-size: 32px;
  }
  
  .content-subtitle {
    color: var(--dark-gray-text);
    padding-bottom: 1rem;
  }
  
  .content-example {
    display: flex;
    justify-content: center;
    /* width: 75vw; */
    min-height: 100px;
    width: 100%;
    box-shadow: rgb(0 0 0 / 2%) 0px 1px 3px 0px,
      rgb(27 31 35 / 15%) 0px 0px 0px 1px;
    background-color: var(--example-background);
    border-radius: 10px;
    align-items: center;
    gap: 10px;
  }

.content-heading{
    border-bottom: 1px solid #d9d9d9;
    padding: 1rem;
    width: max-content;
}

a{
    text-decoration: none;
    color: var(--text-color-light);
}

.side-bar{
    display: flex;
    flex-direction: column;
    width: 25vw;
    
    cursor: pointer;
}

.item-list{
    display: flex;
    flex-direction: column;
    gap: 10px;
    list-style-type: none;
    padding: 1rem;
    font-size: 13px;
}

.padding_bottom{
    padding: 2rem;
}