html, body 
{
    height: 100%;
    margin: 0;
    overflow: hidden ;
    padding: 0;
    /*background: #A5BBD5;*/
    font-family: Helvetica; /* From Mobile Theme */
    font-size: 17px; /* From Mobile Theme */

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.outline		{ /*border:		1px dashed #F00 !important;*/ }
.add-padding	{ padding:		2px !important; }
.no-padding		{ padding:		0 !important; }
.add-scrollbar	{ overflow:		auto; }
.no-scrollbar	{ overflow:		hidden; }
.y-scrollbar    { overflow-y: auto; overflow-x: hidden;  }
.allow-overflow	{ overflow:		visible; }
.full-height	{ height:		100%; }
.full-width     { width:        100%; }

.error          { color: red !important;  }
.offline { background: #c00; }
.online { background: #0c0; }

.wordwrap { 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
   word-break: break-all; 
}

.no-select  
{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
button			{ cursor:		pointer; }
.font-blue     { font-weight:bold; color: Blue; }

/* --------------- */

/*-----------------------------------------------
SH. Site Header (generic)
-----------------------------------------------*/
#appLayout  
{
    height:		100%;  
}

#appLayout .head 
{
    height: 75px;
    border-color: #888888;
    border-width: 2px;
    border-style:solid;
    background: white;
    /*border-radius: 5px;
    box-shadow: 2px 2px 2px 2px #888888;*/
    margin-bottom: 5px;
}

#appLayout .foot
{
    font-size: smaller;
    padding:0px;
    margin:0px;
    text-align:center; 
    background-color: White;
}

.header {
    margin: 0;
    padding: 0;
    /*background: url(../images/header/linen.jpg) repeat-x scroll left top;*/
    width: 100%;
    height: 78px;
    border-bottom: 1px solid #D8D8D8;
}
.header .container {
    height: 78px;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.pageOverlay {
    top: 0;
    left: 0;
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 1001;
    display: block;
    background: white;
}

#leading
{
    width:180px;
    border-style:none;    
}

.loadingOverlay 
{
    background: 
        url('../images/app/loading.gif') 
        no-repeat
        10px 23px;
    /*display: table;
    margin: 0 auto;*/
    margin: -50px 0 0 -50px;
    position: absolute;
    left: 45%;
    top: 45%;
    overflow:hidden;
}

.centerOverlay
{
    margin: -50px 0 0 -50px;
    position: absolute;
    left: 40%;
    top: 45%;
    overflow:hidden;
}
 
.loadingMessage {
    padding: 25px 40px;
    color: Black;
    font-style:italic;
    font-size: large;
}


/*************
* CENTER LAYOUT
***************/
.center
{
	margin: 0 auto;
}

.dijitBorderContainer {
    background-color: white !important;
}

.dijitBorderContainer .dgrid {
    height: 100% !important;
    /*position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: auto;*/
}

.dijitContentPane
{
    padding: 0 !important; 
}

/*.dijitBorderContainer-dijitContentPane
{
    overflow: hidden !important;    
}*/

/*.claro .dijitDialogUnderlay { background:#000; }*/

.searchIcon {
    background-image: url(/content/images/buttons/search.png); /* 16px x 16px */
    background-color: transparent; /* make the button transparent */
    background-repeat: no-repeat;  /* make the background image appear only once */
    background-position: 0px 0px;  /* equivalent to 'top left' */
    border: none;           /* assuming we don't want any borders */
    cursor: pointer;        /* make the cursor like hovering over an <a> element */
    height: 16px;           /* make this the size of your image */
    padding-left: 0px;     /* make text start to the right of the image */
    vertical-align: middle; /* align the text vertically centered */
    border-width: 0px;
    width: 16px;
}

.closeChatIcon {
    background-image: url(/content/images/buttons/closeChat.png); /* 16px x 16px */
    background-color: transparent; /* make the button transparent */
    background-repeat: no-repeat; /* make the background image appear only once */
    background-position: 0px 0px; /* equivalent to 'top left' */
    border: none; /* assuming we don't want any borders */
    cursor: pointer; /* make the cursor like hovering over an <a> element */
    height: 20px; /* make this the size of your image */
    padding-left: 0px; /* make text start to the right of the image */
    vertical-align: middle; /* align the text vertically centered */
    border-width: 0px;
    width: 20px;
}

.revertChatIcon {
    background-image: url(/content/images/buttons/revert.png); /* 16px x 16px */
    background-color: transparent; /* make the button transparent */
    background-repeat: no-repeat; /* make the background image appear only once */
    background-position: 0px 0px; /* equivalent to 'top left' */
    border: none; /* assuming we don't want any borders */
    cursor: pointer; /* make the cursor like hovering over an <a> element */
    height: 20px; /* make this the size of your image */
    padding-left: 0px; /* make text start to the right of the image */
    vertical-align: middle; /* align the text vertically centered */
    border-width: 0px;
    width: 20px;
}


.exportIcon {
    background-image: url(/content/images/buttons/csv.png); /* 16px x 16px */
    background-color: transparent; /* make the button transparent */
    background-repeat: no-repeat; /* make the background image appear only once */
    background-position: 0px 0px; /* equivalent to 'top left' */
    border: none; /* assuming we don't want any borders */
    cursor: pointer; /* make the cursor like hovering over an <a> element */
    height: 16px; /* make this the size of your image */
    padding-left: 0px; /* make text start to the right of the image */
    vertical-align: middle; /* align the text vertically centered */
    border-width: 0px;
    width: 22px;
}

/*button {
	-webkit-transition: background-color 0.2s linear;
	border-radius:4px;
	-moz-border-radius: 4px 4px 4px 4px;
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
	background-color: #E4F2FF;
	background-image: url("//ajax.googleapis.com/ajax/libs/dojo/1.9.1/dijit/themes/claro/form/images/button.png");
	background-position: center top;
	background-repeat: repeat-x;
	border: 1px solid #769DC0;
	padding: 2px 8px 4px;
	font-size:1em;
}

button:hover {
	background-color: #AFD9FF;
	color: #000000;
}*/

/*.gridContainer
{
    height: 100% !important;
}*/

.dialogTitle {
    display: block;
    padding-bottom: 7px;
}

input {
	font-family: Segoe UI, Tahoma, Arial, Verdana; font-size: 100%;
}
button {
	font-family: Segoe UI, Tahoma, Arial, Verdana; font-size: 100%;
}
textarea {
	font-family: Segoe UI, Tahoma, Arial, Verdana; font-size: 100%;
}
select {
	font-family: Segoe UI, Tahoma, Arial, Verdana; font-size: 100%;
}
input {
	background-color: rgb(255, 255, 255);
}
textarea {
	background-color: rgb(255, 255, 255);
}
select {
	background-color: rgb(255, 255, 255);
}
.textbox {
	outline: 0px; border: 1px solid rgb(230, 230, 230);
}
.input-text {
	outline: 0px; border: 1px solid rgb(230, 230, 230);
}
label {
	color: rgb(109, 109, 109);
}
legend {
	color: rgb(109, 109, 109);
}
a {
	color: rgb(0, 122, 204); text-decoration: none; cursor: pointer;
}
a:hover {
	color: rgb(0, 122, 204); text-decoration: underline;
}
a:visited {
	color: rgb(0, 122, 204);
}
a:active {
	color: rgb(0, 122, 204);
}
fieldset {
	margin: 0px; padding: 0px; border: 0px currentColor;
}

.dojoxFloatingPane /* http://forums.arcgis.com/threads/91621-Help-with-dojo-floating-pane */
{
	padding:0 !important;
	border:solid 1px #769DC0 !important;
}

.dojoxFloatingPaneTitle {
	border: 1px solid #ffffff;
	border-top: none;
	background-color: #abd6ff;
	background-image: url("/js/libs/dojo/dijit/themes/claro/images/standardGradient.png");
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
	background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
	background-image: -o-linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
	background-image: linear-gradient(rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0) 100%);
	_background-image: none;
	padding: 5px 7px 4px 7px;
}
.dojoxFloatingPaneContent {
	border-top:solid 1px #769DC0;
	padding:0;
	overflow:hidden !important;
}
.dojoxFloatingMinimizeIcon {
	/*custom minimize icon if desired*/
}

.dijitValidationTextAreaError, .dijitValidationTextAreaError.dijitTextBoxHover {
 background-image: url("/dijit/themes/claro/form/images/error.png");
 background-position: right;
 background-repeat: no-repeat;
}



.outcomingCallIcon {
    background-image: url(/content/images/buttons/outcoming-call.png); /* 16px x 16px */
    background-color: transparent; /* make the button transparent */
    background-repeat: no-repeat; /* make the background image appear only once */
    background-position: 0px 0px; /* equivalent to 'top left' */
    border: none; /* assuming we don't want any borders */
    cursor: pointer; /* make the cursor like hovering over an <a> element */
    height: 24px; /* make this the size of your image */
    padding-left: 0px; /* make text start to the right of the image */
    vertical-align: middle; /* align the text vertically centered */
    border-width: 0px;
    width: 24px;
}
.hangUpCallIcon {
    background-image: url(/content/images/buttons/hang-up.png); /* 16px x 16px */
    background-color: transparent; /* make the button transparent */
    background-repeat: no-repeat; /* make the background image appear only once */
    background-position: 0px 0px; /* equivalent to 'top left' */
    border: none; /* assuming we don't want any borders */
    cursor: pointer; /* make the cursor like hovering over an <a> element */
    height: 24px; /* make this the size of your image */
    padding-left: 0px; /* make text start to the right of the image */
    vertical-align: middle; /* align the text vertically centered */
    border-width: 0px;
    width: 24px;
}
.hangUpCallIconHoverIcon {
    background-image: url(/content/images/buttons/hang-up-hover.png); /* 16px x 16px */
    background-color: transparent; /* make the button transparent */
    background-repeat: no-repeat; /* make the background image appear only once */
    background-position: 0px 0px; /* equivalent to 'top left' */
    border: none; /* assuming we don't want any borders */
    cursor: pointer; /* make the cursor like hovering over an <a> element */
    height: 24px; /* make this the size of your image */
    padding-left: 0px; /* make text start to the right of the image */
    vertical-align: middle; /* align the text vertically centered */
    border-width: 0px;
    width: 24px;
}
.outcomingCallHoverIcon {
    background-image: url(/content/images/buttons/outcoming-call-white.png); /* 16px x 16px */
    background-color: transparent; /* make the button transparent */
    background-repeat: no-repeat; /* make the background image appear only once */
    background-position: 0px 0px; /* equivalent to 'top left' */
    border: none; /* assuming we don't want any borders */
    cursor: pointer; /* make the cursor like hovering over an <a> element */
    height: 24px; /* make this the size of your image */
    padding-left: 0px; /* make text start to the right of the image */
    vertical-align: middle; /* align the text vertically centered */
    border-width: 0px;
    width: 24px;
}
.tmslogsys .cc-icon .dijitButtonNode{
    background-color:white!important
}

.tmslogsys .cc-icon-hover .dijitButtonNode {
    background-color: #e9931a!important;

}