#cv {
  background-color: transparent;
  padding: 0 0 5vmin 0;
  width: clamp(0px,100%,700px);
  margin: auto;
  display: grid;
  grid-gap: 2vmin;
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  grid-template-areas:
    "education"
    "skills"
    "experience"
    "art"
    "prices";
  margin-bottom: 5vmin;
}

#cv > div {
  display: grid;
  padding: 5vmin;
  grid-gap: 1.5em;
}

#cv > div > * {
  width: 100%;
  margin: 0;
  padding: 0;
}

#cv > div > div > * {

  margin: 0;
  padding: 0;
}

#education {
  grid-area: education;
}

#experience {
  grid-area: experience;
}

#skills {
  grid-area: skills;
}

#art {
  grid-area: art;
}

#prices {
  grid-area: prices;
}

.small_dot {
  height: 0.5em;
  width: 0.5em;
  background-color: white;
  border-radius: 50%;
  display: inline-block;
}

.medium_dot {
  height: 1em;
  width: 1em;
  background-color: white;
  border-radius: 50%;
  display: inline-block;
}

.large_dot {
  height: 1.5em;
  width: 1.5em;
  background-color: white;
  border-radius: 50%;
  display: inline-block;
}

#cv #education .cv_entry, #cv #art .cv_entry, #cv #prices .cv_entry {
  display: grid;
  grid-template-columns: 7fr 3fr 1fr;
  column-gap: 1em;
  /*grid-template-rows; minmax(1.5em, auto);*/
  /*grid-template-rows: auto;*/
}

#cv #skills .cv_entry {
  display: grid;
  grid-template-columns: 10fr 1fr;
  column-gap: 1em;
  /*grid-template-rows: repeat(auto-fit, 3em);*/
  /*grid-template-rows: 2em repeat(auto-fill, 1.75em) 1.75em;*/
  /*grid-template-rows: auto;*/
}

.cv_skill_name {
  grid-area: 1 / 1 / 2 / 3;
}

.affiliation {
  font-weight: lighter;
}

.experience>.cv_entry {
  display: grid;
  grid-template-columns: 7fr 3fr 1fr;
  column-gap: 1em;
  grid-template-areas:
  "name . ."
  "text affi year";
}
.experience>.cv_entry>h3 {
  grid-area: name;
}
.cv_exp_text {
  grid-area: text;
}
.cv_exp_affi {
  grid-area: affi;
}
.cv_exp_year {
  grid-area: year;
}

@media only screen and (min-width: 1100px) {
  #cv {
    background-color: transparent;
    padding: 0 0 5vmin 0;
    /*width: clamp(0px,100%,700px);*/
    width: 100%;
    margin: auto;
    display: grid;
    grid-gap: 2vmin;
    grid-template-columns: 4fr 5fr;
    grid-template-rows: auto auto auto;
    grid-template-areas:
      "skills education"
      "skills experience"
      "art experience"
      "prices experience";
    margin-bottom: 5vmin;
  }
}
