/*!
Theme Name: Sheets
Theme URI: https://oploxtech.com/
Author: Oplox
Author URI: https://oploxtech.com/
Description: Custom Theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: sheets
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Sheets is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;
  box-sizing: border-box;
}
*:before {
  box-sizing: border-box;
}
*:after {
  box-sizing: border-box;
}

body {
  font-family: "Poppins", sans-serif;
  color: #384047;
}

.sidebar {
  position: fixed;
  height: 100%;
  width: 240px;
  background: #13273a;
  transition: all 0.5s ease;
}
.sidebar.active {
  width: 0px;
}
.sidebar .logo-details {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px 0px;
}
.sidebar .logo-details .logo_name {
  color: #fff;
  font-size: 24px;
  font-weight: 500;
}
.sidebar .nav-links {
  margin-top: 10px;
  flex-direction: column;
}
.sidebar .nav-links li {
  position: relative;
  list-style: none;
  height: 50px;
}
.sidebar .nav-links li:last-child .links_name {
  color: #fe7272;
}
.sidebar .nav-links li a {
  height: 100%;
  display: flex;
  padding-left: 23px;
  width: 100%;
  align-items: center;
  text-decoration: none;
  transition: all 0.4s ease;
}
.sidebar .nav-links li a img {
  height: 24px;
  width: 24px;
  margin-right: 12px;
}
.sidebar .nav-links li a:hover {
  background: #276fb7;
}
.sidebar .nav-links li a .links_name {
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  white-space: nowrap;
  text-transform: capitalize;
}
.sidebar .nav-links li a.active {
  background: #276fb7;
}
.sidebar .nav-links li i {
  min-width: 60px;
  text-align: center;
  font-size: 18px;
  color: #fff;
}
.sidebar .copyright_para {
  color: white;
  position: absolute;
  bottom: 10px;
  text-align: center;
  width: 100%;
}

#main_content {
  position: relative;
  background: #ffffff;
  min-height: 100vh;
  width: calc(100% - 240px);
  left: 240px;
  transition: all 0.5s ease;
}
#main_content.active {
  left: 0px;
  width: 100%;
}
#main_content.active nav {
  left: 0px;
  width: 100%;
}
#main_content nav {
  display: flex;
  justify-content: space-between;
  height: 80px;
  background-color: white;
  display: flex;
  align-items: center;
  position: fixed;
  width: calc(100% - 240px);
  left: 240px;
  z-index: 100;
  padding: 0 20px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  transition: all 0.5s ease;
}
#main_content nav .sidebar-button {
  display: flex;
  align-items: center;
  font-size: 24px;
  font-weight: 500;
}
#main_content nav .sidebar-button img {
  margin-right: 10px;
}
#main_content nav .search-box {
  position: relative;
  height: 50px;
  max-width: 550px;
  width: 100%;
  margin: 0 20px;
}
#main_content nav .profile-details {
  display: flex;
  align-items: center;
  height: 50px;
  min-width: 190px;
  padding: 0;
}
#main_content nav .profile-details .dropdown-toggle {
  padding: 0;
  border: 0;
  margin: 0;
}
#main_content nav .profile-details .dropdown-toggle:focus,
#main_content nav .profile-details .dropdown-toggle:active,
#main_content nav .profile-details .dropdown-toggle:hover {
  outline: 0;
  box-shadow: none;
}
#main_content nav .profile-details .dropdown-menu {
  padding: 0;
  flex-direction: column;
}
#main_content nav .profile-details .dropdown-menu li {
  position: relative;
  list-style: none;
  height: 50px;
}
#main_content nav .profile-details .dropdown-menu li:first-child a {
  border-top-left-radius: 0.375rem;
  border-top-right-radius: 0.375rem;
}
#main_content nav .profile-details .dropdown-menu li:last-child a {
  border-bottom-left-radius: 0.375rem;
  border-bottom-right-radius: 0.375rem;
  border-bottom: 0;
}
#main_content nav .profile-details .dropdown-menu li a {
  border-bottom: 1px solid #276fb7;
  height: 100%;
  display: flex;
  padding-left: 23px;
  width: 100%;
  align-items: center;
  text-decoration: none;
  transition: all 0.4s ease;
}
#main_content nav .profile-details .dropdown-menu li a.active {
  background: #276fb7;
}
#main_content nav .profile-details .dropdown-menu li a.active .links_name {
  color: #fff;
}
#main_content nav .profile-details .dropdown-menu li a:hover {
  background: #276fb7 !important;
}
#main_content nav .profile-details .dropdown-menu li a:hover .links_name {
  color: #fff !important;
}
#main_content nav .profile-details .dropdown-menu li a img {
  height: 24px;
  width: 24px;
  margin-right: 9px;
}
#main_content nav .profile-details .dropdown-menu li a .links_name {
  color: #276fb7;
  font-size: 15px;
  font-weight: 400;
  white-space: nowrap;
  text-transform: capitalize;
}
#main_content nav .profile-details img {
  height: 40px;
  width: 40px;
  border-radius: 6px;
  -o-object-fit: cover;
  object-fit: cover;
}
#main_content nav .profile-details .admin_name {
  font-size: 15px;
  font-weight: 500;
  color: #333;
  margin: 0 10px;
  white-space: nowrap;
}
#main_content .home-content {
  position: relative;
  padding-top: 104px;
}
#main_content .home-content .sales-boxes .top-sales {
  margin: 0;
}
#main_content main .table_section {
  background-color: white;
}
#main_content main .table_section table {
  width: 100%;
  margin: 0px auto;
}
#main_content main .table_section table thead tr th {
  text-align: left;
  padding: 20px;
  font-weight: 600;
  background: #276fb7;
  color: #fff;
  border: 1px solid #d9d9d9;
}
#main_content main .table_section table tbody tr {
  background: #f4fdff;
  border-bottom: 1px solid #d9d9d9;
  margin-bottom: 5px;
}
#main_content main .table_section table tbody tr:nth-child(even) {
  background: #ffffff;
}
#main_content main .table_section table tbody tr:nth-child(even) th {
  background: #fafafa;
}
#main_content main .table_section table tbody tr td {
  text-align: left;
  padding: 20px;
  font-weight: 300;
}
#main_content main .table_section table tbody tr th {
  text-align: left;
  padding: 20px;
  font-weight: 600;
  background: #e4faff;
  color: #606060;
}
#main_content main .table_section table tfoot tr {
  background: none;
}
#main_content main .table_section table tfoot tr td {
  padding: 10px 2px;
  font-size: 0.8em;
  font-style: italic;
  color: #8a97a0;
}
#main_content main .table_section .pagination {
  margin-top: 30px;
  justify-content: center;
}
#main_content main .table_section .pagination a {
  padding: 8px 16px;
  text-decoration: none;
  transition: background-color 0.3s;
  border: 1px solid #ddd;
  color: black;
  float: left;
  padding: 8px 16px;
  text-decoration: none;
  justify-content: center;
  margin-right: 5px;
}
#main_content main .table_section .pagination a:first-child {
  border: 0;
  color: #276fb7;
}
#main_content main .table_section .pagination a:last-child {
  border: 0;
  color: #276fb7;
}
#main_content main .table_section .pagination a:hover:not(.active) {
  background-color: #ddd;
}
#main_content main .table_section .pagination a.active {
  color: white;
  border: 1px solid #276fb7;
  background-color: #276fb7;
  color: white;
  border: 1px solid;
}
#main_content main .table_section .table_footer {
  /* margin-top: 100px; */
  padding: 25px;
  background-color: #ecedf3;
}
#main_content main .table_section .table_footer p {
  text-align: right;
  color: #606060;
  margin: 0;
  font-weight: 500;
}
#main_content main section.search_section {
  display: flex;
  justify-content: flex-end;
  padding: 10px 23px;
  background-color: #ecedf3;
}
#main_content main section.search_section .input-group {
  display: flex;
  width: 230px;
}
#main_content main section.search_section .input-group img {
  width: 20px;
  height: 20px;
}
#main_content main section.search_section input {
  border: none;
  /* background:; */
  margin: 0;
  padding: 7px 8px;
  font-size: 14px;
  color: inherit;
  border: 1px solid transparent;

  border: 1px solid #d2d6da;
  border-radius: 0.5rem;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-right: 0;
}
#main_content main section.search_section form input::placeholder {
  color: #bbb;
}
#main_content main section.search_section input:focus,
#main_content main section.search_section input:active {
  box-shadow: none;
  outline: 0;
  border-color: #d2d6da !important;
  border-right: 0 !important;
}
/* #main_content main section.search_section form button[type="submit"] {
  text-indent: -999px;
  overflow: hidden;
  padding: 7px;
  border: 1px solid transparent;
  border-radius: inherit;
  background: transparent
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'%3E%3C/path%3E%3C/svg%3E")
    no-repeat center;
  cursor: pointer;
  opacity: 0.7;
} */
/* #main_content main section.search_section form button[type="submit"]:hover {
  opacity: 1;
} */
#main_content main section.search_section form button[type="submit"]:focus {
  box-shadow: 0 0 3px 0 #1183d6;
  border-color: #1183d6;
  outline: none;
}
#main_content main section.user_profile_section {
  background-color: #fff;
  padding: 10px 0 30px 0;
}
#main_content main section.user_profile_section .card > img {
  width: 50%;
  padding: 35px 0px;
  align-items: center;
  justify-content: center;
  margin: 0px auto;
}
#main_content main section.user_profile_section .btn-upload {
  margin: 0px auto;
  width: 60%;
  height: 45px;
  align-items: center;
  justify-content: center;
  background: #13273a;
  border-radius: 5px;
  color: white;
  font-size: 14px;
}
#main_content main section.user_profile_section .btn-larg {
  background-color: #276fb7;
  color: white;
  padding: 13px 1px;
  justify-content: center;
  width: 100%;
  font-size: 14px;
  border-radius: 5px;
}
#main_content main section.user_profile_section .card-title1 {
  margin-bottom: 10px;
}
#main_content main section.user_profile_section .card-title {
  justify-content: center;
  text-align: center;
  font-size: 16px;
}
#main_content main section.user_profile_section .row2 {
  padding: 20px;
  background: #f8f8f8;
  border-bottom: 1px solid #d9d9d9;
}
#main_content main section.user_profile_section .card-title2 {
  color: #276fb7;
  font-weight: 700;
  font-size: 26px;
}
#main_content main section.user_profile_section .form-label {
  font-weight: 500;
  font-size: 16px;
}
#main_content main section.user_profile_section .form-control,
#main_content main section.user_profile_section .form-select {
  /*		background-color:#D9D9D9;*/
  height: 45px;
  background-color: rgba(236, 237, 243, 0.27);
  border: 1px solid #d9d9d9;
  border-radius: 5px;
  color: #c7c7c7;
}
#main_content main section.user_profile_section .form-control1 {
  background-color: white;
  border: 0;
}
#main_content main section.user_profile_section .card {
  background-color: rgba(236, 237, 243, 0.27);
  border: rgba(236, 237, 243, 0.27);
}
#main_content main section.user_profile_section .card-footer {
  background-color: white;
  border: 0;
}
#main_content main section.user_profile_section .card-title3 {
  color: #606060;
  text-align: center;
  justify-content: center;
}

