﻿/***********LEFT SIDEBAR**************/
#abpds-sidebar {
  box-shadow: inset -1px 0 0 0 rgba(0, 0, 0, 0.1);
  position: fixed;
  top: 50px;
  bottom: 0;
  left: 0;
  overflow: hidden;
  width: 320px;
  background: #6C2621;
  border-right: 1px solid #e6e6e6;
  z-index: 1000;
  overflow-y: auto;
  height: 100%;
  padding-bottom: 30px;
}


  #abpds-sidebar.hidden {
    box-shadow: inset -1px 0 0 0 rgba(0, 0, 0, 0.1);
    position: fixed;
    top: 50px;
    bottom: 0;
    left: 0;
    overflow: hidden;
    width: 0px;
  }

#abpds-content-wrapper.wide {
  margin: 10px 15px 0 15px;
}




@media (max-width: 767px) {
  #abpds-sidebar {
    top: 58px;
  }
}


/*************LEFT SIDEBAR -MENU***************/
#abpds-menu-wrapper {
  font-size: 12px;
  padding: 0;
  margin-bottom: 30px;
  margin-top: 5px;
  margin-top: 1px;
}

  #abpds-menu-wrapper > li {
    position: relative;
    /*margin-bottom: 5px;*/
  }

    #abpds-menu-wrapper > li > a {
      color: white;
      position: relative;
      display: block;
      text-decoration: none;
      font-size: 13px;
      padding-left: 0;
      border-bottom: dotted 1px #361613;
      height: 45px;
      display: table;
      width: 100%;
    }


      #abpds-menu-wrapper > li > a .title {
        margin-left: 65px;
        display: block;
        padding-left: 6px;
        opacity: 1;
        text-shadow: none;
        -webkit-transition: all 0.5s cubic-bezier(0.15, 0.99, 0.18, 1.01);
        -o-transition: all 0.5s cubic-bezier(0.15, 0.99, 0.18, 1.01);
        transition: all 0.5s cubic-bezier(0.15, 0.99, 0.18, 1.01);
        color: #CAD2DC;
        display: table-cell;
        vertical-align: middle;
        padding-left: 65px;
      }

      #abpds-menu-wrapper > li > a:hover {
        background-color: #562320;
      }

        #abpds-menu-wrapper > li > a:hover .menu-icon {
          background-color: white;
          color: #562320;
        }

        #abpds-menu-wrapper > li > a:hover .title {
          color: white;
        }

    #abpds-menu-wrapper > li.active > a {
      background-color: #562320;
    }

  #abpds-menu-wrapper li.active .menu-icon,
  #abpds-menu-wrapper li.active .menu-icon:hover {
    background-color: #ffffff;
    border-color: #ffffff;
    color: #562320;
  }

  #abpds-menu-wrapper li.active > a .title {
    color: white;
    font-weight: 500;
  }

.menu-icon .fa:first-child, .menu-icon .md:first-child, .menu-icon .glyphicon:first-child {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  line-height: 40px;
  width: 1em;
}

.menu-icon {
  position: absolute;
  left: 12px;
  top: 2px;
  width: 40px;
  height: 40px;
  color: #535858;
  font-size: 18px;
  overflow: hidden;
  border-radius: 999px;
  -webkit-transition: all 0.15s linear;
  -o-transition: all 0.15s linear;
  transition: all 0.15s linear;
  color: white;
}

.menu-icon-active {
  background-color: #ffffff;
  border-color: #ffffff;
  color: #0aa89e;
}

.menubar-visible #abpds-menu-wrapper li .title {
  left: 0;
  opacity: 1;
}

#abpds-menu-wrapper > li.opened > a {
  color: white;
  position: relative;
  display: block;
  text-decoration: none;
  font-size: 13px;
  padding-left: 0;
  border-bottom: none;
  height: 45px;
  display: table;
  width: 100%;
}

