.kontakt {
  width: 100%;
  height: 100%;
  margin: 30px 0 30px 0;
  display: flex;
  justify-content: space-between;
}

.kontakt .map {
  width: 60%;
  height: 100%;
}

.map iframe {
  box-shadow: 0px 0px 15px rgba(92, 83, 3, 0.7);
  border-radius: 5px;
}

.kontakt .contact {
  width: 40%;
  height: 100%;
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.kontakt .contact form {
  display: flex;
  justify-content: space-around;
  flex-direction: column;
  height: 100%;
  max-width: 100%;
}

.kontakt .contact form input,
.kontakt .contact form textarea {
  width: 100%;
  padding: 1rem;
  margin-bottom: 1.1rem;
  outline: none;
  border: none;
  border-radius: 5px;
  box-shadow: 0px 0px 10px rgba(92, 83, 3, 0.7);
  background-color: rgba(255, 255, 255, 0.5);
}

.kontakt .contact form .input_text:focus {
  border: 2px solid rgb(152, 61, 58);
  background-color: rgba(255, 255, 255, 0.7);
}

.submit_btn {
  color: #fff;
  background-color: rgb(152, 61, 58);
  padding: 10px;
  margin-bottom: 10px;
  border: none;
  cursor: pointer;
  transition: box-shadov 0.5s, transform 0.5s;
}

.submit_btn:hover {
  box-shadow: 0px 0px 10px rgba(92, 83, 3, 0.7);
  transform: scale(1.01);
}

#main {
  background-image: linear-gradient(rgba(232, 219, 167, 0.9)),
    url(../img/idvor.png);
  background-position: center;
  background-size: cover;
}

@media (max-width: 830px) {
  .kontakt {
    flex-direction: column;
  }

  .kontakt .map,
  .kontakt .contact {
    width: 100%;
  }

  .kontakt .map iframe {
    width: 100%;
  }

  .kontakt .contact {
    margin-top: 20px;
  }
}
