div#kapsayici{
    background:#fff;
}
.wrapper-architectural{ width: 100%; background-color: grey; }
.kapsayici{ position: relative; }
.ortaTasi{ position: relative; }
.architectural_design{ margin:0; padding: 0; }
.architectural-design-top { position: absolute; top: 0; left: 0;  }
.architectural-design-bottom{ position: absolute; right: 0; bottom:-100px;  }
.architectural-design-wrap{ width: 100%; margin-top: 50px; margin-bottom: 100px; position: relative; }
.space{ margin:0 40px; }
.meetlogo img{ width: 100%; }
.text-layer-top h2{   font-family: 'caracasbold'; font-size: 2.5vw; color:#858a90; margin:0; padding: 0; }

.text-layer-top p{ font-family: 'caracasregular'; font-size: 30px; color:#858a90; margin-top: 18vh; margin-bottom: 0; }

.logos { width: 100%; margin:40px 0 0 0; padding: 0; display: inline-block;  }

.logos img { width: 100%;  }

.architectural-text{ width: 100%; margin-top: 50px; position: relative; }
.architectural-text .top{ }
.architectural-text .icon{ width: 131px; height: 131px; position: absolute; top:10px; left:-32px; }
.architectural-text .top img { width: 100%; float: left; position: relative; }
.architectural-text .middle{ background-color: #6fc1c5; min-height: 150px; float: left; position: relative; vertical-align: bottom; }
.architectural-text .middle p{ font-family: 'caracasmedium'; font-size: 25px; color: #ffffff; padding: 0 80px; }
.architectural-text .middle p span { font-family: 'caracasbold'; font-size: 25px; color: #ffffff; }
.architectural-text .bottom{}
.architectural-text .bottom img { width: 100%; }
.formItem span.sample{ width: 10%!important; }
.text-alone{ margin: 80px 0; text-align: center;  }
.text-alone h2{ font-family: 'caracasdemibold';  font-size: 30px; line-height: 50px; color:#848a90; }


.contact-form{ padding: 0!important; margin-top:0!important; position: relative; }

#contact-form{ padding: 0!important; margin-top:0!important; position: relative; }
.iletisim-part{ width: 100%; background-color: #fe5858; margin-top: 20px; color:#fff; min-height: 395px; z-index:7;}
.iletisim-part h2{font-family: 'Gotham-Bold'; padding: 40px 80px 0 80px; } 
.form-part{ width: 82%; float: left; }   
.formItem{ margin: 20px 0!important; padding: 0 0 0 80px; }
}
.formItem input[type="text"], input[type="email"], input[type="tel"] {
    width: 60% !important; border-bottom: 1px solid #fff !important;
}
.formItem span.sample:before{
  content: ' '!important; 
}
.formItem span.sample, .formItem span{ font-family: 'Gotham-Bold'; line-height: 25px; }
#btn_content{ position: relative; float: left;  margin:70px 0 0 70px!important;}
.meet-your-mood-text{ position: relative; float: left; margin-top: 40px; margin-left:-10px }

.purple-img{ position: absolute; top: 0; left: -26px; z-index: 8; }
.yellow-img{ position: absolute; top: -50px; right: 0px; z-index: 8; text-align: right;  }
.yellow-img img{ width: 30%; }
.white-img{ position: absolute; bottom: 30px; right: 200px; z-index: 8; }
.moodconcept select{ width: 80%; height: 30px; background: none; border:none; border-bottom: solid 1px #fff; line-height: 50px; margin: 0 auto 0 9px; }
.moodconcept select option{ color: #000 }

.successPart p{ padding:120px 80px 0 80px; font-size: 25px; }
.successPart h2{ margin:0 0 20px 0; padding: 0 80px; font-size: 30px; }

.tasarimzirvesi{ margin: 80px 0; text-align: center; }
.tasarimzirvesi p{ font-family: 'caracasdemibold'; font-size: 30px; line-height: 50px; color: #848a90; }
.tasarimzirvesi p a{ text-decoration: underline; font-size: 26px; }
.tasarimzirvesi p a:hover{  color:#337ab7!important; }
.tasarimzirvesi p a:focus{  color:#337ab7!important; }

.burosit-logo{  margin-top: 4px; }
.action-button:active {
    transform: none !important;
}

.errorPart {
    width: 80%; float: left; margin-top: 170px; text-align: center; font-size: 30px;
}


@media only screen and (max-width: 980px) {
    .text-layer-top{ margin-top:70px; }
    .text-layer-top h2{ font-size: 50px; line-height: 60px; }
    .text-layer-top p{ font-size: 40px; position: relative; display: inline-block; margin-top: 20px!important; }
    .logos {margin:30px 0 0 0;}
    .logos img {  margin:10px 0 20px 0; }
    .architectural-text .icon{ left:-40px; top:0; }
    .meet-your-mood-text{ text-align: center; width: 100%; margin: 50px 0; }
    .space{ margin:0; }
    .yellow-img{ text-align: right; top:-22px; right: 0;}
    .yellow-img img{width: 30%;}
    /*.formItem input[type="text"], input[type="email"], input[type="tel"]{ width: 65% !important }*/
    
    .burosit-logo { text-align: center; margin-top: 50px; }
   .burosit-logo img { width: 50%; }
     .meetlogo img{ width: 70%!important; }
}
 

@media only screen and (max-width: 768px) {
   
    .text-layer-top{ margin-top:50px; }
    .architectural-text .middle p{ padding: 0 20px; }
    .architectural-text .middle p, .architectural-text .middle p span{ font-size: 16px;}
    .architectural-text .icon{ top:-20px; left:-20px;}
    .architectural-text .icon img{ width: 50% }

    .iletisim-part h2{ padding: 0px 0 0 0px; text-align: center; }
    .form-part{ width: 100%; float: left; } 
    .formItem{ padding: 0 20px; } 
    #btn_content{  margin: 70px auto 0!important; }
    .white-img{ right: 20px !important }
    .purple-img{ top: -10px; left: -10px; }
    .purple-img img{ width: 80%; }
    .yellow-img{ text-align: right; top:-22px; right: 0;}
    .yellow-img img{width: 30%;}
    .formItem input[type="text"], input[type="email"], input[type="tel"]{ width: 80% !important }
    #contact_form_btn{ margin-left: 10px }
    .successPart p { padding: 120px 10px 0 10px; font-size: 12px; }
    .successPart h2{ font-size: 15px!important; }

    .text-alone h2{ font-size: 62px; line-height: 70px; }
    .meetlogo img{ width: 70%; }
    
}
@media only screen and (max-width: 480px) {
    .successPart p { text-align: center; }
    .iletisim-part .container { padding: 0 0 0 15px!important; }    
    .formItem span.sample{ min-width: 14%!important;  font-size: 12px!important; font-weight: normal!important; }
    .yellow-img  { display: none}
    .purple-img { display: none }
    .white-img { display: none }
    .text-alone h2{ font-size: 62px; line-height: 70px; }
    .burosit-logo img { width: 80%; }
    .meetlogo img{ width: 70%; }
}

@media screen and (min-width: 1024px) and (max-width: 1224px){
    .text-layer-top p{ margin-top: 10vh;}
}

@media screen and (min-width: 1225px) and (max-width: 1500px){
    .text-layer-top p{ margin-top: 18vh;}
}

@media screen and (max-width: 1500px){
    .meetlogo img{ width: 85%; }
}

@media screen and (max-width: 1024px) {
    .architectural-design-bottom{ bottom: -20px; }
}