.membership_section {
  background-color: #f4f8fb;
  padding: 100px 0;
}
.membership_section h1 {
  text-align: center;
  font-weight: 600;
  font-size: 45px;
  color: #212121;
  margin-bottom: 6px;
}
.membership_section p {
  text-align: center;
  font-weight: 500;
  font-size: 22px;
  color: #606060;
  margin-bottom: 30px;
}
.membership_section .toggleParent {
  display: flex;
  justify-content: center;
  margin-bottom: 30px;
}
.membership_section .toggleParent input[type="checkbox"].ios8-switch {
  position: absolute;
  margin: 8px 0 0 16px;
}
.membership_section .toggleParent input[type="checkbox"].ios8-switch + label {
  position: relative;
  padding: 0px 0 0 75px;
}
.membership_section
  .toggleParent
  input[type="checkbox"].ios8-switch
  + label:before {
  content: "";
  position: absolute;
  display: block;
  left: 6px;
  top: 0px;
  width: 60px;
  height: 30px;
  border-radius: 16px; /* x*2 */
  background: #276fb7;
  border: 1px solid #d9d9d9;
  transition: all 0.3s;
}
.membership_section
  .toggleParent
  input[type="checkbox"].ios8-switch
  + label:after {
  content: "";
  position: absolute;
  display: block;
  left: 10px;
  top: 4px;
  width: 22px; /* x*3 */
  height: 22px; /* x*3 */
  border-radius: 16px; /* x*2 */
  background: #fff;
  border: 1px solid #d9d9d9;
  transition: all 0.3s;
}
.membership_section
  .toggleParent
  input[type="checkbox"].ios8-switch
  + label:hover:after {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}
