html, body,  .login-page-green {

    height: 100vh;
    
    padding: 0;
    
    margin: 0;
    overflow-y: hidden;
    
    }
   
    .login-page-green {
    
        min-height: 100vh;
        background-color: #d2d6de;
        
    }

  
    .skin-blue .main-header  .navbar, .logo{
        background-color: #4479a1 !important;
        /* rgb(51, 89, 223) !important; 
    background-color: #4479a1*/
    }
    
    .skin-blue .sidebar-menu .treeview-menu>li>a {
        color: white;
        /* #8aa4af;  #367fa9;*/
    }

    .skin-blue .sidebar a {
        color: white;
    }
    .skin-blue .main-sidebar, .skin-blue .left-side {
        background-color: #1b506e;
        color: white;
    }

    .skin-blue .sidebar-menu>li.header {
        color: #4b646f;
        background: black
        /* background: #1a2226; #0a0344;*/
    }
    .skin-blue .sidebar-menu>li>.treeview-menu {
        margin: 0 1px;
        background:  #092a3d;
        /* background: #2c3b41; */
    }
    .skin-blue .sidebar-menu>li.menu-open>a {
        color: #fff;
        background: black;

        /* background: #1e282c; */
    }

    .btn-primary {
        background-color:#0326c5 !important;
        border-color:#0120a8 !important;
    }
    .btn-primary:hover,
    .btn-primary:active,
    .btn-primary.hover {
      background-color: #0120a8 !important;
    }

    .btn-info {
        background-color:#00a65a !important;
        border-color: #008f4f !important;
    }
    .btn-info:hover,
    .btn-info:active,
    .btn-info.hover {
      background-color: #008f4f !important;
    }
    
      
        
       .page-height {
            max-height: 100vh;
        }

        .content-area-height {
            max-height: 76vh;           
        }
        
        .content-area {
            max-height: 86vh;
            min-height: 86vh;
            overflow-y: auto;
            overflow-x: hidden;
         }

         .content-area-sm-pa {
            max-height: 70vh;
            min-height: 70vh;
            overflow-y: auto;
            overflow-x: hidden;
         }
         .content-area-sm {
            max-height: 75.5vh;
            min-height: 75.5vh;
            overflow-y: auto;
            overflow-x: auto;
         }
         .content-area-sm-ticket {
            max-height: 75vh;
            min-height: 75vh;
            overflow-y: auto;
            overflow-x: auto;
         }

         .content-area-md {
            /* 66.5vh; */
            max-height: 78vh; 
            min-height: 78vh;
            overflow-y: auto;
            overflow-x: hidden;
         }

         .content-area-lg {
            height: 86vh;
           
            display: flex;
                -ms-flex-direction: column;
                flex-direction: column;
                flex: 0 0 240px;
                overflow: auto;
         }
        
         .area-bottom{
             padding-bottom: 20px;
         }
       
        
         .content-header {
            top:45px;
          }

          .content {
            top:0px;
            /* 40,top:102px; */
          }

         /* @media screen and (max-width:776px){
            .content-header {
                top:95px;
              }
          } */


        @media screen and (max-width:767px){
            .content-area {
            max-height: 62vh;
            overflow-y: auto;
            overflow-x: hidden;
         }

         .content-area-sm {
            max-height: 51vh;
            overflow-y: auto;
            overflow-x: hidden;
         }

         .content-area-md {
            max-height: 60vh;
            overflow-y: auto;
            overflow-x: hidden;
         }

        }

        @media screen and (max-width:640px){
            .content-area {
                max-height: 57vh;
                overflow-y: auto;
                overflow-x: auto;
             }

             .content-area-sm {
                max-height: 47vh;
                overflow-y: auto;
                overflow-x: auto;
             }

             .content-area-md {
                max-height: 56vh;
                overflow-y: auto;
                overflow-x: auto;
             }

             /* .content-area-lg {
                max-height: 60vh;
                overflow-y: scroll;
             } */
        }
    
    .role-table .popover {
        top: 100%;
      
    }    
    .popover {
        box-shadow: 0 2px 4px rgba(141,141,141,.2);
        border: 1px solid #ddd;
    }

    .role-table .popover .arrow {
        left: 36px;
    }

    .role-table .popover .popover-content {
        min-width: 150px;
    }

    .popover-content {
        word-wrap: break-word;
    }

    a:hover{ cursor:pointer}

 

   .hidden{
    display:none;
}
.show{
    display:block;
}

#modal-container {
    position:  fixed;
    top: 200px;
    width:  100%;
    height: 100%;
    background: white;
  
    text-align: center;
    box-shadow: 0px 0px 2px 1px black;
    z-index: 1050;
}

#overlay {
    position: absolute;
    top: 0px;
    left:  0px;
    z-index:  1049;
    background:  rgba(0,0,0,0.8);
    width:  100%;
    height: 100%;
}

.input-group > .dropdown-menu {
    box-shadow: white !important; 
    min-width: 200px !important;
}

ngb-datepicker-navigation-select>.custom-select {
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
    padding: 0 .95rem;
    font-size: 15px !important;
    height: 1.85rem !important;
}

.ngb-dp-day, .ngb-dp-week-number, .ngb-dp-weekday{
    width: 3rem !important;
    height: 3rem !important;
}

.my-top-border{
    border-top: 2px solid #00c0ef; 
    padding-top: 5px;   
    /* #00a65a; */
}


.gray-top-border{
    border-top: 2px solid #d2d6de; 
    padding-top: 5px;   
}
.padding-right{
 padding-right: 10px;
}
.btn-margin-top{
    margin-top: 20px;
}

.btn-margin-right{
    margin-right: 5px;
}

.save-btn-margin-left{
    margin-left: 60px !important;
}

.no-padding-top{
    padding-top: 0px;
}
.no-padding-bottom{
    padding-bottom: 0px;
}

.box-header{
    padding-bottom: 0px;
}
.col-actions{
    min-width:90px;
}

.small-padding-left{
   padding-left:5px;
}
.sm-padding-top
{ 
    padding-top: 5px;
}

.modal-dialog-lg {
    width: 850px;   
}
.modal-dialog-xlg {
    width: 1050px;   
}

.print-padding-bottom{
    padding-bottom: 10px;
}

.small-text{
    font-size: 13px !important;
}
.text-white{
    color: #00acd6 !important;
}


.md-td td {
    min-width: 100px;
}

 .lg-td{
    min-width: 128px;
}




sidebar-menu li.menu-open>a>.fa-angle-left, .sidebar-menu li.menu-open>a>.pull-right-container>.fa-angle-left {
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.sidebar-menu>li.menu-open>a {
    color: #fff;
    background: #1e282c;
    border-left-color: #3c8dbc;
}

.main-header .screen-toggle {
    float: left;
    background-color: transparent;
    background-image: none;
    padding: 15px 15px;
    font-family: fontAwesome; 
    color:  #fff;
}

.my-link{
   color: #3c8dbc !important;  
   cursor: pointer !important;
}
.my-link-error{
    color: red !important;  
    cursor: pointer !important;
 }

.refund{
    color: red; 
    font-size: 11px;  
}

.align-center{
    text-align: center;
}
.align-right{
    text-align: right;
}
.align-left{
    text-align: left;
}

.text-bold{
    font-weight: bold;
}
.borderless td, .borderless th {
    border: none;
}


.reports-top-border{
    border-top: 1px solid #000; 
    padding-top: 2px;
   
}
.reports-padding{
    margin-left: 0px;
    margin-right:0px;
}
.report-bottom{
  text-decoration: underline;
  font-weight: bold; 
  padding-left: 8px;
  padding-right: 8px; 
}