/* Styles dependend on device
-----------------------------------------------------------*/ 
.HideOnNonMobile {
    display: none;
}

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error
{
    color: #ff8000;
    width: 100%;
}

.field-validation-valid
{
    display: none;
}

.input-validation-error
{
    border: 1px solid #ff8000;
    background-color: #FFE5CC;
}

.validation-summary-errors
{
    font-weight: bold;
    color: #ff8000;
}

.validation-summary-valid, .Hidden
{
    display: none;
}

/* -- Global -----------------------------------------------------*/

html, body {
    background-color: #F0F0F0;
    font-family: Arial,Sans-Serif;
    font-size: 14px; 
    height: 100%;  /*18.9. 100vh  */
    margin: 0;
    padding: 0;
    width: 100%; 
    overflow:hidden;
    box-sizing:border-box; 
}
body {
    min-height: 100%;
}

p, h2, ul
{
    margin-top:0px;
}

.TextContainer
{
    padding-left:7px;
    padding-top:10px;
}

.Justify {
    text-align:justify;
}

h2
{
    font-size:16px;
}

.checkbox
{
    background: url("checkbox.png") no-repeat scroll 0 0 transparent;
    clear: left;
    display: block;
    float: left;
    height: 23px;
    padding: 0 5px 0 0;
    width: 18px;
}

#LowLevelContainer
{
    width:100%;
    height: calc(100% - 41px);
    background-image: url(hor_sprites.png);
    background-repeat: repeat-y;
    background-position:-255px 0px;
    background-color:#f0f0f0;
    /*padding-top:20px;*/
}
.BgContainer
{
    margin-left:45px;
    margin-right:35px;
}
.body_container {
    background-color: #f0f0f0;
    padding:0;
    margin:0;
    height:100%;
    width: 100%;
    background-image: url(hor_sprites.png);
    background-repeat: repeat-y;
    background-position:-255px 0px;
    position:relative;
    overflow: hidden;
}
.body_container .content {
    height: calc(100% - 20px); /* no Logo */
    overflow: auto;
}

#MainContentContainer {
    height: calc(100% - 130px);
    /* width: calc(100% - 80px);  margins of .BgContainer*/
}
 
#AssessmentStatisticsContainer, #SuggestionTableContainer {
    overflow: auto;
}

.BgContainer.LeftAlign
{
    margin-left:0px;
}

.BgContainer .White
{
    background-color:White; /* #f0f0f0; */
}

.GrayBackgroundSeparator
{
    background-color:transparent;
    height:15px;
}
/*
.ListItemTitle
{
    height:40px;
    text-align: left;
    font-size:28px;
    color:#7994bc;
    float:left;
    width:100%;
}


.ListItemButton
{
    background-color:#1f4c8f;
    border-top-style:solid;
    border-top-color:White;
    border-top-width:2px;
    border-bottom-style:solid;
    border-bottom-color:White;
    border-bottom-width:2px;
    height:31px;
    width:333px;
    text-align:center;
    color:White;
    font-size:15px;
    padding-top:13px;
    text-decoration: none;
    float:left;
    position:relative;
    left:-60px;
}*/

/* Source: http://www.teddillard.com/2010/02/dumb-stuff-waiting-gifs.html
 * http://www.teddillard.com/graphics/timergifs/bluespinner.gif
 */
.WaitingBlue
{
    background-image: url(waiting_blue.gif);
    background-repeat: no-repeat;
    height: 48px;
    width: 48px;
}

#languagePicker, .LanguagePickerLanguageList
{
    width: 115px;
}

.LanguagePickerLanguageList, .SubMenuButtonContainer, .LogOutPickerSelectedOptionList
{
    z-index: 1001;
}

.LanguagePickerLanguage, .LogOutPickerChangeWorkPlace
{
    float: left;
    padding-top: 3px;
    background-color:Black;
    opacity:0.6;
    filter:alpha(opacity=60); /* For IE8 and earlier */
    color:#d3d3d3;
}

.LanguagePickerLanguage
{
    height: 17px;
    width: 110px;
    padding-left: 5px;
}

.LanguagePickerLanguage:hover, .LogOutPickerChangeWorkPlace:hover
{
    opacity:0.7;
    filter:alpha(opacity=70); /* For IE8 and earlier */
    color:White;
}

.LogOutPickerChangeWorkPlace
{
    height: 34px;
    width: 88px;
    padding-left: 2px;
    text-align:center;
}

.LanguagePickerLanguage:hover, .LogOutPickerChangeWorkPlace:hover
{
    background-repeat: repeat;
    color:White;
}

.LanguagePickerLanguageList, .LogOutPickerSelectedOptionList
{
    position: absolute;
    visibility: hidden;
    top: 20px;
}

#languagePickerSelectedLanguage
{
    height:100%;
    cursor: pointer;
}

#languagePickerSelectedLanguageText
{
    height:17px;
    padding-left: 5px;
    padding-top:3px;
    float:left;
}

#languagePickerTriangle
{
    float: left;
    height: 17px;
    padding-left: 10px;
    width: 5px;
}
.TriangleDown
{
    background-image: url(icons.png);
    background-position: -30px -632px;
    background-repeat: no-repeat;
}
.TriangleUp
{
    background-image: url(icons.png);
    background-position: -27px -676px;
    background-repeat: no-repeat;
    float: left;
    height: 17px;
    padding-left: 10px;
    width: 5px;
}


#languagePicker
{
    height:100%;
    float: right;
    color: White;
    text-align: left;
}

#topHeader2_Title
{
    text-align: left;
    font-size:1.5rem;  /* font-size:24px; 18.9.23*/
    color:#7994bc;
    height:35px;
    overflow: hidden;
    padding-bottom:5px;
}



input[type=text], input[type=password], textarea, select
{
    background-color: White;
    background-image: url("buttons.png");
    background-position: 0px -934px;
    background-repeat: repeat-x;
    border-color: #A7A7A7 #C6C6C6 #C6C6C6;
    border-style: solid;
    border-width: 1px;
    padding-left: 7px;
    width: 100%;
    font-family:Arial;
   /* font-size:12px; 4.8.23*/
   font-size:1rem;
   
}

input[type=text], input[type=password], select
{
    /*height:20px; 4.8.23*/
}

.editor-container, .editor-container-silent
{
    width:100%;
}

.editor-container-silent
{
    height:23px;
    display:table;
}

.editor-container
{
    display: inline-block;
    padding: 5px 0 5px 0;
    /*background-color:#e2e2e2;
    border-top: 1px solid Black;
    border-bottom: 1px solid Black;*/
}

.editor-label
{
    font-size: 1rem;
    font-weight:bold;
    white-space:nowrap;
    color:Black; /* #7f7f7f; */
    /*padding-top:13px;*/
    display: inline-block;
}

.editor-field
{
    /*padding-top:2px; 4.8.23*/
    display: inline-block;
    max-width: 100%;
}

.editor-container-silent .editor-label
{
    display:table-cell;
    vertical-align:middle;
}

.CheckBox
{
    width:18px;
}

.ChbxCentred
{
    margin-left:auto; 
    margin-right:auto;
}

.editor-field input, .editor-field select, .editor-container textarea
{
    font-weight:bold;
}

.editor-label-big-pencil
{
    background-image:url(pencil.png);
    background-repeat:no-repeat;
    background-position:9px 1px;
    width:35px;
    height:30px;
}


#Suggestion {
    height: 2.5em;
}

#LinkForSharingImage {
    display:table-cell;
    background-image: url('link_ico.png');
    background-repeat:no-repeat;
    width:20px;
    height:20px;
    position:absolute;
    padding:2px;
}
#LinkToSurvey, #PublickRegistrationUrl, #LinkToAssessment {
    padding-left:25px;
}

.InputContainerLeft {
    width: 300px;
}

.InputContainerLeftLarge {
    width: 500px;
}

/* -- ToolTip on Hoover ----------------------------------------------*/

.tooltip 
{
  position: relative;
  display: inline-block;
  padding: 2px;
  cursor: help;
}

.tooltip .tooltiptext 
{
  visibility: hidden;
  width: 120px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;
  opacity: 0;
  transition: opacity 0.3s;
}

.tooltip .tooltiptext::after 
{
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}
#ExcellenceReport .tooltip .tooltiptext::after , #WLFRep .tooltip .tooltiptext::after
{
  display: none;
}
#ExcellenceReport .tooltip .tooltiptext::before 
{
  content: "";
  position: absolute;
  top: -10px;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent #555 transparent;

}
#WLFRep .tooltip .tooltiptext::before 
{
  content: "";
  position: absolute;
  top: 10px;
  margin-left: -28px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent  #555 transparent transparent;
  height: auto;
}

