/* Header  Uses pixel units to align things around the Dialogic logo image 
 * which is 194px (wide) x 60px (high)
 */
#header {
	width: 100%;
	height: 50px;
}


/* Header content pane area. Where it has company logo, "PowerMedia" and "username, logout" */
#containerHeaderId{
	margin: -8px;
	clear: both;
	float: left;
	height: 45px;
	border-bottom: 1px solid #bbb;
	color: #fff;
    overflow-y:hidden;
}

/* Main webui configuration content*/
body {
	margin: 0;
	padding: 0;
	border: 0;           /* Removes the border around the viewport in old versions of IE */
	width: 100%;
	min-width: 600px;    /* Minimum width of layout, does not work in old versions of Internet Explorer */
	background: #2b4d6e; 
	color: #000;
	font: 92%  'Verdana sans-serif',Arial,Helvetica,sans-serif; 
	height: 100%;
	min-height: 100%;
}


/* Left navigation menu */
#leftTabContainerId{
	margin-top: -1px;
    margin-left: -5px;
    margin-right: -4px;
	overflow-y:auto;
   	overflow-x:hidden;
	width: 120px;
	position: relative;
  	background-color: #2b4d6e;
	top:182px;
}


/* Background color content pane area */
.contentPaneColor {
    background-color:#e9edf4;
    border: 0px solid #e9edf4;
    border-radius: 0px;
}


/* Dialog - Background color content pane area */
.claro .dijitDialogPaneContent {
    background-color:#e9edf4;
}


/* Dialog - Background color of action pane area */
.claro .dijitDialogPaneActionBar {
    background-color:#e9edf4;
}


/* Background color of based tab area */
.claro .dijitTabContainerTop-dijitContentPane {
    background-color: white;
}

/* Dojo button background color */
.claro .dijitButton .dijitButtonNode,.claro .dijitDropDownButton .dijitButtonNode,.claro .dijitComboButton .dijitButtonNode,.claro .dijitToggleButton .dijitButtonNode {
    background-color: #bcd8f4;
}


/* Replacce url or image to change company logo  */
/* This setting is shared on the header of login */
/* page and the header of configuration page     */
#logoImg {
  display: block;
  width: 280px;
  height: 69px;
  vertical-align:middle;
  background-image: url("../../images/logo.png"); 
  background-size: 85%;
  background-repeat: no-repeat;
  margin: 0px 0px 0px 15px;  /* top right bottom left */
}


/* Footer note */
div.footer_note span:before {
  content: "www.dialogic.com © Dialogic ®PowerMedia® XMS 2024";
}



/*--------  The section below is for html table  --------*/

    /* Header color of table grid */
.tbcolumn {
	background-color: #2b4d6e;
	color: white;
	font-weight: bold;
	padding: 5px 0 5px 5px;
}


    /* Alternating color rows in table grid */
.rowColor1 {
        background-color:#d0d8e8
}

    /* Alternating color rows in table grid */
.rowColor2 {
        background-color:#e9edf4
}




/*--------  The section below is for dojo grid  --------*/

.claro .dojoxGridRowOdd .dojoxGridRowTable tr {
	background-color:#f7fcff;
}


.claro .dojoxGridRowOver .dojoxGridCell {
	background: #ABD6FF repeat-x;
	border-top:1px solid #769DC0;
	border-bottom:1px solid #769DC0;
}

.claro .dojoxGridRowSelected .dojoxGridRowTable tr {
	background-color:#cee6fa;
}

.claro .dojoxGridHeader, .claro .dojoxGridHeader .dojoxGridCell {
    vertical-align: bottom;
    color: black !important;
	background: #e5edf4 repeat-x top;
    border-color: #ECE2D8;
    font-weight: bold;
}


.claro .dojoxGridHeader .dojoxGridCell:hover{
	background-color: #9dcfff;
}


.claro .dojoxGridHeader .dojoxGridCellOver .dojoxGridSortNode {
	background-color:#9dcfff;
}


/*--------  The section below is for login page  --------*/


body.login{
    font: 92%  'Verdana sans-serif',Arial,Helvetica,sans-serif; 
    font-size:medium;
    color: white;
    background-size:cover;
    background-color: white;
}


/* The setting of the login box on the login page */
/* "color" - font color */
/* "background-color" - background color of the login box */
div.DivLogin {
    height: 260px;
    width: 450px;
    color: white;
    margin-left: auto ;
    margin-right: auto ;
    margin-top: 150px ;
    margin-bottom: auto ;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 2px 0 #C2C2C2;
    box-shadow: 0 2px 2px 0 #C2C2C2;
    background-color:#679cc7
}


/* The header section on the login page below the company logo header section */ 
/* Replace the image to change the background of that header section          */
div.section.header {
    margin-left: -20px;
    margin-right: -10px;
    background-image:url("/images/slide-bg-3.jpg");
    background-position-y:-200px;
    background-color:transparent;
    padding:0!important;
    height: 100px;
    margin-top:6px
}

/* Header H1 setting on the login page where is the text as "Dialogic® PowerMedia® XMS" */
/* "color" - font color */
div.section.header h1 {
    position: relative;
    font: normal 40px !important;
    font-weight: bold;
    color: white;
    max-width:90%
}


div.section.header .login_header {
    display:flex;
    align-items:center;
    justify-content:center;
    height:100%
}


/* Header H1 content "Dialogic® PowerMedia® XMS" */
div.section.header .login_header h1:after {
  content: "Dialogic® PowerMedia® XMS";
}


/* Product title on the header area */
div.product_title span:before {
  content: "PowerMedia XMS";
}

/* Logo image on the login page*/
div.logosection {
    width: 323px;
    height: 120px;
    overflow: hidden;
    background: url("../../images/logo.png");
    background-size: 70%;
    background-color:transparent;
    background-repeat: no-repeat;
    background-position:center;
    margin: 0px 0px 0px 10px;   /* top right bottom left */
}

/* EOF */