﻿@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,800');
@import url('https://fonts.googleapis.com/css?family=Lato:400,700,900');
@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed);

@charset "utf-8";
/* CSS Document */

.mainTitle{
	font-family:Tahoma, Arial, "Lucida Console";
	font-size:18px;
	font-weight:bold;
	color:#1D53E2;	
	text-align:left;
	border-bottom: solid  #666666 1px;
	}

.subTitle{
	background-color: hsl(189, 20%, 91%);
    font-family: 'lato', sans-serif;
    color: #1A8498;
    font-weight: bold;
    line-height: 36px;
    text-shadow: 1px 1px 2px #F6FEFF;
    width: 100% !important;
    font-size: 16px;
    text-align: left;
    /* border-left: 2px solid #C7DBDE; */
    padding-left: 10px;
    border-radius: 8px 8px 1px 0;
	 vertical-align: middle;
    box-shadow: 0px -1px 1px 1px rgb(205, 225, 228);
		}

	.subTitleC{
	font-family:Tahoma, Arial, "Lucida Console";
	font-size:15px;
	font-weight:bold;
	color:#0073AA;	
	text-align: center;
	border-bottom: solid  #CCCCCC 1px;
	/*border-top: solid  #CCCCCC 1px;*/
		}
/*
.button{
	color:#fff;
	font-family:Tahoma, Geneva, sans-serif;
	font-size:11px;
	background: #2C5ED3;
	text-decoration:none;
	display: inline-block;
    width: 100px;
    height: 30px;
    text-align: center;
    cursor: pointer;
    border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border: 0px;
	border-bottom: 2px solid #006;
	  } */
/*	  
.button:hover{
    color:#fff;
	background:#1A1A1A;
	display: inline-block;
    width: 100px;
    height: 30px;
  }*/
 
.successText{
	font-size:12px;
	color:#009900;
	}

.errorText_OLD{
	font-size:12px;
	color:#FF0000;
	}

.urgentClass{
	font-size:12px;
	color:#FF0000;
	font-family:Tahoma, Geneva, sans-serif;
	}
	
.topPriorityClass{
	font-size:12px;
	color:#FF0000 ;
	}

.infoTextBig{
	font-size:14px;
	color: Green;
	font-weight:bold
	}

.gridBtn{
	font-family: 'open sans', sans-serif;
	font-size: 12px;
	font-weight: 700;
	/*background-color: #2C5ED3;*/
	line-height: 30px;
	padding: 0 10px !important;
	margin-top: 2px;
	margin-left: 60px !important;
	margin-bottom:5px;
	width: 110px !important;
	/* [disabled]-webkit-border-radius: 6px; */
	/*border-radius: 6px;*/
	color: #fff;
	text-decoration: none;
	/*border-bottom: 2px solid #006;*/
	background-image: -webkit-linear-gradient(270deg,rgba(107,183,245,1.00) 0%,rgba(0,100,148,1.00) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(107,183,245,1.00) 0%,rgba(0,100,148,1.00) 100%);
	background-image: -o-linear-gradient(270deg,rgba(107,183,245,1.00) 0%,rgba(0,100,148,1.00) 100%);
	background-image: linear-gradient(180deg,rgba(107,183,245,1.00) 0%,rgba(0,100,148,1.00) 100%);
	border: 2px solid hsla(0,0%,100%,1.00);
	box-shadow: 0 0 1px 1px hsla(0,0%,85%,1.00);
	-webkit-box-shadow: 0 0 1px 1px hsla(0,0%,85%,1.00);
	transition: all .5s;
	}
