@font-face {
  font-family: Segan-Light;
  src: url("../../_static/font/Segan-Light.ttf");
}
body {
  /* margin: 0 !important ; */
  /* padding: 0 !important ; */
  /* font-family: Segan-Light; */
}
blockquote {
  transition: 3.3s;
}
.center {
  font-size: 4rem;
  font-weight: 100;
  transform: translate(-50%, -50%);
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
}
div.bg-image {
  background-image: url("https://moxietek.app/_assets/img/brand/logo.png");
  background-repeat: no-repeat;
  background-size: cover;
  width: 420px;
  height: 102px;
  margin: auto;
  padding: 0;
  transition: 2s;
}


div.card,
input.form-control,
select.form-control {
  border-radius: 0px;
}
input[typeof:reset] {
}
button:not(:disabled), [type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled) {
    cursor: pointer;
    border: 0px solid #ffff;
    padding: 6px 10px;
}
.btn {
  border-radius: 0px;
}
#pageMenu {
  width: 100%;
  /* background-color: #3a3634; */
  /* height: 100vh; */
  height: calc(100vh - 100px);
  overflow-y: auto;
  transition: .53s;
  scrollbar-width: none;
  list-style: none;
  padding-bottom: 40px;
}
#pageMenu::-webkit-scrollbar {
  width: 0px;
  display: none;
}

#pageMenu .nav-item {
  border-top: 2px solid #fff;
  transition: .4s;
  padding: 0px;
  background-color: #cacaca;
}
#pageMenu .nav-item button {
  background-color: #aaa;
}
#pageMenu .nav-item a,
.btnLogout, .btnProfile {
  width: 100%;
  text-decoration: none;
  color: #5b5b5b;
  font-weight: 600;
  text-align: center;
}
#pageMenu .nav-item:hover a,
#pageMenu .nav-item.active a,
.btnLogout:hover,
.btnProfile:hover {
  color: #000;
  font-weight: bold;
}
#pageMenu .nav-item:hover,
#pageMenu .nav-item.active,
.btnLogout:hover,
.btnProfile:hover {
  /* background-color: #25d9dfa8; */
  background-color: #83a8d3;
}
button.navbar-toggler:not(:disabled),
button.navbar-toggler[type=button]:not(:disabled) {
    border: 1px solid #abdf25a8;
    color: #abdf25a8;
}

#ajaxResponse .alert.alert-danger {
  background-color: #ffc0cb30;
}
#btnBackToTop {
  position: fixed;
  bottom: 10px;
  right: 50px;
}
#sideNav .navbar-nav .nav-item .nav-link {
    font-weight: 600;
    letter-spacing: inherit;
    text-transform: uppercase;
}
section.resume-section {
  flex-wrap: wrap;
}
section {
  padding: .7rem;
}
section:nth-of-type(even) {
  background-color: #f7f7f799;
  border-top: 1px solid #f3f3f3;
  padding-bottom: 1.75rem;
}
section:nth-of-type(odd) {
  background-color: #fff;
  border-top: 1px solid #f3f3f3;
  padding-bottom: 1.75rem;
}
section:first-of-type {
  background-color: #fff;
  border-top: 0px solid #fff;
}

blockquote.blockquote p {
  color: #7f7f7f;
}
.app-item {
  list-style: none;
  border: 1px solid silver;
  margin-bottom: 4px;
  margin-right: 4px;
  display: inline-flex;
  padding: 0;
  width: 280px;
}
.app-item a {
  font-family: system-ui;
  font-size: 1.12rem;
  color: #7f7f7f;
  text-decoration: none;
  padding: .125rem .65rem;
  width: 100%;
}
.app-item:hover {
  background-color: #628cbd;
  /* background-color: #83a8d3; */
  /* background-color: #75abeb; */
  cursor: pointer;
}
.app-item:hover a {
  color: #fff;
}
.app-item:hover i.fa,
.app-item:hover i.fas,
.app-item:hover i.fab {
  color: #d4dfeb !important;
}


th.sortable {
  cursor: pointer;
}

.w15p { width: 15% !important; }
.w20p { width: 20% !important; }
.w25p { width: 25% !important; }
.w50p { width: 50% !important; }
.w25px { width: 25px !important; }
.w30px { width: 30px !important; }
.w32px { width: 32px !important; }
.w35px { width: 35px !important; }
.w50px { width: 50px !important; }
.w75px { width: 75px !important; }
.w100p { width: 100%; }
.w100px { width: 100px; }
.w125px { width: 125px; }
.w150px { width: 150px; }
.w200px { width: 200px; }
.w250px { width: 250px; }
.w260px { width: 260px; }
.w275px { width: 275px; }
.w300px { width: 300px; }
.w350px { width: 350px; }
.w500px { width: 500px !important; }
.w600px { width: 600px !important; }
.w650px { width: 650px !important; }
.w700px { width: 700px !important; }

