/* ====== Contact-Page-Start ====== */

.title-header {
       text-align: center;
       margin-top: 3%;
}

.contact-main-container {
       display: flex;
       flex: 0 0 100%;
       width: 100%;
       flex-wrap: wrap;
}

.contact-address {
       flex: 0 0 50%;
       width: 50%;
}

.contact-add {
       margin-bottom: 5%;
}

.contact-add h4 {
       font-size: 18px;
       letter-spacing: 0.5px;
       padding-bottom: 2%;

}

.contact-add a {
       font-family: sans-serif;
       font-size: 15px;
       letter-spacing: 0.7px;
       color: var(--text-h-700);
       transition: all 0.5s;
}
.contact-add a:hover{
       color: gray;
       font-family: 'Roboto-900';

}

.contact-form {
       flex: 0 0 50%;
       width: 50%;

}

.contact-inp-5 {
       display: flex;
       justify-content: space-between;
       align-items: center;
       flex-wrap: wrap;
}

.contact-form textarea {
       display: block;
       width: 99%;
       height: 150px;
       border-radius: 10px;
       padding: 13px 15px;
       font-size: 15px;
       resize: none;
       color: var(--text-a-700);
       letter-spacing: 0.7px;
       word-spacing: 0.7px;
       border: 1px solid var(--text-50);
       margin: auto;
}

.btn {
       border: none;
       padding: 15px 20px;
       border-radius: 25px;
       margin: 15px 0;
       font-size: 17px;
       cursor: pointer;
       transition: all 1s;
}

#Name,
#Email,
#Phone,
#Web {
       flex: 0 0 49.5%;
       width: 50%;
       font-size: 15px;
       padding: 13px 15px;
       border-radius: 25px;
       margin-bottom: 10px;
       border: 1px solid var(--text-50);
       color: var(--text-a-700);
       letter-spacing: 0.7px;
       word-spacing: 0.7px;
       margin: 0 auto 5px auto;
}

.contact-map {
       margin: 5% 0;
}

.contact-map iframe {
       width: 100%;
}

/* ====== Contact-Page-End ====== */



/* Responsive Media */
@media (max-width: 1030px) {

       #Name,
       #Email,
       #Phone,
       #Web {
              flex: 0 0 99.5%;
              width: 100%;
       }
}

@media (max-width: 750px) {
       .contact-address {
              flex: 0 0 100%;
              width: 100%;
       }

       .contact-form {
              flex: 0 0 100%;
              width: 100%;
       }

       .btn {
              padding: 10px 15px;
              font-size: 16px;
       }
}