.gridBtn:hover{
	background: #1A1A1A;
	color: #F7F7F7;
	/*background-color: hsla(0,0%,61%,1.00);*/
	text-decoration: none;
	border: 2px solid hsla(198,60%,76%,1.00);
	/* width: 80%;	box-shadow: none;*/
	/*background-image: -webkit-linear-gradient(270deg,rgba(233,233,233,1.00) 0%,rgba(139,139,139,1.00) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(233,233,233,1.00) 0%,rgba(139,139,139,1.00) 100%);
	background-image: -o-linear-gradient(270deg,rgba(233,233,233,1.00) 0%,rgba(139,139,139,1.00) 100%);
	background-image: linear-gradient(180deg,rgba(233,233,233,1.00) 0%,rgba(139,139,139,1.00) 100%);*/
	box-shadow: none;
	
	}

.gridRowAlt{
	background: #F2F5F3 !important;
	vertical-align:text-top;
	line-height: 2.0em;
	border-bottom: 1px solid #C6E6FF;
	border-top: 1px solid #C6E6FF;
	}
	.gridRowAltInput{
	background: #F4FAFF;
	line-height: 2.0em;
	border-bottom: 1px solid #C6E6FF;
	border-top: 1px solid #C6E6FF;
	}
.subgridRowAlt{
	background: #F4FAFF;
	vertical-align:text-top;
	line-height: 2.3em;
	font-size: 11px;
	border-bottom: 1px solid #C6E6FF;
	/*border-top: 1px solid #C6E6FF;*/
	}
.gridRowAltDark{
	background: #CCCCCC; 
	vertical-align:text-top;
	line-height: 2.5em;
	border-bottom: 1px solid #C6E6FF;
	border-top: 1px solid #C6E6FF;
	}
	

.gridHeader{
	background: #109BB5;
	color: #fff;
	height: 35px;
	border-collapse: collapse;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.8em;
    vertical-align: middle;
	}
.subgridHeader{
	background-color: hsl(189, 12%, 54%) !important;
 
	color: #fff;
	border-collapse: collapse;
	font-size: 12px;
	font-weight: 700;
	line-height: 2.3em;
	}
.gridHeaderSmall{
	background: #999999;
	color: #fff;
	height: 25px;
	border-collapse: collapse;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.8em;
	}
.gridRow{
	background-color: #FFFFFF;
	vertical-align:text-top;
	line-height: 2.0em;
	/* padding-bottom: 15px; */
	/* padding: 15px; */
	}
	.gridRowInput{
	background-color: #FFFFFF;
	line-height: 2.0em;
	}
	.subgridRow{
	background-color: #FFFFFF;
	/* vertical-align:text-top; */
	line-height: 2.3em;
	font-size: 11px;
	
	}
	
     .gridButton{
 
background: url(../images/buttonBg.jpg) top left repeat-x #000;
 
/* display: block; */
 
color: #FFF !important;
 
border-radius: 5px;
 
text-decoration: none !important;
 
margin: 5px 0px 5px 0px;
 
border: 1px solid #ccc;
 
cursor: pointer;
 
text-align: center;
 
}
      
      .gridButton:hover{
	background: #1A1A1A;
	color: #F7F7F7;
	text-decoration:none;
	}
textarea {
  display: inline-block;
  margin: 0;
  padding: 5px 8px;
  border: 1px solid #666666;
  border-top: 1px solid #CCCCCC;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px;
  color:#333333;
  background: #ECF9FF;
  width: 100%;
   }
  
 textarea:hover{
  background:#FFF;
  transition: all .5s;
  border-color: #00AAE7;
box-shadow: 0 0 10px #00BDFF;
-webkit-box-shadow: 0 0 10px #00BDFF;
-moz-box-shadow: 0 0 10px #00BDFF;
  }
 textarea:focus{
  outline: none;
  border-color: #00AAE7;
box-shadow: 0 0 10px #00BDFF;
-webkit-box-shadow: 0 0 10px #00BDFF;
-moz-box-shadow: 0 0 10px #00BDFF;
transition: all .6s;

  }
  .expTolAmnt{
	border:solid 4px #f9f9f9;
	background-color: rgba(0,102,255,.3);
	height:25px;
	padding:3px;
	margin-bottom:5px;
	font-size:16px;
	border-radius: 5px;
}