.membership_section
  .toggleParent
  input[type="checkbox"].ios8-switch:checked
  + label:after {
  margin-left: 30px;
}
.membership_section
  .toggleParent
  input[type="checkbox"].ios8-switch:checked
  + label:before {
  background: #276fb7;
}
.membership_section .toggleParent input[type="checkbox"] {
  display: none;
}
.membership_section .toggleParent label {
  text-align: center;
  font-weight: 500;
  font-size: 22px;
  color: #606060;
}
.membership_section .toggleParent label span {
  font-weight: 700;
  font-size: 14px;
  color: #13273a;
  background-color: #fee87d;
  border-radius: 3px;
  padding: 5px;
}
.membership_section .card {
  border: 1px solid #d9d9d9;
  border-radius: 21px;
}
.membership_section .card .card-body {
  padding: 28px 35px 70px;
}
.membership_section .card .card-body .card-title {
  font-weight: 600;
  font-size: 24px;
  margin-bottom: 0px;
}
.membership_section .card .card-body .plan-cost .plan-price {
  font-family: "Roboto Mono", sans-serif;
  font-weight: 500;
  font-size: 72px;
  color: #276fb7;
  line-height: 75px;
  margin-bottom: 25px;
  display: inline-block;
}
.membership_section .card .card-body .plan-cost .plan-type {
  color: #969696;
}
.membership_section .card .card-body .card-text {
  font-weight: 500;
  font-size: 15px;
  text-align: left;
  color: #969696;
  margin-bottom: 20px;
}
.membership_section .card .card-body .key_features_heading {
  font-weight: 600;
  font-size: 15px;
  margin-top: 20px;
}
.membership_section .card .card-body .key_features {
  list-style: none;
  padding: 0;
  margin: 10px 0;
}
.membership_section .card .card-body .key_features .list {
  position: relative;
  padding-left: 30px;
  font-size: 15px;
  text-align: left;
  color: #969696;
  margin-bottom: 5px;
}
.membership_section .card .card-body .key_features .list::before {
  content: "";
  position: absolute;
  height: 11px;
  width: 15px;
  top: 6px;
  left: 0;
  background-image: url("../img/check.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
}
.membership_section .card .card-footer {
  background-color: transparent;
  border: 0;
  padding: 28px 35px;
  border-bottom-right-radius: 21px;
  border-bottom-left-radius: 21px;
}
.membership_section .card .card-footer .btn-1 {
  display: block;
  width: 100%;
  border: 1px solid #276fb7;
  border-radius: 3px;
  padding-left: 30px;
  font-weight: 500;
  font-size: 15px;
  color: #276fb7;
  padding: 15px 0;
  transition: 0.3s all;
}
.membership_section .card .card-footer .btn-1:hover {
  background-color: #276fb7;
  color: #fff;
  transition: 0.3s all;
}
.membership_section .card.active {
  background-color: #13273a;
}
.membership_section .card.active .card-body {
  padding: 28px 35px 70px;
}
.membership_section .card.active .card-body .card-title {
  font-weight: 600;
  font-size: 24px;
  color: #276fb7;
  margin-bottom: 0px;
}
.membership_section .card.active .card-body .plan-cost .plan-price {
  font-family: "Roboto Mono", sans-serif;
  font-weight: 500;
  font-size: 72px;
  line-height: 75px;
  color: #fff;
  margin-bottom: 25px;
  display: inline-block;
}
.membership_section .card.active .card-body .plan-cost .plan-type {
  color: #fff;
}
.membership_section .card.active .card-body .card-text {
  font-weight: 500;
  font-size: 15px;
  text-align: left;
  color: #fff;
  margin-bottom: 20px;
}
.membership_section .card.active .card-body .key_features_heading {
  font-weight: 600;
  font-size: 15px;
  margin-top: 20px;
  color: #ffffff;
}
.membership_section .card.active .card-body .key_features {
  list-style: none;
  padding: 0;
  margin: 10px 0;
}
.membership_section .card.active .card-body .key_features .list {
  position: relative;
  padding-left: 30px;
  margin-bottom: 5px;
  font-size: 15px;
  text-align: left;
  color: #fff;
}
.membership_section .card.active .card-body .key_features .list::before {
  content: "";
  position: absolute;
  height: 11px;
  width: 15px;
  top: 6px;
  left: 0;
  background-image: url("../img/check.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
}
.membership_section .card.active .card-footer {
  background-color: transparent;
  border: 0;
  padding: 28px 35px;
  border-bottom-right-radius: 21px;
  border-bottom-left-radius: 21px;
}
.membership_section .card.active .card-footer .btn-1 {
  display: block;
  width: 100%;
  border: 1px solid #276fb7;
  border-radius: 3px;
  padding-left: 30px;
  font-weight: 500;
  font-size: 15px;
  color: #fff;
  padding: 15px 0;
  transition: 0.3s all;
  background-color: #276fb7;
}
.membership_section .card.active .card-footer .btn-1:hover {
  background-color: #fff;
  color: #276fb7;
  transition: 0.3s all;
}

/* @media (max-width: 1150px) {
  .home-content .sales-boxes {
    flex-direction: column;
  }
  .home-content .sales-boxes .box {
    width: 100%;
    overflow-x: scroll;
    margin-bottom: 30px;
  }
}
@media (max-width: 1000px) {
  .overview-boxes .box {
    width: calc(50% - 15px);
    margin-bottom: 15px;
  }
}
@media (max-width: 700px) {
  nav .sidebar-button .dashboard {
    display: none;
  }
  nav .profile-details .admin_name {
    display: none;
  }
  nav .profile-details i {
    display: none;
  }
  .home-section nav .profile-details {
    height: 50px;
    min-width: 40px;
  }
  .home-content .sales-boxes .sales-details {
    width: 560px;
  }
}
@media (max-width: 550px) {
  .overview-boxes .box {
    width: 100%;
    margin-bottom: 15px;
  }
  .sidebar.active ~ .home-section nav .profile-details {
    display: none;
  }
}
@media (max-width: 400px) {
  .sidebar {
    width: 0;
  }
  .sidebar.active {
    width: 60px;
  }
  .sidebar.active ~ .home-section {
    left: 60px;
    width: calc(100% - 60px);
  }
  .sidebar.active ~ .home-section nav {
    left: 60px;
    width: calc(100% - 60px);
  }
  .home-section {
    width: 100%;
    left: 0;
  }
  .home-section nav {
    width: 100%;
    left: 0;
  }
} */

/* Custom */

#main_content nav .profile-details .dropdown-toggle {
  box-shadow: none !important;
}

.sidebar .copyright_para a {
  color: white;
}

#main_content main .table_section .table_footer p {
  text-align: center;
}

