/*@font-face {
  font-family: "HelveticaNeue";
  src: url(../fonts/HelveticaNeue-Bold.eot) format("embedded-opentype"),
    url(../fonts/HelveticaNeue-Bold.woff) format("woff"),
    url(../fonts/HelveticaNeue-Bold.ttf) format("truetype"),
    url(../fonts/HelveticaNeue-Bold.svg) format("svg");
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: "HelveticaNeue";
  src: url(../fonts/HelveticaNeue-Light.eot) format("embedded-opentype"),
    url(../fonts/HelveticaNeue-Light.woff) format("woff"),
    url(../fonts/HelveticaNeue-Light.ttf) format("truetype"),
    url(../fonts/HelveticaNeue-Light.svg) format("svg");
  font-weight: 400;
  font-style: normal;
} */

@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
:root {
  /* Color Variables Start*/
  --dark-text-color: #333333;
  --dark-back-color: #333333;
  --dark-border-color: #333333;
  --white-text-color: #FFFFFF;
  --white-back-color: #F2F2F2;
  --primary-text-color: #CB0C68;
  --primary-back-color: #CB0C68;
  --primary-border-color: #CB0C68;
  --success-text-color: #25A74C;
  --success-back-color: #25A74C;
  --success-border-color: #25A74C;
  --inactive-text-color: #828282;
  --inactive-back-color: #828282;
  --inactive-border-color: #828282;
  --disabled-back-color: #F2F2F2;
  --disabled-border-color: #F2F2F2;
  --base-font: 'Rubik', system-ui;
  /* Color Variables Start*/
  /* Typography Variables Start*/
  --font-emphasis: normal 500 24px var(--base-font);
  --font-text-title: normal 500 14px var(--base-font);
  --font-text: normal 300 16px/22px var(--base-font);
  --font-btn: normal 500 12px var(--base-font);
  /* Typography Variables End*/
}

html,* {
  scroll-behavior: smooth;
}

/* var(--primary-back-color) en son bunlar yapıldı*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, input, select, textarea, button, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  box-sizing: border-box;
  color: var(--dark-text-color);
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
  font-family: var(--base-font);
}

img {
  max-width: 100%;
  height: auto;
  border: 0;
  display: block;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

a {
  text-decoration: none !important;
}

:focus {
  outline: 0;
}

.clear {
  clear: both;
}

select {
  width: 100%;
  height: 50px;
  padding: 0 15px !important;
  box-sizing: border-box;
  border: none;
  font-size: 14px;
  transition: 300ms all;
  box-shadow: 0px 0px 0px rgba(223, 10, 111, 0);
  border: none;
  -webkit-appearance: none;
  -moz-appearance-radius: 7px;
  appearance: none;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  background: #fff;
  border: 2px solid #e9ebf4;
  background-image: url(../images/icons/select_arrow.png?v1);
  background-position: center right;
  background-repeat: no-repeat;
}

.mobile-menu {
  display: none;
  position: relative;
  top: 0;
  right: 0;
  width: 100%;
  z-index: 1;
  bottom: 0;
  /* background: #02466f; */
  overflow-y: scroll !important;
}

.mobile-menu ul {
  padding: 0;
  margin: 0;
  list-style-type: none;
}

.mobile-menu>div>ul {
  padding-bottom: 100px;
}

.mobile-menu ul li {
  position: relative;
  padding: 0;
  margin: 0;
  border-top: 1px solid #f3f3f3;
  font-weight: 600;
}

.mobile-menu ul li a {
  padding: 15px 25px;
  display: block;
  color: var(--dark-text-color);
  text-decoration: none;
  font-size: 14px;
  line-height: initial;
  font-weight: 600;
}

.mobile-menu ul li a.active {
  background: var(--dark-back-color);
  color: var(--white-text-color);
}

.mobile-menu ul li ul li {
  background: #053958;
}

.mobile-menu ul li ul {
  display: none;
}

.mobile-menu ul li.menu-item-has-children>a {
  pointer-events: none;
  font-weight: 600;
}

.mobile-menu ul li.menu-item-has-children:before {
  top: 23px;
  right: 20px;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(213, 9, 9, 0);
  border-top-color: #ffffff;
  border-width: 5px;
}

.mobile-menu ul li.menu-item-has-children>a {
  padding-right: 40px;
}

.burger-lines, .header, .toggle-menu {
  position: relative;
}

.mobile-menu ul li ul li ul li {
  display: block;
  background: #232935;
  border-bottom: 1px solid #0d1a38;
}

.mobile-menu ul li ul li ul {
  display: block;
}

.toggle-menu {
  display: none;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding: 20px 25px;
  background: none;
  border: none;
  position: absolute;
  top: 0;
  right: 0;
}

.toggle-menu:hover, .toggle-menu:focus {
  outline: 0;
}

.toggle-menu:hover .burger-lines:before, .toggle-menu:hover .burger-lines:after, .toggle-menu:focus .burger-lines:before, .toggle-menu:focus .burger-lines:after {
  background-color: var(--primary-back-color);
}

.toggle-menu.active .burger-lines {
  background: transparent;
}

.toggle-menu.active .burger-lines:before, .toggle-menu.active .burger-lines:after {
  -webkit-transition: top 400ms cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 400ms 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 400ms cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 400ms 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 400ms cubic-bezier(0.165, 0.84, 0.44, 1), transform 400ms 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 400ms cubic-bezier(0.165, 0.84, 0.44, 1), transform 400ms 400ms cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 400ms 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  top: 0;
  width: 20px;
}

.toggle-menu.active .burger-lines:before {
  -webkit-transform: rotate3d(0, 0, 1, 45deg) scale(1.1);
  transform: rotate3d(0, 0, 1, 45deg) scale(1.1);
}

.toggle-menu.active .burger-lines:after {
  -webkit-transform: rotate3d(0, 0, 1, -45deg) scale(1.1);
  transform: rotate3d(0, 0, 1, -45deg) scale(1.1);
}

.burger-lines {
  display: inline-block;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
  width: 25px;
  height: 2px;
  background-color: var(--primary-back-color);
  position: relative;
  top: -6px;
}

.burger-lines:before, .burger-lines:after {
  content: "";
  display: inline-block;
  width: 25px;
  height: 2px;
  background-color: var(--primary-back-color);
  position: absolute;
  left: 0;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transition: top 400ms 400ms cubic-bezier(0.165, 0.84, 0.44, 1), background-color 400ms cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 400ms 400ms cubic-bezier(0.165, 0.84, 0.44, 1), background-color 400ms cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 400ms 400ms cubic-bezier(0.165, 0.84, 0.44, 1), transform 400ms cubic-bezier(0.165, 0.84, 0.44, 1), background-color 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: top 400ms 400ms cubic-bezier(0.165, 0.84, 0.44, 1), transform 400ms cubic-bezier(0.165, 0.84, 0.44, 1), background-color 400ms cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
}

.burger-lines:before {
  top: 8px;
}

.burger-lines:after {
  top: -8px;
}

.animating .mobile-menu, .menu-visible .mobile-menu {
  display: block;
}

.clearfix:before, .clearfix:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}

.clearfix:after {
  clear: both;
}

.container {
  width: 1170px;
  display: block;
  margin: auto;
  position: relative;
  padding: 0px;
}

.page-container {
  position: relative;
  background: #ffffff;
  padding-top: 140px;
}

body.fancybox-active .page-container, body.fancybox-active .header {
  /* -webkit-filter: blur(15px); */
  /* filter: blur(15px); */
}

.fancybox-bg {
  background: rgba(0, 0, 0, 0.5) !important;
}

.fancybox-button svg {
  color: var(--primary-text-color);
}

.header {
  position: fixed;
  left: 0;
  width: 100%;
  transition: 300ms all;
  z-index: 222;
  top: 0px;
  border: none;
  display: inline-block;
  float: left;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
}

.headerBottom {
  display: inline-block;
  width: 100%;
  float: left;
  position: relative;
  height: 100px;
  box-shadow: 0 0 20px 15px #ea57970d;
  background: #fff;
}

.headerTitle {
  float: right;
  font-size: 25px;
  font-family: var(--base-font);
  font-weight: bold;
  margin-right: 20px;
  margin-top: 40px;
  letter-spacing: 0.3px;
  transition: 300ms all;
}

.sticky .headerTitle {
  margin-top: 30px;
}

.sticky .header {
  box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1);
  background: #fff;
  top: -34px;
}

.sticky a.logo {
  width: 150px;
  top: 30px;
}

.sticky .ustMenu>ul>li>a {
  padding: 33px 25px 28px;
}

.sticky .headerBottom {
  height: 80px;
}

.sticky a.isube_btn, .sticky a.musteriOl_btn {
  margin-top: 24px;
}

.ustMenu>ul>li.menu-item-has-children>a {
  padding-right: 40px;
}

.headertop {
  height: 50px;
  background: #372850;
  box-shadow: 0px 0px 1px rgba(255, 255, 255, 0.1);
  z-index: 2;
  position: relative;
  font-size: 14px;
  color: var(--white-text-color);
}

.ustMenu {
  float: left;
  height: 105px;
  display: block;
  margin-left: 90px;
}

a.logo {
  float: left;
  position: relative;
  top: 38px;
  transition: 300ms all;
  width: 185px;
}

a.logo img {
  width: 100%;
  position: relative;
  z-index: 2;
  transition: 300ms all;
}

.ustMenu ul {
  margin-top: 5px;
}

.ustMenu ul li {
  float: left;
  position: relative;
}

.ustMenu ul li:before {}

.ustMenu ul li:hover:before {
  width: 100%;
  right: inherit;
  left: 0px;
}

.ustMenu ul li a {
  color: var(--dark-text-color);
  font-size: 18px;
  line-height: 18px;
  padding: 38px 25px 38px;
  display: block;
  font-weight: 500;
  transition: 300ms all;
  font-family: var(--base-font);
  font-weight: 400;
}

.ustMenu ul li a:hover {
  color: var(--primary-text-color);
}

.ustMenu>ul>li>ul {
  position: absolute;
  left: 0px;
  width: 300px;
  visibility: hidden;
  opacity: 0;
  /* transition: 400ms; */
  margin-top: 0;
  transition-delay: inherit;
  display: block;
  padding: 10px 20px;
  background: #fff;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
  -webkit-border-bottom-right-radius: 6px;
  -webkit-border-bottom-left-radius: 6px;
  -moz-border-radius-bottomright: 6px;
  -moz-border-radius-bottomleft: 6px;
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
  /* border-top: 1px solid #d9dcde; */
  transform: scale(0.7);
}

.ustMenu>ul>li>ul>li {
  margin: 0px;
  width: 100%;
  position: relative;
  float: left;
  border-top: 1px dotted #efefef;
  /* border-left: 1px dashed #efefef; */
}

.ustMenu>ul>li>ul>li:first-child {
  border-top: none;
}