.expTolAmntRed {
    border:solid 4px #f9f9f9;
    background-color: rgba(241, 60, 20, 0.3);
    height: 25px;
    padding: 3px;
    margin-bottom: 5px;
    font-size: 16px;
    border-radius: 5px;
}

.boldText{
	font-weight:bold;
	font-family:verdana;
}
.totalTxt{
	font-family: 'open sans', sans-serif;
	font-size: 13px;
	font-weight:500;
	
}
.successBox{
	border:solid 1px #ccc;
	border-radius:5px;
	-webkit-box-shadow: 0 8px 6px -6px black;
	   -moz-box-shadow: 0 8px 6px -6px black;
	        box-shadow: 0 8px 6px -6px black;
	        padding-bottom:10px;
	
}
.successHeader{
	color:#666;
	font-family:Verdana;
	font-size:12px;
	text-align: left;
	background-color: rgba(0,102,255,.1);
	padding-left:5px;
	
	}
	
.successText{
	color:#00B22D;
	font-family: verdana;
	font-size:12px;
	font-style:italic;
	
}
.aligntext
        {
            text-align:right;
         }
	
	 a.ExpensesRefNO 
		{
			
			color:blue;
			text-decoration:none;
			font-size:12px;
		}
			a.ExpensesRefNO:hover
		{
			color:#F90;
			text-decoration:none;
			
		}
		a.LinkButtonClass 
		{
			
			color:blue;
			text-decoration:none;
			font-size:12px;
		}
			a.LinkButtonClass:hover
		{
			color:#F90;
			text-decoration:none;
			
		}
	
.dropMenu {
  /*-webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  background-color: #ECF9FF;
   border: 1px solid #999999;
   padding: 3px 8px 3px 8px;
  color: #444;
  font-size: 11px;
  font-weight: bold;
  line-height: 20px;
  list-style: none;
  margin: 0 0px 0px 0px;
  min-width: 40px;
  min-height: 25px;
  outline: none;
  padding: 3px 0px 0 6px;
  text-decoration: none;
  vertical-align: middle;*/
  }
  
.dropMenu-disabled {
  background-color: #fff;
  border-color: #f3f3f3;
  color: #b8b8b8;
  cursor: default;
  }
  
.dropMenu:hover {
  background-color: #D5EAEA;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.1);
  -moz-box-shadow: 0 1px 1px rgba(0,0,0,.1);
  box-shadow: 0 1px 1px rgba(0,0,0,.1);
  border-color: #c6c6c6;
  color: #333;

  }
  
.dropMenu .dropMenu-focused {
  border-color: #488; width:50%;
  height: 15px;
  }
 
input[type=email],
  input[type=number],
  input[type=password],
  input[type=tel],
  input[type=text],
  input[type=url] 
  {
  display: inline-block;
  /*height: 25px;*/
  margin-right: 10px;
  padding: 3px 8px 3px 8px;
  /* background: #ECF9FF; */
  border: 1px solid #999999;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
 /* -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border-radius: 1px;*/
  color:#333333;
  width: 100%;
  }
  
input[type=email]:hover,
  input[type=number]:hover,
  input[type=password]:hover,
  input[type=tel]:hover,
  input[type=text]:hover,
  input[type=url]:hover {

  background: #FFF;
  border-color: #00AAE7;
  box-shadow: 0 0 10px #00BDFF;
  -webkit-box-shadow: 0 0 10px #00BDFF;
  -moz-box-shadow: 0 0 10px #00BDFF;
  transition: all .5s;
  }
  
input[type=email]:focus,
  input[type=number]:focus,
  input[type=password]:focus,
  input[type=tel]:focus,
  input[type=text]:focus,
  input[type=url]:focus {
  outline: none;
  border-color: #00AAE7;
  box-shadow: 0 0 10px #00BDFF;
  -webkit-box-shadow: 0 0 10px #00BDFF;
  -moz-box-shadow: 0 0 10px #00BDFF;
  transition: all .5s;

  }
  