#main_content main .table_section .table_footer {
  position: fixed;
  width: calc(100% - 240px);
  bottom: 0;
}
#main_content.active main .table_section .table_footer {
  width: 100%;
}
.dropdown.dropdown-hover:hover > .dropdown-menu:before,
.dropdown .dropdown-menu.show:before {
  display: none;
}

.dropdown:not(.dropdown-hover) .dropdown-menu {
  transform: translate3d(-1.77778px, 47.5556px, 0px) !important;
  margin: 0 !important;
}

@media (max-width: 1070.98px) {
  #main_content main .table_section table thead tr th {
    padding: 10px;
    font-size: 14px;
  }

  #main_content main .table_section table thead tr th:after {
    top: 17px !important;
    width: 11px !important;
    height: 11px !important;
    right: 10px !important;
  }

  #main_content main .table_section table tbody tr td,
  #main_content main .table_section table tbody tr th,
  #main_content main .table_section table tbody tr td:first-child {
    font-size: 14px;
    padding: 10px;
    height: auto !important;
  }
}
@media (max-width: 991.98px) {
  #main_content main .table_section table {
    width: 100vh;
  }

  div#table {
    overflow: scroll;
  }
}
@media (max-width: 768.98px) {
  #main_content nav .sidebar-button {
    font-size: 16px;
  }

  #main_content nav .sidebar-button img {
    width: 26px;
    height: auto;
  }

  #main_content nav .profile-details {
    justify-content: flex-end;
    padding: 0 !important;
  }

  button.btn.dropdown-toggle {
    margin: 0;
  }

  .dropdown:not(.nav-item):not(.dropdown-hover) .dropdown-menu {
    margin: 0 !important;
    right: 0 !important;
    transform: translate3d(10px, 47px, 0px) !important;
  }

  #main_content nav .profile-details .admin_name {
    display: none;
  }

  .dropdown-toggle::after {
    display: none;
  }
  #main_content nav {
    height: 60px;
  }
}
@media (max-width: 575.98px) {
  #main_content main section.search_section {
    justify-content: center;
  }
  #main_content nav .profile-details {
    width: 50%;
    min-width: auto;
  }
  #main_content nav .sidebar-button {
    width: 50%;
  }
  #main_content nav .sidebar-button {
    font-size: 14px;
  }
  /* #main_content {
    width: 0%;
    left: 100%;
    opacity: 0;
    visibility: hidden;
  }
  .sidebar {
    width: 100%;
  }
  #main_content nav {
    width: 0%;
    left: 100%;
  }
  #main_content.active {
    opacity: 1;
    visibility: visible;
  } */
  .sidebar {
    width: 190px;
  }

  #main_content {
    width: calc(100% - 190px);
    left: 190px;
  }

  #main_content nav {
    width: 100vh;
    left: 190px;
  }

  #main_content main .table_section .table_footer {
    position: fixed;
    width: 100%;
    bottom: 0;
  }

  .sidebar .logo-details img {
    width: 80%;
    height: auto;
  }
}