/*
* demo.css
* File include item demo only specific css only
******************************************************************************/

.menu .app-brand.demo {
  height: 64px;
  margin-top: 12px;
}

.app-brand-logo.demo svg {
  width: 22px;
  height: 38px;
}

.app-brand-text.demo {
  font-size: 1.75rem;
  letter-spacing: -0.5px;
  text-transform: lowercase;
}

/* ! For .layout-navbar-fixed added fix padding top tpo .layout-page */
/* Detached navbar */
.layout-navbar-fixed .layout-wrapper:not(.layout-horizontal):not(.layout-without-menu) .layout-page {
  padding-top: 76px !important;
}
/* Default navbar */
.layout-navbar-fixed .layout-wrapper:not(.layout-without-menu) .layout-page {
  padding-top: 64px !important;
}

/* Navbar page z-index issue solution */
.content-wrapper .navbar {
  z-index: auto;
}

/*
* Content
******************************************************************************/

.demo-blocks > * {
  display: block !important;
}

.demo-inline-spacing > * {
  margin: 1rem 0.375rem 0 0 !important;
}

/* ? .demo-vertical-spacing class is used to have vertical margins between elements. To remove margin-top from the first-child, use .demo-only-element class with .demo-vertical-spacing class. For example, we have used this class in forms-input-groups.html file. */
.demo-vertical-spacing > * {
  margin-top: 1rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-lg > * {
  margin-top: 1.875rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-lg.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.demo-vertical-spacing-xl > * {
  margin-top: 5rem !important;
  margin-bottom: 0 !important;
}
.demo-vertical-spacing-xl.demo-only-element > :first-child {
  margin-top: 0 !important;
}

.rtl-only {
  display: none !important;
  text-align: left !important;
  direction: ltr !important;
}

[dir='rtl'] .rtl-only {
  display: block !important;
}

/*
* Layout demo
******************************************************************************/

.layout-demo-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 1rem;
}
.layout-demo-placeholder img {
  width: 900px;
}
.layout-demo-info {
  text-align: center;
  margin-top: 1rem;
}










input.tags {
    border: none;
    box-shadow: none;
    width: auto;
    margin: 0;
    padding: 0;
}
input.tags:focus {
    outline:none;
    background: transparent;
}
.tag-cloud {
  display:block;
  height: auto;
  padding: 10px;
  margin: .25em 0;
  background: #FFF;
  border: solid 1px #dadada;
  border-radius: 4px;

}
.tag {
  display:inline-block;
  border-radius: 3px;
  background: #201b31;
  color: #fff;
  margin: 2px 3px 0 0;
  padding:3px 8px;
}
a.close {
  display: block;
  float: right;
  white-space: nowrap;
  overflow: hidden;
  width: 1em;
  height: 1em;
  margin: .125em 0 0 .5em;
  text-indent: -999em;
}
a.close:before {
  display:block;
  float: left;
  content: "\2716";
  font-size: 13px;
  font-weight: bold;
  text-indent: 0;
  color: #d62814;
}
#loader{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: none;
}
.wait{
    border: 16px solid #000;
    border-top: 16px solid #d62814;
    border-radius: 50%;
    width: 120px;
    height: 120px;
    animation: spin 2s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


/* ======================== */
.card_1{ background: #fff; }
.card_1_header{border-bottom: #ff3e1d solid 2px; font-size: 14px; font-weight: 400; text-align: center; padding:10px 5px; background: #fff5f3; margin: 0;}
.card_1_header2{border-bottom: #ffab00  solid 2px;  background: #fff8ea ; }
.card_1_header2{border-bottom: #ffab00  solid 2px;  background: #fff8ea ; } 
.card_1_header3{border-bottom: #03c3ec  solid 2px;  background: #ebfbff ; }
.card_1_header4{border-bottom: #696cff   solid 2px;  background: #ebecff  ; }
.card_1 .inner{ height: 70vh;}
.blank_inner{padding-top: 50%;  font-size: 14px; text-align: center;}
.user_track{  margin-bottom: 5px; border-radius: 2px; padding: 10px; 
  box-shadow: #e7e3e296 0 2px 5px;}
.user_img img{width: 40px; height: 40px; border-radius: 50%;}
.visitors_list{background: #fff; height:75vh; overflow: auto;}
.user_visitors{ padding: 8px; border-bottom: #d1d1d1 solid 1px;}
.user_header{border-radius: 8px 8px 0 0;}



.sessions { margin-top: 2rem; border-radius: 12px; position: relative; list-style: none;}
.sessions li { padding-bottom: 1.5rem; border-left: 1px solid #abaaed;  position: relative; padding-left: 20px;
  margin-left: 10px;}
.sessions li:last-child { border: 0px;  padding-bottom: 0;}
.sessions li:before {content: ""; width: 15px; height: 15px; background: white;  border: 1px solid #4e5ed3;
  box-shadow: 3px 3px 0px #bab5f8; box-shadow: 3px 3px 0px #bab5f8;  border-radius: 50%;
  position: absolute;  left: -10px;  top: 0px;}
.time { color: #2a2839; font-family: "Poppins", sans-serif;  font-weight: 500;}
.sessions p {color: #4f4f4f; font-family: sans-serif; line-height: 1.5; margin-top: 0.4rem;}

.input_box{font-size: 15px !important; width: 40px;}



@media only screen and (max-width:700px) {
.login_box .w-50{width: 100% !important;}
.right_section{border-radius: 10px !important; text-align: center;}
.m_menu{background: #201b31 !important;  position: fixed; width: 100%; left: 0; top: 0; z-index: 999;} 
.nav-link{color: #ee1800;}
.app-brand .layout-menu-toggle { background-color: #ee1800;  border: 7px solid #f5f5f9;}
.dataTables_length{display: none;}
}
.cancel-checkbox{
    position: fixed;
    z-index: 1000;
    top: 0%;
    right: 10%;
}