body {
    font-family: 'Rubik', sans-serif;
}

.header {
    top: 0;
    left: 0;
    right: 0;
    box-shadow: 0 2px 5px rgb(0 0 0 / 10%);
    background: #fff;
    z-index: 99;
    padding:15px 0px;
}

.logo img {
    width:60%;
}

.buttons {
    _float: right;
}

.main-nav .buttons {
    text-align: right;
}

.btn {
    _display: inline-block;
    _vertical-align: top;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    color: #0d6efd;
    line-height: 26px;
    text-align: center;
    border: 0;
    padding: 5px;
    border-radius: 4px;
}

.btn.btn-primary {
    background: #0d6efd;
    color: #fff;
    box-shadow: 0 1px 3px rgb(0 0 0 / 20%);
}

.btn.btn-primary:hover {
    background: #fff;
    color: #0d6efd;
}

.btn:hover {
    color: #000;
}

.hero {
    color: #fff;
    position: relative;
    text-align: center;
    z-index: 1;
    background: url(../images/bg-hero.jpg) no-repeat;
    background-size: cover;
}

.hero .container {
    display: flex;
    flex-direction: column;
    position: relative;
}

h1 {
    font-size: 3.1em;
    line-height: 60px;
    font-weight: 500;
    width: 65%;
    margin: 0 auto;
    position: relative;
    text-align: center;
    padding-top:40px;
}

.hero  p {
    letter-spacing: .3em;
    font-family: Rubik,sans-serif;
}

.btn-secondary {
    background: #fff;
    color: #0d6efd;
    box-shadow: 0 3px 15px rgb(0 0 0 / 16%);
    width: fit-content;
    margin:0 auto;
    position: relative;
    padding: 12px 25px;
    margin-top:35px;
    font-size:1em;
    font-weight: 500;
}

.hero.btn {
    margin: 35px 0 0;
}

.hero .bottom {
    width: 100%;
    margin-top: auto;
    padding-top: 55px;
    font-size: 1em;
    letter-spacing: .266em;
    font-family: Rubik,sans-serif;
    padding-bottom:40px;
}

.btn-secondary:hover {
    background: #0d6efd;
    color: #fff;
}

.white-row {
    background:#fff;
    box-shadow: 0 -20px 25px rgb(0 0 0 / 16%);
    padding:45px 125px;
}

.white-row h3 {
    font-weight: bold;
    color:#000;
    font-size:3em;
    text-align: center;
    padding-bottom:0px;
    margin-bottom:-5px;
}

.white-row span {
    color:#0d6efd;
    font-weight: 500;
    text-align: center;
}

.bordered {
    border-right:1px solid #ddd;
    border-left:1px solid #ddd;
}

.gray {
    background:#fafbfb;
}

.percent {
    width:100%;
}

.text-section h2 {
    font-size: 2em;
    color: #000f22;
    padding: 8px 0;
    line-height: 35px;
    font-weight: 700;
}

.text-section p {
    color:#7f8690;
    font-weight: normal;
    font-size: 1em;
}

.pl5 {
    padding-left:15%;
}

.box-content h2 {
    color:#222;
    font-weight: 700;
}

.box-content p {
    color:#999;
    font-size:1.1em;
}

.gray {
    background:#fafbfb;
    padding:35px 15px;
}

.box-img {
    width:80%;
}

.head-testimonial {
    font-size:2em;
    font-weight: bold;
    width:60%;
    margin:0 auto;
    position: relative;
    display: block;
    text-align: center;
    padding:25px;
}

.swiper-slide {
    margin-top:35px;
    padding:35px 25px;
    border:1px solid #ddd;
    border-radius: 12px;
    box-shadow: 0px 0px 24px rgba(221, 221, 221, 0.651);
    margin-bottom:35px;
}

.swiper-slide p {
    text-align: center;
    color:#888;
    line-height: 1.6em;
}

.swiper-slide h5 {
    text-align: center;
    font-weight: bold;
    font-size:1.1em;
}

.mySwiper {
    padding-bottom:35px;
}

.footer {
    padding-top:90px;
    padding-bottom:30px;
}

.footer h6 {
    font-size: 2em;
    text-align: center;
    font-weight: bold;
}

.footer input {
    padding:15px;
    margin-top:15px;
    text-indent: 40px;
}

.footer label {
    font-size:.8em;
    padding-left:10px;
    color:#888;
}

.footer a {
    color:#0d6efd;
}

.footer-text {
    margin-top:30px;
    color:#999;
    font-size:.8em;
    padding: 30px 35px;
    margin-bottom:0px;
    padding-bottom:0px;
}

.footer-text span {
    float: right;
}

.footer i {
    position: absolute;
    top:20px;
    left:15px;
    color:#0d6efd;
    font-size:1.3em;
}

.rltv {
    position: relative;
}

.footer button {
    color:#fff;
    background:#0d6efd;
    padding:8px 25px;
    border-radius: 4px;
    border:none;
    display: block;
    width: fit-content;
    margin:0 auto;
    margin-top:10px;
}

.footer button:hover {
    background:#7f8690;
}

.log {
    background-image: url(../images/bg-hero.jpg);
    background-size:cover;
    padding:50px;
}

.log .row {
    height: 80%;
    position: relative;
}

.log h6 {
    color:#fff;
    font-weight: normal;
    font-size:3em;
    text-align: center;
}

.log-box {
    width:100%;
    border-radius: 6px;
    background:#fff;
    height:85vh;
    padding:75px;
}

