@media screen and (max-width: 600px) {
  header {
    padding-top: 5px;
  }
  .container {
    display: flex;
    flex-wrap: wrap;
  }

  .one-third, .two-thirds {
      flex-basis: 100%;
  }
}

/*Language and theme model*/
.modal {
  display: none;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
}

.modal-content {
  margin: 15% auto;
  padding: 20px;
  background-color: #eeeeee;
  border: 1px solid #575656;
  width: 300px;
  text-align: center;
}

.modal-content h3 {
  margin: 5px;
  outline-color: whitesmoke;
  padding: 10px 20px;
  font-size: 14px;
}

.modal-content .button {
  margin: 5px;
  padding: 10px 20px;
  font-size: 14px;
  cursor: pointer;
  border: 1px solid #2aabee;
}

.language-img {
  width: 20px;
}

.language-label {
  font-size: 14px;
  cursor: pointer;
  display: block;
  margin: auto;
  text-align: center;
}

.language-label img {
  width: 20px;
  height: auto;
  margin-left: 5px;
}


.dark-mode-toggle {
  display: flex;
  align-items: center;
}

#dark-mode {
  font-size: 14px;
  font-weight: bold;
}

.toggle-container {
  display: inline-block;
  position: relative;
  width: 28px;
  height: 14px;
}

.toggle-container input[type="checkbox"] {
  opacity: 0;
  width: 0;
  height: 0;
}

.toggle-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  transition: .4s;
  border-radius: 7px;
}

.toggle-slider:before {
  position: absolute;
  content: "";
  height: 10px;
  width: 10px;
  left: 2px;
  bottom: 2px;
  background-color: white;
  transition: .4s;
  border-radius: 50%;
}

input[type="checkbox"]:checked + .toggle-slider {
  background-color: #2AABEE;
}

input[type="checkbox"]:checked + .toggle-slider:before {
  transform: translateX(10px);
}

/*-----------------------------------------------------------*/

body {
    font-family: sans-serif;
    transition: background-color 2s ease;
    /*background-color: rgb(59, 59, 59);*/
  }

  body.dark-mode {
    background-color: #333;
    color: #eee;
  }

  body.dark-mode .modal-content {
    background-color: #333;
  }
  
  header {
    display: flex;
    flex-direction: row;
    padding-bottom: 5px;
  }

  .one-third {
    width: calc(33.33% - 20px);
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 10px;
  }

  .two-thirds {
    width: calc(66.67% - 20px);
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 10px;
  }

  section {
    margin-bottom: 20px;
    box-shadow: 0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19);      
  }

  .icon {
    width: 15px;
    margin-left: 5px;
    margin-right: 5px;
  }

  .icon-large {
    width: 30px;
    height: 30px;
    margin-left: 5px;
    margin-right: 5px;
  }
 
  .container {
    display: flex;
  }
  
  .container-one-third {
    display: flex;
    align-items: center;
  }

  .container-two-thirds {
    display: flex;
    align-items: center;
    margin-left: 5px;
    margin-right: 5px;
  }

  h1, h2, h3, h4, h5, h6, p, a {
    margin-left: 5px;
    margin-right: 5px;
  }

  a {
    text-decoration: underline;
    color: #2AABEE;
  }

  p {
    margin: 5px;
  }

  .contact-info-link {
    margin: 5px;
  }




  .blur {
    filter: blur(5px); /* Adjust the blur intensity as needed */
  }