/*
 * ─── MAIN STYLING THE CV HOME PAGE ──────────────────────────────────────────────
 */

* {
  box-sizing: border-box;
}

@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond &display=swap");

html {
  background-color: #000;
  color: #ffffff;
  font-family: "Cormorant Garamond", serif;
  font-size: 1.2rem;
}

body {
  background: linear-gradient(
    179.79deg,
    #000,
    #000 37.19%,
    #0a0010 43.13%,
    #1b1300 53.38%,
    #1e0000 62.28%,
    #000 76.78%,
    #000
  );
  color: #f7f7f7;
  margin: 0;
  line-height: normal;
  overflow-anchor: none;
}

.container {
  max-width: 100%;
  margin: 0 auto;
  background-image: url("img/WoodenPanelCV.jpg");
  background-repeat: no-repeat;
  background-position: center top;
  display: flex;
  justify-content: center;
}

/*
   * ─── THESE ARE THE MAIN COLUMN CONTROLS ───────────────────────────────────────────
   */

.allme {
  flex-basis: 20rem;
  padding: 5px;
  background-color: #0000005e;
  margin-top: 117px;
}

.onceupon {
  flex-basis: 22rem;
  padding: 5px;
  background-color: #0000005e;
  margin-top: 117px;
}

.treasures {
  flex-basis: 22rem;
  padding: 5px;
  background-color: #00000000;
  margin-top: 117px;
}

/*
   * ─────────────────────────────────────────────────────────────────── END OF ─────
   */
.sectionMain {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background-color: #000000eb;

  text-align: center;

  background-position: center;
  background-repeat: no-repeat;

  z-index: 1000;
}

.footer {
  background-color: #000000;
  background-image: url(img/FooterBG.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  max-width: 80rem;
  height: 15rem;
  margin: 0 auto;
  text-align: center;
}
@media (max-width: 768px) {
  .footee {
    flex-direction: column-reverse;
  }
  @media (max-width: 1024px) {
    .container {
        flex-direction: row;  
    }
}
@media (max-width: 1024px) {
  .onceupon,
  .allme,
  .treasures {
    flex-basis: 30%;
  }
}

  .column {
    flex-basis: 50%;
  }
}

h3 {
  margin-top: 5px;
  text-transform: uppercase;
}
.footer p {
  font-size: 1rem;
  text-align: center;
  margin-top: 5px;
  text-transform: uppercase;
}

.treasures a {
  text-transform: uppercase;
}
.treasures img {
  width: 22rem;
}

.infoboxes {
  background-color: rgba(124, 124, 124, 0.137);
  border-radius: 10px;
  padding-left: 5px;
  padding-top: 0;
  margin-bottom: 0;
  position: relative;
}

.startlist {
  list-style-type: none;
}

.education-item {
  text-align: left;
  text-decoration: none;
  display: flex;
  align-items: center;
  color: #fff;
  margin-top: -17px;
  margin-bottom: 12px;
}
.education-item a {
  display: flex;
  align-items: center;
  color: white;
  text-decoration: none;
}
.education-item img {
  margin-right: 5px;
  vertical-align: middle;
  margin-top: 5px;
  margin-bottom: 5px;
}

.iconsleft {
  list-style-type: none;
  padding-left: 0;
}

.honors {
  color: goldenrod;
  margin: 0px;
}

.NotableRoles {
  width: 100%;
  height: 100%;
}

.NotableRoles .role {
  color: goldenrod;
  font-weight: bold;
  line-height: 18px;
  word-wrap: break-word;
}

.NotableRoles .description {
  color: white;
  font-weight: normal;
  line-height: 1.2rem;
  word-wrap: break-word;
  text-transform: none;
  padding-bottom: 20px;
}

.ThereWasAn {
  width: 100%;
  height: 100%;
}

.ThereWasAn .title.h3 {
  color: white;
  font-size: 2rem;
  font-weight: bold;
  text-transform: uppercase;
  line-height: 2.5rem;
  word-wrap: break-word;
}

.ThereWasAn .role {
  color: goldenrod;
  font-size: 1rem;

  font-weight: bold;
  text-transform: uppercase;
  line-height: 18px;
  word-wrap: break-word;
}

.ThereWasAn .description {
  color: white;
  font-weight: normal;
  line-height: 1.2rem;
  word-wrap: break-word;
  font-size: 1rem;
  text-transform: none;
}

.description li {
  font-size: 1rem;
  background-image: url("img/Bitcoin2.svg");
  background-repeat: no-repeat;
  background-position: left top;
  text-transform: none;
  font-weight: normal;
  list-style: none;
  padding-left: 45px;
  margin-left: -40px;
}
.phone-link {
  text-decoration: none;
  color: inherit;
}
.nav-link {
  text-decoration: none;
  color: inherit;
}