.work-wrapper .work .info {
  display: flex; }
  .work-wrapper .work .info .duration {
    min-width: 50px;
    text-align: center;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    background: var(--green); }
    @media screen and (min-width: 500px) {
      .work-wrapper .work .info .duration {
        min-width: 100px;
        height: 80px; } }
    .work-wrapper .work .info .duration .separator {
      line-height: 10px; }
  .work-wrapper .work .info .company {
    position: relative;
    display: inline-flex;
    width: 100%;
    flex-direction: column;
    justify-content: center;
    padding: 10px 110px 10px 20px;
    background: var(--dark-lighter); }
    .work-wrapper .work .info .company .office {
      position: absolute;
      top: 20px;
      right: 20px;
      font-size: 14px;
      padding: 10px;
      background: var(--dark); }
.work-wrapper .work .description {
  padding: 20px;
  margin-left: 50px;
  border-top: 1px solid var(--green);
  border-left: 1px solid var(--green); }
  @media screen and (min-width: 500px) {
    .work-wrapper .work .description {
      margin-left: 100px; } }
  .work-wrapper .work .description summary {
    position: relative;
    outline: 0;
    cursor: pointer; }
    .work-wrapper .work .description summary::before {
      content: "+";
      position: absolute;
      font-size: 30px;
      width: 45px;
      height: 45px;
      padding: 10px;
      line-height: 20px;
      text-align: center;
      left: -70px;
      top: calc(50% - 22px);
      transform-origin: center;
      transition: 200ms linear;
      cursor: pointer; }
      @media screen and (min-width: 500px) {
        .work-wrapper .work .description summary::before {
          left: -95px; } }
  .work-wrapper .work .description[open] .dots {
    display: none; }
  .work-wrapper .work .description[open] summary::before {
    transform: rotate(45deg);
    font-size: 32px; }

details summary::-webkit-details-marker,
details summary::marker {
  display: none;
  content: ""; }

details[open] summary ~ * {
  animation: open 0.4s ease-in-out; }

@keyframes open {
  0% {
    opacity: 0;
    height: 0; }
  100% {
    opacity: 1;
    height: 100%; } }

/*# sourceMappingURL=experience.css.map */