.ustMenu>ul>li>ul>li>a {
  padding: 10px 10px;
  line-height: initial;
  font-weight: 700;
  line-height: initial;
  color: var(--dark-text-color);
  display: block;
  font-size: 17px;
  font-weight: 400;
  transition: 400ms all;
  letter-spacing: 0.3px;
}

.ustMenu>ul>li>ul>li>a:before {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f0da";
  /* margin-right: 8px; */
  visibility: hidden;
  opacity: 0;
  transition: 300ms all;
  color: var(--primary-text-color);
}

.ustMenu>ul>li>ul>li>a:hover:before {
  margin-right: 8px;
  opacity: 1;
  visibility: visible;
}

.ustMenu>ul>li:hover>ul {
  visibility: visible;
  opacity: 1;
  margin-top: 0px;
  /* transition-delay: 500ms; */
  /* transition: 400ms all; */
  transform: scale(1);
}

.ustMenu>ul>li.menu-item-has-children:before {
  display: block;
  content: "";
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-bottom-color: #d9dcde;
  border-width: 8px;
  margin-left: 0px;
  right: inherit;
  bottom: -40px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  transition: 300ms all;
  visibility: hidden;
  opacity: 0;
}

.ustMenu>ul>li.menu-item-has-children:hover:before {
  visibility: hidden;
  opacity: 0;
  transition-delay: 500ms;
  transition: 400ms all;
}

.ustMenu>ul>li>a:hover {
  color: var(--primary-text-color);
}

.ustMenu>ul>li.menu-item-has-children:after {
  content: none;
  position: absolute;
  top: 50%;
  right: 15px;
  border: solid transparent;
  height: 0;
  width: 0;
  pointer-events: none;
  border-color: rgba(213, 9, 9, 0);
  border-top-color: rgba(109, 122, 127, 0.28);
  border-width: 5px;
  float: right;
}

.ustMenu>ul>li.menu-item-has-children {
  padding-right: 0;
}

.ustMenu>ul>li>ul>li:nth-child(2) {}

.ustMenu>ul>li>ul>li>ul {
  border-top: 1px solid rgba(197, 196, 209, 0.6);
  background: #f5f5f7;
  width: 100%;
  position: relative;
  border-left: 4px solid #c5c4d1;
}

.ustMenu>ul>li>ul>li>ul>li {
  border-bottom: 1px dashed #c5c4d1;
  line-height: initial;
  font-weight: 700;
}

.ustMenu>ul>li>ul>li>ul>li:last-child {
  border: none;
}

.ustMenu>ul>li>ul>li>ul>li>a {
  color: var(--dark-text-color);
  display: block;
  padding: 19px 20px;
}

.ustMenu>ul>li>ul>li>ul>li>a:before {
  content: "";
  position: relative;
  width: 8px;
  height: 8px;
  border: 2px solid #ff7049;
  display: block;
  float: left;
  margin-top: 7px;
  border-radius: 50px;
  box-sizing: border-box;
  margin-right: 20px;
}

.ustMenu>ul>li>ul>li a:hover {
  color: var(--primary-text-color);
}

.ustMenu>ul>li>ul>li.menu-item-has-children:before {
  content: "";
  position: absolute;
  right: 20px;
  width: 6px;
  height: 10px;
  background: url(../images/icons/menuArrow.png);
  position: absolute;
  top: 26px;
}

.ustMenu>ul>li>ul>li.menu-item-has-children ul {
  display: none;
}

.ustMenu>ul>li>ul>li.menu-item-has-children:hover ul {
  display: block;
}

.ustMenu ul li ul li:before {
  bottom: 0px;
}

.ustMenu>ul>li:hover>a {
  color: var(--primary-text-color);
  border-left-color: var(--white-border-color);
  border-right-color: var(--white-border-color);
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}

.ustMenu>ul>li:last-child>ul {
  /* left: calc(50% + 75px); */
  /* max-width: 510px; */
}

.ustMenu>ul>li:last-child>ul>li {
  width: 100%;
}

.headerBar {
  height: 35px;
  width: 100%;
  background: #fff;
  display: block;
  float: left;
  position: relative;
  z-index: 2;
}

.headerBar:before {
  content: "";
  width: 100%;
  display: block;
  height: 1px;
  position: absolute;
  bottom: 0px;
  background-image: -moz-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
}

.headerBar .container:before {
  height: 6px;
  width: 1234px;
  position: absolute;
  bottom: -6px;
  display: block;
  content: "";
  background-image: -moz-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
  -webkit-border-bottom-right-radius: 6px;
  -webkit-border-bottom-left-radius: 6px;
  -moz-border-radius-bottomright: 6px;
  -moz-border-radius-bottomleft: 6px;
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
  left: -3%;
}

.hSocial {
  float: right;
}

.hSocial a {
  font-size: 18px;
  line-height: 44px;
  padding: 0 5px;
  transition: 400ms all;
  color: var(--white-text-color);
}

.hSocial a:hover {
  color: #fdb761;
}

.hBarMenu {
  float: right;
}

.hBarMenu ul {}

.hBarMenu ul li {
  float: left;
}

.hBarMenu ul li a {
  display: block;
  line-height: 35px;
  padding: 0 15px;
  font-size: 13px;
  transition: 400ms all;
  color: var(--dark-text-color);
}

.hBarTel {
  /* float: left; */
  font-size: 13px;
  line-height: 35px;
  display: inline-block;
}

.hBarTel a {
  float: left;
  line-height: 35px;
  font-size: 16px;
  color: var(--dark-text-color);
  margin-right: 10px;
  font-weight: normal;
  font-family: var(--base-font);
}

.hBarMenu ul li a:hover {
  color: var(--primary-text-color);
}

a.musteriOl_btn {
  border-radius: 4px;
  /* background-image: -moz-linear-gradient( 0deg, rgb(51, 190, 143) 1%, rgb(27, 191, 220) 100%);
   background-image: -webkit-linear-gradient( 0deg, rgb(51, 190, 143) 1%, rgb(27, 191, 220) 100%);
   background-image: -ms-linear-gradient( 0deg, rgb(51, 190, 143) 1%, rgb(27, 191, 220) 100%); */
  background-color: var(--primary-back-color);
  box-shadow: 0px 5px 15px 0px rgba(50, 67, 75, 0.07);
  width: 137px;
  height: 38px;
  display: block;
  float: right;
  text-align: center;
  color: var(--white-text-color);
  margin-top: 34px;
  line-height: 38px;
  font-size: 14px;
  transition: 300ms all;
}

a.musteriOl_btn:hover {
  /* background-image: -moz-linear-gradient( 0deg, rgb(27, 191, 220) 0%, rgb(51, 190, 143) 99%);
   background-image: -webkit-linear-gradient( 0deg, rgb(27, 191, 220) 0%, rgb(51, 190, 143) 99%);
   background-image: -ms-linear-gradient( 0deg, rgb(27, 191, 220) 0%, rgb(51, 190, 143) 99%); */
  background: var(--primary-back-color);
}

a.isube_btn {
  border: 1px solid var(--primary-border-color);
  height: 38px;
  display: block;
  float: right;
  text-align: center;
  color: var(--primary-text-color);
  margin-top: 34px;
  line-height: 38px;
  font-size: 14px;
  border-radius: 4px;
  margin-right: 10px;
  padding: 0 12px 0 12px;
  transition: 300ms all;
}

a.isube_btn:hover {
  background: var(--primary-back-color);
  color: var(--white-text-color);
}

a.isube_btn i {
  width: 19px;
  height: 18px;
  background: url(../images/icons/isube.png);
  display: inline-block;
  margin-right: 10px;
  position: relative;
  transition: 300ms all;
  top: 4px;
}

a.isube_btn:hover i {
  background: url(../images/icons/isube_hover.png);
}

.owl-carousel .owl-dots {
  position: relative;
  bottom: 0px;
  margin-top: 20px;
  display: table;
  margin: 20px auto 10px;
}

.owl-carousel .owl-dots button.owl-dot {
  overflow: hidden;
  box-shadow: none;
  width: 10px;
  height: 10px;
  margin: 0 4px;
  z-index: 144;
  position: relative;
  top: 0px;
  transition: 300ms all;
  background: #203341;
  border-radius: 20px;
  overflow: hidden;
}

.owl-carousel .owl-dots button.owl-dot.active {
  width: 36px;
  height: 10px;
  /* top: 3px; */
  background: var(--primary-back-color);
}

.owl-carousel .owl-dots button.owl-dot:hover {
  background: var(--primary-back-color);
}

.owl-carousel .owl-dots button.owl-dot:before {
  /* content: ""; */
  display: block;
  background: #203341;
  height: 0px;
  width: 0px;
  transition: 300ms all;
  border-radius: 30px;
  left: 50%;
  position: relative;
  transform: translateX(-50%);
}

.owl-carousel .owl-dots button.owl-dot.active:before {
  width: 24px;
  height: 24px;
}

.footer {
  background: #181818;
  position: relative;
  padding: 0;
  margin: 0;
  border: 0;
}

.footerText {
  width: 25%;
  float: left;
}

.footerText ul li a {
  padding: 5px 0px;
  display: block;
  margin: 10px 0px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.5);
  transition: 400ms all;
}

.footerText ul li a:before {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f105";
  margin-right: 8px;
}

.footerText ul li a:hover {
  color: var(--white-text-color);
}

.flogo {
  /* margin-top: -10px; */
}

.footerText p {
  font-size: 12px;
  margin-top: 20px;
  line-height: 24px;
  color: rgba(255, 255, 255, 0.51);
}

.f_menu {
  width: 100%;
  float: right;
  margin-top: 35px;
  margin-bottom: 35px;
}

.f_menu>ul {}

.f_menu>ul>li {
  float: left;
  /* width: 170px; */
  width: 25%;
}

.f_menu>ul>li>a {
  font-weight: 700;
  pointer-events: none;
  color: var(--dark-text-color);
  font-size: 18px;
}

.f_menu>ul>li>ul {}

.f_menu>ul>li>ul>li {}

.f_menu>ul>li>ul>li a {
  padding: 5px 0px;
  display: block;
  margin: 10px 0px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.5);
  transition: 400ms all;
  font-weight: 300;
}

.f_menu>ul>li>ul>li a:before {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f0da";
  margin-right: 0px;
  opacity: 0;
  visibility: hidden;
  transition: 300ms all;
  color: var(--white-text-color);
}

.f_menu>ul>li>ul>li a:hover {
  color: var(--white-text-color);
}

.f_menu>ul>li>ul>li a:hover:before {
  margin-right: 8px;
  opacity: 1;
  visibility: visible;
}

.fcontact {
  float: right;
  width: 290px;
}

.fcontact h4 {
  font-weight: 700;
  pointer-events: none;
  color: var(--dark-text-color);
  font-size: 18px;
  margin-bottom: 43px;
}

.fcontact ul {}