input[type=email][disabled=disabled],
  input[type=number][disabled=disabled],
  input[type=password][disabled=disabled],
  input[type=tel][disabled=disabled],
  input[type=text][disabled=disabled],
  input[type=url][disabled=disabled] {
  border: 1px solid #e5e5e5;
  background: #f5f5f5;
  }
 
 .parentTable{
	 border: 1px solid #E6E6E6;
	 -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);
     -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);
     box-shadow: inset 0 1px 2px rgba(0,0,0,0.3);
	 }

.workTracker{
	height: 160px;
	margin-top: 10px;
	background: url(../images/trackerBanner.jpg)   top center no-repeat;
	}
.gridBorder{
	font-family: 'open sans', sans-serif;
	font-weight:600;
	padding: 2px;
    width: 100%;
    padding: 0px 2px;
    font-size: 13px;
	color:#5E5E5E;
	border-collapse: collapse;
	border-color: #00AAE7;
box-shadow: 0 0 2px #109BB5!important;
-webkit-box-shadow: 0px 0 2px #109BB5!important;
-moz-box-shadow: 0 0 2px #00BDFF!important;
transition: all .5s;
	}
	
	.gridBorder a{
		text-decoration: none;
		color:#5E5E5E;
	}
	.tableBorder{
	border: 2px solid #CCC;
	padding: 3px 3px 3px;

	
	}
.chkChoice input 
{ 
    margin-left: -20px; 
}
.chkChoice td 
{ 
    padding-left: 20px; 
     width:20%;
}

 .modalBackground
    {
        background-color: Black;
        filter: alpha(opacity=90);
        opacity: 0.8;
    }
    .modalPopup
    {
        background-color: #FFFFFF;
        border-width: 3px;
        border-style: solid;
        border-color: black;
        padding-top: 10px;
        padding-left: 10px;
        width: 300px;
        height: 140px;
    }

    .gridBtnRed{
	font-family: 'open sans', sans-serif;
	font-size: 12px;
	font-weight: 700;
	/*background-color: #2C5ED3;*/
	line-height: 30px;
	padding: 0 10px !important;
	margin-top: 2px;
	margin-right: 20px !important;
	margin-bottom:5px;
	background:  #ff4500;
	/*border-radius: 5px;
	-webkit-border-radius: 5px;*/
	color:  #fff;
	text-decoration:none;
/*	border-bottom: 2px solid #006;*/
	width:100px;
	background-image: -webkit-linear-gradient(270deg,rgba(255,210,193,1.00) 0%,rgba(255,69,0,1.00) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(255,210,193,1.00) 0%,rgba(255,69,0,1.00) 100%);
	background-image: -o-linear-gradient(270deg,rgba(255,210,193,1.00) 0%,rgba(255,69,0,1.00) 100%);
	background-image: linear-gradient(180deg,rgba(255,210,193,1.00) 0%,rgba(255,69,0,1.00) 100%);
	border: 2px solid hsla(0,0%,100%,1.00);
	box-shadow: 0 0 1px 1px hsla(0,0%,85%,1.00);
	-webkit-box-shadow: 0 0 1px 1px hsla(0,0%,85%,1.00);
	transition: all .5s;
	}
	
.gridBtnRed:hover{
	background: #1A1A1A;
	border: 2px solid hsla(16,100%,65%,1.00);
	box-shadow: none;
	color: #F7F7F7;
	text-decoration: none;/*	width:80%;*/
	}
	
.imageUploaderField input{width:70%!important;}"

.cssPmtPaid {
background-color: #0F0;
font-weight: bold;
color: #000;
}

.cssPmtPending {
font-weight: bold;
color: #000;
background-color: #FF0;
}