.tooltip:hover .tooltiptext 
{
  visibility: visible;
  opacity: 1;
}

#Glossary .tooltip {
	font-size:1rem; /* 14px */
	font-weight:bold;
}
#Glossary .tooltiptext {
	width:400px; 
}

/* -- Buttons ----------------------------------------------*/

button
{
    border-width:0px;
    float:left;
    cursor:pointer;
    padding-top:12px;
    background-color:transparent;
    padding:0px;
    margin-right:7px;
    height:26px;
}

.ButtonContainerArea
{
    height:30px;
    margin-top:7px;
}

.ButtonContainerAreaBig
{
    height:60px;
    margin-top:7px;
}

.ButtonLong
{
    width:255px;
}

a.BlackButton, a.OrangeButton, a.BlueButton, div.BlackButton, div.OrangeButton, div.BlueButton, div.GrayButton, div.WhiteButton
{
    text-decoration:none;    
    float:left;
    margin-right:7px;
    height:26px;
}

.ButtonContainer .TextCell, .ButtonContainer .IconCell
{
    display:table-cell;
    vertical-align:middle;
    margin-top: 10px;
}

.ButtonContainer .IconCell .IconContainer
{
    background-image:url(icons.png);
    background-repeat: no-repeat;
    height:20px;
    width:24px;
    float:right;
}

.ButtonContainer .IconCell
{
    padding-left: 5px;
}

.ButtonContainer .TextCell
{
    padding-right: 5px;
    text-align:left;
}

.ButtonContainer .LeftSide, .ButtonContainer .RightSide
{
    display: none;
    /*display:table-cell;
    width:2px;
    background-repeat:no-repeat;
    background-image:url("buttons.png");*/
}

button[type=submit], input[type=submit]
{
    padding-top:0px;
    margin-left:0px;
}

#BtnAcceptAveragesContainer 
{
    width:auto; 
    margin:0px auto; 
    display:table;
}
#BtnAcceptAveragesContainer.Hidden
{
    width:auto; 
    margin:0px auto;
    display:none;
}

/*Fix FF level with other buttons.
This is needeed because Firefox (User Agent) own CSS style uses !important and anything one tries to do to override the CSS property won't get applied*/
button[type=submit]::-moz-focus-inner 
{ 
    border:0; 
    padding:0 
}


.ButtonContainer
{
    /*background-image:url("buttons.png");
    background-repeat:repeat-x;*/
    display:table;
    margin-left: auto;
    margin-right: auto;
    min-height: 26px;
    vertical-align:middle;
    color:White;
    cursor:pointer;
    width:100%;

}

button .ButtonContainer
{
    /*height:26px;*/
}

.ButtonContainerBig
{
    min-height:50px;
}

.WhiteButton .ButtonContainer .LeftSide
{
    background-position:0px -830px;
}

.WhiteButton .ButtonContainer .RightSide
{
    background-position:0px -856px;
}