.fcontact ul li {
  position: relative;
  padding-left: 30px;
  color: #969696;
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 10px;
}

.fcontact ul li i {
  position: absolute;
  left: 0px;
  top: 4px;
}

.fcontact ul li a {
  color: #969696;
}

.socialBar {
  display: inline-block;
  background: var(--dark-text-color);
  width: 100%;
  border-bottom: 1px solid #1f1f1f;
}

.socialBar .socialText {
  float: left;
  font-size: 18px;
  color: #979797;
  line-height: 75px;
}

.fSocial {
  float: right;
  margin-top: 10px;
}

.fSocial a {
  font-size: 24px;
  line-height: 44px;
  padding: 0 5px;
  transition: 400ms all;
  color: #979797;
  font-size: 18px;
  margin-left: 20px;
}

.fSocial a:hover {
  color: var(--white-text-color);
}

.footerBar {
  display: inline-block;
  width: 100%;
  border-top: 1px solid #1f1f1f;
}

.footerCopyright {
  float: none;
  color: #a4a4a4;
  text-align: center;
  display: table;
  margin: 23px auto 25px;
  font-size: 14px;
  line-height: 50px;
}

.logoLeft {
  float: left;
}

.logoRight {
  float: right;
}

img.telicon {
  float: left;
  margin-left: 50px;
}

span.telcontext {
  color: var(--white-text-color);
  padding: 5px 15px;
  display: inline-block;
}

.f_menu .telcontext a {
  padding: 0px;
  margin: 0px;
  color: var(--white-text-color) !important;
  font-size: 18px !important;
  font-weight: 500 !important;
}

.f_menu .telcontext a:before {
  content: none;
}

li.appicon {
  margin-top: 20px;
}

li.appicon a {
  float: left;
  padding: 5px 0px !important;
  margin: 0 5px !important;
}

li.appicon a:last-child {
  margin: 0 5px !important;
}

li.appicon a:before {
  display: none !important;
}

.socialBar {
  display: inline-block;
  background: #131313;
  width: 100%;
  border-bottom: 1px solid #1f1f1f;
}

.socialBar .socialText {
  float: left;
  font-size: 18px;
  color: #979797;
  line-height: 75px;
}

.accordionButton {
  padding: 15px 20px;
  transition: 400ms;
  cursor: pointer;
  font-size: 16px;
  color: var(--dark-text-color);
  box-sizing: border-box;
  position: relative;
}

.accordionContent {
  padding-bottom: 20px;
  font-size: 18px;
  line-height: 26px;
  padding-left: 45px;
  padding-right: 20px;
  /* border: 1px solid #efefef; */
  font-size: 14px;
  line-height: 26px;
  color: var(--dark-text-color);
  padding-top: 10px;
}

.accordionButton.on {
  transition: 400ms;
  color: var(--primary-text-color);
}

.accordionContent p:not(:first-child) {
  margin-top: 15px;
}

.accordionButton.on:before {
  content: "\f068";
}

.accordionButton:before {
  content: "\f067";
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 8px;
}

.accordionContent a:hover {
  color: #ce8d43;
}

form.contactForm {
  /* display: table; */
  /* width: 100%; */
  /* padding: 20px; */
  /* box-sizing: border-box; */
}

form.contactForm>ul {
  display: inline-block;
  width: 100%;
}

form.contactForm>ul>li {
  margin-bottom: 14px;
  position: relative;
  float: left;
  width: 100%;
  color: var(--dark-text-color);
  font-size: 12px;
  text-align: left;
  line-height: initial;
  font-size: 11px !important;
}

form.contactForm ul li input::placeholder, form.contactForm ul li select::placeholder {
  color: var(--dark-text-color);
}

form.contactForm ul li input[type="email"], form.contactForm ul li input[type="tel"], form.contactForm ul li input[type="date"], form.contactForm ul li input[type="text"], form.contactForm ul li input[type="submit"], form.contactForm ul li input[type="checkbox"], form.contactForm ul li select, form.contactForm ul li textarea {
  width: 100%;
  height: 50px;
  padding: 0 15px !important;
  box-sizing: border-box;
  border: none;
  font: var(--font-text);
  transition: 300ms all;
  box-shadow: 0px 0px 0px rgba(223, 10, 111, 0);
  border: none;
  -webkit-appearance: none;
  -moz-appearance-radius: 7px;
  appearance: none;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  background: #fff;
  border: 2px solid #e9ebf4;
}

form.contactForm ul li textarea {
  padding: 15px !important;
  height: 90px;
}

form.contactForm ul li select {
  background-image: url(../images/icons/select_arrow.png?v1);
  background-position: center right;
  background-repeat: no-repeat;
}

/*form.contactForm > ul > li:last-child { margin-bottom: 0px; width: 100% !important; margin-right: 0px !important; }*/

form.contactForm ul li input[type="submit"] {
  font: var(--font-btn);
  color: var(--white-text-color);
  display: inline-block;
  margin: auto;
  cursor: pointer;
  border: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: var(--success-text-color);
  height: auto;
  padding: 16px 32px !important;
  width: auto;
  float: left;
}

form.contactForm ul li label {
  font: var(--font-text);
  color: #697276;
  display: inline-block;
  line-height: 22px;
  cursor: pointer;
}

form.contactForm ul li input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  position: relative;
  right: 0;
  bottom: 0;
  left: 0;
  height: 25px !important;
  width: 25px !important;
  cursor: pointer;
  display: inline-block;
  margin-right: 0.5rem;
  outline: 0;
  float: left;
  box-sizing: border-box;
  padding: 0px !important;
  border-radius: 0;
  box-shadow: none;
  background: white;
  margin-top: 0px;
  border: 2px solid rgb(196, 200, 218);
  border-radius: 7px;
}

form.contactForm ul li input[type="checkbox"]:checked::after {
  position: absolute;
  font-family: "font awesome 5 free";
  content: "\f00c";
  display: inline-block;
  text-align: center;
  line-height: 14px;
  color: var(--primary-text-color);
  left: 4px;
  top: 4px;
  font-weight: 700;
}

form.contactForm ul li input[type="submit"]:hover, form.contactForm ul li input[type="submit"]:focus {
  background: var(--success-text-color);
  color: var(--white-text-color);
  border: none;
  box-shadow: 0px 5px 10px rgba(77, 175, 81, 0.2);
}

.form-title {
  display: block;
  font-size: 34px;
  margin-top: 0px;
  line-height: 48px;
  font-weight: 700;
  color: var(--dark-text-color);
  letter-spacing: -1px;
  border-bottom: 1px dotted rgba(1, 63, 81, 0.21);
  text-align: center;
  width: calc(100% - 40px);
  margin-left: 20px;
  padding-bottom: 10px;
}

.intl-tel-input .selected-flag {
  height: 42px !important;
}

/*, .rangeInput:focus */

form.contactForm ul li input[type="text"]:focus, form.contactForm ul li input[type="datetime-local"]:focus, form.contactForm ul li input[type="date"]:focus, form.contactForm ul li input[type="email"]:focus, form.contactForm ul li input[type="tel"]:focus {
  box-shadow: 0px 5px 10px rgba(223, 10, 111, 0.2);
  color: var(--primary-text-color);
  border: 2px solid var(--primary-border-color);
}

.input--title {
  font: var(--font-text-title);
  margin-bottom: 8px;
  width: 100%;
}

form.contactForm .formtitle {
  font-size: 20px;
  line-height: initial;
  color: var(--dark-text-color);
  text-align: center;
  margin-bottom: 10px;
  font-weight: 300;
  line-height: 30px;
}

form.contactForm .formtitle strong {
  display: block;
}

.footerForm form.contactForm .formtitle {
  font-size: 18px;
  font-weight: 700;
}

form.contactForm>ul>li p {
  font-size: 18px;
  color: var(--dark-text-color);
}

form.contactForm>ul>li p a {
  color: var(--dark-text-color);
  font-size: 38px;
  font-weight: 700;
  display: table;
  margin: 10px auto 0px;
}

form.contactForm>ul>li a {
  text-decoration: underline !important;
}

.hesaplamaPage {
  /* min-height:100vh; */
  margin-top: 60px;
}

.timeline {
  width: 3px;
  height: 100%;
  position: absolute;
  left: 0px;
  background: #baecf4;
  display: block;
}

.timeline:before {
  content: "";
  position: absolute;
  top: -5px;
  width: 20px;
  height: 20px;
  line-height: 20px;
  border-radius: 100%;
  text-align: center !important;
  color: var(--white-text-color);
  font-size: 11px;
  font-weight: 700 !important;
  border: 4px solid var(--primary-border-color);
  background: var(--white-back-color);
  left: -8px;
  box-sizing: border-box;
  z-index: 3;
}

.timeline.active:after {
  content: "";
  position: absolute;
  bottom: -5px;
  width: 20px;
  height: 20px;
  line-height: 20px;
  border-radius: 100%;
  text-align: center !important;
  color: var(--white-text-color);
  font-size: 11px;
  font-weight: 700 !important;
  border: 4px solid var(--primary-border-color);
  background: #fff;
  left: -8px;
  box-sizing: border-box;
  z-index: 3;
}

.line {
  position: absolute;
  height: 58px;
  background: var(--primary-back-color);
  display: block;
  width: 3px;
  margin-top: 0;
  transition: 500ms all;
  left: 0px;
}

.line.full {
  height: 100%;
}

.stepTitle {
  margin-top: 30px;
  display: block;
  display: inline-block;
  width: 100%;
  margin-bottom: 60px;
}

.stepTitle span {
  display: block;
  background: var(--primary-back-color);
  box-shadow: 0px 10px 15px 0px rgba(252, 115, 197, 0.1);
  height: 50px;
  display: inline-block;
  border-radius: 50px;
  line-height: 50px;
  color: var(--white-text-color);
  font-weight: 700;
  font-family: var(--base-font);
  width: 220px;
  text-align: center;
  font-size: 18px;
}

.stepTitle:before {
  content: "";
  position: relative;
  height: 3px;
  background: var(--primary-back-color);
  display: block;
  width: 40%;
  float: left;
  margin-top: 25px;
}

.step1 {
  display: inline-block;
  width: 100%;
  /* position: relative; */
}

.step1 .contactForm {
  width: 445px;
  margin-left: 50px;
  float: left;
  display: block;
}

.formTitle {
  font: var(--font-text-title);
  color: var(--dark-text-color);
  margin-bottom: 40px;
  text-align: center;
}

.step1 form.contactForm>ul>li:nth-child(2), .step1 form.contactForm>ul>li:nth-child(3) {
  width: calc(50% - 7px);
}

.step1 form.contactForm>ul>li:nth-child(2) {
  margin-right: 14px;
}

.stepImg {
  float: right;
  position: relative;
  z-index: 2;
  margin-top: 80px;
  position: absolute;
  right: -20px;
  bottom: 0px;
}

.stepImg:before {}

