@font-face {
    font-family: 'Wotfard';
    src: url('/fonts/Wotfard-Regular.otf') format('opentype');
    font-weight: 400;
}


.contactHeader{
    display:flex;
    width:100%;
    height:auto;
    position:relative;
    margin-top:0px;
}

.form-control{
    font-family: 'Wotfard'!important;
    border-radius:15px;
    padding-left: 12px;
}

.form-message{
    border-radius:15px;
}
.captcha-container {
    display: flex;
    align-items: center;
    gap: 10px; /* image ile input arası boşluk */
}

.captcha-container img {
    height: 50px;
    width: auto;
}

input[name="captcha_1"] {
    width: 150px !important;
    border-radius: 50px;
    padding: 5px 10px;
}
.sendingGroupContainer{
    display:flex;
    flex-direction:row;
    justify-content:flex-end;
    gap:5px;
    align-items:center;
}

.map{
    width:100%;
    height:auto;
}

.addressContainer,
.formContainer{
    padding-top:50px;
    display:flex;
    flex-direction:column;
    width:50%;
    margin:auto;
    color:white;
    font-weight:200;
    
    }

.phone{
    padding-top:15px;
}
.phone a:hover{
    color:gray;
    cursor:pointer;
}

.formTitle{
    font-size:29px;
    font-weight:200;
    margin-top:40px;
}

.formInnerContainer{
    display:flex;
    flex-direction:column;
    gap:20px;
    width:100%;
    margin:auto;
    margin-top:-20px;
    padding-bottom:5%;
}

input{
    width:100%;
    height:50px;
    border-radius:5px;
}

input:focus{
     border-color:magenta;
    outline: none;
}



textarea{
    width:100%;
    border: 2px solid #333;
}

textarea::placeholder{
    padding-top:10px !important;
}

textarea:focus{
     border-color:magenta;
    outline: none;
    border: 2px solid magenta;
}


.fields{
    padding-top:20px;
}

.nameSurname{
    display:flex;
}


.company{
}

.email{
}

.message{
}

.btn-primary{
    padding:13px 20px 13px 20px;
    border-radius:30px;
    border:none;
    cursor:pointer;
    color:gray;
}

.btn-primary:hover{
color:#333;
    
}


.kvkk{
    padding-top:5%;
    display:flex;
    width:50%;
    margin:auto;
    justify-content:left;
    text-align:left;
}


.kvkk a:hover{
    color:gray;
}

@media screen and (min-width:300px) and (max-width:1000px){
    .addressContainer,
.formContainer{
    padding-top:50px;
    display:flex;
    flex-direction:column;
    width:80%;
    margin:auto;
    color:white;
    font-weight:200;
    
    }
}