.WhiteButton .ButtonContainer
{
    background-image: linear-gradient(#ffffff, #d3d3d3);
    background-position: initial;
    border: 1px solid #878787;
    border-radius: 4px;
    box-sizing: border-box;
    font-weight: bold;
/*  background-position:0px -882px; */
    color:Black; 
}

.WhiteButton .ButtonContainer:hover
{
    /*background-position:0px -908px; */
    background-image: linear-gradient(#d3d3d3, #ffffff);

}

.OrangeButton .ButtonContainer .LeftSide
{
    background-position:0px 0px;
}

.OrangeButton .ButtonContainer .RightSide
{
    background-position:0px -26px;
}

.OrangeButton .ButtonContainer, .OrangeButtonBig .ButtonContainer
{
    background-image: linear-gradient(#eb7c2f, #c55306);
    background-position: initial;
    border: 1px solid #803300;
    border-radius: 4px;
    box-sizing: border-box;
    color: #FFFFFF;
    font-weight: bold;
    /*
    background-position:0px -52px;
    font-weight:bold;*/
}

.OrangeButton .ButtonContainer:hover, .OrangeButtonBig .ButtonContainer:hover
{
    /*background-position:0px -78px;
    font-weight:bold; */
     background-image: linear-gradient(#c55306, #eb7c2f);
}

.OrangeButton.Normal .ButtonContainer
{
    font-weight:normal;
}

.OrangeButtonBig, .OrangeButtonBig .ButtonContainer, .GrayButtonBig, .GrayButtonBig .ButtonContainer
{
    height:50px;
    font-weight:bold;
}

.OrangeButtonBig.Normal .ButtonContainer 
{
    font-weight:normal;
}

.OrangeButtonBig .ButtonContainer .LeftSide
{
    background-position:0px -352px;
}

.OrangeButtonBig .ButtonContainer .RightSide
{
    background-position:0px -402px;
}

.OrangeButtonBig .ButtonContainer
{
    /*background-position:0px -452px;*/
}

.OrangeButtonBig .ButtonContainer:hover
{

    /*background-position:0px -502px;*/
}

.GrayButton .ButtonContainer .LeftSide
{
    background-position:0px -702px;
}

.GrayButton .ButtonContainer .RightSide
{
    background-position:0px -728px;
}

.GrayButton .ButtonContainer, .GrayButtonBig .ButtonContainer
{
    background-color: #878787;
    border: 1px solid #FFFFFF;
    border-radius: 4px;
    box-sizing: border-box;
    color: #FFFFFF;
    /*     background-position:0px -754px;    */
}

.GrayButtonBig .ButtonContainer .LeftSide
{
    background-position:0px -552px;
}

.GrayButtonBig .ButtonContainer .RightSide
{
    background-position:0px -602px;
}

.GrayButtonBig .ButtonContainer 
{
    /*    background-position:0px -652px;    */
}


.BlackButton .ButtonContainer .LeftSide
{
    background-position:0px -104px;
}

.BlackButton .ButtonContainer .RightSide
{
    background-position:0px -130px;
}

.BlackButton .ButtonContainer
{
    background-position:0px -156px;
   /* background-image: linear-gradient(#3A5FCD, #2740BB);
    background-position: initial;
    border: 1px solid #2740BB;
    border-radius: 4px;
    box-sizing: border-box;
    color: #FFFFFF;
    font-weight: bold;*/
}

.BlackButton .ButtonContainer:hover
{
    background-position:0px -182px;
}


.BlueButton .ButtonContainer .LeftSide
{
    background-position:0px -208px;
}

.BlueButton .ButtonContainer .RightSide
{
    background-position:0px -234px;
}

.BlueButton .ButtonContainer
{
    /*background-position:0px -260px;*/
    background-image: linear-gradient(#4682B4, #36648B);
    background-position: initial;
    border: 1px solid #4A708B;
    border-radius: 4px;
    box-sizing: border-box;
    color: #FFFFFF;
    font-weight: bold;
}

.BlueButton .ButtonContainer:hover
{
       /*background-position:0px -286px;*/
     background-image: linear-gradient(#36648B, #4682B4);
}

.ButtonContainer .IconCell .Cancel
{
    background-image:url(icons.png);
    background-position:0px -756px;
}

.ButtonContainer .IconCell .LogIn
{
    background-image:url(icons.png);
    background-position: -30px -756px;
}

.ButtonContainer .IconCell .Save
{
    background-image:url(icons.png);
    background-position:0px -735px;
}

.ButtonContainer .IconCell .Download
{
    background-image:url(icons.png);
    background-position:0px -715px;
}

.ButtonContainer .IconCell .GoToAssessment
{
    background-image:url(icons.png);
    background-position:0px -637px;
}

.ButtonContainer .IconCell .Home
{
    background-image:url(icons.png);
    background-position:0px -777px;
}

.ButtonContainer .IconCell .Consolidate
{
    background-image:url(icons.png);
    background-position:0px -656px;
}

.ButtonContainer .IconCell .Report
{
    background-image:url(icons.png);
    background-position:0px -676px;
}

.ButtonContainer .IconCell .Download
{
    background-image:url(icons.png);
    background-position:0px -716px;
}

#ForgetPswContainer
{
    margin-top:35px;
    padding-top:10px;
}

#logOutIcon
{
    float:left;
    width:20px;
    height:20px;
    margin-left:7px;
    margin-right:7px;
    background-image:url(icons.png);
    background-position:5px -839px;
    background-repeat: no-repeat;
}

.quest-ico
{
    background-image:url(quest_ico.png);
    background-repeat: no-repeat;
    padding: 5px 10px;
    cursor: help;
}

#StrengthsReportButton, #AreasOfImprovementReportButton 
{
    float:none;
    font-size:13px;
}
#StrengthsAndAreasOfImprovementReportButton 
{
    float:left;
    font-size:13px;
}

.ButtonHolder
{ 
    display:inline-block;
}

/* -- Top header -------------------------------------------------*/

#topHeader
{
    background-image: url("buttons.png");
    background-position: 0 -312px;
    background-repeat: repeat-x;
    clear: both;
    /*float: left;*/
    height: 20px;
    text-align: right;
    width: 100%;
}

#topHeaderText1, #topHeaderText2, #topHeaderText3, #topHeaderText_IsRespondent, #topHeaderText_NotLoggedIn
{
    float: left;
    color:#BCC9DD;
    padding-top:2px;
    padding-left:5px;
    height:18px;
}

.TableHeader
{
    font-size: 18px;
    color:#BCC9DD;
}

#topHeaderText2
{
    font-weight:bold;
}

#topHeaderText2, #topHeaderText3
{
    color:White;
}

#topHeaderFontSize
{
    float: right;
    padding-right:10px;
}

#topHeaderHome
{
    background-image: url("buttons.png");
    background-position: 0 -332px;
    background-repeat: repeat-x;
    float: left;
    height: 20px;
    width: 45px;
}

#topHeaderHomeIcon
{
    background-image: url("icons.png");
    background-position: -2px -777px;
    background-repeat: no-repeat;
    height: 18px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2px;
    width: 15px;
}

#topHeaderHomeLink
{
    display:block;
    position:relative;
    width:100%;
    height:100%;
    top:-100%;
}

#logOutButton
{
    float: right;
    width: 125px;
    background-image: url(buttons.png);
    background-position: 0px -332px;
    background-repeat: repeat-x;
    text-align:left;
    height:20px;
    color:White;
}

#logOutButton a
{
    text-decoration:none;
    color:White;
}

.LogOutPickerSelectedOptionList
{
    width: 77px;
}

#LogOutPickerSelectedOptionText
{
    height:100%;
}

#LogOutPickerSelectedOption
{
    height:17px;
    padding-top:3px;
}

/* -- Main footer -------------------------------------------------------*/

#mainFooter {
    bottom: 0;
    font-size: 10px;
    height: 18px;
    position: absolute;
    width: 100%;
}

#FooterLogo
{
    height:60px;
    width:157px;
    background-image: url(footer_logo.png);
    background-repeat: no-repeat;
    margin: 4px;
    bottom: 20px;
    position: absolute;
    left: 50px;
    width: 160px;
}
#mainFooter .Row {
    display: block;
}

#mainFooter #mainFooterTextContainer {
    background-color: #4167A0;
    bottom: 0;
    height: 18px;
    position: absolute;
    width: 100%;
}

#mainFooter #mainFooterText {
    color: White;
    padding-left: 11px;
    padding-top: 3px;
}

/* -- Home Index -------------------------------------------------*/

#Home_LeftSide
{
    padding-left: 52px; /* 45 + 7 */
    padding-right: 52px;
    /*width: 300px;*/
}

/* -- Home ForgotPassword -------------------------------------------------*/

#ForgotPasswordArea, #ChangePasswordArea
{
    width: 300px;
}

#EmailHasBeenSent
{
    font-weight:bold;
}

/* -- Captcha ----------------------------------------------*/
.CaptchaArea
{
    width: 300px;
}
.CaptchaArea img
{
    padding:13px 0 0 50px;
}

/* -- Buttons ----------------------------------------------*/
.ButtonIconContainer
{
    display:table;
    margin-left: auto;
    margin-right: auto;
    height: 16px;
}

.ButtonIconCell
{
    width:20px;
    background-repeat:no-repeat;
    background-position: 0px 2px;
}

.ButtonTextCell, .ButtonIconCell
{
    display:table-cell;
    vertical-align:top;
}

.ButtonIconSubmit
{
    background-position:-29px -757px;
}

.ButtonIconCancel
{
    background-position:0px -757px;
}

.ButtonIconSave
{
    /* Old icon
    background-position:-26px -802px; */
    background-position:0px -735px;
}

.ButtonIconSaveBig
{
    /* Old icon
    background-position:0px -802px; */
    background-position:0px -735px;
}

.ButtonIconDownload
{
    background-position:-2px -716px;
}

.ButtonIconSwitch
{
    background-position:-26px -737px;
}

.ButtonIconDelete
{
    background-position:-26px -777px;
}

.ButtonIconAdd
{
    background-position:-26px -696px;
}

.ButtonIconPencil
{
    background-position:-26px -657px;
}

.ButtonIconUndo
{
    background-position:-26px -716px;
}

.ButtonIconUnselectAll
{
    background-image:url(checkbox.png) !important;
    background-position:0px -1px;
}

.ButtonIconExpand, .ButtonIconCollapse
{
    background-image:url(icons.png);
    background-repeat: no-repeat;
    display: inline-block;
    width: 17px;
    height: 14px;
    margin-top:1px;
}

.ButtonIconExpand
{
    background-position:0px -617px;
}

.ButtonIconCollapse
{
    background-position:-27px -617px;
}

.ButtonIconOk
{
    background-position:0px -822px;
}

/* -- Tabbing ---------------------------------------------------------*/

.Tabbing.ImprovementPlanning .Button
{
    border-bottom-width: 0px;
    max-width: calc(35% - 25px);
    height: auto;
    display: block;
    float:left;
  
}
.Tabbing.ImprovementPlanning .Button {
    white-space:normal;
    display:block;
    height:auto;
}

.Tabbing, .ExpandedTabbing
{
    width:100%;
    border-bottom: 1px solid #c9c9c9;
    height:40px;
    display:inline-flex;
    white-space:nowrap;
    overflow-x:auto;
}

.Tabbing .Button, .ExpandedTabbing .Button
{
    border-top: 1px solid #c9c9c9;
    border-right: 1px solid #c9c9c9;
    padding-top: 5px;
    padding-right: 10px;
    padding-bottom: 5px;
    padding-left: 10px;
    text-decoration:none;
    color:#787878;
    background-color: #F0F0F0;
    cursor: pointer;
    display:inline-block;
}
.Tabbing .Button.Hidden, .ExpandedTabbing .Button.Hidden {
    display: none;
}

.Tabbing .First, .ExpandedTabbing .First
{
    margin-left:7px;
    border-left: 1px solid #c9c9c9;
}

.Tabbing .Selected, .ExpandedTabbing .Selected
{
    color: black;
    border-bottom:2px solid #F0F0F0;
    background-color: white;
    z-index: 200;
    cursor: default;
}

.Tabbing div.Button, .ExpandedTabbing div.Button {
    float: left;
}
.Tabbing a {
    text-decoration:none;
    color: black;
    word-break: break-all;
}
.Tabbing.ImprovementPlanning a {
    display: inline-block;
    height: 100%;  /* fill complete Button */
}

/* -- Assessment Details ----------------------------------------------*/
.CreateAssessmentContainer
{
    width:100%;
}

#Assessment_name, #Assessment_description
{
    min-width: 200px;
    max-width: 90%;
}
#Assessment_valid_till_date
{
    max-width: 100%;
}

.CriteriaSelectTable
{
    border-collapse:separate;
    border-spacing:0px;
    width:100%;
}

.AssessmentCriteria, .AssessmentCriteriaSelected, .AssessmentCriteriaCheckBoxArea
{
    padding-top:15px;
    height:30px;
    color:White;
    border-bottom: 2px solid white;
    vertical-align: middle;
}

.AssessmentCriteria, .AssessmentCriteriaCheckBoxArea
{
     background-image: url("criteria_transp.png");
    text-align:left;
    font-size:14px;
    cursor:pointer;
}

.AssessmentCriteriaSelected
{
    padding-left:0px;
    /*background-image:url("buttons.png");
    background-position:0px -455px;
    background-repeat:repeat-x;*/
    background-color:#CF5C15;
    text-align:center;
    font-size:16px;
}

.ButtonHelpText
{
    color:Gray;
    padding-left:15px;
}

.ChangeLeaderColumn
{
    width:225px;
}

.ActionsWithAssessorsColumn
{
    width:20px;
}

#TableAssessment, #TableConfigureAssessment
{
    width:100%;
    border-right-style:solid;
    border-right-width:35px;
    border-right-color:transparent;
    border-collapse:collapse;
}

#TableAssessment tr, #TableConfigureAssessment tr
{
    border-bottom: 1px solid Black;
    border-top: 1px solid Black;
}

#TableAssessment td, #TableConfigureAssessment td
{
    vertical-align:middle;
}

#TableReports
{
    width:100%;
}

.ReportingButtonCell
{
    width:230px;
}

#FillingOveralReportArea, #FillingIndividualReportArea, #ConsolidationOveralReportArea
{
    width: 100%;
    padding-top: 10px;
}
#FillingOveralReportArea {
    
}

#TableFillingStatistic
{
    width: 100%;
}

.TableFillingStatisticContainer
{
    padding-left:20px;
    padding-right:40px;
}

#AssessmentStatusContainer
{
	display:table; 
	width:100%; 
	padding-top:5px;
}
#AssessmentStatusLeft
{
	display:table-cell; 
	width:455px; 
	vertical-align:top;
}
#AssessmentStatusRight
{
	display:table-cell; 
	vertical-align:top;
}
#WebRepContainer {
    height: calc(100% - 30px);
}


