/* FONTS LIST
    G-fonts:
        Open Sans (Good for text and symbols)
        Noto Sans (Good for text and symbols)
        Catamaran (Only good for Headers, symbols iffy)
        Sarala (Only good for text, symbols iffy, fixed weights)
        
*/

/* Body colours are in hwb so the transparency is the same for all variants)*/
.bodyCV {background-color: hwb(60 95% 0%);
} 

/*Divs*/
 /* The sidebar main navigation menu */
 .SidebarCV {
    height: 100%; /* Full-height: remove this if you want "auto" height */
    width: 11%; /* Set the width of the sidenav */
    position: fixed; /* Fixed Sidebar (stay in place on scroll) */
    z-index: 1; /* Stay on top */
    top: 0; /* Stay at the top */
    left: 0;
    background-color: hwb(89 53% 31%);
    overflow-x: hidden; /* Disable horizontal scroll */
    overflow-y: auto; /* Lets you scroll to the other sidebar links if screen is too small*/
  }

  /* Sidebar */
  /* Profile Pic */
  .MeCV {
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
    margin-top: 8%;
  }

  /* Icons */
  .lin img {
    width: 1.25vw;
    margin-top: 5%;
    margin-left: 33%;
  }

  .git img {
    width: 1.25vw;
  }
  
  .orc img {
    width: 1.25vw;
  }

  /*Text*/
  .SidebarCV p {
    text-decoration: solid;
    text-align: center;
    font-size: 1.5vw;
    font-family: 'Sarala', sans-serif;
    color: hwb(0 0% 100%);
    display: block;
  }

  .SubBar-contentCV {
    background-color: hwb(89 53% 31%);
  }

  .SubBar-contentCV a {
    font-size: 1.3vw;
    color: white;
    text-decoration: none;
    padding: 0.25em 0.25em 0.25em 0.25em;
    text-decoration: solid;
    text-align: center;
    font-family: 'Sarala', sans-serif;
    display: block;
  }

  .SubBar-contentCV a:hover {
    background-color: hwb(60 95% 0%);
    color: black; /*text colour*/
  }

  .SubBar:hover .SubBar-contentCV {
    display: block;
  }

/* Style Mainpage content */
  .MainCV {
    margin-left: 11%; /* Same as the width of .SideBarCV sidenav */
    padding: 0px 10px;
  }

  .BannerCV {
    background-color: hwb(89 53% 31%);
    position: relative;
    z-index:2;
    left:0;
    top:0;
    height: 10%;
    width: 100%;
    padding:0;
    text-align: center;
  }

  .CVSkillsCol {
  column-count: 3;
  column-gap: 5vw;
  column-rule: 1px solid hwb(0 0% 100%);
  }

  .CVSkillsCol p {
  margin-top: 0px;
  }

/* Text Semantics */

h1 {
    font-family: 'Catamaran', sans-serif;
    font-size: 2.5vw;
    position: relative;
    padding-top:0.25%;
    margin-top: 0;
    margin-bottom: 0;
}

/* Sub Headers*/
h2 {
  font-family: 'Catamaran', sans-serif;
  font-size: 1.75vw;
}

h3 {
  font-family: 'Catamaran', sans-serif;
  font-size: 1.2vw;
}

/* The talky bits */
p {
  font-family: 'Noto Sans', sans-serif;
  font-size: 1vw;
  text-align: justify;
}

ul {
  margin-left:-25px; /*Aligns li bullets to p/header margins*/
}

li {
  font-family: 'Noto Sans', sans-serif;
  font-size: 1vw;
  text-align: justify;
}

.MainCV a:link {
  color: hwb(89 24% 54%)
}

.MainCV a:visited {
  color: hwb(269 24% 34%)
}

.MainCV a:hover {
  color: hwb(269 24% 14%)
}

.MainCV a:active {
  color: hwb(89 24% 14%)
}

/*div class to make some sections invisible*/
.hide {
  display: none;
}