html {
    font-size: 14px;
  }
  
  @media (min-width: 768px) {
    html {
      font-size: 16px;
    }
  }
  
  .btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
  }
  
  html {
    position: relative;
    min-height: 100%;
  }
  
  body {
    margin-bottom: 60px;
  }
  
  
  .overview {
      display: flex;
      flex-direction: column;
      
  }
  
  .overview-picture {
      margin: auto;
      display: flex;
      flex-direction: column;
      width: 40%;
      align-content: center;
  }
  
  .profilepicture {
      border: 4px solid black;
      border-radius: 50%;
      object-fit: cover;
      overflow: hidden;
      margin: 15px;
      width: 60%;
      height: 100%;
      animation: glow 3s ease alternate;
  }
  
  .introduction {
      display: flex;
      flex-direction: column
  }
  
  
  .skills {
      display: flex;
      flex-direction: column
  }
  
  .skills-experiences {
      display: flex;
      flex-direction: column;
      width: fit-content;
  }
  
  .skills-experiences-education {
      margin: auto;
      display: flex;
      flex-direction: column
  }
  
  .education {
      margin: left;
      align-content: flex-start;
      display: flex;
      flex-direction: row
  }
  
  .skills-experiences-workexperience {
      margin: auto;
      display: flex;
      flex-direction: Column
  }
  
  .workexperience {
      margin: left;
      align-content: flex-start;
      display: flex;
      flex-direction: row
  }
  
  .skills-aditional {
      display: flex;
      flex-direction: column
  }
  
  .education-details{
    display: flex;
    flex-direction: column;
    max-width: 40%;
    min-width: 30%;
    width: auto;
  }

  .education-description{
    display: flex;
    flex-direction: column;
    overflow-wrap: normal;
    max-width: 70%;
    min-width: 60%;
    width: auto;
  }

  .workexperience-details{
    display: flex;
    flex-direction: column;
    max-width: 40%;
    min-width: 30%;
    width: auto;
  }

  .workexperience-description{
    display: flex;
    flex-direction: column;
    overflow-wrap: normal;
    max-width: 70%;
    min-width: 60%;
    width: auto;
  }


  .container2 {
      display: flex;
      flex-direction: column;
      font-family: Arial;
  }
  
  .gdpr-consent {
      display: flex;
      flex-direction: column;
      align-items: center;
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 10px;
      margin: 5px;
      border: 2px solid gray;
      background: white;
      border-radius: 15px 15px 15px 15px;
  }
  
  .gdpr-consent__description {
      display: flex;
      justify-content: center;
  }
  
  .gdpr-consent__choice {
      display: flex;
      flex-direction: row-reverse;
      justify-content: space-evenly;
      width: 100%;
  }
  
  .gdpr-consent__button--accept {
      background-color: #d5f5d5;
      padding: 10px;
      border-radius: 10px;
      border: 1px solid gray;
  }
  
  .gdpr-consent__button--accept:hover {
      background-color: #c5e3c5;
  }
  
  .gdpr-consent__button--reject {
      padding: 10px;
      border-radius: 10px;
      border: 1px solid gray;
  }
  
  .hide {
      display: none;
  }
  
  .show {
      display: block;
  }
  
  .contact {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.form-contactpagina__inputelement{
    display: flex;
    flex-direction: row;
    margin: 15px 0px 15px 0px
}
  
.fx-col{
    flex-direction: column;
}
  
/* Navbar Brand */
a.navbar-brand {
  white-space: normal;
  text-align: center;
  word-break: break-all;
}

/* Navbar Link Color */
a {
  color: #0077cc;
}

/* Primary Button within Navbar */
.btn-primary {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

/* Active State for Nav Pills within Navbar */
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

/* Border Styling for Navbar */
.border-top {
  border-top: 1px solid #e5e5e5;
}
.border-bottom {
  border-bottom: 1px solid #e5e5e5;
}

/* Box Shadow for Navbar */
.box-shadow {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}



  @media only screen and (min-width: 800px) {
      .overview {
          flex-direction: row
      }
  
      .skills {
          flex-direction: row
      }
  
      .skill-experiences {
          display: flex;
          flex-direction: row
      }

      .education-details{
        display: flex;
        flex-direction: column;
        max-width: 30%;
        min-width: 20%;
        width: auto;
      }
    
      .education-description{
        display: flex;
        flex-direction: column;
        overflow-wrap: normal;
        max-width: 80%;
        min-width: 70%;
        width: auto;
      }
  }