/* -- Assessment Question Edit ----------------------------------------*/
textarea#Question, textarea#Context
{
    font-weight:normal;
}

#AssessmentEditForm, #SurveyEditForm
{
    padding-top:7px;
}

#AssignQuestionsForm
{
    padding-top:7px;
}

#btnNewQuestion, #btnResetToDefault, #btnDeleteQuestion
{
    float:left;
    margin-bottom:7px;
}


div.GroupList  {
    margin:10px 0px;
}

a.AutoCheck {
    cursor:pointer;
}
/* -- Assessor List ---------------------------------------------------*/

.ClickableAssessor
{
    cursor:pointer;
}
/* -- Assessor List ---------------------------------------------------*/
#dialog-form-ImportData {
    margin-top:10px;
    height: 300px;
    max-height: 20vh;
    border: 2px solid #C6C6C6;
    overflow: scroll;
}
#dialog-form-ImportData #tblAssessors td  
{
    padding-right:5px;
}

/* -- Assessment Fill -------------------------------------------------*/
#Fill-RegionContainer {
    height: 100%;
    width: calc(100% - 35px);
}

#Fill-Region {
    display:table; 
    width:100%;
    height:inherit;
}
#Fill-RegionCriteria {
    display:table-cell;
    width:220px;
    height:inherit;
    overflow-y:auto;
}
#Fill-RegionQuestions {
    display:table-cell;
    vertical-align:top;
    height:inherit;
    overflow-y:auto;
}
#Fill-RegionAssessment {
    display:table-cell; 
    width:400px; 
    padding-left:7px; 
    vertical-align:top;
    height:inherit;
}
#Fill-RegionCriteria .CriteriaSelectTable {
    display:table; 
    position:relative; 
    /*left:-5px; */
    /*padding-right:17px; */
    /*padding-left:7px; */
    /*height:100% */
}
#Fill-RegionAssessment #rightCell {
    width: 400px;
    /*position: fixed;*/
    z-index: 999;
}



.AssessmentCriteria, .AssessmentCriteriaCheckBoxArea
{
    width:90%;
}

.AssessmentCriteriaSelected
{
    text-align:left;
    border-top: 2px solid White;
}

.Question, .QuestionAnswered, .QuestionSelected
{
    color:Black;
    width:100%;
    cursor: pointer;
    padding: 5px;
    border-top: 1px solid #C6C6C6;
    box-sizing: border-box; /*copied PEX*/
     background-color: White; /*copied PEX*/
}

.FirstQuestion
{
    border-top: 0px;
}

.QuestionAnswered
{
    color:Gray;
}

.QuestionDeleted
{
    text-decoration:line-through;
}

.QuestionSelected, .contextQuestion
{
    color:Black;
    background-color: #d2def1; /*copied PEX*/
    /*background-color:#8fa5c7;
    font-weight:bold;*/
    border-top: 1px solid Black;
    border-bottom: 1px solid Black;

}
.col3Container
{
    width:285px;
    margin-left:10px;
}
.contextBox {
    margin-bottom:10px; 
    border-top: 1px solid Black;
    border-bottom: 1px solid Black;
}
.contextBoxCriterion 
{
    color:#1F4C8F;
    background-color:White; 
    border: 2px solid orange;
    padding:5px;
}
.contextBoxQuestion
{
    color:Black;
    background-color: #b3c6e4;
    border-top: 1px solid Black;
    border-bottom: 1px solid Black;
}
.contextHeader
{
    width:100%;
    /*height:17px;*/
    padding-top:6px;
    padding-left:6px;
    padding-bottom:6px;
    color:Black;
    text-align:left;
    /*font-size:1.1rem; 
    font-weight:bold;*/
}
.contextQuestion {
    max-height:150px; 
    overflow-y:auto;
    overflow-x:hidden;
    padding:6px;
}

.context ul {
    padding-left: 20px;
    padding-right: 0;
    margin-bottom: 6px;
}

.context li {
margin: 5px 0 0 0;
}

#contexField {
    color:white;
    margin-bottom: 10px;
    background-color:#8fa5c7;
    border-top: 1px solid Black;
    border-bottom: 1px solid Black;    
}

#contextHeader {
    max-height:150px; 
    overflow-y:auto;
    overflow-x:hidden;
}

.contextFieldHeader
{
    width:100%;
    height:17px;
    padding-top:6px;
    padding-left:6px;
    text-align:left;
    font-size:16px;
    font-weight:bold;
}

#contextFieldText
{
    padding:6px;
}

.AssessmentScoringTitle
{
    margin-left:10px;
    margin-top:10px;
    font-weight:bold;
}

#SelectedAssessmentValue, #SelectedUrgencyValue
{
    margin-left:10px;
    width: 290px;
    background-color:#8fa5c7;
}

#EvidencesForm #btnSaveEvidences
{
    float:right;
}

#EvidencesForm table tbody tr th 
{
    background-color:#CCCCCC;
}

#EvidencesForm table tbody tr td textarea 
{
    padding-left:0;
}

#EvidencesForm table
{
    padding-top:10px;
}
#dialog-form-Suggestions #selectedQuestionText 
{
    margin: 5px 0 10px 0;
    padding:10px; 
    background-color:#8fa5c7;
    border: 1px solid Black;
    font-weight:bold;
}

/* --- Assessment scoring ----------------------------------*/

.AssessmentStatisticsTitle
{
    color:#1F4C8F;
    font-weight:bold;
    font-size:16px;
    padding-bottom: 25px;
}

.ProgressBarContainer
{
    color:#1F4C8F;
    font-weight:bold;
    font-size:16px;
    float:right;
    width:400px;
}

.AssessmentScoring, .UrgencyScoring
{
    width:100%;
    text-align:center;
    border: none;
    padding: 0;
    margin: 0;
    border-collapse: collapse;
    border-width: 0px;
}

.AssessmentScoring .FirstColumn, .AssessmentScoring .LastColumn, .UrgencyScoring .FirstColumn, .UrgencyScoring .LastColumn
{
    width:30px;
}

.AssessmentScoringArray, .UrgencyScoringArray
{
    width:10px;
    background-repeat:no-repeat;
    background-position:0px 30px;
}

.AssessmentScoringArrayLeft, .UrgencyScoringArrayLeft
{
    background-image:url(icons.png);
    background-position:0px -60px;
    cursor:pointer;
}

.AssessmentScoringArrayRight, .UrgencyScoringArrayRight
{
    background-image:url(icons.png);
    background-position:-33px -60px;
    cursor:pointer;
}

.AssessmentScoring .ArrayRightReadOnly, .AssessmentScoring .ArrayLeftReadOnly
{
    background-color:White;
}

.AssessmentScoring .ScoringRow, .UrgencyScoring .ScoringRow
{
    height:11px;
    background-image:url(buttons.png);
    background-position:0px -780px;
    background-repeat:repeat-x;
}

.AssessmentScoring .ScoringRowSelected
{
    height:20px;
    background-color:#D6D6D6;
}

.AssessmentScoring .ScoringCellSelected, .UrgencyScoring .ScoringCellSelected
{
    height:11px;
    background-image:url(buttons.png);
    background-position:0px -805px;
    background-repeat:repeat-x;
}

.AssessmentScoring .ScoringCellSelectedReadOnly
{
    background-color:#5C7DAD;
}

.ScoringRow .NameColumn
{
    background-color:#F0F0F0;
    width:42%;
    text-align:left;
    overflow:hidden;
    padding-left:5px;
}

.ScoringRowSelected .NameColumn
{
    text-align:left;
    overflow:hidden;
    padding-left:5px;
}

.AssessmentScoring td, .AssessmentScoring td, .UrgencyScoring td, .UrgencyScoring td
{
    height:16px;
    padding:0px;
}

.ScoringLabelLineRow
{
    font-size:10px;
    height:13px;
}

.ScoringLabelValueRow, .ScoringLabelValueRow td, .ScoringLabelValueRow td div
{
    height:16px;
    overflow:hidden;
    cursor: pointer;
}

.ScoringLabelValueSelected
{
    color:#FF6600;   
    font-weight:bold; 
}

.ScoringLabelValueSelectedConstant
{
    color:#FF6600;
}