#abpds-menu-wrapper > li ul {
  padding: 0;
}

  #abpds-menu-wrapper > li ul > li {
    position: relative;
  }

    #abpds-menu-wrapper > li ul > li > a {
      position: relative;
      display: block;
      text-decoration: none;
      padding: 7px 17px;
      font-size: 12px;
      line-height: normal;
      border-radius: 0;
      padding-left: 57px;
      color: #ddd;
    }

#abpds-menu-wrapper li ul li:before {
  content: "";
  left: 30px;
  top: -16px;
  bottom: -15px;
  position: absolute;
  display: block;
  width: 1px;
  border-left: 1px dashed white;
  z-index: 1;
}

#abpds-menu-wrapper > li ul > li > a::before {
  content: "";
  left: 30px;
  top: 15px;
  position: absolute;
  display: block;
  width: 21px;
  border-bottom: 1px dashed white;
  z-index: 1;
}


#abpds-menu-wrapper li ul li:first-child:before {
  content: "";
  left: 30px;
  top: 0px;
  bottom: 16px;
  position: absolute;
  display: block;
  width: 1px;
  border-left: 1px dashed white;
  z-index: 1;
}


#abpds-menu-wrapper li ul li:last-child:before {
  content: "";
  left: 30px;
  top: 15px;
  bottom: 16px;
  position: absolute;
  display: block;
  width: 1px;
  border-left: 1px dashed white;
  z-index: 1;
}




/*************************************TOOLBAR BUTTONS***********************************************/
#toolbar {
  margin-left: 30px;
}

.toolbar-button {
  border-radius: 6px !important;
  padding: 0;
  margin: 0 !important;
  font-size: 13px;
  font-weight: bold;
  -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
  -webkit-transition: -webkit-box-shadow 0.15s ease-out;
  -moz-transition: -moz-box-shadow 0.15s ease-out;
  -o-transition: -o-box-shadow 0.15s ease-out;
  transition: box-shadow 0.15s ease-out;
  color: #0aa89e;
  color: #ffffff;
  background-color: white;
  border-color: white;
  outline: none;
  color: #7b8897;
  box-shadow: none;
}

  .toolbar-button i {
    font-size: 12px;
    border-radius: 15px;
    background-color: #7b8897;
    color: white;
    padding: 10px;
    width: 32px;
    margin-right: 5px;
  }

  .toolbar-button:hover {
    -webkit-box-shadow: 0 8px 14px 0 rgba(0, 0, 0, 0.38);
    box-shadow: 0 8px 14px 0 rgba(0, 0, 0, 0.38);
    outline: none !important;
    color: #7b8897;
  }

#toolbar .splitter {
}





/***********************************************************************************/
/************************ABPDS FORM ELEMAN STİLLERİ*********************************/
/***********************************************************************************/
.input-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

#drpabpdsmenu {
  margin-bottom: 10px;
}

#abpds-content-wrapper {
  margin: 10px 15px 0 335px;
}

@media (max-width: 1024px ) {
  #abpds-content-wrapper {
    margin: 10px 15px 0 15px;
  }

  /*#abpds-sidebar{
        display:none;
    }*/

  /*#drp-abpds-menu{
        display:block !important;
        margin-bottom:10px;
    }*/
  .offcanvasbody {
    width: 100% !important;
  }

  .modal-dialog {
    width: 100%;
  }
}


@media (min-width: 1200px ) {
  .panel-profil {
    width: 75%;
    margin: 0 auto;
  }
}

@media (max-width: 1600px) {
  .panel-profil {
    width: 100%;
  }
}


.box {
  display: block;
  min-height: 90px;
  background: #fff;
  width: 100%;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
  margin-bottom: 15px;
  border: solid 1px #ccc;
  position: relative;
  height: 185px;
  overflow: hidden;
}

.box-content {
  padding: 0px 10px;
  background-color: #F5F5F5;
  color: #8B827C;
}