.step2 {
  background: var(--primary-back-color);
  /* margin-bottom: 40px; */
  /* border-radius: 10px; */
  /* width: 1200px; */
  /* margin-left: -30px; */
  /* position: relative; */
  /* z-index: 2; */
  /* padding: 30px; */
  /* color: #fff; */
  /* display: inline-block; */
}

.step2Text {
  float: left;
  width: 430px;
  padding-left: 0px;
  margin-left: 0px;
  border-left: 1px solid rgba(255, 255, 255, 0.2);
  color: var(--dark-text-color);
  padding: 20px 45px;
}

.step2Text p {
  color: var(--dark-text-color);
  font: var(--font-text);
  letter-spacing: 0.3px;
}

.step2Text strong {
  font: var(--font-text-title);
  margin-bottom: 10px;
  display: block;
}

.sayac {
  /* background: red; */
  display: inline-block;
}

.sayac svg {
  position: absolute;
  /* top: 13px; */
  /* transform: rotateY(-180deg) rotateZ(-90deg); */
}

.sayac circle {
  stroke-dasharray: 410px;
  stroke-dashoffset: 0px;
  stroke-linecap: round;
  stroke-width: 11px;
  fill: none;
  stroke: none;
  overflow: visible;
  animation: countdown 30s linear forwards;
  border-style: solid;
  border-width: 5px;
  border-color: rgb(49, 66, 74);
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0);
  opacity: 1;
  /* box-shadow: 0px 20px 20px 0px rgb(0, 0, 0); */
}

.sayac .circle {
  animation: none;
  stroke: red;
  stroke-width: 3px;
}

@keyframes countdown {
  from {
    stroke-dashoffset: 0px;
  }
  to {
    stroke-dashoffset: 410px;
  }
}

.sayac {
  font-family: var(--base-font);
}

.base-timer {
  position: relative;
  width: 100px;
  height: 100px;
}

.base-timer__svg {
  transform: scaleX(-1);
}

.base-timer__circle {
  fill: none;
  stroke: none;
}

.base-timer__path-elapsed {
  stroke-width: 7px;
  stroke: grey;
}

.base-timer__path-remaining {
  stroke-width: 3px;
  stroke-linecap: round;
  transform: rotate(90deg);
  transform-origin: center;
  transition: 1s linear all;
  fill-rule: nonzero;
  stroke: currentColor;
  color: red;
}

.base-timer__path-remaining.green {
  color: var(--success-text-color);
}

.base-timer__path-remaining.orange {
  color: orange;
}

.base-timer__path-remaining.red {
  color: red;
}

.base-timer__label {
  position: absolute;
  width: 100px;
  height: 100px;
  /* top: 0; */
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--dark-text-color);
  font-size: 20px;
  /* transform: rotate(90deg); */
}

.smsDogrula {
  float: left;
  width: 310px;
}

div#chart {
  float: left;
  margin: 0;
  margin-left: 40px;
}

.popover-body {
  margin: 0 10px;
}

form.contactForm.smsDogrula ul li:nth-child(2) {
  margin-right: 14px;
  width: 171px;
}

form.contactForm.smsDogrula ul li:last-child {
  width: 125px !important;
  float: right;
}

form.contactForm.smsDogrula input#smsKod {
  font-size: 22px;
}

#yenidenSifre {
  font: var(--font-btn);
  color: var(--inactive-text-color);
  width: 100%;
  display: table;
  margin: auto;
  cursor: pointer;
  border: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: var(--disabled-border-color);
  letter-spacing: 0.3px;
  border: none;
  -moz-appearance-radius: 7px;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  box-shadow: 0px 0px 0px rgba(9, 180, 211, 0.2);
  transition: 300ms all;
  pointer-events: none;
  opacity: 0.5;
  text-decoration: none !important;
  text-align: center;
  padding: 16px 12px !important;
}

a#yenidenSifre.active {
  background-color: transparent;
  border: 2px solid var(--primary-back-color);
  color: var(--primary-text-color);
  pointer-events: auto;
  opacity: 1;
  padding: 14px 12px !important;
}

#yenidenSifre.active:hover, #yenidenSifre:focus {
  background: var(--primary-back-color);
  color: var(--white-text-color);
  border: none;
  box-shadow: 0px 5px 10px rgba(9, 180, 211, 0.2);
}

.stepSlider {
  display: block;
  width: 720px;
  margin: auto;
}

.finansTipSec {
  display: table;
  margin: auto;
  float: none;
  text-align: center;
}

.finansTipSec input[type="radio"] {
  display: none;
}

.finansTipSec label {
  display: inline-block;
  background-color: var(--primary-back-color);
  font-family: var(--base-font);
  font-weight: normal;
  font-size: 16px;
  cursor: pointer;
  text-align: center;
  background: var(--white-back-color);
  border: 2px solid #e9ebf4;
  border-radius: 6px;
  overflow: hidden;
  padding: 10px 20px;
  color: var(--dark-text-color);
  font-weight: 700;
  margin: 5px 5px;
  transition: 300ms all;
}

.finansTipSec input[type="radio"]:hover+label, .finansTipSec input[type="radio"]:checked+label {
  background-color: var(--primary-back-color);
  border-color: var(--primary-back-color);
  color: var(--white-text-color);
}

.finansTipSec label i {
  margin-bottom: 20px;
  display: block;
  display: none;
}

.stepSlider h3 {
  font: var(--font-text-title);
  letter-spacing: 0.3px;
  transition: 300ms all;
  text-align: center;
  margin: 0px 0px 40px;
}

.stepSlider .item .w50 {
  width: calc(50% - 30px);
  margin-right: 60px;
  float: left;
}

.stepSlider .item .w50:nth-child(2) {
  margin-right: 0px;
}

.stepSlider .item .w50 h3 {}

.stepSlider .item .w50 p {
  font-size: 13px;
  color: var(--dark-text-color);
  display: block;
  width: 100%;
  float: left;
  line-height: 20px;
  text-align: justify;
}

.izleOgren {
  height: 240px;
  float: right;
  position: relative;
  background-size: cover;
  background-position: center;
  width: 100%;
  padding: 14px;
  border: 2px solid var(--disabled-border-color);
  border-radius: 10px;
  background: var(--white-back-color);
}

.izleOgren a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  transition: 300ms all;
  left: 0px;
  top: 0px;
  z-index: -1;
  background: rgba(0, 0, 0, 0.4);
}

.izleOgren a {
  font-size: 24px;
  font-weight: 700;
  color: var(--white-text-color);
  font-weight: bold;
  line-height: 1.4;
  text-shadow: 0px 3px 0px rgba(0, 0, 0, 0.4);
  position: relative;
  text-align: center;
  display: block;
  transition: 300ms all;
  z-index: 2;
  height: calc(100% - 28px);
  background-size: cover;
  background-position: center;
  border-radius: 6px;
  overflow: hidden;
}

.izleOgren a i {
  font-size: 50px;
  display: table;
  transition: 400ms all;
  top: calc(50% - 25px);
  position: absolute;
  left: calc(50% - 25px);
  overflow: hidden;
}

.izleOgren a:hover i {
  color: var(--primary-text-color);
  transform: scale(1.2);
}

.izleOgren span {
  margin-bottom: 15px;
  display: block;
  text-align: center;
  font-size: 13px;
  color: rgba(32, 51, 65, 0.5);
  letter-spacing: 0.2px;
}

.rangeslider, .rangeslider__fill {
  display: block;
  -moz-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3);
  /* -webkit-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3); */
  /* box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3); */
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
}

.rangeslider {
  /* background: #e9ebf4; */
  position: relative;
}

.rangeslider--horizontal {
  height: 4px;
  width: 100%;
  margin-top: -4px;
}

.rangeslider--vertical {
  width: 20px;
  min-height: 150px;
  max-height: 100%;
}

.rangeslider--disabled {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  opacity: 0.4;
}

.rangeslider__fill {
  background: var(--primary-back-color);
  position: absolute;
}

.rangeslider--horizontal .rangeslider__fill {
  top: 0;
  height: 100%;
}

.rangeslider--vertical .rangeslider__fill {
  bottom: 0;
  width: 100%;
}

.rangeslider__handle {
  background: white;
  border: 1px solid #ccc;
  cursor: pointer;
  display: inline-block;
  width: 20px;
  height: 20px;
  position: absolute;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjAiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4xIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g");
  background-size: 100%;
  /* background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, rgba(0, 0, 0, 0.1))); */
  background-image: -moz-linear-gradient( rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.1));
  /* background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.1)); */
  /* background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.1)); */
  -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
  /* -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.3); */
  /* box-shadow: 0 0 8px rgba(0, 0, 0, 0.3); */
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: var(--primary-back-color);
  border: none;
}

.rangeslider__handle:after {
  /* content: ""; */
  display: block;
  width: 18px;
  height: 18px;
  margin: auto;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  /* background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjEzIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjAuMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); */
  background-size: 100%;
  /* background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(0, 0, 0, 0.13)), color-stop(100%, rgba(255, 255, 255, 0))); */
  background-image: -moz-linear-gradient( rgba(0, 0, 0, 0.13), rgba(255, 255, 255, 0));
  /* background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.13), rgba(255, 255, 255, 0)); */
  /* background-image: linear-gradient(rgba(0, 0, 0, 0.13), rgba(255, 255, 255, 0)); */
  -moz-border-radius: 50%;
  /* -webkit-border-radius: 50%; */
  /* border-radius: 50%; */
}

.rangeslider__handle:active, .rangeslider--active .rangeslider__handle {
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjEiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4xMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==");
  background-size: 100%;
  background-image: -webkit-gradient( linear, 50% 0%, 50% 100%, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, rgba(0, 0, 0, 0.12)));
  background-image: -moz-linear-gradient( rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.12));
  background-image: -webkit-linear-gradient( rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.12));
  background-image: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.12));
}

.rangeslider--horizontal .rangeslider__handle {
  top: -7px;
  touch-action: pan-y;
  -ms-touch-action: pan-y;
}

.rangeslider--vertical .rangeslider__handle {
  left: -10px;
  touch-action: pan-x;
  -ms-touch-action: pan-x;
}

input[type="range"]:focus+.rangeslider .rangeslider__handle {
  -moz-box-shadow: 0 0 8px rgba(255, 0, 255, 0.9);
  -webkit-box-shadow: 0 0 8px rgba(255, 0, 255, 0.9);
  box-shadow: 0 0 8px rgba(255, 0, 255, 0.9);
}

.range {
  display: inline-block;
  width: 100%;
}

.rangeInput {
  width: 100%;
  height: 60px;
  padding: 0 15px !important;
  box-sizing: border-box;
  border: none;
  transition: 300ms all;
  box-shadow: 0px 0px 0px rgba(223, 10, 111, 0);
  border: none;
  -webkit-appearance: none;
  -moz-appearance-radius: 6px;
  appearance: none;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  background: transparent;
  border: 2px solid var(--disabled-border-color);
  font: var(--font-emphasis) !important;
  text-align: center;
}