.ScoringLabelLineRow td
{
    height:9px;
    padding-top:0px;
    padding-bottom:0px;
    font-size:6px;
}

.AssessmentScoring .ScoringButtonContainer, .UrgencyScoring .ScoringButtonContainer
{
    border: 0px;
    height:18px;
    width:0px;
    display:inline-block;
}

.AssessmentScoring .ScoringButton, .UrgencyScoring .ScoringButton
{
    position:relative;
    left:-12px;
    top:-10px;
    height:30px;
    width:26px;
    background-repeat:no-repeat;
    background-image:url(icons.png);
    background-position:0px 0px;
}

.ScoringButtonMovable
{
    cursor:pointer;
}

.DescriptionOfValue
{
    background-color:#e5e5e5;
    color:Black;
    padding: 5px;
    overflow:hidden;
    margin-left:2px;
    border: 1px solid #bebebe;
    background-image:url(ScoreDescriptionBg.png);
    background-repeat:repeat-x;
}

.DescriptionOfValue.Error
{
    color:Red;
    font-weight: bold;
}

.DescriptionOfValueArray
{
    padding: 0px;
    height:6px;
}

.DescriptionOfValueArray .Array
{
    background-image:url(icons.png);
    background-position:-29px -683px;
    background-repeat:no-repeat;
    height:6px;
    width:15px;
    position:relative;
    top:1px;
    left:10px;
}

/* --- Conslidation ----------------------------------*/
#Consolidate-RegionContainer {
    height: 100%;
    width: calc(100% - 80px);
    overflow:auto;
}

#ConsolidateAssessmentTab, #ConsolidateSuggestionTab
{
    width:100px;
}

.GrayTest
{
    color: #787878;
}

.BoldTest
{
    font-weight: bold;
}

.LineSeparator
{
    border-bottom: 1px solid #C9C9C9;
    height: 10px;
    width: 100%;
}

#questionPickerSectionContainer
{
    margin-left:90px;
    margin-right:45px;
}

#btnNextQuestion, #btnNextCriterion
{
    padding-top:0px;
    width:120px;
    float:right;
}

.ConsolidationLabel
{
    padding-top:10px;
    font-weight:bold;
}

.ConsolidationDropDownList
{
    width:100%;
}

.ConsolidationDropDownList select
{
    width:100%;
    background-color:#8fa5c7;
    border-top: 1px solid Black;
    border-bottom: 1px solid Black;
}

#questionField
{
    background-color:White;
    height:63px;
    padding: 6px;
    font-size:17px;
    border-top: 1px solid Black;
    border-bottom: 1px solid Black;
}

.TabPageDescription
{
    font-weight:bold;
    padding:5px;
    width:100%;
    color:#1f4c8f
}

.ConsolidationColumn1 .DescriptionOfValue
{
    height:auto;
    overflow:auto;
}


/* --- Statistic scoring ----------------------------------*/
.Statistics
{
    display:table;
    width:100%;
    height:11px;
}

.Statistics .Left
{
    display:table-cell;
    width:4px;
    height:11px;
    background-image:url('icons.png');
    background-position:-24px -90px;
    background-repeat:no-repeat;
}

.Statistics .Right
{
    display:table-cell;
    width:4px;
    height:11px;
    background-image:url('icons.png');
    background-position:-42px -90px;
    background-repeat:no-repeat;
}

.Statistics .Bg
{
    display:table-cell;
    height:11px;
    background-image:url(buttons.png);
    background-position:0px -780px;
    background-repeat:repeat-x;
}

.Statistics .LeftSelected
{
    display:table-cell;
    width:4px;
    height:11px;
    background-image:url(icons.png);
    background-position:0px -90px;
    background-repeat:no-repeat;
}

.Statistics .RightSelected
{
    display:table-cell;
    width:4px;
    height:11px;
    background-image:url(icons.png);
    background-position:-18px -90px;
    background-repeat:no-repeat;
}

.Statistics .Bg .Selected
{
    height:11px;
    background-image:url(buttons.png);
    background-position:0px -805px;
    background-repeat:repeat-x;
    float:left;
}
/*
table.DataTable 
{
    border: 2px single black; 
    border-collapse: collapse;
    width: 100%;
    margin-top: 5px;
    margin-bottom: 10px;
}

table.DataTable tr
{
    height:31px;
}
    */

table.DataTable td, table.dataTable td, table.dataTable tbody > tr > td
{
    padding: 3px 3px 3px 8px;
    vertical-align: middle;
}

.PersonalWeb table.dataTable td
{
    vertical-align:baseline;
}

table.DataTable th, table.dataTable th, table.dataTable > thead > tr > th
{
    padding: 3px 3px 3px 8px;
    vertical-align:bottom;      /* 2024-03-25 middle */
    text-align:left;
    color:White;
    background-color:#9fb4d3;
    background-image: url(icons.png);
    background-position:0px -864px;
    background-repeat: repeat-x;
}

table.DataTable th .Header, table.dataTable th .Header
{
    padding-top:6px;
    width:101%;
}

table.DataTable th .Header Triangle
{
    display:inline-block;
}

table.DataTable th .Separator
{
    position:relative;
    left:-8px;
    top:-2px;
    float:left;
    height:30px;
    width:2px;
    background-image: url(hor_sprites.png);
    background-position:-164px 0px;
    background-repeat: no-repeat;
}

table.DataTable .even, table.DataTable > tbody > tr:nth-child(2n+1)
{
    background-color: #d4dde9;
}

table.DataTable .odd, table.DataTable > tbody > tr:nth-child(2n)
{
    background-color: #e1e7f0;
}

td ul
{
    padding-left:20px;
}

table input[type=text]
{
    width: 98%;
}

table .ButtonCell 
{
    text-align:center; 
    vertical-align:middle;
}

/* http://csscreator.com/node/28948 */
input[readonly], textarea[readonly], select[disabled]
{
    background: #d4d0c8;
}

select
{
    width: 100%;
}

/*
input[type=text], input[type=password]
{
    width: 95%;
}
*/

/* Position date picker icon inside text box on right side */
.ui-datepicker-trigger
{
    position:relative;
    float:right;
    top: 2px; /*-19px;  */      
    left: -15px; /*-4px;   */ 
}

table .Centred 
{
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}

.ChangeFontSize1, .ChangeFontSize2, .ChangeFontSize3
{
    padding-left: 4px;
    color:White;
}

.ChangeFontSize1
{
    font-size:10px;
}

.ChangeFontSize2
{
    font-size:11px;
}

.ChangeFontSize3
{
    font-size:13px;
}

/* -- Dialogs
-------------------------------------------------------------------------*/

.ui-widget textarea, .ui-widget table
{
    width: 99%;
}

.ui-widget .CheckBoxCell
{
    width: 20px;
}

.PopupButtonContainerArea
{
    height:30px;
    margin-top:7px;
    margin: 10px auto 0px auto; 
    display:table;
}

.PopupTextArea
{
    text-align:center;
}

/* -- Assessment header -------------------------------------------------*/

#assessmentHeader
{
    width:100%;
    height:20px;
    background-image:url(BG_grei.png);
    background-repeat: repeat-y;
    padding-top: 4px;
}

.MainMenuDropDownButton, .MainMenuButton, .MainMenuButtonLast
{
    width:190px;
    height:23px;
    background-image:url(BG_main_menu.png);
    background-repeat: repeat-y;
    text-align:center;
    font-size:18px;
    color:White;
    text-decoration: none;
    margin-right:13px;
    margin-left:0px;
}

.MainMenuButtonLast
{
    margin-left:1px;
    margin-right:0px;
}

.MainMenuButton
{
    float: left;
}

.MainMenuButtonDisabled
{
    Color: Gray;
}

/*
.ActionButton, .ActionButtonDisabled, input[type=submit].ActionButton
{
    width:140px;
    height:16px;
    text-align:center;
    font-size:14px;
    color:Black;
    text-decoration: none;
    margin-right:10px;
    margin-bottom:5px;
    margin-top:5px;
    border: 2px solid #96D550;
    padding: 3px;
    float: left;
}

.ActionButtonDisabled
{
    border: 2px solid Gray;
    color: Gray
}

input[type=submit].ActionButton
{
    background-color:White;
    width:150px;
    height:26px;
    padding-top: 0px;
    cursor: pointer;
}
*/