.mw125px { min-width: 125px !important; }
.mw150px { min-width: 150px !important; }

.xw100px { max-width: 100px !important; }
.xw200px { max-width: 200px !important; }
.xw600px { max-width: 600px !important; }
.xw700px { max-width: 700px !important; }

.h100px { height: 100px; }
.h150px { height: 150px; }
.h200px { height: 200px; }
.h300px { height: 300px; }
.h400px { height: 400px; }
.h500px { height: 500px; }
.xh125px { max-height: 125px; }
.xh150px { max-height: 150px; }
.xh175px { max-height: 175px; }
.xh200px { max-height: 200px; }
.xh250px { max-height: 250px; }
.xh300px { max-height: 300px !important; }
.xh400px { max-height: 400px; }
.xh450px { max-height: 450px; }
.xh475px { max-height: 475px; }
.xh500px { max-height: 500px; }
.xh550px { max-height: 550px; }
.xh600px { max-height: 600px; }
.xh650px { max-height: 650px; }
.xh700px { max-height: 700px; }
.xh750px { max-height: 750px; }
.xh800px { max-height: 800px; }
.h200px { height: 200px; }
.h300px { height: 300px; }

.scroll-y { overflow-y: scroll !important; }
.scroll-x { overflow-x: scroll; }
.scroll-y thead th {
  /* https://www.w3docs.com/snippets/html/how-to-create-a-table-with-a-fixed-header-and-scrollable-body.html */
  background-color: #efefef;
  position: sticky; /* make the table heads sticky */
  top: 0px; /* table head will be placed from the top of the table and sticks to it */
}

.saved {
  border: 1px solid green !important;
  background-color: #beecbe99;
}
.failed {
  border: 1px solid red !important;
  background-color: #ecbebe99;
}
.form-control {
  border: 1px solid #ddd;
  display: block;
  width: 100%;
}
.display-5,
.display-6 {
    color: #7f7f7f;
}
.text-lg,
.text-larger {
  font-size: 1.2rem;
}
.text-xl {
  font-size: 1.5rem;
}
.text-xxl {
  font-size: 1.8rem;
}
.line-xxl {
  line-height: 2.8rem;
}
.bg-medium {
  background-color: #77777763;
}
.bg-pink { background-color: #ffc0cb66; }
.pointer {
  cursor: pointer;
}
.icon-card figure {
  margin: 3px;
  font-size: .8rem;
}
.icon-card i,
.icon-card img.svg-icon {
  color: #ff8647; /*zimportant;*/
  line-height: 1.2rem;
  font-size: 2rem;
  transition: .4s;
  margin-bottom: 10px;
}
.icon-card.active i,
.icon-card.active figcaption {
  color: #fff !important;
}
.icon-card.active {
  background-color: #ff8647 !important;
  border-color: #ff8647 !important;
}
.icon-card:hover i,
.icon-card:hover {
  /* background-color: #b6d85d3b !important; */
  background-color: #5e89bb !important;
  color: #fff !important;
}
.showdiv { border: 1px solid red; }
.btn-primary { color: #fff; }
.table-hover tbody tr:hover {
    color: #000;
    background-color: #83cf4061;
}
@media (min-width: 768px) {
  section.resume-section.section-top {
    min-height: inherit;
  }
}

@media (max-width: 767px) {
  .center {
    width: 100vw;
  }
  div.bg-image,
  img {
    /* width: 300px; */
    /* height: 50px; */
    /* max-height: 30px; */
  }

  #pageMenu {
    /* width: 100%; */
    /* background-color: #3a3634; */
    /* height: 100vh; */
    height: calc(100vh - 75px);
    /* overflow-y: auto; */
    /* transition: .53s; */
    /* scrollbar-width: none; */
    /* list-style: none; */
    /* padding-bottom: 40px; */
  }
  section.resume-section {
    /* flex-wrap: wrap; */
    padding-top: 1rem;
  }

}
@media (min-width: 992px) {
  body {
      padding-top: 0;
      padding-left: 17rem;
  }
  /* a.navbar-brand {
    display: inherit;
  } */
  #sideNav .navbar-brand {
      display: inherit;
      margin: auto auto 0;
      padding: 0px;
  }
}
@media (min-width: 1800px) {
  .col-2x-6 {
    flex: 0 0 auto;
    width: 50%;
  }
}