/*-------------------------------------------------------------------------------------
// Author: na
// Created: na
// 
// Overview:
// Shows the project listing, profitability and targeting views
// 
// Special Considerations:
// 
// Revision History:
// Mark   Date   By   Reason
// ---- --/--/-- ---- -----------------------------------------------------------------
// 8759 11/04/14 DP   Reworked styling to fit in with new DevExpress
// 9207 02/03/16 JH   Add style rule to not display clear icon on Edge browers 
-------------------------------------------------------------------------------------*/

/*override the standard fieldset to something a bit nicer*/
fieldset {
    border: solid 1px silver;
}

.chartHeaderLabel{
    padding-top: 3px;
    padding-left: 10px;
    padding-right: 3px;
}

/*8500+*/
/* overrides here to hide thing due to new metro styling*/
/*hide all the existing hrlines these will eventually need removing from all of the pages */
.hrline {
    /*
    color: #FFA500;
    width: 100%;
    padding: 0px;
    margin: 2px;
    background-color: #FFA500;
    height: 2px;
    border: 0px;
    */
    display:none;
}
/* define new hr_line class this is currently only used in the master pager header*/
.hr_line {
    color: #FFA500;
    width: 100%;
    padding: 0px;
    margin: 2px;
    background-color: #FFA500;
    height: 2px;
    border: 0px;
}

.warningStyle {
     border: 1px solid #DC634E;
     padding:1px;
}

/* hide table banner used only in legacy pages as a page title not needed now*/
#TableTopBanner {
    display:none;
}

/* 8500 hide the main contents div until the page has fully loaded this prevents screen layout issues whilst we turn things on / off*/
#divMainContent {
    display:none;
}

/* 8500 override normal button and input button to conform to the metro styles */
button,
input[type=button] {
    background-color: white;
    vertical-align: middle;
	cursor: pointer;
    text-align: center;
	white-space: nowrap;
	font: normal 12px 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
    border: 1px solid #c0c0c0;
    padding: 2px 7px 3px;
}

button:hover,
input[type=button]:hover {
    background-color: #FFA500;
    color: white;
    border: 1px solid #FFA500;
}

.popupBottomPnl
{
    height:30px;
    width:100%;
    /*
    position:absolute;
    bottom:0px;
    padding:5px;
    */
    /*
    background-color:#D8E2E6;
    border-top:solid 1px #6A8CCB;
	*/
}

/*devexpress overrides */

/* override the inline-block back to inline, button paddings are effected without this fix and some buttons do not align properly */
.dxbButton_Metropolis span.dx-vam .dxbButton_Moderno span.dx-vam ,.dxbButton_Office365 span.dx-vam {
    display:inline!important;
}


/* make the popup header larger*/
.dxpcLite_Metropolis span.dxpc-headerText , .dxpcLite_Moderno span.dxpc-headerText  .dxpcLite_Office365 span.dxpc-headerText {
    font-size:28px !important;
}

/* remove the bottom spacings from popup sub titles */
.dxpcLite_Metropolis td.dxrpHeader_Metropolis, .dxpcLite_Moderno td.dxrpHeaderModerno , .dxpcLiteOffice365 td.dxrpHeaderOffice365  {
    padding-bottom : 0;
    margin-bottom: 0;
}



/* remove the browser focus styling for devexpress inputs as these are styled by the metro theme*/
input.dxeEditAreaSys:focus {
    outline: none;
}


.dxgvFocusedRow_Metropolis img, .dxgvDataRow_Metropolis img 
    , .dxgvFocusedRow_Moderno img, .dxgvDataRow_Moderno img 
    , .dxgvFocusedRow_Office365 img, .dxgvDataRow_Office365 img {
    vertical-align:bottom;
}


/*override the padding in the modal popups to put a left hand margin in and align the grid last button column*/
.dxpcContent_Metropolis, .dxpcContent_Moderno  , .dxpcContent_Office365 {
    padding-left:12px !important;
}
/*
.dxgvHeader_Moderno  , .dxgvHeader_Office365 {
    padding:4px 6px 5px ;
}
*/


/* quick override to try and make all the buttons the same shape*/
/* 8759+ */
.dxbButton_Metropolis div.dxb , .dxbButton_Moderno div.dxb , .dxbButton_Office365 div.dxb
{
    text-align:center !important;
    vertical-align:middle !important;
}

.dxbButton_Metropolis div.dxb img , .dxbButton_Moderno div.dxb img , .dxbButton_Office365 div.dxb img 
{
    text-align:center !important;
    vertical-align:middle !important;
}

.dxbButton_Metropolis input.dxb-hb , .dxbButton_Moderno input.dxb-hb , .dxbButton_Office365 input.dxb-hb 
{
    display:none !important;
}
/* 8759- */





/* without this menu item in some grids get the blue background colour for hyperlink*/

.dxgvFocusedRow_Metropolis a , .dxgvFocusedRow_Moderno a ,  .dxgvFocusedRow_Office365 a {
    background-color: transparent !important;
}

.dxgvFocusedRow_Metropolis, .dxgvFocusedRow_Moderno  , .dxgvFocusedRow_Office365 {
    background-color: #BED1E8 !important;
    background-image:none;
}
.dxgvFocusedRow_Metropolis:hover, .dxgvFocusedRow_Moderno:hover ,  .dxgvFocusedRow_Office365:hover {
    color: white !important;
}

a.dxeHyperlink_Metropolis, a.dxeHyperlink_Moderno {
    color:gray;
    text-decoration :none;
}

a:hover.dxeHyperlink_Metropolis, a:hover.dxeHyperlink_Moderno, a:hover.dxeHyperlink_Office365
{
	color: #FFA500;
}

/*8759*/