.log-box .logo {
    width:60%;
    margin:0 auto;
    position: relative;
    display: block;
    margin-bottom:20px;
}

.log-box .logo img {
    width:100%;
}

.log-form {
    padding:25px 50px;
}

.log-form .form-control {
    padding:10px 15px;
}

.log-form input {
    margin-bottom:15px;
}

.log-box span {
    margin-bottom:15px;
    display: block;
    font-size:2em;
}

.log-box .acc {
    text-align: center;
    display: block;
    width: 100%;
    color:#999;
}

.log-box .acc a {
    color:#0d6efd;
    text-decoration: none;
}

.log-box .acc a:hover {
    color:#000;
    text-decoration: none;
}

.log-box button {
    color:#fff;
    background:#0d6efd;
    padding:8px 25px;
    border-radius: 4px;
    border:none;
    display: block;
    width: fit-content;
    margin:0 auto;
    margin-top:20px;
}

.log-box button:hover {
    background:#7f8690;
}

.get-center .logo img {
    width: 60%;
    margin: 0 auto;
    position: relative;
    display: block;
    filter: brightness(0) invert(1);
    margin-bottom:10px;
}

.admin-user {
    text-align: center;
    padding:5px;
    color:#7f8690;
    display: inline-block;
}

.admin-container {
    background:#f4f6f8 !important;
}

.switch {
    display: inline-block;
    height: 20px;
    position: relative;
    width: 40px;
    top: 5px;
    margin-left: 5px;
}

  .switch input {
    display:none;
  }

  .slider {
    background-color: #ccc;
    bottom: 0;
    cursor: pointer;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: .4s;
  }

  .slider:before {
    background-color: #fff;
    bottom: 2px;
    content: "";
    height: 16px;
    left: 2px;
    position: absolute;
    transition: .4s;
    width: 16px;
  }

  input:checked + .slider {
    background-color: #0d6efd;
  }

  input:checked + .slider:before {
    transform: translateX(20px);
  }

  .slider.round {
    border-radius: 34px;
  }

  .slider.round:before {
    border-radius: 50%;
  }

  .cat-name {
      display: inline-block;
      margin-top:-5px;
      position: relative;
  }

  .admin-white-box {
      padding:25px;
      background:#fff;
      margin-top:20px;
  }

  .ad-filters i {
      padding-right:4px;
      color:#0d6efd;
  }

  .ad-filters a {
      color:#222;
      text-decoration: none;
      text-align: center;
  }

  .ad-filters a:hover {
      color:#fff;
      background:#0d6efd;
  }

  .ad-filters a:hover i {
      color:#fff;
  }

  .filter-search {
      padding-left:45px;
  }

  #stock-search {
      position: relative;
  }

  #stock-search i {
      position: absolute;
      left:14px;
      top:10px;
  }

  .ad-filters span {
      display: inline-block;
      width: fit-content;
      padding-right:7px;
  }

  .custom-select {
    display: inline-block;
    width: fit-content;
  }

  .pr-name {
      font-weight: 500;
  }

  .pr-brand {
      color:#777;
      font-weight: 300;
      padding-bottom:10px;
  }

  .pr-corp, .pr-ref {
      font-weight: 300;
  }

  .btn-success {
      background:rgb(90, 193, 0);
  }

  .action-row a {
      color:#fff !important;
      padding:3px 12px !important;
      font-size:.8em !important;
      font-weight: 500;
  }

  .action-row i {
      padding-right:6px;
  }

  .add-stock {
    width: 100%;
    __height: 100vh;
    background: rgba(0, 153, 255, 0.96);
    position: relative;
    z-index: 50;
    padding: 50px;
}

  .add-stock .title {
      font-size:2em;
      color:#fff;
  }

  .add-stock .close {
      text-align: right;
      color:#fff;
      font-size:1.2em;
      text-decoration: none;
      display: block;
  }

  .add-stock .close:hover {
      color:#222;
  }

  .add-stock a i {
      padding-left:7px;
  }


  .add-stock .row {
      margin-bottom:15px;
  }

  .add-stock .refnum {
      padding:15px 20px;
      font-weight: 400;
  }

  .ref-note {
      padding-top:10px;
      padding:10px;
      font-size:.9em;
      color:#fff;
      display: block;
      font-weight: 300;
  }

  .data-row {
      background:#fff;
      border-radius: 5px;
      display: block;
      margin:0px;
      margin-bottom:10px !important;
      padding:3px;
  }

  .data-row div {
      display: table-cell;
      vertical-align: middle;
  }

  .data-row div a {
      color:#fff;
      float: right;
  }

  .data-texts span {
      font-size:.8em;
      color:#fff;
  }

  .data-texts .data-col {
      color:#fff;
      font-weight: bold;
      margin-bottom:25px !important;
      display: block;
  }

  .data-texts .form-control {
      margin-bottom:25px;
  }

  .data-texts textarea {
      color:#222;
  }

  .data-texts .pl-text {
      color:#fff;
  }

  .up-img {
      font-size:3em;
      display: inline-block;
      color:#fff;
      margin-left:5px;
  }

  .up-hold {
      display: inline-block;
  }

  .data-border {
      border:1px solid #fff;
      border-radius: 5px;
      padding:0px 20px;
      width: fit-content;
      display: inline-block;
  }

  .data-border:hover {
    background:rgb(7, 116, 189);
}

.data-texts .btn-success {
    font-weight: normal;
    padding:15px 25px;
    color:#fff;
}