﻿/* Extra small devices (phones, 600px and down) */

.scroll
{
 overflow-y:scroll;
}
.lst-height {
    max-height: 50em;
    margin-left: 0.5em;
}
.detail-lst-height
{
	/**max-height:27.5em;**/
}
.wu-toolbar{
	width:100%;
	padding:0.2em 0.5em 0.2em 0.5em;
	}
.records-count{
	width:100%;
	padding:0.2em 2em 0.2em 2em;
	text-align:center;
	font-style:italic;
	}

.btn-mg
{
	margin:0em 0.3em 0em 0.2em;
	min-width:3.5em;
}

.tool-search-txt
{
	margin:0em 0.3em 0em 0.3em;
	max-width:10em;
	height:2em;
	max-height:2em;
	line-height:1em;
	
}
.search-box
{
	width:100% !important;

	
}
.namebadge
{
	margin:0em 0em 0.3em 0em;
	width: 100%;
	text-align:left !important;
}

#tb_cus_list tbody tr{
	cursor:pointer;
}

#tb_cus_list tbody tr:hover{
    
    background-color:#478FCA;
  /** background-color:#93CBF9;**/
    color:whitesmoke;
}
#tb_cus_list tbody tr:nth-child(even)
{
    background-color:whitesmoke;
    
}
#tb_cus_list tbody tr:nth-child(even):hover
{
   background-color:#478FCA;
  /** background-color:#93CBF9;**/
    color:whitesmoke;
   
}
.align-c
{ text-align: center;}
.rowselect{
       background-color:#478FCA !important;
       color:whitesmoke;
}

.customerphoto{
        max-width: 100%;
        max-height: 100%;
        object-fit:fill;
        display: block;
        margin-left: auto;
        margin-right: auto;
        text-align:center;
       
}

/*************spinner**************/
.loader {
  border: 16px solid #f3f3f3; /* Light grey */
  border-top: 16px solid #66615B; /* Blue */
  border-radius: 50%;
  width: 120px;
  height: 120px;
  margin:15vh auto 15vh auto;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
/*************end of spinner************/
.pad-label-10
{
 padding-top:10px;
 float:right;	
}

.pad-10
{
	padding-bottom:10px;
}
/*************************Login Page**************/
.loginwrap
{
	margin-top:30vh;
	width:300px;
	
	
}
.fr{ float:right;}
.fl{ float:left;}
.mt-5{
    margin-top:5vh;
}
#scli-form-wrapper, .forgot-box-div
{
background:rgba(255,255,255,.50);
}

.divforgotpswd
{
width: 100%;
padding:5px 10px 5px 10px;
}
.loginforms
{display:none;}
#user_accounts_form_content
{ min-height:15em; }
#user_account_form
{
	min-height:29em;
}

#billinvoicewrapper
{
/**margin-top:10em;**/
max-height:14em;
overflow-y:scroll;

}


/****************************end of login page*************/

.CustomerGreen
{
 color:green;
}
.CustomerRed
{
color:red;
}
.CustomerBlue
{
 color:#478FCA;
}

/********************************customer content ******************/
#customer-content
{
  /** height: 80vh;**/
}
#customer-account-info
{
	padding-bottom: 0.5em;

}
.hide-me{
    display: none;
}
.customer-p_rate
{ height: 100px;}

#div_oe_graph_view {
    width: 100%;
    height: 50vh;
}


/***********************expenditure and income table views************/
.entries_view_div
{
     width: 100%;
     overflow:auto;
    height:550px;
}

.entries_view_table thead tr td{
 font-weight: bolder;
}
.entries_view_table th, .entries_view_table td {
  padding: 5px;
  text-align: left;
}

.dashboardgraphs-1
{
     height: 320px !important;
      
}
.dashboardgraphs-1 canvas
{
         
}
#customer_prate_radial
{
    
}
/***********upload progress bars ****************/
#csprogressContainer,#cmprogressContainer,#arrprogressContainer {
            width: 100%;
            background-color: #f3f3f3;
            margin-top: 10px;
            display: none;
        }
#csprogressBar,#cmprogressBar,#arrprogressBar {
            width: 0%;
            height: 20px;
            background-color: #4caf50;
            text-align: center;
            line-height: 20px;
            color: white;
}
/**************end *******************************/
/******************************end************************************/
/**********************************end *******************************/
@media only screen and (max-width: 600px) {...}

...}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {...}

...}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {...}

...}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) 
{
.btn-mg
{
	margin:0em 0.2em 0em 0.2em;
	min-width:3em;
}
.search-box
{
	width:100% !important;

	
}


}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) 
{
.btn-mg
{
	margin:0em 0.3em 0em 0.3em;
	min-width:3.5em;
}
.tool-search-txt
{
	margin:0em 0.3em 0em 0.3em;
	max-width:10em;
	height:2em;
	max-height:2em;
	line-height:1em;
	
}
.search-box
{
	width:100% !important;
		
}


}