:root {
  --color: #DA251C;
  --color2: #3B3B3B;
  --colorw: #fff;
  --background: #2A2A2A;
}
* {
  outline: none!important
}

.errorhtml {
  position: absolute;
      left: 0;
      right: 0;
      top: 157px;
      bottom: 0;
      height: 20px;
      margin: auto;
      text-align: center;
  } .circle-loader {
    margin-bottom: 3.5em;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-left-color: #5cb85c;
    animation: loader-spin 1.2s infinite linear;
    position: relative;
    display: inline-block;
    vertical-align: top;
    border-radius: 50%;
    width: 7em;
    height: 7em;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  
  .load-complete {
    -webkit-animation: none;
    animation: none;
    border-color: #5cb85c;
    transition: border 500ms ease-out;
  }
  .load-complete.error {
    border-color: #caa933;
  }
  .checkmark, .errormark {
    display: none;
  }
  .checkmark.draw:after  {
    animation-duration: 800ms;
    animation-timing-function: ease;
    animation-name: checkmark;
    transform: scaleX(-1) rotate(135deg);
  }
  .errormark.draw:after {
    transform: scaleX(-1) rotate(136deg)!important;
  }
  .errormark.draw:before {
    transform: scaleX(-1) rotate(-225deg)!important;
  }
  .errormark:after, .errormark:before, .checkmark:after {
    opacity: 1;
    position: absolute;
    content: "";
    transform-origin: left top;
    width: 1.75em;
    height: 1.75em;
    height: 1.75em;
  }
  .checkmark:after {
    height: 3.5em;
    border-right: 3px solid #5cb85c;
    border-top: 3px solid #5cb85c;
    left: 1.75em;
    top: 3.5em;
  }
  .errormark:after {
    left: 35px;
    top: 75px;
    border-bottom: 3px solid #caa933;
    border-left: 3px solid #caa933;
  }
  .errormark:before {
    left: 35px;
    top: 2.5em;
    border-top: 3px solid #caa933;
    border-right: 3px solid #caa933;
  }
  @keyframes loader-spin {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  @keyframes checkmark {
    0% {
      height: 0;
      width: 0;
      opacity: 1;
    }
    20% {
      height: 0;
      width: 1.75em;
      opacity: 1;
    }
    40% {
      height: 3.5em;
      width: 1.75em;
      opacity: 1;
    }
    100% {
      height: 3.5em;
      width: 1.75em;
      opacity: 1;
    }
  }
  #ucx-mail-loading {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background: rgba(255,255,255,0.9);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column-reverse;
      z-index: 2;
      opacity: 0;
      pointer-events: none;
      transition: .5s all
  }
  #ucx-mail-loading.active {
    opacity: 1;
  }
  .ucx-captcha {
    display: flex;
    padding: 0 7px;
    margin: auto;
    justify-content: flex-start;
  }
  .ucx-captcha img {
    width: 160px;
    height: 60px;
    border-radius:5px;
    margin-right: 10px;
  }
  .ucx-captcha p {
    padding-left: 15px;
  }
  .ucx-captcha a {
      padding: 5px 10px;
      border-radius:5px;
      font-size: 13px;
      font-weight: 400;
      border:1px solid #111;
      color: #111;
      cursor: pointer;
      line-height: 51px;
      height: 60px;
      float: right;
  }
  .ucx-captcha input {
    width:100%;
    flex: 1;
      height: 60px;
  }
  .form1 button {
    position: relative;
    z-index: 2;
    padding: 15px 60px;
    background: transparent;
    border-radius: 40px;
    font-size: 16px;
    font-weight: 600;
    border: 2px solid var(--color);
    transition: .3s all;
    color: var(--color);
    margin-top: 15px;
    display: inline-block;
  }
  .form1 button:hover {
    background: var(--color);
    color:#fff;
  }
* {
  outline: none !important;
  box-sizing: border-box;
}

img {
  max-width: 100%;
  max-height: 100%;
}

body {
  font-family: 'Montserrat', sans-serif;
}
.container-box{padding: 0 10%;}
#nav-icon {
	width: 30px;
	height: 30px;
	position: relative;
	margin: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	cursor: pointer;
	float: right;
	top: 35px;
	display:none;
	z-index:999;
}
#nav-icon span {
	display: block;
	position: absolute;
	height: 2px;
	width: 30px;
	background: #fff;
	border-radius: 9px;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}