.range span {
  font-size: 11px;
  margin-top: 4px;
  display: block;
  color: rgba(34, 51, 59, 0.5);
  float: left;
  line-height: 12px;
}

.range span:last-child {
  float: right;
}

input[type="radio"] {
  display: none;
}

.r_label {
  height: 50px;
  padding: 0 15px !important;
  box-sizing: border-box;
  border: none;
  font-size: 14px;
  transition: 300ms all;
  box-shadow: 0px 0px 0px rgba(223, 10, 111, 0);
  border: none;
  -webkit-appearance: none;
  -moz-appearance-radius: 6px;
  appearance: none;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  background: #fff;
  border: 2px solid #e9ebf4;
  font-size: 16px;
  text-align: center;
  display: inline-block;
  width: calc(50% - 10px);
  line-height: 46px;
  float: left;
  margin-right: 20px;
  margin-bottom: 20px;
  cursor: pointer;
}

.r_label:nth-of-type(2) {
  margin-right: 0px;
}

input[type="radio"]:checked+label {
  background-color: #ffeff9;
  border-color: var(--primary-border-color);
  color: var(--primary-text-color);
  box-shadow: 0px 4px 10px rgba(191, 33, 125, 0.2);
}

.c_label {
  font-size: 14px;
  color: var(--dark-text-color);
  display: inline-block;
  line-height: 22px;
  cursor: pointer;
  margin-bottom: 10px;
}

.c_label input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  position: relative;
  right: 0;
  bottom: 0;
  left: 0;
  height: 25px !important;
  width: 25px !important;
  cursor: pointer;
  display: inline-block;
  margin-right: 0.5rem;
  outline: 0;
  float: left;
  box-sizing: border-box;
  padding: 0px !important;
  border-radius: 0;
  box-shadow: none;
  background: white;
  margin-top: 0px;
  border: 2px solid #e9ebf4;
  border-radius: 6px;
}

.c_label input[type="checkbox"]:checked::after {
  position: absolute;
  font-family: "font awesome 5 free";
  content: "\f00c";
  display: inline-block;
  text-align: center;
  line-height: 14px;
  color: var(--primary-text-color);
  left: 4px;
  top: 4px;
  font-weight: 700;
}

/* .stepSlider h4 {
  font-size: 17px;
  font-family: var(--base-font);
  font-weight: bold;
  letter-spacing: 0.3px;
  transition: 300ms all;
  text-align: center;
  margin: 10px 0px 10px;
  text-align: left;
} */

.w100 label {
  width: 100%;
  margin-right: 0px;
}

.step3 {
  padding-bottom: 50px;
}

.stepSlider .item {
  padding-bottom: 50px;
  display: inline-block;
  width: 100%;
}

.mt37 {
  margin-top: 37px;
}

.w50.align-center {
  display: table;
  margin: auto !important;
  float: none !important;
}

.araOdemeTarihleri {
  display: table;
  margin: auto;
  width: 100%;
}

.araOdemeTarihleri h4 {
  display: table;
  margin: auto;
  margin: 20px auto 30px;
  font-weight: 700;
}

.araOdemeTarihleri ul li {
  float: left;
}

.araOdemeTarihleri ul>li {
  line-height: 50px;
  margin: 0 10px;
  font-size: 14px;
}

.araOdemeTarihleri ul li input {
  height: 50px;
  font-size: 18px;
  box-shadow: 0px 0px 0px rgba(223, 10, 111, 0);
  border: none;
  -webkit-appearance: none;
  -moz-appearance-radius: 6px !important;
  appearance: none;
  -webkit-border-radius: 6px !important;
  -moz-border-radius: 6px !important;
  background: #fff;
  border: 2px solid #e9ebf4;
}

.araOdemeTarihleri ul>li a {
  font-size: 14px;
}

/*.datepicker table tr td, .datepicker table tr th { line-height: 40px; width: 40px !important; height: 40px !important; font-size: 15px; }
.datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active:active { background: #bf217d !important; }*/

.araOdemeTarihleri ul {
  display: table;
}

#progress-wrapper {
  width: 250px;
  background: #eaecec;
  display: block;
  position: relative;
  margin: 0px auto;
  top: 17px;
  overflow: hidden;
  border-radius: 6px;
}

#progress-wrapper #progress-bar {
  background: #304149;
  height: 100%;
  width: 0%;
  transition: 0.5s ease-in-out;
  border-radius: 6px;
  position: relative;
  margin-top: 0px;
  height: 4px;
  overflow: hidden;
}

#progress-wrapper #progress-bar:after {
  content: attr(data-progress) "%";
  position: absolute;
  text-align: center;
  font-size: 12px;
  line-height: 12px;
  display: inline-block;
  background: #fbbc2e;
  padding: 10px;
  width: 50px;
  top: -32px;
  right: 0px;
  color: var(--dark-text-color);
  border-radius: 6px;
  opacity: 1;
  transition: 0.25s ease-in-out;
  font-weight: bold;
  z-index: 999999999;
  display: none;
}

a#next {
  float: right;
  font-weight: 700;
  opacity: 0.5;
}

a#prev {
  float: left;
}

.sliderNav {
  width: 530px;
  display: table;
  margin: auto;
}

a#next:hover, a#prev:hover {
  opacity: 1;
}

a#next, a#prev {
  font-weight: 700;
  opacity: 0.5;
  transition: 300ms all;
  display: block;
  padding: 10px 20px;
}

a#next:hover i {
  /* margin-left: 10px; */
}

a#next i, a#prev i {
  /* margin: 0 20px; */
  /* transition: 300ms all; */
}

a#next:hover {
  padding: 10px 10px 10px 30px;
}

a#prev:hover {
  padding: 10px 30px 10px 10px;
}

.odemeOzet, .odemecizelgesi {
  padding: 0 60px;
  display: inline-block;
  width: 100%;
}

.odemeOzet ul {
  width: 100%;
}

.odemeOzet ul li {
  width: calc(25% - 15px);
  float: left;
  margin-right: 20px;
  background: #e9ebf4;
  margin-bottom: 20px;
  height: 125px;
  border-radius: 6px;
  text-align: center;
  position: relative;
  color: var(--dark-text-color);
  padding-top: 35px;
}

.odemeOzet ul li:nth-child(4n) {
  margin-right: 0px;
}

.odemeOzet ul li a {
  float: right;
  position: absolute;
  top: 10px;
  right: 10px;
  color: var(--dark-text-color);
}

.odemeOzet ul li span {
  font-size: 16px;
}

.odemeOzet ul li h5 {
  color: var(--success-text-color);
  font: var(--font-emphasis);
  margin-top: 20px;
}

.tg {
  border-collapse: collapse;
  border-spacing: 0;
  margin: 0px auto;
  width: 100%;
  /* border: none !important; */
  border: 1px solid var(--dark-border-color);
}

.tg td {
  border-color: #e9ebf4;
  border-style: solid;
  border-width: 1px;
  font-size: 14px;
  overflow: hidden;
  padding: 10px 5px;
  word-break: normal;
  text-align: center;
  color: var(--dark-text-color);
}

.tg th {
  border-color: #e9ebf4;
  border-style: solid;
  border-width: 1px;
  font-size: 16px;
  font-weight: normal;
  overflow: hidden;
  padding: 10px 5px;
  word-break: normal;
  text-align: center;
}

.tg .tg-bqcy {
  color: var(--dark-text-color);
  font-weight: bold;
  position: -webkit-sticky;
  position: sticky;
  top: -1px;
  vertical-align: bottom;
  will-change: transform;
  background: #e9ebf4;
  line-height: 30px;
}

.tg .tg-zj9c {
  vertical-align: bottom;
}

@media screen and (max-width: 767px) {
  .tg {
    /* width: 100% !important; */
  }
  .tg col {
    width: auto !important;
  }
  .tg-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: auto 0px;
  }
}

.tg-wrap {
  width: 100%;
  display: block;
  margin: auto;
  overflow-y: scroll;
  height: 500px;
  margin-bottom: 30px;
  border-radius: 6px;
  border: 2px solid #e9ebf4;
}

.tg-wrap::-webkit-scrollbar {
  width: 8px;
}

.tg-wrap::-webkit-scrollbar-track {
  background: #e9ebf4;
}

.tg-wrap::-webkit-scrollbar-thumb {
  background: #929bb3;
}

.odemecizelgesi .title {
  text-align: center;
  width: 100%;
  font-weight: 700;
  margin-top: 20px;
  margin-bottom: 30px;
  line-height: 24px;
  font-size: 24px;
  font-family: var(--base-font);
  font-weight: bold;
  color: var(--dark-text-color);
}

.sonucButtons {
  display: inline-block;
  width: 100%;
}

.sonucButtons button {
  width: calc(25% - 15px);
  margin-right: 20px;
  float: left;
  display: block;
  text-align: center;
  background: #929bb3;
  line-height: 50px;
  border-radius: 6px;
  color: var(--white-text-color);
  font-weight: 700;
  /* border: 1px solid rgba(0, 0, 0, 0.2); */
}

.sonucButtons button:last-child {
  margin-right: 0px;
}

.sonucButtons button i {
  margin-right: 10px;
}

a.yenidenHesaplaBtn {
  background: #1bbfdc;
}

a.alternatifHesaplaBttn {
  background: #f62e2e;
}

a.detayliBilgiBtn {
  background: #f6a42e;
}

a.basvurumuTamamla {
  background: var(--success-text-color);
}

.colorBox {
  width: calc(100% - 120px);
  margin: 0 auto 50px;
  position: relative;
  /* box-sizing: border-box; */
  color: var(--white-text-color);
  /* !importanté */
  /* !importanté */
  border-radius: 6px;
  z-index: 1;
  padding: 3px;
  background-image: -moz-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
  display: inline-block;
  width: 100%;
  /* background: #e9ebf4; */
}

.colorBox .inner {
  background: #fff;
  border-radius: 5px;
  padding: 70px 50px;
  display: inline-block;
  width: 100%;
  float: left;
  position: relative;
}

.colorBox .inner .title {
  text-align: center;
  width: 100%;
  font-weight: 700;
  margin-bottom: 30px;
  line-height: 24px;
  font-size: 24px;
  font-family: var(--base-font);
  font-weight: bold;
  color: var(--dark-text-color);
}

.musteriBilgileri {
  width: 720px;
  display: table;
  margin: auto;
}

.musteriBilgileri form.contactForm>ul>li:nth-child(-n+6) {
  width: calc(33.33% - 9.33px);
  margin-right: 14px;
}

.musteriBilgileri form.contactForm>ul>li:nth-child(3n) {
  margin-right: 0px;
}

.musteriBilgileri form.contactForm>ul>li .input-daterange input {
  -webkit-border-radius: 6px !important;
  -moz-border-radius: 6px !important;
  -moz-appearance-radius: 6px !important;
  text-align: left;
}

