#content {
  padding: 60px;
}

#contact {
  display: flex;
  flex-direction: row;
  background-color: #181818;
  max-height: 70vh;
}

#contact-text {
  display: flex;
  flex-direction: column;
  gap: 10px;

  padding: 40px;
  width: 50%;
}

.contact-value {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
}
.contact-value-icon {
  height: 35px;
  width: auto;
}
.contact-value-name {
  font-size: 18px;
}

#contact-apps {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin-right: 20px;
}

#contact-apps-title {
  font-size: 18px;
}

#contact-apps-section {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

#contact-apps-items {
  display: flex;
  flex-direction: row;
  gap: 10px;
}
.contact-app {
  width: 30px;
  height: 30px;
  border: 2px solid transparent;
  padding: 5px;
  border-radius: 50%;
}

#contact-telegram {
  border-color: #60A1DE;
}
#contact-whatsapp {
  border-color: #69A94B;
}
#contact-instagram {
  background-clip: padding-box, border-box;
  background-origin: padding-box, border-box;
  background:
    linear-gradient(#181818, #181818) padding-box,
    linear-gradient(to top right, #FCC70D, #CF05D3) border-box;
}


#contact-map {
  background-color: #202020;
  width: 50%;
}



#drive {
  display: flex;
  flex-direction: row;
  background-color: #181818;
  max-height: 80vh;
}

#drive-text {
  display: flex;
  flex-direction: column;
  gap: 10px;

  padding: 40px;
  width: 50%;
}


#drive-video {
  background-color: #202020;
  width: 50%;
}

/* feedback messages */
#feedback-message {
  margin-top: 10px;
  font-size: 14px;
}
.feedback-message.success { color: #4CAF50; }
.feedback-message.error   { color: #f44336; }
.feedback-message.info    { color: #FFC107; }

/* feedback consents */
#feedback-consents {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 8px 0 4px;
  font-size: 13px;
}
.feedback-consent {
  display: flex;
  align-items: center;
  gap: 8px;
}
.feedback-consent a { color: #FF854D; }


#feedback {
  display: flex;
  flex-direction: row;
  background-color: #181818;
}


#feedback-text {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 40px;
  width: 40%;
}

.feedback-input {
  background-color: transparent;
  border: none;
  padding: 12px 10px;
  border-bottom: 1px #666 solid;
  font-size: 15px;
  outline: none;
  margin-bottom: 5px;
}
.feedback-input:focus {
  outline: none;
  border: none;
  border-bottom: #EB5E1B 1px solid !important;
}
.feedback-input:user-invalid:not(:placeholder-shown) {
  border-bottom: #ff2a00 1px solid;
}
.feedback-input::placeholder {
  color: #666;
  font-size: 15px;
}

#feedback-submit {
  margin-top: 10px;
  margin-left: auto;
}


#feedback-image {
  background-color: #202020;
  width: 60%;
}