#jsddm
{	margin: 0;
	padding: 0; }

	#jsddm li
	{	float: left;
		list-style: none;
    }

	#jsddm li a
	{	display: block;
		text-decoration: none;
		white-space: nowrap;
	}

	#jsddm li a:hover
	{	background: #96D550; }
		
		#jsddm li ul
		{	margin: 0;
			padding: 0;
			position: absolute;
			visibility: hidden;
            }
		
			#jsddm li ul li
			{	float: none;
				display: inline}

			#jsddm li ul li a:hover
			{
			    background: #96D550;
			}

/* -- Assessment List -------------------------------------------------*/
.DeleteAssessment
{
    background-image: url("images/ui-icons_222222_256x240.png");
    background-position: -96px -128px;
    background-repeat:no-repeat;
    float:right;
    width:18px;
    height:16px;
    overflow:hidden;
    cursor:pointer;
}

#OpenAssessmentReportLink
{
    width:455px;
    height:200px;
    cursor:pointer;
    position:absolute;
}

/* -- Assessment Details ----------------------------------------------*/
.BusinesCardFrame
{
    float:left;
    border-top:2px solid Gray;
    width:100%;
    margin-bottom:20px;
}

.BusinesCardHeaderFrame
{
    width:100%;
    background-color:#96D550;
    padding:3px 0px 3px 0px;
    cursor: pointer;
}

.BusinesCardHeaderFrameTitleContainer
{
    font-weight:bold;
    padding-left: 5px;
    height:15px;
}

.BusinesCardHeaderFrameTitle, .BusinesCardCollapseButton
{
    float:left;
}

.BusinesCardCollapseButton
{
    width: 15px;
}



#questionSection
{
    float: left;
    width: 604px;
    padding-left:6px;
    height: 153px;
}

#questionSectionArea
{
    width: 100%;
    height: 100%;
    overflow-x:hidden;
    overflow-y:auto;
}

/*
#questionSectionArea .Question, #questionSectionArea .QuestionSelected, #questionSectionArea .QuestionAnswered
{
    overflow:hidden;
    height:14px;
}
*/

.assessmentValueAndUrgencySectionContainer
{
    width:100%;
    background-image:url(BG_grei2.png);
    background-repeat: repeat-y;
    padding: 3px 11px 3px 11px;
    float:left;
}

/* -- Goa/Improvement/Planning -------------------------------------------------*/

#SuggestionTable
{
    height:100%;
    margin-top: 0;
}

#SuggestionTable .Row
{
    display:table-row;
}

#SuggestionTable .HiddenRow
{
    display:none;
}

#SuggestionTable .FirstRow
{
    border-top-width:0px;
}


#FirstHeadCol 
{
    padding-top:0px;
    cursor :pointer;
}

.filterTriangle 
{
    background-image: url(icons.png);
    background-position: -30px -634px;
    background-repeat: no-repeat;
    padding-left: 15px;
}

#SuggestionTable .MouseHover, #SuggestionTable .SelectedRow, .SuggestionPrioritisationTable .MouseHover
{
    background-color:#d4dde9;
}

.SuggestionGroup
{
    margin-bottom:0px;
}

.SuggestionGroup .UnConsolidate, .RemoveIcon
{
    background-image:url(icons.png);
    background-position:-32px -779px;
    background-repeat:no-repeat;
    display: inline-block;
    height:12px;
    width:12px;
    cursor:pointer;
}

#SuggestionTable .CountOfSuggestions
{
    color:Gray;
    font-size:11px;
}

.SuggestionPrioritisationTable #SecondHeadCol, .SuggestionPrioritisationTable #FirstHeadCol, .SuggestionPrioritisationTable #GroupHeadCol
{
    cursor:pointer;
}
table.DataTable tr.MouseOut, table.DataTable tr.MouseOver
{
    cursor:pointer;
}

table.DataTable tr.MouseOver
{
    background-color:White !important;
}

table.CriteriaSelectTable tr.MouseOver
{
    background-color:#4167A0 !important;
}

table.DataTable tr.MouseOverBlue
{
    background-color:#d4dde9 !important;
}

td.ImprovementStatus0
{
    color:#4f73a7 !important;
}

td.ImprovementStatus6
{
    color:#FF6600 !important;
}

table.ImprovementDataTable
{
    font-weight:normal;
    margin-top:0px;
}

.TextContainer.ImprovementDataTable
{
    padding-right:7px;
    padding-bottom:20px;
}

table.ImprovementDataTable .ProjectOverwiev
{
    font-size: 18px;
    font-weight:normal;
    color:#BCC9DD;
}

table.ImprovementDataTable .FirstHederRow
{
    background-image:none;
    background-color:White;
    color:#7994BC;
}

table.ImprovementDataTable .LinkText
{
    color:#7994BC;
    text-decoration:underline;
    cursor: pointer;
}

table.ImprovementDataTable .c
{
    border-right: 1px solid #f4f4f4;
    padding:0px;
}

table.ImprovementDataTable .MarkedCell
{
    margin-top:3px;
    margin-bottom:3px;
    background-color:#d1d1d1;
    width:100%;
    height:18px;
    display:inline-block;
}

table.ImprovementDataTable .Sortable
{
    cursor:pointer;
}

.ImprovementDetailsContainer
{
    width:700px;
    display:table;
}

.ImprovementDetailsRow
{
    display:table-row;
}

.ImprovementDetailsCell
{
    width:50%;
    display:table-cell;
    padding-right:30px;
}

#start_date, #end_date
{
    width:400px;
}

.ImprovementPlanning .editor-label
{
    color:#787878;
}

.ImprovementPlanning select
{
    width:330px; 
}

.SuggestionPrioritisationTable select
{
    width:auto;
}
.SuggestionPrioritisationTable .FirstCell
{
    text-align-last: center;
}

.ImprovementPlanning .ImprovementDetailsCell input[type=text]
{
    width:321px; 
}

/* --- Survey ----------------------------------*/

.SurveyQuestionAnswer
{
    margin-top:15px;
    width:693px;
    margin-bottom:15px;
}

.DropDownListForSurveyAnswers 
{
    margin-bottom:15px;
}

.SurveyQuestionSelected
{
    color:Black;
    background-color: White;
    background-color:#8fa5c7;
    border-top: 1px solid Black;
    border-bottom: 1px solid Black;
    font-weight:bold;
    font-size:18px;
    padding:20px 50px;
}

.SurveyCriteriaSelected
{
   
    color:white;
    background-color:#4167A0;
    text-align:center;
    font-size:16px;
    padding:20px 50px;
    font-size:20px;
}

.SurveyValueError
{
    display:none;
    padding-top:10px;
}

.SurveyValueError.Visible
{
    color:Red;
    font-weight: bold;
    display:block;
}

.SurveyScoringTitle 
{
    font-weight:bold;
    padding:15px 0;
    font-size:15px;
}

.SurveyFinishTextArea
{
    color: #7994BC;
    text-align: center;
    font-size: 30px;
    height: 35px;
    width:600px;
    position: fixed;
    top: 50%;
    left: 50%;
    line-height: 35px;
    margin-top: -35px;
    margin-left: -300px;
}

.SurveyDescriptionArea 
{
    font-size: 13px;
}

.SurveyStartArea 
{
    color: #7994BC;
    text-align: center;
    height: 35px;
    width: 600px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -100px;
    margin-left: -300px;
}

.SurveyStartArea #SurveyName 
{
    font-size: 30px;
}

#btnNextSurveyQuestion
{
    padding-top:0px;
    width:170px;
    float:right;
    margin-right:-50px;
}

#SurveyEditForm textarea
{
    padding-top:3px;
}


/* --- BreadCrump --------------------------------------------------------*/
.BreadCrumpContainer {
	width:100%;
	/*overflow-x:visible; 4.8.23*/
    overflow-x: scroll;
    margin-bottom: 10px; /*4.8.23*/
}
.BreadCrump
{
	overflow-y:auto;
	overflow-x: hidden;
    width:100%;
    height:54px;
    color:White;
    font-size:13px;
    font-weight:bold;
    vertical-align: middle;
    border-width:0px;
    border-collapse:separate;
    border-spacing:0px;
    /*margin-bottom:15px; 4.8.23*/
    display:table;
}

.BreadCrump .Blue, .BreadCrump .Gray, .BreadCrump .Orange, .BreadCrump .LightBlue
{
    display:table-cell;
    vertical-align:middle;
}

.BreadCrump .Blue, .BreadCrump .Gray, .BreadCrump .LightBlue
{
    background-repeat: repeat-x;
    height:100%;
    cursor:pointer;
}

.BreadCrump .Blue
{
    background-image:url(BreadCrump_Blue.png);
}

.BreadCrump .Circle
{
    background-repeat:no-repeat;
    background-position:8px 0px;
    width:40px;
    height:23px;
    text-align:center;
    padding-top:3px;
}

.BreadCrump .Blue .Circle
{
    background-image:url(BreadCrump_Blue_Circle.png);
}

.BreadCrump .Array, div .Array_
{
    background-repeat:no-repeat;
    width:22px;
    height:100%;
    padding: 0px;
}

.BreadCrump .Array
{
    display:table-cell;
}

.BreadCrump .BlueArray
{
    background-image:url(BreadCrump_BlueArray.png);
}

.BreadCrump .BlueArray_
{
    background-image:url(BreadCrump_BlueArray_.png);
}

.BreadCrump .Gray
{
    background-image:url(BreadCrump_Gray.png);
}

.BreadCrump .Gray .Circle
{
    background-image:url(BreadCrump_Gray_Circle.png);
}

.BreadCrump div .GrayArray_
{
    background-image:url(BreadCrump_GrayArray_.png);
}

.BreadCrump .GrayArray
{
    background-image:url(BreadCrump_GrayArray.png);
}

.BreadCrump .Orange
{
    background-image:url(BreadCrump_Orange.png);
}

.BreadCrump .Orange .Circle
{
    background-image:url(BreadCrump_Orange_Circle.png);
}

.BreadCrump div .OrangeArray_
{
    background-image:url(BreadCrump_OrangeArray_.png);
}

.BreadCrump .OrangeArray
{
    background-image:url(BreadCrump_OrangeArray.png);
}

.BreadCrump .LightBlue
{
    background-image:url(BreadCrump_LightBlue.png);
}

.BreadCrump .LightBlue .Circle
{
    background-image:url(BreadCrump_LightBlue_Circle.png);
}

.BreadCrump div .LightBlueArray_
{
    background-image:url(BreadCrump_LightBlueArray_.png);
}

#LogIn {
    font-weight: bold;
}