.sozlesmeButton {
  float: right;
  margin-top: 0;
  top: 20px;
  position: relative;
}

.sozlesmeButton a {
  font-size: 13px;
  margin-left: 20px;
  color: var(--dark-text-color);
}

.musteeriSozlesmesi form {
  float: left;
  margin-top: 0;
  width: 100%;
}

.sozlesmeButton a:hover {
  color: var(--primary-text-color);
}

.mBilgileri {
  display: table;
  margin: auto;
}

.mBilgileri ul {
  width: 100%;
}

.mBilgileri ul li {
  width: 250px;
  float: left;
  margin: 0 10px;
  margin-bottom: 20px;
  height: 125px;
  border-radius: 6px;
  text-align: center;
  position: relative;
  color: var(--dark-text-color);
  padding-top: 35px;
  border: 2px solid var(--disabled-border-color);
}

.mBilgileri ul li a {
  float: right;
  position: absolute;
  top: 10px;
  right: 10px;
  color: var(--dark-text-color);
}

.mBilgileri ul li span {
  font-size: 16px;
}

.mBilgileri ul li h5 {
  color: var(--primary-text-color);
  font-size: 24px;
  font-weight: 700;
  margin-top: 20px;
}

.musteriOnayi {
  width: 100%;
  display: inline-block;
}

.musteriOnayi p {
  text-align: center;
  line-height: 30px;
  color: var(--dark-text-color);
  width: 90%;
  display: table;
  margin: 0 auto 30px;
}

.musteriOnayi p a {
  font-weight: 700;
  text-decoration: underline !important;
}

a.odemeYapBtn {
  width: 70%;
  display: block;
  text-align: center;
  background: var(--primary-text-color);
  line-height: 50px;
  border-radius: 6px;
  color: var(--white-text-color);
  font-weight: 700;
  transition: 300ms all;
  display: table;
  margin: auto;
}

a.odemeYapBtn:hover {
  background: var(--success-text-color);
}

select#calismabedelitaksiti {
  height: 60px;
  font-size: 18px;
}

.cbedeliTutari, .cbedeliTaksitleri {
  font-size: 24px;
  margin-bottom: 20px;
  color: var(--primary-text-color);
}

.stepNum {
  display: table;
  margin: 0 auto -23px;
  z-index: 2;
  position: relative;
}

.stepNum ul {
  background: #fff;
  display: inline-block;
  padding: 0 10px;
}

.stepNum ul li {
  float: left;
  margin: 0 10px;
  position: relative;
  transition: 1s all;
  box-shadow: 0px 0px 0px var(--white-border-color);
}

.stepNum ul li a {
  display: block;
  background: var(--disabled-back-color);
  height: 40px;
  color: var(--dark-text-color);
  line-height: 40px;
  text-align: center;
  border-radius: 20px;
  position: relative;
  z-index: 1;
  font-weight: 700;
  padding: 0 16px;
  font-weight: 700;
  /* transition: 300ms all; */
}

.stepNum ul li:before {
  content: "";
  position: absolute;
  width: calc(100% + 6px);
  height: calc(100% + 6px);
  left: -3px;
  top: -3px;
  display: block;
  border-radius: 170px;
  background-image: -moz-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(232, 78, 169) 0%, rgb(238, 116, 85) 26%, rgb(244, 154, 0) 34%, rgb(27, 191, 220) 67%, rgb(69, 188, 105) 100%);
  background: var(--disabled-back-color);
  transition: 300ms all;
}

.stepNum ul li span {
  display: none;
  transition: 300ms all;
  margin-left: 10px;
}

.stepNum ul li.active a, .stepNum ul li.active span {
  background: #fff0;
  color: var(--white-text-color) !important;
  /* background: #32434b; */
}

.stepNum ul li.active:before {
  background: #32434b;
}

.stepNum ul li.active.current span {
  display: inline;
}

.stepNum ul li.active.current:before {
  background: var(--primary-back-color);
  box-shadow: 10px 10px 10px #bf217d;
  -webkit-box-shadow: 0 0 1px 0 rgb(191 33 125 / 0.1), 0 4px 8px 0 rgb(191 33 125 / 0.1), 0 16px 24px 0 rgb(191 33 125 / 0.1), 0 24px 32px 0 rgb(191 33 125 / 0.1);
  box-shadow: 0 0 1px 0 rgb(191 33 125 / 0.1), 0 4px 8px 0 rgb(191 33 125 / 0.1), 0 16px 24px 0 rgb(191 33 125 / 0.1), 0 24px 32px 0 rgb(191 33 125 / 0.1);
}

.shortPopup {
  display: none;
  width: 400px;
  max-width: 100%;
  line-height: 160%;
}

/*////////////////////////////////////////////////////////////////////*/

/*.owl-stage-outer.owl-height {
  height: auto !important;
}

  .owl-stage-outer.owl-height item {
    height: auto !important;
  }*/

/*style="margin-top:-4px; position:relative; display:block; height:1px;"*/

@media only screen and (max-width: 1440px) {}

@media only screen and (max-width: 1440px) {
  .step2Text {
    width: 340px;
    padding: 20px 25px 20px 45px;
  }
  .container {
    max-width: 980px;
  }
  .ustMenu>ul>li>ul>li>a {
    font-size: 15px;
    letter-spacing: 0.3px;
  }
  .ustMenu ul li a {
    font-size: 18px;
  }
  a.logo {
    width: 160px;
    top: 40px;
  }
  .formTitle {
    margin-top: 30px;
    font-size: 16px;
  }
  .ustMenu {
    margin-right: 20px;
  }
  a.girisyapBtn i {
    width: 140px;
    margin-right: 10px;
  }
  .fcontact {
    width: 180px;
  }
  .owl-carousel .itemTitle {
    font-size: 18px;
    line-height: 24px;
  }
  .owl-carousel .itemDesc {
    font-size: 13px;
    line-height: 22px;
  }
  .accountStatic {
    width: 450px;
  }
  .lastHistory {
    width: 220px;
  }
  .accountPart {
    width: 120px;
    margin-left: -190px;
  }
  .accountPart.right {
    margin-left: 70px;
  }
  .statics {}
  .progress {
    width: 150px;
  }
  .isubeMenu ul li a {
    font-size: 16px;
  }
  a.accountTableBtn {
    font-size: 14px;
    font-weight: 500;
  }
  a.accountActivitiesBtn {
    font-size: 14px;
    font-weight: 500;
  }
  .accountNextDate {
    font-size: 14px;
  }
  .accountTable {
    width: 500px;
  }
  .acDetail {
    font-size: 18px;
    line-height: 26px;
  }
  .acDetail strong {
    font-size: 16px;
    margin-top: 0px;
  }
  .accountList ul li {
    padding: 20px;
  }
  .accountList ul li .acTitle {
    font-size: 16px;
  }
  .accountList ul li .acTitle strong {
    font-size: 14px;
  }
  .odemePage .tabPage form.contactForm {
    width: 410px;
  }
  .odemePage .tabPage {
    padding: 50px;
  }
  .bankaList ul li {
    width: calc(50% - 10px);
  }
  .bankaList ul li:nth-child(3n) {
    margin-right: 15px;
  }
  .bankaList ul li:nth-child(even) {
    margin-right: 0px;
  }
  .liveFrame iframe {
    height: 515px;
  }
  .sonucButtons a {
    font-size: 15px;
    width: calc(50% - 15px);
    margin-bottom: 20px;
    font-weight: 400;
  }
  .sonucButtons a:nth-child(even) {
    margin-right: 0px;
  }
  .odemeOzet ul li h5 {
    font-size: 18px;
  }
  .odemeOzet ul li span {
    font-size: 14px;
  }
  .loginBox {
    width: 300px;
  }
  .loginSlider {
    width: 650px;
  }
  .loginBox .tabPage form.contactForm>ul {
    margin: 0px;
  }
  .loginBox .tabPage {
    height: 285px;
  }
  form.contactForm ul li input, form.contactForm ul li select {
    height: 45px !important;
  }
  form.contactForm ul li label {
    font-size: 13px;
  }
  .isubeBaslik {
    font-size: 32px;
  }
  .step1 .contactForm {
    margin-left: 0px;
    width: 430px;
  }
}

@media only screen and (max-width: 1300px) {}

@media only screen and (max-width: 1024px) {}