.box-number {
  font-size: 70px;
  text-align: center;
  font-weight: bolder;
  position: relative;
  text-shadow: 0px 3px 3px rgba(50,50,50, .3);
}

.box-text {
  text-align: center;
  font-size: 14px;
  position: relative;
  top: -20px;
}

.box-footer {
  color: #AE4F3D;
  border-top: solid 1px #ccc;
  font-size: 12px;
  font-weight: bold;
  min-height: 61px;
  max-height: 70px;
  display: table;
  width: 100%;
  text-align: center;
  padding: 3px;
}

  .box-footer span {
    display: table-cell;
    vertical-align: middle;
  }

.box .mask {
  background-color: gray;
  transform: translateX(-600px);
  opacity: 0.8;
  transition: all 0.4s ease-in-out;
  background-color: gray;
  position: absolute;
  bottom: 0;
  height: 185px;
  border-radius: 1px;
  width: 101%;
  display: table;
  cursor: pointer;
}


.box h2 {
  background: rgba(255, 255, 255, 0.5);
  color: #000;
  box-shadow: 0px 1px 3px rgba(159, 141, 140, 0.5);
}

.box p {
  opacity: 0;
  color: #333;
  transition: all 0.2s linear;
  margin-top: 50px;
}

  .box p a {
    display: block;
    margin: 0 auto;
    color: white;
    text-align: center;
  }

    .box p a > i {
      color: white;
      text-align: center;
      font-size: 30px;
      display: block;
    }

.box:hover .mask {
  transform: translateX(0px);
}

.box:hover img {
  transform: translateX(300px);
  transition-delay: 0.1s;
}

.box:hover p {
  opacity: 1;
  transition-delay: 0.4s;
  transform: scale(1.1);
}














.aligncenter {
  text-align: center !important;
}

.backdrop {
  position: fixed;
  z-index: 1031;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: block;
  background-color: rgba(12, 12, 12, 0.33);
}



.offcanvas {
  position: fixed;
  top: 0px;
  bottom: 0;
  right: 0;
  z-index: 1032;
}

.offcanvas-pane.active {
  display: block;
  -webkit-box-shadow: 0 8px 14px 0 rgba(0, 0, 0, 0.38);
  box-shadow: 0 8px 14px 0 rgba(0, 0, 0, 0.38);
  -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.22, 0.99, 0.68, 0.98);
  -moz-transition: -moz-transform 0.5s cubic-bezier(0.22, 0.99, 0.68, 0.98);
  -o-transition: -o-transform 0.5s cubic-bezier(0.22, 0.99, 0.68, 0.98);
  transition: transform 0.5s cubic-bezier(0.22, 0.99, 0.68, 0.98);
  border-left: solid 1px #838289;
}

.offcanvas-pane {
  border-left: solid 1px #838289;
  position: fixed;
  top: 0;
  bottom: 0;
  min-width: 8px;
  background-color: #ffffff;
  overflow: hidden;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-transition: -webkit-transform 0.33s ease-in;
  -moz-transition: -moz-transform 0.33s ease-in;
  -o-transition: -o-transform 0.33s ease-in;
  transition: transform 0.33s ease-in;
}

.offcanvasbody {
  width: 80%;
  padding: 20px 50px;
  margin: 20px auto;
  height: calc(100vh - 110px);
  overflow-y: auto;
}

.bs-callout {
  padding: 20px;
  margin: 0px;
  /*border-left: 1px solid #838289;
  border-left-width: 10px;*/
  border-radius: -35px;
  border-bottom: solid 1px #838289;
}

.bs-callout-sm {
  padding: 5px;
  margin: 0px;
  border-left: 1px solid #838289;
  border-left-width: 5px;
  border-radius: -35px;
  border-bottom: solid 1px #838289;
  font-size: 13px;
}