#nav-icon span:nth-child(1) {
	top: 0px;
}
#nav-icon span:nth-child(2) {
	top: 7px;
}
#nav-icon span:nth-child(3) {
	top: 14px;
}
#nav-icon.open span:nth-child(1) {
	top: 7px;
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	-o-transform: rotate(135deg);
	transform: rotate(135deg);
}
#nav-icon.open span:nth-child(2) {
	opacity: 0;
	left: -60px;
}
#nav-icon.open span:nth-child(3) {
	top: 7px;
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	transform: rotate(-135deg);
}
@media all and (max-width:1240px) {
#nav-icon {
	display: none;
}
#nav-icon span {
}
}
@media all and (max-width: 991px) {
#nav-icon span {
	margin:auto;
}

}

@media all and (max-width: 768px) {
#nav-icon {
	top: 30px;
}

#nav-icon span {
}

#nav-icon span:nth-child(1) {
}
#nav-icon span:nth-child(2) {
}
#nav-icon span:nth-child(3) {
}
}

@media all and (max-width:480px) {
#nav-icon {
}
}
.men{display: flex; align-items: center;}
.nav { width:auto; float:right; margin:0 0 0 20px; display:block; position:relative; z-index:999;   }
.nav ul { float:left; margin:0; display:table;  } 
.nav ul li { float:left; margin:0;  text-align:center; margin:0 13px; position:relative;}
.nav ul li a { font-size:18px; color:#fff; padding:8px 0 8px; text-align:center; display:block; font-weight:300; transition: all 0.3s ease-in-out;}
.nav ul li:last-child a { border:none;}
.nav ul li a:hover, nav ul li a.active, nav ul li a:focus {color:var(--color);     clear: both;}
.nav ul li a.active { border-bottom:2px solid #fff;}

.nav ul li ul { position:absolute; z-index:9; left:-20px; padding:31px 0 0 ; border-radius: 0 0 5px 5px; display:none;  }
.nav ul li ul li{ min-width:250px; float:none;   text-align:left;}
.nav ul li ul li a{ text-align:left; border-right: none; color:#111; font-size:12px; padding:10px 20px; border-bottom: 1px solid #ddd; background:#fff;}
.nav ul li ul li a:hover {background:#000; color:#fff; }
 
.nav ul li ul li ul{     left: 100%;    padding: 0;   top: 0; display:none;    border-left: 1px solid #eee;     } 
.nav ul li ul li ul li {    padding: 0;    top: 0;      width: 100%; margin:0;} 



header {
  position: absolute;
  z-index: 99;
  left: 0;
  right: 0;
  padding:15px;

}
.fixed{position: fixed; background-color: var(--color); z-index: 999999;}
.fixed img{height:50px;}
.row>.row{padding: 0 !important}
.contact{color:#6A6A6A; font-size: 16px; margin-bottom: 50px;}
.contact a{color:#6A6A6A; transition: all 0.3s ease;}
.contact a:hover{color:#D21F30; }
.contact span{display: block; line-height: 34px;}
.color{background-color: var(--color); color:#fff;}
.color2{background-color: var(--color2);}
.colorw{background-color: var(--colorw); color:var(--color);}

.bg_color{background-color: var(--background);}

.ilet_btn{padding:10px 25px; border-radius: 50px; transition: all 0.3s ease-in-out; border:0;}
.ilet_btn:hover{background-color: var(--background); color:#fff;}


.baslik{position: relative; padding-bottom: 10px; margin-bottom: 25px;}
.baslik h2{font-size: 36px; font-weight: 700;}
.baslik h2 b{color:var(--color);}
.baslik::before{ content: ''; position: absolute; background-repeat: no-repeat; background-image: url('../img/baslik.png'); height: 10px; width: 100%; bottom: 0; left: 0; }

/* İndex */

.index_slider_item{height: 80vh; position: relative; padding-top: 150px; color:#fff; background-size: cover; background-position: bottom;}
.slider_bilgi h3{ font-size:50px; font-weight: 700; line-height: 70px;}
.slider_bilgi h3 b{color:var(--color);}
.slider_bilgi span{font-size: 15px;  display: block; margin-top: 10px;  width: 80%; margin-bottom: 30px;}
.index_slider .owl-dots{display: none}
/* Döviz Sorgu */
.doviz_sorgu{position: absolute; left:50%;  width: 40%;  height: 100%; z-index: 9999; top: 110px; }
.ucxcode_telefon{margin-top: 0px !important;}

/* box_p*/
.box_p{padding: 100px 0;}

/* index_kurumsal_bilgi */
.index_kurumsal_bilgi{font-size: 15px; line-height: 25px; color:#727272; align-items: center;}
.ic_bilgi{align-items: unset !important}
/*  neden_finike */
.bg{padding: 50px 0 250px 0; background-image: url('../img/bg.svg'); background-size: cover;}
.bg h2{color:#fff; text-align: center; font-weight: 700;}
.neden_slider .owl-stage {display: flex;flex-direction: row;
  flex-wrap: wrap;}
.neden_slider .owl-stage  .owl-item{ display: flex;    flex-direction: column; }
.neden_box{margin-top: -200px; }
.neden_item{ height: 100%;  transition:all 0.3s ease-in-out; border-radius: 10px; padding: 50px 15px; background-color: #fff; text-align: center; box-shadow: 0 3px 6px rgba(0,0,0,0.16); margin-bottom: 50px;}
.neden_item:hover{background-color: #000;}
.neden_item:hover h3{color:#fff;}
.neden_item:hover span{color:#fff;}
.neden_item img{height: 100px; margin-bottom: 25px;}
.neden_item h3{color:var(--color2); font-size: 24px; font-weight: 700;}
.neden_item span{color:var(--color2); font-size: 15px; }
.owl-dots .owl-dot span { width: 20px !important; background-color: var(--background) !important; transition: 0.3s ease-in-out !important;}
.owl-dots .owl-dot.active span { width: 50px !important;  background-color: var(--color) !important;}
/* duyuru_box */
.duyuru_box{padding: 30px; box-shadow: 0 3px 6px rgba(0,0,0,0.16); border-radius: 10px; margin-top: 50px !important;}
.duyuru_item{margin: 10px 0; border-left:2px solid #cdcdcd; padding-left:10px; width:100%; display:block;}
.duyuru_item h2{font-size: 20px; font-weight: 700; cursor: pointer;}
.collapse{font-size: 14px; line-height: 24px; color:var(--color2) ;}


/* footer */
footer{background-color: var(--color2); padding: 50px 0;}
footer img{height: 80px;;}
footer span{display: block; margin-top: 15px; color:#fff; font-size: 13px;}
footer h5{color:#fff; font-size: 24px; font-weight: 700; position: relative; display: inline-block; padding-bottom: 10px;}
footer h5::before{ position: absolute; content: ''; bottom: 0; left: 0; width: 50%; height: 2px; background-color: #fff;}
footer h5 b{color:var(--color);}
footer ul li{color:#fff;}
footer ul li a{color:#fff; font-size: 13px; }
footer ul li a:hover{color:var(--color);}


/* ic_head */
.ic_head{height: 200px; background-image: url('../img/slider.png');}
.ic_baslik{margin-top:-50px; margin-bottom:50px;}
.ic_baslik h2{padding: 10px 25px; border-radius: 10px; background-color: #fff; display: inline-block;}
.ic_sayfa_bosluk{padding-bottom: 100px;}
.kare{background-size: cover; border-radius: 10px; border:5px solid #fff; position: relative;}
.kare::before{content: ''; transition: all 0.3s ease-in-out; position:absolute; opacity: 0;; top: 0; left: 0; width: 100%; height: 100%; border-radius: 10px;  background-color: rgba(218,37,28,0.80);}
.kare:hover::before{opacity: 1;}

.alt{padding: 20px 0;}
/* Responsive */
/* Portrait */
@media only screen
  and (min-device-width: 320px)
  and (max-device-width: 568px)
 {  
   .container-box{padding: 0 5%;}
   
   .logo a img{height: 50px;}
   #nav-icon{position: absolute;; top: 50%; right: 10%;}
  .nav { width:100%; height:auto; float:left; margin:auto; padding:15px 0; display:table;  position:relative;  display:none; right:0;    }
  .nav ul {position: absolute;   box-shadow: 0 3px 20px rgba(0,0,0,0.20); background-color: #fff; border-radius: 5px; float:left; margin:auto; width:100%; padding:15px 15px; border-top:2px solid #eee;  } 
  .nav ul li { float:none; margin:0; text-align:left;}
  .nav ul li a {color:var(--color2); font-size:14px; padding:8px 0; text-align:left; display:block; font-weight:600; border:none;  clear: both;  }
  .nav ul li ul { border:none; padding:0; left:0; }
  .nav ul li ul li a {color:var(--color2);   font-weight:400; background:none; padding:5px 10px; border-bottom:none; clear:both;}
  .nav ul li ul li a:hover { background:none; color:#2e3192;}
  .nav ul li a:hover, nav ul li a.active, nav ul li a:focus {color:#2e3192;}
  .nav ul li a.active { border-bottom:none;}
   
  .nav ul li ul li ul{     left: 0;    padding:0; margin-left:10px;   top: 0;    border-left:none;     } 
  .nav ul li ul li ul li {    padding: 0;    top: 0;    border-left: none;    width: 100%; margin:0;} 
  .slider_bilgi h3{font-size: 24px;}
  .index_kurumsal_bilgi img{display: none;}
  footer div{ margin-bottom: 25px;}
  .baslik::before{height: 5px; width: 50%;}
  .baslik h2{font-size: 24px;}
  .box_p{padding: 25px 0;}
  }
  @media(max-width:991px){
    #nav-icon {
      display: block;
    }
    
  }