#contact-info .row {
    margin-bottom: 50px;
}


.contact-icon {
    top: 0;
    left: 0;
    text-align: center;
    background: var(--text-medium-tranparent);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
    padding: 25px;
}

    .contact-icon i {
        display: table-cell;
        vertical-align: middle;
        color: var(--text-highlight);
        font-size: 250%;
    }


.contact-text {
    display: table;
}

    .contact-text p {
        display: table-cell;
        vertical-align: middle;
    }

    .contact-text a {
        font-weight: bold;
        display: table-cell;
        vertical-align: middle;
        text-decoration: none;
        color: var(--text-highlight);
    }

    .contact-text a:hover {
        color: var(--text-highlight);
    }


.contact-form input, .contact-message textarea {
    width: 100%;
    height: 54px;
    background: var(--text-medium-tranparent);
    border: none;
}

.contact-message textarea {
    height: 150px;
}

.contact-message label {
    font-size: 16px;
    color: var(--text-dark-tranparent);
    font-weight: bold;
}

.contact-form label {
    position: relative;
    left: 10px;
    top: -36px;
    font-size: 16px;
    transition: all 0.5s ease;
    color: var(--text-dark-tranparent);
    font-weight: bold;
}

.contact-form input:focus {
    
}


    .contact-form input:focus ~ label,
    .contact-form input:valid ~ label {
        transform: translateY(-40px);
        left: 0;
        color: var(--text-highlight);
    }

.contact-message textarea:focus ~ label,
.contact-message textarea:valid ~ label {
    color: var(--text-highlight);
}

#iletisim .btn-contact {
    background-color: var(--text-dark-tranparent);
    color: var(--text-light);
}


    #contact-map iframe {
        width: 100%;
    }