/*
.dxm-item {
    background-color:white;
    border: 1px solid #c0c0c0 !important;
}
*/
/*8759*/

.dxMenuWithImages {
    background-color:transparent !important;
}
.dxMenuWithImagesItem {
    border: 1px solid #c0c0c0 !important;
}

/*devexpress overrides */

.childTopics {
    display: none;
}

.highlightParentTopic {
    font-weight: bolder !important;
}

.relatedTopics {
    color: gray;
    font: 10pt 'Segoe UI';
}
.topTitleBarText {
    color: gray;
  /*  font: 12pt 'Segoe UI';  */
   
}

    .topTitleBarText span {
        color: gray;
     /*      font: 12pt 'Segoe UI'; */
        
    }

.relatedTopicTabWrapper {
    width: 100%;
    margin-bottom: 5px;
}

    .relatedTopicTabWrapper .dxtcPageContent_Metropolis ,   .relatedTopicTabWrapper .dxtcPageContent_Moderno ,   .relatedTopicTabWrapper .dxtcPageContent_Office365 {
        display: none;
    }



/*8500*/



/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
body {
    font-family: 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
    font: 12px 'Segoe UI';
    margin: 0;
    padding: 0;
    /*color: #696969;*/
    color:black;
}

img {
    border-style: none;
}

.mainMasterTable {
    background-color: White;
}

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
    font-size: 1.75em;
    color: #FFA500; /*font-family: Arial, Helvetica, sans-serif*/
    font-family: 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
}

h1 {
    padding-top: 0px;
    margin-top: 0px;
    font-size: 30px;
    padding-bottom: 0px;
    margin-bottom: 0px;
    font-weight: normal;
}

h2 {
    margin-top: 0px;
    margin-bottom: 5px;
    padding: 0 0 5px 0;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}
/* FORM LAYOUT ELEMENTS   
----------------------------------------------------------*/

.LoginUser {
    font-family: 'Segoe UI', Helvetica, 'Droid Sans', Tahoma, Geneva, sans-serif;
    font-size: 12px;
}

.star {
    width: 8px;
    color: Red;
    font-weight: bold;
}

.hide-info-message {
    display: none;
}

.modalSavePanelBottom {
    width: 100%;
    height: 23px;
    position: absolute;
    bottom: 0;
    left: 0;
}


/* MISC  
----------------------------------------------------------*/
.clear {
    clear: both;
}

.error {
    color: Red;
}

.warning {
    color: Maroon;
}

#menucontainer {
    margin-top: 30px;
}

.mandatory, 
.mandatory span {
    width: 20px;
    color: #E9786E !important;
}

.dataLabel .datalabel{
    color: Black;
    font-size: 10pt;
}

.datavalue {
    /* 8500 font-weight: bold; */
    color: Black;
    font-size: 10pt;
}

.infolabel {
    color: Gray;
    font-size: 10pt;
}

.divDescription {
    margin-bottom: 3px;
    margin-left: 1px;
}

.hr-seperator {
    border: 0;
    border-top: 1px solid Silver;
    height: 0;
    background: Silver;
}

ul.errorbullet {
    white-space: nowrap;
    margin: 0px;
    margin-left: 27px;
    padding: 0px;
    color: Maroon;
}

li.errorbullet {
    padding-top: 4px;
}

.pvr_lblcell1 {
    color: Black;
}

.pvr_lblcell {
    color: Black;
    padding-left: 30px;
}

.pvr_datacell {
    padding-left: 5px;
    color: Navy;
}

.pvr_datacelltotal {
    padding-left: 5px;
    color: Navy;
    font-weight: bold;
}

.pvr_cellhr {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-color: orange;
}

.divFormEntry {
    margin-left: 40px;
    margin-right: auto;
    width: 800px;
}

@media screen and (max-width: 539px) {
	.divFormEntry {
		margin-left: 5px;
		margin-right: auto;
		width: 100%;
	}
}


.uppercase input,
.upperCase input{
    text-transform: uppercase;
}

.highlight {
    background-color: Yellow;
}

.grid_cell_highlight {
    background-color: #DFEEFF;
}
.grid_cell:hover,
.grid_cell_highlight:hover {
    background-color: #FFA500!important;
    color:white!important;
    cursor:pointer;
}
/* 9207 Do not display Clear icon on entry forms Edge browser */
input[type=text]::-ms-clear { 
    display: none; 
}


/* John Responsive */
   .ToolbarSearch {
        display: table-cell;
    }
   
.col-man {
  float: left;
  width: 5%;
  margin-top: 6px;
}

/* Floating column for inputs: 15% width */
.col-title {
  float: left;
  width: 15%;
  margin-top: 6px;
}

.col-entry {
  float: left;
  width: 75%;
  margin-top: 6px;
}
.col-warning {
  float: left;
  width: 75%;
  margin-top: 6px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - when the screen is less than 576px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 576px) {
 .col-entry, .col-warning {
    width: 100%;
    margin-top: 2px;
  }
}
/* Dont make full width so that the mandatory div stays on same line */
@media screen and (max-width: 576px) {
    h1, h2, h3, h4, h5, h6 {
        font-size: 1.5em;

    }

    /* make the popup header larger*/
    .dxpcLite_Metropolis span.dxpc-headerText, .dxpcLite_Moderno span.dxpc-headerText .dxpcLite_Office365 span.dxpc-headerText {
        font-size: 1.1em !important;
    }
 .col-title {
    width: 50%;
        margin-top: 2px;

  }
    .col-man {
        width: 2%;
            margin-top: 2px; 
    }

    .ToolbarSearch {
        display: none;
    }
}


@media screen and (max-width: 576px) {
    .mobilenoshow {
        display: none;
    }
}