.bs-callout i.header {
  font-size: 50px;
  position: absolute;
  left: 15px;
  top: 15px;
  opacity: 0.1;
}

.bs-callout h4 {
  margin-top: 0;
  margin-bottom: 5px;
  margin-left: 45px;
}

.bs-callout span {
  display: inline-block;
  margin-left: 45px;
}

.bs-callout p:last-child {
  margin-bottom: 0;
}

.bs-callout code {
  border-radius: 3px;
}


.bs-callout-default {
  border-left-color: #838289;
}

  .bs-callout-default h4 {
    color: #777;
  }

.bs-callout-maroon {
  border-left-color: #6C2621;
  border-left-width: 10px;
  border-radius: -35px;
  border-bottom: solid 1px #6C2621;
  padding: 1px 0 1px 10px !important;
}

  .bs-callout-maroon h4 {
    color: #6C2621;
    font-weight: bold;
  }

.bs-callout .sign-outbtn {
  /*position: absolute;
  top: 15px;
  right: 20px;
  font-size: 40px;
  width: 50px;
  height: 50px;
  display: inline-block;
  line-height: 50px;
  color:#838289;*/
  position: relative;
  /* top: 15px; */
  /* right: 20px; */
  /* font-size: 30px; */
  width: 40px;
  height: 40px;
  /* display: inline-block; */
  /* line-height: 50px; */
  /* color: #838289; */
  display: inline-block;
  border: solid 1px gray;
  border-radius: 99px;
  color: #838289;
}

  .bs-callout .sign-outbtn i {
    position: absolute;
    top: 9px;
    left: 11px;
    font-size: 20px;
  }

  .bs-callout .sign-outbtn:hover {
    background-color: #838289;
    color: white;
    transition-property: background-color;
    transition-duration: 0.7s;
  }

.profileInputs li {
  line-height: 30px;
}

.profile-avatar {
  text-align: center;
  border-radius: 50%;
  width: 130px;
  height: 130px;
  overflow: hidden;
  /* display: inline-block; */
  margin: 20px auto;
}


.btn-save i, .btn-modal-save i {
  margin-right: 5px;
}

.btn-modal-save {
  position: fixed;
  right: 20px;
  height: 100px;
  width: 100px;
  border-radius: 50%;
  background-color: gray;
  color: white;
  box-shadow: 1px 1px 12px 5px #626c6f;
}

  .btn-modal-save:focus {
    outline: none;
  }
/* Sacnite */
.button.button--sacnite {
  min-width: 0;
  color: #838289;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
}

.button--scanite.button--round-l {
  border-radius: 50%;
}

.button-icon {
  padding: 11px !important;
  border-radius: 80px !important;
  background-color: #838289 !important;
  width: 35px;
  height: 35px;
  color: white;
}

.button--sacnite.button--inverted {
  color: #838289;
}

.button--sacnite::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  z-index: -1;
  box-shadow: inset 0 0 0 35px #fff;
  -webkit-transform: scale3d(0.9, 0.9, 1);
  transform: scale3d(0.9, 0.9, 1);
  -webkit-transition: box-shadow 0.7s, -webkit-transform 0.7;
  transition: box-shadow 0.7s, transform 0.7s;
}

.button--sacnite.button--inverted::before {
  box-shadow: inset 0 0 0 35px #37474f;
}

.button--sacnite .button__icon {
  font-size: 22px;
  width: 22px;
}

.button--sacnite > span {
  opacity: 1;
  pointer-events: none;
  color: #838289;
  padding-left: 5px;
}

.button--sacnite:hover {
  color: #838289;
}

.button--sacnite.button--inverted:hover {
  color: #838289;
}

.button--sacnite:hover::before {
  box-shadow: inset 0 0 0 2px #838289;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  opacity: 1;
}

.button--sacnite.button--inverted:hover::before {
  box-shadow: inset 0 0 0 2px #fff;
  opacity: 1;
}