@media only screen and (max-width: 768px) {
  .colorBox {
    background: none;
  }
  .colorBox .inner {
    padding: 40px 0;
  }
  .finansTipSec__list {
    grid-template-columns: repeat(auto-fit, 160px);
    gap: 9px;
  }
  .toggle-menu {
    display: block;
  }
  .page-container, .header {
    transition: none;
    left: inherit;
  }
  .container {
    max-width: 100%;
    padding: 0 20px;
    display: block;
  }
  form.contactForm ul li input, form.contactForm ul li select {
    height: 45px;
  }
  form.contactForm ul li input[type="submit"] {}
  .header {
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1);
  }
  a.isube_btn {
    margin-top: 20px;
  }
  a.musteriOl_btn {
    margin-top: 20px;
  }
  .headerBottom {
    height: auto;
  }
  .toggle-menu {
    display: block;
    float: right;
    position: relative;
    right: -20px;
    padding: 32px 25px 32px 25px;
  }
  .headerBar {
    display: none;
  }
  .page-container {
    /* background: #fff; */
    z-index: 2;
    display: block;
    padding-top: 80px;
  }
  a.logo {
    width: 150px;
    top: 28px;
  }
  a.logo:after {
    display: none;
  }
  .footerForm:before {
    display: none;
  }
  .formImg {
    position: relative;
    top: 0px;
    left: inherit;
    display: table;
    margin: auto;
  }
  .footerForm form {
    width: -webkit-fill-available;
    width: 447px;
    display: table;
    margin: 20px auto 10px;
    float: none;
  }
  .f_menu {
    /* display: none; */
  }
  .footerText {
    float: none;
    width: 100%;
    text-align: center;
    width: 300px;
    display: table;
    margin: auto;
  }
  .flogo {
    display: table;
    margin: auto;
  }
  .footer:before {
    display: none;
  }
  .fcontact {
    display: none;
  }
  .footerCopyright {
    width: 100%;
    display: block;
    float: none;
    text-align: center;
  }
  .fSocial {
    margin: auto;
    text-align: center;
    padding-top: 20px;
  }
  .loginSlider {
    width: 100%;
  }
  .loginBox {
    width: 100%;
    margin-top: 30px;
  }
  ul.tabMenu li {
    border: 2px solid #e9ebf4;
    border-bottom: 0px;
  }
  .headerBottom .container:before {
    width: 100%;
    left: 0px;
  }
  .hBarTel {
    margin-top: 20px;
  }
  .loginSlider {
    width: 100%;
  }
  .loginBox {
    width: 100%;
    margin-top: 30px;
  }
  ul.tabMenu li {
    border: 2px solid #e9ebf4;
    border-bottom: 0px;
  }
  .headerBottom .container:before {
    width: 100%;
    left: 0px;
  }
  .hBarTel {
    margin-top: 20px;
  }
  .isubeBaslik {
    padding: 30px 0px;
    line-height: 30px;
    height: auto;
  }
  .newCustomerBox {
    background-position: -340% 100%;
  }
  /*.passwordBox { background: #fff url(../images/sifremiunuttumBg_mobil.png) center top no-repeat; background-size: contain; }*/
  .passwordBox form.contactForm {
    margin: 30% auto 50px;
    float: none;
    display: table;
  }
  .accountStatic {
    width: calc(100% - 280px);
  }
  .lastHistory {
    width: 250px;
    /* margin-top: 10px; */
  }
  .lastHistory .title {
    border: 2px solid #e9ebf4;
    border-bottom: 0px;
  }
  .dashSidebar {
    display: none;
  }
  .dashSidebar a {
    float: left;
    margin-right: 20px;
  }
  .accountList ul li .circle {
    display: table;
    margin: auto;
    float: none;
  }
  .accountList ul li .acTitle {
    width: 100%;
    display: block;
    text-align: center;
    margin-top: 20px;
  }
  .accountList ul li {
    padding: 20px 0px;
  }
  .accountList ul li a {
    margin: 20px auto;
    display: table;
  }
  .accountPage .accountStatic {
    width: 100%;
  }
  .accountTable {
    width: 100%;
    margin-top: 20px;
  }
  .odemePage .card-wrapper {
    float: left;
    margin-bottom: 30px;
    margin-top: 0px;
  }
  .referansPage .contactText {
    font-size: 18px;
  }
  .referansPage form.contactForm {
    width: 500px;
  }
  .liveFrame iframe {
    height: 374px;
  }
  .sifreInfo {
    margin-left: 30px;
    width: 220px;
    font-size: 12px;
  }
  .stepSlider {
    width: 90%;
  }
  .ustMenu>ul>li:hover>ul {
    width: 210px;
    left: 0px;
  }
  .menuBg {
    top: 63px;
    position: absolute;
    bottom: 0;
    height: auto;
  }
  .ustMenu.ozel>ul>li:hover>ul {
    right: 0px;
    left: inherit;
  }
  .ustMenu>ul>li>ul>li>a:before, .ustMenu.ozel>ul>li>ul>li>a:before {
    display: none;
  }
  .ustMenu>ul>li>ul>li>a {
    padding: 10px 0px;
  }
  .isubeMenu ul li {
    width: calc(33.33%);
  }
  .ustMenu>ul>li.menu-item-has-children>a {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .ustMenu.ozel>ul>li.menu-item-has-children>a {
    padding: 30px 20px;
  }
  .ustMenu.ozel {
    height: auto;
    margin-right: 0px;
  }
  .ustMenu {
    height: auto;
    margin-right: 0px;
  }
  .headerTitle {
    display: none;
  }
  .stepImg {
    /* width: 340px; */
    display: none;
  }
  .step1 .contactForm {
    width: 100%;
  }
  .formTitle br {
    display: none;
  }
  .musteriBilgileri {
    width: 100%;
  }
  .step2 {
    padding: 80px 20px !important;
  }
  .step2Text {
    width: 70%;
    text-align: center;
    margin: 0px;
    padding: 0px 0px 40px;
    display: table;
    margin: auto;
    float: none;
  }
  .odemeOzet, .odemecizelgesi {
    padding: 0px;
  }
}