/* --- Hide apperaring cross in input fields IE10 when not empty -------*/
::-ms-clear { 
    display: none;
}

#LogoEEAGrants {
    background-image:url(RootOrg_Logo_EEA_Grants.png);
    background-repeat: no-repeat;
    height: 60px;
    width: 80px;
    margin: 4px;
    bottom: 18px;
    position: absolute;
    left: 215px;
}

#LogoSabiedribasIntegracijasFonds {
    background-image:url(RootOrg_Logo_SabiedribasIntegracijasFonds.png);
    background-repeat: no-repeat;
    height: 60px;
    width: 360px;
    margin: 4px;
    bottom: 20px;
    position: absolute;
    left: 300px;
}

.SelectSmall
{
    width:80% !important;
}

.ChartContainer 
{
    display: inline;
    width:90%
}

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

/*  new Layout Details.cshtml  */
.ProjectDetailsContainer
{

    margin-top: 5px;
    margin-bottom: 15px;
     /*border:solid 1px green; */
    /*position:relative; 
    left:0px; 
    padding-right:0px; 
    padding-left:0px; */
}
.ProjectDetailsRow
{
    display: block;
    width: 100%;
}
.BgContainer.ProjectPlanning.Title {
    margin-left:50px; 
    /*border:solid 1px green; */
    margin-bottom: 5px;
    /*width:90%;*/
}
.ProjectPlanning .editor-label 
{
    color:#787878;
    white-space: normal;
}
.ProjectPlanning .editor-container 
{
    display: inline-block;
    vertical-align:top;
    width:230px;
}
.ProjectPlanning select
{
    width:210px; 
}
.ProjectPlanning textarea, .ProjectPlanning input[type=text]
{
    /*width:100%;*/
    resize: vertical; 
}
.ProjectPlanning .editor-label, .ProjectPlanning .editor-field
{
    display: block;
    padding-top:5px;
    vertical-align:middle;
}
.ProjectPlanning .ProjectDetailsCell textarea
{
    width:200px; 
}
.ProjectPlanning .ProjectDetailsCell input[type=text]
{
    width:200px; 
}
#Project_authorized_date, #Project_start_date, #Project_end_date
{
    width:200px;
    float:left;

}
.ProjectPlanning .ui-datepicker-trigger
{
    position:relative;
    left: -22px;  /* -70px */
    top: 2px;
}

.ProjectPlanningTab, .ProjectPlanningTabSelected
{
    padding-top:0px;
    height:35px;
    color:White;
    border-bottom: 2px solid white;
    vertical-align: middle;
    padding-left:14px;

}
.ProjectPlanningTab a, .ProjectPlanningTabSelected a {
        color: white;
        text-decoration:none;
        display: block;
        width:100%;
        height: 35px;
        line-height: 35px;
        cursor: pointer;
}
.ProjectPlanningTab
{
    background-image: url("criteria_transp.png");
    text-align:left;
    font-size:14px;
    cursor:pointer;
}

.ProjectPlanningTabSelected
{
    /*padding-left:0px;
    background-image:url("buttons.png");
    background-position:0px -455px;
    background-repeat:repeat-x;*/
    background-color:#CF5C15;
    text-align:left;
    border-top: 2px solid White;
    font-size:16px;
}
.ProjectTabTable
{
    border-collapse:separate;
    border-spacing:0px;
    width:97%;
}
.ProjectPlanning table.DataTable 
{
    border-collapse: collapse;
    width:100%;
    margin-top: 5px;
    /*margin-bottom: 10px;*/
}
.ProjectPlanning table.DataTable tr
{
    height:31px;
}
.ProjectPlanning table.DataTable th
{
    vertical-align:middle;
}
.ProjectPlanning table.DataTable td {
    padding: 3px 5px 3px 3px; 
}
.ProjectPlanning table.DataTable th {
    padding: 3px 3px 3px 8px;
}
.ProjectPlanning table.DataTable th .Header
{
    padding: 6px 3px 3px 3px; /*padding-top:6px;*/
    width:101%; 
    
}
table.ProjectTabTable tr.MouseOver
{
    background-color:#4167A0 !important;
}

.ProjectPlanning table.DataTable th {
    text-align:left;
    color:White;
    background-color:#9fb4d3;
    background-image: url(icons.png);
    background-position:0px -864px;
    background-repeat: repeat-x;
}

.ProjectPlanning table.DataTable th .Header Triangle
{
    display:inline-block;
}
.ProjectPlanning table.DataTable th .Separator
{
    position:relative;
    left:-8px;
    top:-2px;
    float:left;
    height:30px;
    width:2px;
    background-image: url(hor_sprites.png);
    background-position:-164px 0px;
    background-repeat: no-repeat;
}
.ProjectPlanning table.DataTable input[type=text] {
    width:97%;
}

#PublishSugg {
    margin: 10px 0 0 7px; 
    overflow:hidden;
}
#SuggConsolidationContainer {
    display: inline-block; 
    margin-top:10px;
}

/* --- Stress Assessment Scoring ----------------------------------*/
.StressAssessment {
    margin-top: 10px;
    margin-bottom: 10px;
    height:50px;
    width: 100%;
    border:none;
   
}
.StressAssessment td {
    width: 20%;
}