.cssLoanPending {font-weight: bold;color: #000;background-color: #FF0;padding-left: 10px;display: block;border-radius: 5px;}
.cssLoanPaid {background-color: #0F0;font-weight: bold;color: #000;padding-left: 10px;display: block;border-radius: 5px;}
.cssLoanApproved {background-color: #0F0;font-weight: bold;color: #000;padding-left: 10px;display: block;border-radius: 5px;}
.cssLoanDenied {background-color: Red;font-weight: bold;color: #000;padding-left: 10px;display: block;border-radius: 5px;}
.cssLoanUserCancelled {
background-color: Silver;
font-weight: bold;
color: #000;
}

.inputLookAlike
 {
 /* width: 300px; */
	font-family: 'open sans', sans-serif;
	font-weight:700;
	color: #8E8E8E;
	border: 1px solid hsla(0,0%,76%,1.00);
	border-bottom: 2px solid hsla(0,0%,76%,1.00);;
	background-color: hsla(0,0%,99%,1.00);
	line-height: 25px;
	height : 30px;
	font-size: 13px;
	text-align: left;
	padding: 6px 9px;
	box-shadow: 0px 0px 2px 1px hsla(0,0%,89%,1.00);
	-webkit-box-shadow: 0px 0px 2px 1px hsla(0,0%,89%,1.00);
  }
  
  .inputLookAlike:hover
  {
  border: 1px solid #84C1C1;
  -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
  -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
  background: #FFF;
  }
  .dashBoardBoxTask {
   /*  position:absolute; */
   position:relative;
	width: 192px;
	height: 146px;
	background-image: url(http://192.168.129.50/myoffice/Resources/PayMyBills/images/workTracker.png);
	border: none;
	background-repeat: no-repeat;
	text-decoration:none;
	text-align: center;
	}
	
.dashBoardBoxTask:hover {
	
	}
	
	
  .dashBoardBoxManageTask {
   /*  position:absolute; */
   position:relative;
	width: 192px;
	height: 146px;
	background-image: url(http://192.168.129.50/myoffice/Resources/PayMyBills/images/taskManagement.png);
	border: none;
	background-repeat: no-repeat;
	text-decoration:none;
	text-align: center;
	}
	
.dashBoardBoxManageTask:hover {
	
	}

.dashBoardBoxAlertMsgRed{
	  /*  position:relative;  
	  position:absolute;
	text-align: center;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	font-weight: bold;
	
	border: dotted 1px #fff;
	font-style: normal;
	
	padding-top:2px;
	padding-bottom:2px;
	width: 192px;*/

background-color: rgba(255,0,0,0.8);
color:#fff;
position: absolute;
text-align: center;
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
font-weight: bold;
border: dotted 1px #fff;
font-style: normal;
padding-top: 1px;
padding-bottom: 1px;
width: 190px;
top: 10px;


	}
.dashBoardBoxAlertMsgYellow{
	  /*  position:relative;  
	  position:absolute;
	text-align: center;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 11px;
	font-weight: bold;
	
	border: dotted 1px #fff;
	font-style: normal;
	
	padding-top:2px;
	padding-bottom:2px;
	width: 99%;*/
color: Gray;
background-color: rgba(255,255,0,0.8);
	position: absolute;
text-align: center;
font-family: Verdana, Geneva, sans-serif;
font-size: 11px;
font-weight: bold;
border: dotted 1px #fff;
font-style: normal;
padding-top: 2px;
padding-bottom: 2px;
width: 190px;
top: 10px;

	}
.dashBoardBoxAlertMsg:hover{
	background-color: rgba(0,153,255,0.8);
	}
.dashBoardBoxAlertMsgYellow:hover{
	background-color: rgba(0,153,255,0.8);
	}
.dashBoardBoxAlertMsgRed:hover{
	background-color: rgba(0,153,255,0.8);
	
	}
.dashBoardBoxAlertMsg a {
	margin-top:146px;

}

.WindowScroll{
	width: 320px;
	height: 200px;
	overflow: scroll;
	background:#fff;
	border:1px solid #ccc;	
	padding-left:5px;
	}
.errorText {
	font-family: 'open sans', sans-serif;
	color: #F00000;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	font-weight: 700 !important;
	clip: rect( );
	background-repeat: no-repeat;
	font-size: 11.5px;
}

.redAlert {
background-color: Red;
font-weight: bold;
color: #000;
}

.yellowAlert {
background-color: #FFFF66;
font-weight: bold;
color: #000;
}
.greenAlert {
background-color: #0F0;
font-weight: bold;
color: #000;
}

.linkClass {
    font-family: 'open sans', sans-serif;
    font-weight: 700;
    font-size: 13px;
    color: #686868;
    text-align: center;
    line-height: 20px;
    /* padding: 10px 5px; */
}


.gridviewPager{
    background-color:#fff;
   
   padding:2px;
   margin:2% auto;
   
   
}

.gridviewPager a{
  margin:auto 1%;
    border-radius:50%;
      background-color:#444;
      padding:5px 10px 5px 10px;
      color:#fff;
      text-decoration:none;
      -o-box-shadow:1px 1px 1px #111;
      -moz-box-shadow:1px 1px 1px #111;
      -webkit-box-shadow:1px 1px 1px #111;
      box-shadow:1px 1px 1px #111;
     
}

.gridviewPager a:hover{
    background-color:#1e8d12;
    color:#fff;
}

.gridviewPager span{
    background-color:#ae2676;
    color:#fff;
     -o-box-shadow:1px 1px 1px #111;
      -moz-box-shadow:1px 1px 1px #111;
      -webkit-box-shadow:1px 1px 1px #111;
      box-shadow:1px 1px 1px #111;

    border-radius:50%;
    padding:5px 10px 5px 10px;
}
 a.ExpensesRefNO 
		{
			
			color:blue;
			text-decoration:none;
			font-size:12px;
		}
			a.ExpensesRefNO:hover
		{
			color:#F90;
			text-decoration:none;
			
		}

		 a.LinkButtonClass 
		{
			
color: blue !important;
			
text-decoration:none !important;
			
font-size:12px !important;
		}
			a.LinkButtonClass:hover
		{
			color:#F90 !important;
			text-decoration:none !important;
			
		}
		
		.font-txt{
	 font-family: 'Open Sans', sans-serif;
	  font-size: 13px;
	  color: #6A6A6A;
	  line-height:25px;}
	  
input[type=search], select{
	font-family: 'Open Sans', sans-serif;
	height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
	margin-bottom: 5px;
	    border: 1px solid #ccc;
		transition: all .5s;}
input[type=search]:focus, select:focus{
	box-shadow: 0 0 2px 1px rgba(45,150,237,0.40);
	-webkit-box-shadow: 0 0 2px 1px rgba(45,150,237,0.40);

}
.boldGridText
{
    font-family: 'lato', sans-serif;
    font-weight: 700 !important;
    color: #1eb5d2;
    font-size: 14px;
    font-style: italic;
    padding-right: 7px;
    }

.gridBoldText
{
    font-family: 'lato', sans-serif;
    font-weight: 700 !important;
    color: #1eb5d2;
    font-size: 14px;
    font-style: italic;
    padding-right: 7px;
    }

form#form1 div.subTitle:nth-child(3) {
    width: 99% !important;
}

.gridBoldTextN {
    font-family: 'lato', sans-serif;
    font-weight: 700 !important;
    color: #1eb5d2;
    font-size: 14px;
    padding-right: 7px;
}

.gridRefID {
    font-family: 'lato', sans-serif;
    font-weight: 700 !important;
    color: #1eb5d2;
    font-size: 12px;
    font-style: normal;
    padding-right: 4px;
}
.greenTDClass{
color: #fff ;
font-family: verdana;
font-size: 13px;
font-weight: 500;
background-color:#1F8806;
 padding: 5px
}

.redTDClass{
color:#fff;
font-family: verdana;
font-size: 13px;
font-weight: 500;
background-color: #ff6347;
 padding: 5px
}

.yellowTDClass{
color:black;
font-family: verdana;
font-size: 13px;
font-weight: 500;
background-color: yellow;
 padding: 5px
}

.display-img {
    left: 66.5%;
    width: 35px;
    height: 45px;
    padding: 0;
    /* background: #f5fdfd; */
    border-radius: 19px;
    border: 2px solid #96c0c7;
}


.display-img img {
    width: 31px;
    height: 41px;
    border-radius: 20px;
    opacity: .8;
}
.kpi_panel
{
padding: 5px!important;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12)!important;
background-color: #fbfbfb!important;
margin-bottom: 12px!important;
margin-top: 6px!important;
}

#WrapUrl{
width:400px;
    word-wrap:break-word;
}

.thCenter
{ text-align: center;}


.datatableBorder{
	font-family: 'open sans', sans-serif;
	font-weight:600;
	padding: 2px;
    width: 100%;
    padding: 0px 2px;
    font-size: 13px;
	color:#5E5E5E;
	border-collapse: collapse;
	border-color: #CDD2D8;
box-shadow: 0 0 6px #109BB5!important;
-webkit-box-shadow: 0px 0 7px #CDD2D8 !important;
-moz-box-shadow: 0 0 7px #00BDFF!important;
transition: all .5s;
	}
	
	.datatableBorder a{
		text-decoration: none;
		color:#5E5E5E;
	}

	/*

.checkboxClass, .radiobuttonClass{
  height: 20px;
  width: 20px;
  position: relative;
}

.checkboxClass:after, .radiobuttonClass:after{
  content: '\00D7';
  display: block;
  background: #E5E4E4;
  background-image: url('https://cdn0.iconfinder.com/data/icons/slim-square-icons-basics/100/basics-21-32.png');
  pointer-events: none;
  font-size: 15px;
  position: absolute;
  top: 0;
  left: 0;
  height: 15px;
  width: 15px;
  color: transparent;
  transition: .25s all ease-in-out;
  border-radius: 2px;
  line-height: 15px;
  background-position: 0 15px;
  background-repeat: no-repeat;
  background-size: 15px 15px;
  border-width: 2px;
  border-style: solid;
  border-color: transparent;
}
.radiobuttonClass:after{ border-radius: 50%; }
.checkboxClass:checked:after, .radiobuttonClass:checked:after {
  background-color: #d4de4e;
  background-position: 0 0;
   border-color: #E6E8EB;
}
.checkboxClass:hover:after, .radiobuttonClass:hover:after{
  border-color: #d4de4e;
}

*/

/* Class for Styling Checkbox */
.checkboxClass[type=checkbox] { 
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: 0
}
.checkboxClass[type=checkbox]:after {
  padding-right: 3px;
  top: 1px;
  font-family: 'Arial' !important;
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  content: "X";
  color: #333;
  display:block;
}
.checkboxClass[type=checkbox]:checked:after {
  content: "\2713";
  color: #ffa500;
} 

.checkboxClass[type=checkbox]:disabled {
 opacity:0.2;
border: 0px;
}

.checkboxClass[type=checkbox]:focus{
        outline:0;
    } 
	 
  .gridheader_calendaricon {
        display: block;
        padding: 0 4px 0 15px;
        background: url(../../../../../images/calendaricon_48.png) no-repeat !Important;
		   background-color: black:
    }
	 
.gridHeader_CalendarIconClass {
       
         background-color: rgba(255,255,255,0);
    padding: 10 30px;
	  background-image: url(../../../../../../images/icons8-calendar-35.png) !Important;
    background-repeat: no-repeat !Important;
      background-position: 50% 60% !Important;; 
    text-align: center;
     vertical-align: middle;
			
    }
	 
.gridHeader_TelephoneIconClass {
       
         background-color: rgba(255,255,255,0);
    padding: 10 30px;
	  background-image: url(../../../../../../images/icons8-telephone-35.png) !Important;
    background-repeat: no-repeat !Important;
      background-position: 50% 60% !Important;; 
    text-align: center;
     vertical-align: middle;
			
    }
	 
	   .imageMiddleAlign{
        display: inline-block;
		  vertical-align: middle;
    }