.button {
  padding: 0.5em 2em;
  border: none;
  background: none;
  color: inherit;
  vertical-align: middle;
  position: relative;
  z-index: 1;
  opacity: 0.7;
  outline: none;
}


mark {
  background-color: #9D605C;
  color: white;
}



.box-overlay {
  position: relative;
}

  .box-overlay .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #C8C4C4;
    opacity: 0.5;
  }

  .box-overlay .overlay-content {
    /*position: absolute;
    top: 40%;
    left: 40%;
    color: #fff;*/
    color: #372323;
    display: table;
    width: 100%;
    height: 100%;
  }

    .box-overlay .overlay-content > .fa {
      /*position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -15px;
    margin-top: -15px;
    font-size:40px;*/
      font-size: 40px;
    }

    .box-overlay .overlay-content p {
      margin-top: 50px;
    }

.overlay-div {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

  .overlay-div p {
    margin-top: 0 !important;
    font-size: 24px !important;
  }

.overlay-div {
  font-size: 40px;
}

.overlayminheight {
  min-height: 200px;
}

.specialAreaCheckField {
  padding: 20px;
  border: solid 1px #ddd;
  padding-left: 30px;
  border-radius: 5px;
  background-color: #D8AFAC;
  color: black;
  font-weight: bold;
}

  .specialAreaCheckField label {
    font-weight: bold;
  }



.radio + .radio, .checkbox + .checkbox {
  margin-top: 15px;
  padding-left: 0;
}


.table {
  font-size: 13px;
}


.substatusprogress {
  /*margin-left:26px !important;*/
  margin-top: 40px !important;
}


.statusprogress > li > ul::before {
  content: "";
  display: block;
  position: absolute;
  z-index: 1;
  left: 127px;
  top: 5px;
  bottom: 0;
  border: 5px solid;
  border-width: 0 0 0 3px;
  height: 93px;
  width: 5px;
}



/*li.firstsubstatusprogress:before {
  content: attr(data-step);
    display: block;
    margin: 0 auto;
    background: #DFE3E4;
    width: 1em;
    height: 150px;
    text-align: center;
    margin-bottom: 0.25em;
    line-height: 3em;
    border-radius: 100%;
    position: relative;
    z-index: 1000;
}*/


.statusprogress {
  list-style: none;
  margin: 0;
  padding: 0;
  display: table;
  table-layout: fixed;
  width: 100%;
  color: #849397;
}

  .statusprogress li {
    position: relative;
    display: table-cell;
    text-align: center;
    font-size: 0.8em;
  }

    .statusprogress li:before {
      content: attr(data-step);
      display: block;
      margin: 0 auto;
      background: #DFE3E4;
      width: 3em;
      height: 3em;
      text-align: center;
      margin-bottom: 0.25em;
      line-height: 3em;
      border-radius: 100%;
      position: relative;
      z-index: 1000;
    }

    .statusprogress li:after {
      content: '';
      position: absolute;
      display: block;
      background: #DFE3E4;
      width: 100%;
      height: 0.5em;
      top: 1.25em;
      left: 50%;
      margin-left: 1.5em\9;
      z-index: -1;
    }

    .statusprogress li:last-child:after {
      display: none;
    }

    .statusprogress li.is-complete {
      color: #2ECC71;
    }

      .statusprogress li.is-complete:before, .statusprogress > li.is-complete:after {
        color: #FFF;
        background: #2ECC71;
      }

    .statusprogress li.is-active {
      color: #3498DB;
      color: #562320;
      font-weight: bold;
    }

      .statusprogress li.is-active:before {
        color: #FFF;
        background: #3498DB;
        background: #562320;
        /*#00B432*/
      }

/**
 * Needed for IE8
 */
.statusprogress__last:after {
  display: none !important;
}

/**
 * Size Extensions
 */
.statusprogress--medium {
  font-size: 1.5em;
}

.statusprogress--large {
  font-size: 2em;
}


*, *:after, *:before {
  box-sizing: border-box;
}

h1 {
  margin-bottom: 1.5em;
}

.statusprogress {
  margin-bottom: 3em;
}

a {
  color: #3498DB;
  text-decoration: none;
}

  a:hover {
    text-decoration: underline;
  }

body {
  color: #444;
}

.navbar-right li a {
  padding-top: 13px;
  padding-bottom: 12px;
}


/*

.customcheck [type="checkbox"]:not(:checked),
.customcheck [type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
}
.customcheck [type="checkbox"]:not(:checked) + label,
.customcheck [type="checkbox"]:checked + label {
  position: relative;
  padding-left: 35px;
  cursor: pointer;
  padding-top:5px;
  font-weight:bold;
}


.customcheck [type="checkbox"]:not(:checked) + label:before,
.customcheck [type="checkbox"]:checked + label:before {
  content: '';
  position: absolute;
  left:0; top: 2px;
  width: 25px; height: 25px;
  border: 1px solid #aaa;
  background: #f8f8f8;
  border-radius: 3px;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.3)
}

.customcheck [type="checkbox"]:not(:checked) + label:after,
.customcheck [type="checkbox"]:checked + label:after {
  content: '✔';
  position: absolute;
  top: 6px; left: 8px;
  font-size: 12px;
  color: #6C2621;
  transition: all .2s;
}

.customcheck [type="checkbox"]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
.customcheck [type="checkbox"]:checked + label:after {
  opacity: 1;
  transform: scale(2);
}

.customcheck [type="checkbox"]:checked:focus + label:before,
.customcheck [type="checkbox"]:not(:checked):focus + label:before {
  border: 1px dotted blue;
}


label:hover:before {
  border: 1px solid #4778d9!important;
}




.checkbox{
    padding-left:0px !important;
}

    */


.profilNavbar {
}

  .profilNavbar > ul {
    padding-inline-start: 0px;
  }

    .profilNavbar > ul > li {
      color: white;
      cursor: pointer;
      margin: 0 !important;
      padding: 0 !important;
      border-bottom-color: #561e32 !important;
      border-style: solid !important;
      border-left-color: transparent !important;
      border-right-color: transparent !important;
      border-top-color: transparent !important;
      margin-top: -3px !important;
      border-bottom-width: 1px !important;
      list-style: none !important;
      line-height: 30px;
    }

      .profilNavbar > ul > li:hover {
        background-color: #461829;
        border-right: solid 2px #963457;
        border-left: solid 2px #963457;
      }

      .profilNavbar > ul > li.active {
        background: rgba(70,24,41,1);
        background: -moz-linear-gradient(top, rgba(70,24,41,1) 0%, rgba(117,74,90,0.69) 50%, rgba(70,24,41,1) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(70,24,41,1)), color-stop(50%, rgba(117,74,90,0.69)), color-stop(100%, rgba(70,24,41,1)));
        background: -webkit-linear-gradient(top, rgba(70,24,41,1) 0%, rgba(117,74,90,0.69) 50%, rgba(70,24,41,1) 100%);
        background: -o-linear-gradient(top, rgba(70,24,41,1) 0%, rgba(117,74,90,0.69) 50%, rgba(70,24,41,1) 100%);
        background: -ms-linear-gradient(top, rgba(70,24,41,1) 0%, rgba(117,74,90,0.69) 50%, rgba(70,24,41,1) 100%);
        background: linear-gradient(to bottom, rgba(70,24,41,1) 0%, rgba(117,74,90,0.69) 50%, rgba(70,24,41,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#461829', endColorstr='#461829', GradientType=0 );
      }

.profilSubMenu {
}

  .profilSubMenu > li {
    line-height: 40px;
  }

    .profilSubMenu > li > h4 {
      font-weight: bolder;
      color: brown;
      font-size: 14pt;
    }