.StressScore, .StressFrequency {
    height:50px;
    padding: 2px 2px;
    vertical-align:middle;
    text-align:center;
    cursor:pointer;
    font-weight:normal;
    font-size:12px;
    -webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    border-left:5px solid #ffffff;
    border-top:5px solid #ffffff;
    border-right:5px solid #848484;
    border-bottom:5px solid #848484;
}
.StressScore:hover, .StressFrequency:hover, .StressScore:focus, .StressFrequency:focus {
    -webkit-box-shadow: 0px 0px 20px 0px rgba(100, 120, 120, 1);
    -moz-box-shadow: 0px 0px 20px 0px rgba(100, 120, 120, 1);
    -o-box-shadow: 0px 0px 20px 0px rgba(100, 120, 120, 1);
    box-shadow: 0px 0px 20px 0px rgba(100, 120, 120, 1);
}
.StressScore_1, .ReliefScore_5
{
    background-color: #227d3f;
}
.StressScore_1.ScoreSelected, .ReliefScore_5.ScoreSelected
{
    background-image: linear-gradient(to bottom, #227d3f 0%, #73d993 100%);
 }
.StressScore_2, .ReliefScore_4
{
    background-color: #56be78;
}
.StressScore_2.ScoreSelected, .ReliefScore_4.ScoreSelected
{
    background-image: linear-gradient(to bottom, #56be78 0%, #c8ead3 100%);
}
.StressScore_3, .ReliefScore_3
{
    background-color: #ffff9b;
}
.StressScore_3.ScoreSelected, .ReliefScore_3.ScoreSelected
{
    background-image: linear-gradient(to bottom, #ffff9b 0%, #ffffe6 100%);
}
.StressScore_4, .ReliefScore_2
{
    background-color: #cf6969;
 }
.StressScore_4.ScoreSelected, .ReliefScore_2.ScoreSelected
{
    background-image: linear-gradient(to bottom, #ff6969 0%, #ffcccc 100%);
}
.StressScore_5, .ReliefScore_1
{
     background-color: #cf0000;
}
.StressScore_5.ScoreSelected, .ReliefScore_1.ScoreSelected
{
    background-image: linear-gradient(to bottom, #cf0000 0%, #ff9999 100%);
}
.Frequency_1
{
    background-color: rgb(220, 230,242); /* #ffffff*/
}
.Frequency_1.ScoreSelected
{
     /*background-image: linear-gradient(to bottom, #ffffff 0%, #f9f6f6 100%);*/
	 background-image: linear-gradient(to bottom, #ffffff 0%, #dce6f2 100%);
}
.Frequency_2
{
    background-color: rgb(142,180,227); /* #e9e5e5*/
}
.Frequency_2.ScoreSelected
{
	/*background-image: linear-gradient(to bottom, #e9e5e5 0%, #ffffff 100%);*/
    background-image: linear-gradient(to bottom, #8eb4e3 0%, #ffffff 100%);
 }
.Frequency_3
{
    background-color: rgb(85,142,215); /* #d5d1d1*/
}
.Frequency_3.ScoreSelected
{
	/*background-image: linear-gradient(to bottom, #d5d1d1 0%, #ffffff 100%);*/
    background-image: linear-gradient(to bottom, #558ed7 0%, #ffffff 100%);
}
.Frequency_4
{
    background-color: rgb(55,96,146); /* #bfbfbf*/
    color: white;
}
.Frequency_4.ScoreSelected
{
	/*background-image: linear-gradient(to bottom, #bfbfbf 0%, #ffffff 100%);*/
    background-image: linear-gradient(to bottom, #376092 0%, #ffffff 100%);
 }
.Frequency_5
{
    background-color: rgb(23,55,94); /* #9d9a9a*/
    color: white;
}
.Frequency_5.ScoreSelected
{
	/*background-image: linear-gradient(to bottom, #9d9a9a 0%, #ffffff 100%);*/
     background-image: linear-gradient(to bottom, #17375e 0%, #ffffff 100%);
}
.ScoreSelected 
{
/*text-shadow: -1px -1px 0 rgba(255,255,255,0.3); */
border-right:5px solid #ffffff;
border-bottom:5px solid #ffffff;
border-left:5px solid #848484;
border-top:5px solid #848484;
font-weight:bold;
}
div.StressScoreGraph {
    /* -- float:left; -- */
    position:relative;
    /* --top:-2px;-- */
    border: 0px solid black;
    margin-right: 10px;
    margin-top:0px;
    width:20px;
    height:20px;
    vertical-align:middle;
}
.S1, .S2, .R4, .R5
{
    background-color:rgb(34, 125, 63);
}
.S4, .S5, .R1, .R2
{
    background-color:rgb(207, 0, 0);
}
.S3, .R3
{
    background-color:rgb(255, 255, 155);
}
.F5, .F4
{
    width:20px;
    height:20px;
    border-radius: 20px;
    margin:0px;
}
.F1, .F2
{
    width:10px;
    height:10px;
    border-radius: 10px;
    margin: 5px;
}
.F3
{
    width:14px;
    height:14px;
    border-radius: 14px;
    margin:3px;
}
.SFA_CriterionGreen
{
    font-size: 18px;
    font-weight: bold;
    color:rgb(34, 125, 63);
    padding-bottom: 5px;
}
.SFA_CriterionRed
{
    font-size: 18px;
    font-weight: bold;
    padding-bottom: 5px;
    color:rgb(207, 0, 0);
}
/* --- DW Assessment Scoring ----------------------------------*/
.DWAssessment {
    margin-top: 10px;
    margin-bottom: 10px;
    height:70px;
    width: 100%;
    border:none;
   
}
.DWAssessment td {
    width: 16%;
}
.DWScore_0
{
	background-color:rgb(127, 127, 127);
}
.DWScore_20
{
	background-color:rgb(242, 0, 0);
}
.DWScore_40
{
	background-color:rgb(234, 95, 52);
}
.DWScore_60
{
	background-color:rgb(255, 217, 102);
}
.DWScore_80
{
	background-color:rgb(175, 214, 104);
}
.DWScore_100
{
	background-color:rgb(0, 176, 80);
}


@media only screen and (max-width: 1024px) {
    /* styles for mobile browsers smaller than 480px; (iPhone) */
}

@media only screen and (min-width: 768px) and (max-width: 1024px)  {
  }
/* default styles here for older browsers. 
       I tend to go for a 600px - 960px width max but using percentages
    */
@media only screen and (min-width: 960px) {
        /* styles for browsers larger than 960px; */
    }
@media only screen and (min-width: 1440px) {
        /* styles for browsers larger than 1440px; */
    }
@media only screen and (min-width: 2000px) {
        /* for sumo sized (mac) screens */
    }

@media only screen and (max-width: 768px) {
    /* default iPad screens 768 */
}


@media only screen and (max-width: 960px)
{
    /* styles for mobile browsers smaller than 960px;  */
    .HideOnMobile {
        display: none;
    }

    .HideOnNonMobile {
        display: block;
    }

    #AssessmentStatisticsContainer, #SuggestionTableContainer {
    overflow: auto;
    }

    #AssessmentStatusContainer, #AssessmentStatusLeft, #AssessmentStatusRight {
        display: block;
    }
    #AssessmentStatusLeft
    {
	    width:100%; 
	    vertical-align:top;
    }
    	
	.BgContainer.LeftAlign, .BgContainer
	{
		margin-left:15px;
        margin-right:15px;
	}
    #MainContentContainer {
        /* width: calc(100% - 30px);  margins of .BgContainer*/
    }

    #topHeader2_Title {
		font-size: 14px;
		font-weight: bold;
        height: auto;        
        display: block;
        width: 100%;
    }
	.BreadCrumpContainer {
		width:100%;
		overflow-y: visible;
		overflow-x: scroll;
		margin-bottom: 5px;
	}
	.BreadCrump {
		margin-bottom:0px;
        font-size:11px;
	}
    .BlueArray.Array.HideOnMobile, .OrangeArray.Array.HideOnMobile, .GrayArray.Array.HideOnMobile,.LightBlueArray.Array.HideOnMobile,
    .Blue.HideOnMobile, .Orange.HideOnMobile, .Gray.HideOnMobile,.LightBlue.HideOnMobile
{
    display:none;
}
    .BreadCrump .Blue, .BreadCrump .Orange, .BreadCrump .Gray, .BreadCrump .LightBlue
{
    text-align:center;
    border-left: 2px solid #ffffff;
    border-top: 2px solid #ffffff;
    border-right: 2px solid #484848;
    border-bottom: 2px solid #484848;
    padding:1px;
}

    #Fill-Region {
        overflow: auto;
    }
    #Fill-RegionCriteria, #Fill-RegionQuestions, #Fill-RegionAssessment {
        display: block;
        width: 100%;
		padding: 0px;
		margin-bottom: 0px;
        height: auto;
    }
    #Fill-RegionQuestions {
    height: auto;
    overflow-y:visible
    }
    #Fill-RegionCriteria .editor-label, #Fill-RegionQuestions .editor-label,  #Consolidate-RegionCriteria .editor-label, #Consolidate-RegionQuestions .editor-label {
        padding-top: 3px;
    }
    #Fill-RegionCriteria #criteriaTable {
        padding-bottom: 0px;
    }
	#Fill-RegionAssessment #rightCell {
        margin-top: 10px;
        width: 100%;
		padding: 0px;
    }

    #topHeaderText3 {
        display: none;
    }
	.ProgressBarContainer
	{
        font-weight:normal;
        font-size:12px;
        float:right;
        width:100%;
	}
	#LowLevelContainer, .body_container
	{
		background-image: none;
	}
	#Fill-RegionAssessment #rightCell {
        width: 100%;
        position: static;
	}
	.QuestionSelected {
		width: auto;
	}
	.StressScore.tooltip {
		display:none;
	}
	#Glossary {
		width: 90%;
		margin: auto;
	}
	#Glossary .tooltip {
		font-size:12px; 
		font-weight:bold;
        cursor: help;
	}
    #dialog-form-Suggestions {
        width: 90%; 
	}
    .LogOutPickerSelectedOptionList {
        visibility: visible;
        opacity: 0.5;
    }
}

    /* different techniques for iPad screening */
    @media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
      /* For portrait layouts only */
    }

    @media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
      /* For landscape layouts only */
    }

    @media only screen and (max-height: 700px) {
    #mainFooter .Row {
    display: none;
    }
    .body_container .content {
    height: calc(100% - 20px); /* no Logo */
    }
    
    #mainFooter {
        height: 18px;
    }
    #EUlogo {
	font-size: 10px;
    }
}
    @media only screen and (max-height: 500px) {
    #EUlogo {
	display:none;
    }

}