App.css

/* * * * * * * */




/* * COLOURS * */




/* * * * * * * */


:root {
  /* our colours*/
  
    --text-primary: #850F78;
    --mediumpurple: #bc15aa;
  /*--purple: #B85BD1; */
     
  
  
    --accen-secondary: #F57D22;
    --accent-primary: #F4CC1E;
    --lightyellow: #fae99e;
    --lightblue: #A0A7F3;
    --verylightblue: #ebecfd;
    --offblack: #32232C;
    --cebitecgray: #8295A4;
  /*--offwhite: #e9dff1; */
     
  
  
    --ourbeige: #FFF6F2;
    --darkerbeige: #e2dad7;
    --background: #FFF6F2;
  /*igem colours*/
     
  
  
    --igemdarkgreen: #006530;
    --igemmediumgreen: #019968;
    --igemlightgreen: #99cb9a;
    --info-border-color: var(--mediumpurple);
    --vp-ct: var(--text-primary);
    --info-border-color: var(--accent-primary);
    --info-bg-color: var(--lightyellow);
    --info-title-color: var(--text-primary);
    --info-code-bg-color: var(--lightyellow);
    --note-border-color: var(--text-primary);
    --note-bg-color: var(--darkoffwhite);
    --note-title-color: var(--text-primary);
    --note-code-bg-color: var(--darkoffwhite);
    --tip-border-color: var(--text-primary);
    --tip-bg-color: var(--darkoffwhite);
    --tip-title-color: var(--text-primary);
    --tip-code-bg-color: var(--darkoffwhite);
    --warning-border-color: var(--accen-secondary);
    --warning-bg-color: var(--lightorange);
    --warning-title-color: var(--text-primary);
    --warning-code-bg-color: var(--lightorange);
  }
  
  
  
  
  /* * * * * * * */
  
  
  
  
  /* * * BODY* * */
  
  
  
  
  /* * * * * * * */
  
  
  body {
  /* padding-top: 56px; */
     
  
  
    background-color: var(--ourbeige);
    color: #493843;
  }
  

  
  p {
    text-align: justify;
  }
  
  a {
    color: var(--lightblue) !important;
    text-decoration: none !important;
  }
  
  
  
  
  
  /* * * * * * * */
  
  
  
  
  /* *SIDEBAR* * */
  
  
  
  
  /* * * * * * * */
  
  
  
  .sidebar {
    border-left: 6px solid;
    border-left-color: var(--text-primary);
    border-color: var(--accent-primary);
    color: var(--text-primary);
    list-style-type: none;
    line-height: 280%;
    margin: 0px 0px;
    padding: 0px 0px;
  }
  
  .sidebar>div>a>span:hover {
    text-shadow: 5px 5px 15px black;
    transition: all 0.1s linear;
  }
  
  .sidebar>div {
    overflow: hidden;
    text-align: center;
    cursor: pointer;
  }
  
  .sidebar>div>a>span {
    padding: 1rem;
    color: var(--text-primary);
  }
  

  
  
  
  /* * * * * * * */
  
  
  
  
  /* * GENERAL * */
  
  
  
  
  /* * * * * * * */
  
  
  .relative {
    position: relative;
  }
  
  .absolute {
    position: absolute;
  }
  
  .left-aligned {
    margin-left: auto;
  }
  
  .align-items-center {
    align-items: center!important
  }
  
  .zweirem {
    padding: 2rem;
  }
  
  .left {
    float: left;
  }
  
  .right {
    float: right;
  }
  
  .sticky-top {
    position: -webkit-sticky;
    position: sticky !important;
    top: 0;
    z-index: 1020;
    top: 80px !important;
    overflow-wrap: break-word;
  }
  
 /*  .fullsize {
    max-height: 100% !important;