/*
Template Name: Admin Template
Author: Wrappixel

File: scss
*/
@import url(https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700);
/*Theme Colors*/
/**
 * Table Of Content
 *
 * 	1. Color system
 *	2. Options
 *	3. Body
 *	4. Typography
 *	5. Breadcrumbs
 *	6. Cards
 *	7. Dropdowns
 *	8. Buttons
 *	9. Typography
 *	10. Progress bars
 *	11. Tables
 *	12. Forms
 *	14. Component
 */
/*============================================================== 
 For Desktop & above all (1650px) 
 ============================================================== */
/*============================================================== 
 For Laptop & above all (1370px) 
 ============================================================== */
/*-- ============================================================== 
 Small Desktop & above all (1024px) 
 ============================================================== */
@media (min-width: 1024px) {
  .page-wrapper, .footer {
    margin-left: 220px; } }

@media (max-width: 1023px) {
  .inbox-center a {
    width: 200px; }
  .d-flex {
    display: block !important; }
    .d-flex.no-block {
      display: flex !important; } }

/*-- ============================================================== 
 Ipad & above all(768px) 
 ============================================================== */
@media (min-width: 768px) {
  .navbar-header {
    width: 220px;
    flex-shrink: 0; }
    .navbar-header .navbar-brand {
      padding-top: 0px; }
  .material-icon-list-demo .icons div {
    width: 33%;
    padding: 15px;
    display: inline-block;
    line-height: 40px; } }

/*-- ============================================================== 
 Phone and below ipad(767px) 
 ============================================================== */
@media (max-width: 767px) {
  .container-fluid {
    padding: 0px 15px 0px 15px;
    overflow: hidden; }
  /*Header*/
  .topbar {
    width: 100%; }
    .topbar .top-navbar {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      flex-direction: row;
      flex-wrap: nowrap;
      -webkit-align-items: center; }
      .topbar .top-navbar .navbar-collapse {
        display: flex;
        width: 100%; }
      .topbar .top-navbar .navbar-nav {
        flex-direction: row; }
        .topbar .top-navbar .navbar-nav > .nav-item.show {
          position: static; }
          .topbar .top-navbar .navbar-nav > .nav-item.show .dropdown-menu {
            width: 100%;
            margin-top: 0px; }
        .topbar .top-navbar .navbar-nav .dropdown-menu {
          position: absolute; }
  .mega-dropdown .dropdown-menu {
    height: 480px;
    overflow: auto; }
  .comment-text .comment-footer .action-icons {
    display: block;
    padding: 10px 0; }
  .vtabs .tabs-vertical {
    width: auto; }
  /*Footer*/
  .material-icon-list-demo .icons div {
    width: 100%; }
  .error-page .footer {
    position: fixed;
    bottom: 0px;
    z-index: 10; }
  .error-box {
    position: relative;
    padding-bottom: 60px; }
  .error-body {
    padding-top: 10%; }
    .error-body h1 {
      font-size: 100px;
      font-weight: 600;
      line-height: 100px; }
  .login-register {
    position: relative;
    overflow: hidden; }
  .login-box {
    width: 90%; }
  .login-sidebar {
    padding: 10% 0; }
    .login-sidebar .login-box {
      position: relative; }
  /*This is for chat page*/
  .chat-main-box .chat-left-aside {
    left: -250px;
    position: absolute;
    transition: 0.5s ease-in;
    background: #fff; }
    .chat-main-box .chat-left-aside.open-pnl {
      left: 0px; }
    .chat-main-box .chat-left-aside .open-panel {
      display: block; }
  .chat-main-box .chat-right-aside {
    width: 100%; }
  /*Timeline*/
  ul.timeline:before {
    left: 40px; }
  ul.timeline > li > .timeline-panel {
    width: calc(100% - 90px); }
  ul.timeline > li > .timeline-badge {
    top: 16px;
    left: 15px;
    margin-left: 0; }
  ul.timeline > li > .timeline-panel {
    float: right; }
  ul.timeline > li > .timeline-panel:before {
    right: auto;
    left: -15px;
    border-right-width: 15px;
    border-left-width: 0; }
  ul.timeline > li > .timeline-panel:after {
    right: auto;
    left: -14px;
    border-right-width: 14px;
    border-left-width: 0; }
  /*Contact app page*/
  .left-aside {
    width: 100%;
    position: relative;
    border: 0px; }
  .right-aside {
    margin-left: 0px; }
  .flex-wrap {
    flex-wrap: wrap !important;
    -webkit-flex-wrap: wrap !important; }
  .chat-list li .chat-content {
    width: calc(100% - 80px); }
  /*Calendar*/
  .fc-toolbar .fc-left, .fc-toolbar .fc-right, .fc-toolbar .fc-center {
    float: none;
    display: block;
    text-align: center;
    margin-top: 10px;
    overflow: hidden; } }