@media only screen and (max-width: 576px) {
  select {
    height: 45px !important;
  }
  .hImg {
    height: 50px;
  }
  .footerCopyright {
    width: 100%;
    line-height: 24px;
    display: table;
    margin: 20px auto 30px;
    font-size: 13px;
    float: left;
  }
  .fSocial {
    padding-top: 0;
    display: table;
    margin: auto;
    float: none;
  }
  .owl-carousel .owl-dots button.owl-dot {
    width: 10px !important;
    height: 10px !important;
  }
  .owl-carousel .owl-dots button.owl-dot.active {
    width: 25px !important;
    height: 10px !important;
    top: 0px !important;
    background: var(--primary-back-color);
  }
  .owl-carousel .owl-dots button.owl-dot:before {
    display: none;
  }
  .owl-carousel .itemHover a {
    font-size: 14px;
  }
  .owl-carousel .itemHover {
    margin-left: 100%;
    padding: 65px 20px;
  }
  a.fBarTel {
    display: table;
    margin: 10px auto 0;
    float: none;
  }
  .footerBar {
    padding-top: 20px;
  }
  form.contactForm .formtitle {
    font: var(--font-text)
  }
  a.isube_btn {
    width: auto;
    font-size: 12px;
    padding: 0 10px;
    margin-top: 15px;
    line-height: 33px;
    height: 35px;
  }
  a.musteriOl_btn {
    width: auto;
    padding: 0 10px;
    font-size: 12px;
    line-height: 35px;
    height: 35px;
    margin-top: 15px;
  }
  .toggle-menu {
    right: 0px;
    padding: 25px 20px 25px 20px;
    margin-right: -20px;
  }
  a.logo {
    width: 80px;
    top: 25px;
    left: 0;
  }
  .socialBar .socialText {
    text-align: center;
    display: block;
    float: none;
    line-height: 30px;
    font-size: 14px;
  }
  .socialBar {
    padding: 10px;
  }
  .logoLeft {
    display: none;
  }
  .logoRight {
    float: none;
    margin: auto;
    display: table;
  }
  .isubeMenu ul li {
    width: 33.33%;
  }
  .accountStatic {
    width: 100%;
    padding: 10px;
  }
  .lastHistory {
    width: 100%;
    margin-top: 20px;
  }
  span.accountSelected {
    font-size: 16px;
  }
  .accountSelect .tail-select .select-label .label-inner {
    font-size: 14px;
    padding-top: 30px;
  }
  .accountNextDate {
    margin-bottom: 10px;
  }
  .isubeBaslik {
    font-size: 24px;
    padding-top: 10px;
    padding-bottom: 20px;
  }
  html:before {
    height: 300px;
  }
  .ustMenu>ul>li:hover>ul {
    width: 210px;
    left: 0px;
  }
  .menuBg {
    top: 63px;
    position: absolute;
    bottom: 0;
    height: auto;
  }
  .ustMenu.ozel>ul>li:hover>ul {
    right: 0px;
    left: inherit;
  }
  .ustMenu>ul>li>ul>li>a:before, .ustMenu.ozel>ul>li>ul>li>a:before {
    display: none;
  }
  .ustMenu>ul>li>ul>li>a {
    padding: 10px 0px;
  }
  .mobilFixedMenu {
    position: fixed;
    bottom: 0px;
    left: 20px;
    width: calc(100% - 40px);
    z-index: 2222;
    background: var(--primary-back-color);
    background: -moz-linear-gradient( 145deg, rgba(202, 9, 102, 1) 0%, rgba(217, 45, 128, 1) 100%);
    background: -webkit-linear-gradient( 145deg, rgba(202, 9, 102, 1) 0%, rgba(217, 45, 128, 1) 100%);
    background: linear-gradient( 145deg, rgba(202, 9, 102, 1) 0%, rgba(217, 45, 128, 1) 100%);
    -webkit-border-top-left-radius: 7px;
    -webkit-border-top-right-radius: 7px;
    -moz-border-radius-topleft: 7px;
    -moz-border-radius-topright: 7px;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    display: block;
  }
  .mobilFixedMenu ul {
    width: 100%;
  }
  .mobilFixedMenu ul li {
    width: 25%;
    float: left;
    border-right: 1px solid var(--primary-border-color);
  }
  .mobilFixedMenu ul li a {
    text-align: center;
    display: block;
    font-size: 12px;
    color: var(--white-text-color);
    padding: 10px 0px;
  }
  .mobilFixedMenu ul li a i {
    display: table;
    margin: auto;
    display: table;
    border-radius: 33px;
    background: var(--primary-back-color);
    position: relative;
    margin-top: -28px;
    text-align: center;
    margin-bottom: 8px;
    padding: 10px;
    box-shadow: 0px 15px 20px 0px rgba(0, 0, 0, 0.4);
  }
  .mobilFixedMenu ul li a i img {
    width: 15px;
    display: table;
    margin: auto;
  }
  .mobilFixedMenu ul li:last-child {
    border: none;
  }
  .ustMenu>ul>li.menu-item-has-children>a strong {
    display: none;
  }
  .ustMenu>ul>li.menu-item-has-children>a span {
    top: 0px;
    float: none;
  }
  .ustMenu>ul>li.menu-item-has-children>a {
    padding: 15px 20px 10px 0px;
  }
  .ustMenu {
    float: left;
    padding-right: 0px;
  }
  .ustMenu.ozel {
    float: right;
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    border-right: none;
    padding-right: 0px;
  }
  .isubeMenu {
    display: none;
  }
  .header {
    margin-bottom: 20px;
  }
  .ustMenu.ozel>ul>li.menu-item-has-children>a {
    padding: 26px 15px 20px;
  }
  a.hBarTel {
    display: none;
  }
  .progress {
    width: 140px;
    height: 160px;
  }
  .accountPart {
    position: relative;
    left: 0px;
    margin: 0px;
    float: left;
    width: 50%;
    top: 0px;
    transform: none;
    margin-bottom: 20px;
  }
  .accountPart.right {
    margin-left: 0px;
    border-left: 1px solid #e9ebf4;
  }
  .circle {
    margin: 0px auto;
  }
  .circleValue {
    font-size: 28px;
  }
  .accountList ul li {
    width: 100%;
    border-right: none;
    border-top: 1px solid #e9ebf4;
  }
  .accountList ul li:nth-child(2) {
    border-top: 1px solid #e9ebf4;
  }
  .accountTable ul.tabMenu li {
    font-size: 14px;
    padding-left: 20px;
    padding-right: 20px;
  }
  .history ul li {}
  .accordionButton {
    line-height: initial;
  }
  .accountStatic a.odemeYapBtn {
    line-height: 40px;
    font-size: 14px;
  }
  .box {
    padding: 20px;
  }
  .sifrePage .boxTitle {
    margin-top: 10px;
    padding-bottom: 20px;
    font-size: 18px;
    font-weight: 500;
  }
  .sifrePage form.contactForm {
    width: 100%;
  }
  .sifreInfo {
    width: 100%;
    margin-left: 0px;
    margin-top: 10px;
  }
  .userPage .userButton {
    position: relative;
    top: 0px;
    margin-top: 30px;
  }
  .userPage .userAvatar {
    width: 80px;
  }
  .userPage .userName {
    font-size: 20px;
    margin-top: 20px;
  }
  .userPage .userTitle {
    font-size: 14px;
  }
  .userPage .userInfo {
    padding-bottom: 10px;
  }
  .userPage .w50 {
    width: 100%;
    padding: 20px 0px 0;
  }
  .userPage .w50:last-of-type {
    border-left: none;
    border-top: 1px solid #e9ebf4;
    padding: 20px 0px 0;
  }
  .facetoface .screenOne, .facetoface .screenTwo {
    width: 100%;
    margin-left: 0px;
    margin-bottom: 20px;
  }
  .facetoface {
    display: inline-block;
    margin-top: 20px;
  }
  .userContact ul li {
    font-size: 13px;
  }
  .userPage .userButton a.sifreDegistir {
    width: auto;
    display: inline-block;
  }
  .referansPage .contactBox form.contactForm>ul>li {
    width: 100% !important;
    margin-right: 0px;
  }
  .referansPage form.contactForm {
    width: 100%;
  }
  .referansPage .contactText {
    font-size: 16px;
    line-height: 25px;
  }
  .referansPage .box {
    padding: 20px;
  }
  .odemePage .card-wrapper {
    display: none;
  }
  .odemePage .tabPage form.contactForm {
    width: 100%;
  }
  .odemePage .tabPage form.contactForm>ul>li:nth-child(2), .odemePage .tabPage form.contactForm>ul>li:nth-child(3) {
    width: 100%;
    margin-right: 0px;
  }
  .odemePage .tabPage form.contactForm>ul>li:nth-child(4), .odemePage .tabPage form.contactForm>ul>li:nth-child(5) {
    width: calc(50% - 7px);
  }
  .odemePage .tabPage form.contactForm>ul>li:nth-child(5) {
    margin-right: 0px;
  }
  .odemePage .tabPage {
    padding: 20px;
  }
  .odemePage ul.tabMenu li {
    font-size: 14px;
    padding-left: 10px;
    padding-right: 10px;
  }
  .bankaList ul li {
    width: 100%;
    font-size: 13px;
  }
  .bankaList h2 {
    font-size: 18px;
  }
  .bankaList ul li strong {
    font-size: 18px;
  }
  .odemePage p {
    line-height: initial;
    font-size: 15px;
  }
  .footer {}
  .f_menu ul li {
    float: none;
    display: inline-block;
  }
  .f_menu {
    text-align: center;
  }
  a.hBarTel.mobilShow {
    display: block;
    float: left;
    margin-left: 0px;
    margin-bottom: 10px;
    font-size: 13px;
  }
  .formMesaj {
    padding: 60px 30px;
  }
  .formMesaj h2 {
    font-size: 24px;
  }
  .newCustomerBox {
    padding: 120px 20px 20px;
    background: url(../images/formBg_mobil.jpg) center top no-repeat;
    background-size: contain;
  }
  .newCustomerBox form.contactForm {
    width: 100%;
    margin: 0px;
  }
  .passwordBox {
    padding: 0 20px;
    box-sizing: border-box;
  }
  .passwordBox form.contactForm {
    width: 100%;
    margin-bottom: 20px;
  }
  .stepTitle span {
    font-size: 16px;
    line-height: 40px;
    height: 40px;
    width: 150px;
    z-index: 22;
    position: relative;
    display: table;
    margin: auto;
  }
  .stepTitle:before {
    margin-top: 20px;
    width: 100%;
    position: absolute;
    left: 0px;
  }
  .box .timeline {
    left: -3px;
    display: none;
  }
  .box .line {
    display: none;
  }
  .line {
    height: 50px;
  }
  .stepSlider h3 {
    font-size: 18px;
    margin-bottom: 20px;
  }
  .finansTipSec label {
    margin: 5px 5px;
    font-size: 12px;
    padding-bottom: 10px;
  }
  .stepSlider {
    width: 100%;
  }
  .sliderNav {
    /* width: 240px; */
  }
  #progress-wrapper {
    width: 250px;
  }
  .stepTitle {
    margin-bottom: 20px;
  }
  .finansTipSec label i {
    margin-bottom: 10px;
  }
  .stepSlider .item .w50 {
    width: 90%;
    display: table;
    margin: 20px auto 0px;
    float: none;
  }
  .stepSlider .item .w50 h3 {
    margin-bottom: 10px;
  }
  .stepSlider .item .w50:nth-child(2) {
    margin: 20px auto 0;
  }
  .rangeInput {
    height: 50px;
    font: var(--font-emphasis);
  }
  .stepSlider .item.w100 {
    padding: 0 10%;
  }
  .w100 label {
    font-size: 14px;
    margin-bottom: 10px;
  }
  .araOdemeTarihleri ul>li:last-child {
    width: 100%;
    margin-top: 10px;
  }
  .araOdemeTarihleri ul>li a {
    /* opacity: 0.5; */
    display: block;
    background: #c5d1d6;
    width: 100%;
    border-radius: 4px;
    line-height: 40px;
    text-align: center;
    font-weight: bold;
  }
  .araOdemeTarihleri ul {
    margin-bottom: 20px;
  }
  .araOdemeTarihleri ul>li {
    width: 100%;
    margin: 0px;
  }
  .stepTitle:before {}
  .araOdemeTarihleri h4 {
    margin-bottom: 10px;
  }
  .odemeOzet, .odemecizelgesi {
    padding: 0px;
  }
  .odemeOzet ul li {
    width: calc(50% - 10px);
    height: auto;
    padding-bottom: 20px;
    height: 120px;
    padding: 30px 20px 20px;
  }
  .odemeOzet ul li:nth-child(4n) {
    margin-right: 0px;
  }
  .odemeOzet ul li:nth-child(even) {
    margin-right: 0px;
  }
  .odemecizelgesi th.tg-bqcy {
    font-size: 14px;
    line-height: 18px;
  }
  .odemecizelgesi .title {
    font-size: 18px;
  }
  .sonucButtons a {
    width: 100%;
    margin-bottom: 10px;
    margin-right: 0px;
  }
  .sonucButtons {
    margin-bottom: 0px;
  }
  .sonucButtons a:last-child {
    margin-bottom: 0px;
  }
  .colorBox {
    width: 100%;
    margin: 20px 0px;
  }
  a.odemeYapBtn {
    width: auto;
    padding: 0 20px;
  }
  .colorBox .inner .title {
    font-size: 18px;
  }
  .sozlesmeButton {
    float: left;
    width: 100%;
    display: inline-block;
    top: 0px;
    padding: 20px 0px;
  }
  .sozlesmeButton a {
    margin-left: 0px;
    margin-right: 20px;
  }
  .musteeriSozlesmesi iframe {
    height: 360px;
  }
  .odemeOzet ul li span {
    font-size: 12px;
  }
  .stepSlider .item .w50 {
    width: 100%;
  }
  .stepNum ul li a {
    font-size: 14px;
    padding: 0 8px;
    height: 24px;
    line-height: 24px;
  }
  .stepNum ul {
    padding: 0px;
  }
  .stepNum ul li {
    margin: 0 8px;
  }
  .stepNum {
    margin-bottom: -35px;
  }
  .hesaplamaPage {
    margin-top: 20px;
  }
  .stepImg {
    /* display: table; */
    position: relative;
    right: 0px;
    bottom: -22px;
    width: 80%;
    margin-top: 40px;
    display: none;
  }
  .step1 .contactForm {
    width: 100%;
  }
  div#chart {
    float: none;
    margin: auto;
    width: 100px;
  }
  .step2Text {
    width: 90%;
    padding-bottom: 10px;
  }
  .smsDogrula {
    width: 100%;
    margin-top: 30px;
  }
  #yenidenSifre {
    /* height: 45px;
    line-height: 45px; */
  }
  .step2 {
    padding: 50px 20px !important;
  }
  .formTitle {
    margin-top: 0px;
  }
  .musteriBilgileri form.contactForm>ul>li {
    width: 100% !important;
  }
  .f_menu ul li {
    display: block;
    width: 100%;
  }
  .f_menu>ul>li>ul>li a {
    margin: 0px;
    padding: 10px 0px;
  }
  .f_menu {
    margin: 10px 0px;
  }
  .socialBar .socialText {
    display: none;
  }
  .fSocial {}
  .f_menu ul li.appicon {
    width: 290px;
    display: table;
    margin: auto;
  }
  .f_menu ul li.musterihizmetleri {
    width: 210px;
    display: table;
    margin: auto;
  }
  img.telicon {
    margin-left: 0px;
  }
  li.appicon a {
    padding-top: 20px !important;
    display: inline-block;
    float: left;
  }
}

@media only screen and (max-width: 390px) {
  a.isube_btn i {
    display: none;
  }
  .acDetail_list ul li {
    font-size: 13px;
  }
  a.accountActivitiesBtn {
    width: 100%;
  }
  a.accountTableBtn {
    width: 100%;
    margin-top: 10px;
  }
  .odemeOzet ul li h5 {
    margin-top: 10px;
  }
  .stepSlider .item {
    padding-bottom: 20px;
  }
  .w100 .r_label {
    height: auto;
    line-height: initial;
    padding: 10px 10px !important;
    display: block;
  }
  .mt37 {
    margin-top: 0px;
  }
  .stepSlider .item .w50 {
    width: 100%;
    margin-top: 0px;
  }
  /* .stepSlider h4 {
    font-size: 15px;
  } */
  select {
    height: 40px !important;
  }
  .hesaplamaPage {
    margin-top: 40px;
  }
  a#yenidenSifre {
    width: 100%;
  }
  form.contactForm.smsDogrula ul li {
    width: 100% !important;
  }
  form.contactForm.smsDogrula ul li:last-child {
    width: 100% !important;
  }
  .step2Text {
    width: 100%;
  }
}

@media only screen and (max-width: 350px) {
  .page-container {
    padding-top: 50px;
  }
  form.contactForm ul li input, form.contactForm ul li select {
    height: 40px;
  }
  a.musteriOl_btn {
    font-size: 11px;
  }
  a.isube_btn {
    font-size: 11px;
    line-height: 14px;
    height: 35px;
    width: 60px;
    padding-top: 4px;
    margin-right: 11px;
  }
  .toggle-menu {
    padding-left: 15px;
  }
  .acDetail_list ul li {
    font-size: 13px;
  }
  .acDetail_list ul li strong {
    width: 80px;
  }
  .container {
    padding: 0 10px;
  }
  .mobilFixedMenu {
    width: calc(100% - 20px);
    left: 10px;
  }
  .finansTipSec label {}
  .odemeOzet ul li {
    width: 100%;
    margin-right: 0px;
    height: auto;
    margin-bottom: 10px;
  }
  .odemeOzet ul li {
    height: 110px;
  }
  .stepNum ul li a {
    padding: 0 4px;
    font-size: 13px;
    line-height: 15px;
    height: 15px;
  }
  .stepNum ul li {
    margin: 0 5px;
  }
}

.hide {
  opacity: 0;
  visibility: hidden;
  transition: 0.3s all;
  position: absolute !important;
}