@CHARSET "UTF-8";

div.right { float: right }
div.left { float: left }
div.clear { clear: both;}
.nodisplay { display: none;}
.bold { font-weight: bold;}

div.inside { padding: 4px; }
input.button, a.button {
    margin: 0px;
    padding: 1px 2px;
    background-color: #99B0CF;
    border: 1px solid #888888;
    text-decoration: none;
    color: #222;
    font-weight: bold;
}

a.switch {
    margin: 0px;
    padding: 1px 4px;
    background-color: #99B0CF;
    border: 1px solid #888888;
    text-decoration: none;
    color: #222;
}
a.switch.selected {
    font-weight: bold;
}

hr {
    height: 1px;
    background: #99B0CF;
    font-size: 0;
    border: none;  
    margin: 2px 0px;
}

.list a {
    text-decoration: none;
}
.list a:hover {
    color: #b00;
}

div.warning, span.warning {
    color: #b00;
    font-weight: bold;
}
/* ------------------- HEADER ------------------- */
#header {
    background-color:white;
/*    background-image:url(../img/header-background.jpg);*/
    background-position:left top;
    background-repeat:no-repeat;
    height:80px;
    position:relative;
    z-index:2;
}
#headerLogo {
    left:0;
    position:absolute;
    top:11px;
    z-index:2;
}
#headerGraph {
    position:absolute;
    right:20px;
    top:0;
    z-index: 10;
}

/* ------------------- Header project description ------------------- */
#headerInfo {
    float: left;
    position: absolute;
    left: 400px;
    top: 2px;
}

#projectInfo {
    float: left;
}

#questionaryInfo table td, #projectInfo table td {
	background-color: #eee;
	padding: 1px 5px;
/*	border-bottom: 1px solid #555;*/
}

#questionaryInfo {
    margin-left: 20px;
    float: left;
}

#userInfo {
    float: right;
    font-weight: bold;
    color: #fff;
    padding: 6px 20px 0px 0px;
}

#userInfo a {
    font-weight: bold;
    color: #fff;
    text-decoration: none;
}


#mainMenu {
    background-color:#569145;
    background-image:url(../img/menu-background.gif);
    background-position:left top;
    background-repeat:repeat-x;
    font-size:7.5pt;
    height:23px;
    letter-spacing:0;
    padding:0 0 0 190px;
    position:relative;
    z-index:1;
}

#mainMenu ul {
    float:left;
    list-style-image:none;
    list-style-position:outside;
    list-style-type:none;
    margin:0;
    padding:5px 0 0;
}
#mainMenu ul li {
    border-right:1px solid white;
    float:left;
    margin:0;
    padding:0;
}
#mainMenu ul li.title {
    padding: 2px 5px 2px 20px;
    color: #f0b702;
    font-weight: bold;
}

#mainMenu ul li a, #mainMenu ul li span {
    color:white;
    display:block;
    padding:2px 5px;
    text-decoration:none;
    font-weight: bold;
}

#mainMenu ul li a.disabled {
    background-color:#CCCCCC;
    color:#888888;
    display:block;
    padding:2px 5px;
    text-decoration:none;
}
#mainMenu a.disabled:hover {
    background-color:#CCCCCC;
    color:#888888;
}
#mainMenu ul li ul li {
    border-bottom:1px solid gray;
    border-top:1px solid white;
    height:auto;
    padding:0;
    z-index:99;
}
#mainMenu ul li ul {
    clear:both;
    float:left;
}
#mainMenu ul li ul li a {
    background-color:#003a6c;
    border-left:1px solid white;
    border-right:1px solid gray;
    height:auto;
    padding:2px 5px;
    text-align:left;
    width:140px;
    z-index:99;
}
#mainMenu a:hover {
    background-color:#F0B704;
    color:#569145;
}
#mainMenu ul li ul {
    background:gray none repeat scroll 0 0;
    left:-999em;
    margin:0;
    padding:1px 0 0;
    position:absolute;
    width:140px;
    z-index:29;
}
#mainMenu ul li ul ul {
    margin:-1em 0 0 140px;
}
#mainMenu ul li ul ul li a {
    border-left:1px solid white;
}
#mainMenu li:hover ul ul, #mainMenu li.menuHover ul ul {
    left:-999em;
}
#mainMenu li:hover ul, #mainMenu li li:hover ul, #mainMenu li.menuHover ul, #mainMenu li li.menuHover ul {
    left:auto;
}
#mainMenu .selected {
    background-color:#FC8100;
}

/* ------------------- navigatinoPath ------------------- */

.navigationPath {
    background-color:#ECEAEA;
    background-image:url(/img/navigation-path-background.gif);
    background-position:left bottom;
    background-repeat:repeat-x;
    border:1px solid #AAA8A7;
    margin-bottom:10px;
    padding:5px;
}

.navigationPath a {
    text-decoration: none;
}
.navigationPath a:hover {
    text-decoration: underline;
}
.navigationPath a.active {
    font-weight: bold;
}
/****************** MAIN **********************/
body {
    font-size: 0.7em !important;
    color: black;
    font-family: 'Verdana CE',Verdana,'Arial CE',Arial,'Helvetica CE',Helvetica,sans-serif;
    background-color: white;
    text-align: left;
    margin: 0;
    padding: 0;
}

#page{
    /*	width: 740px;  */

    position:relative;
    margin-top: 10px;
    margin-left: 5px;
    margin-right: auto;
    margin-bottom: 0px;
    padding: 0px;

    width: 1250px;
    /*
        _width: expression(document.body.clientWidth < 1000? "1000px" : "auto" );
    */
}

div#form {
    width: 740px;
}

a {
    color: #013983;
}

img {
    border: none;
}

table {
    border-collapse: collapse;
}

label {
    cursor: pointer;
}



div.flashMessage {
    border: 2px solid #666666;
    background-color: #FFBBBB;
    margin: 0px 0px 2px 0px;
    padding: 3px 3px 3px 3px;
}

/* jqModal base Styling courtesy of;
Brice Burgess <bhb@iceburg.net> */

/* The Window's CSS z-index value is respected (takes priority). If none is supplied,
the Window's z-index value will be set to 3000 by default (in jqModal.js). You
can change this value by either;
a) supplying one via CSS
b) passing the "zIndex" parameter. E.g.  (window).jqm({zIndex: 500}); */

.jqmWindow {
    display: none;

    position: fixed;
    top: 17%;
    left: 50%;

    margin-left: -300px;
    width: 600px;

    background-color: #EEE;
    color: #333;
    border: 1px solid black;
    padding: 12px;
}

.jqmOverlay { background-color: #000; }

/* Fixed posistioning emulation for IE6
Star selector used to hide definition from browsers other than IE6
For valid CSS, use a conditional include instead */
/*
* html .jqmWindow {
position: absolute;
top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}  
*/

/************************************/
/*             login                */
/************************************/

.login .flashMessage{
    float: left;
    padding: 2px 10px;
    margin-left: 20px;
    font-weight: bold;
}
#login {
    float: left;
    clear: both1;
    width: 250px;

    background-color: #eee;
    color: #333;
    border: 1px solid black;
    padding: 12px;
}

#login input {
    border: solid 1px #666;
    font-size: 90%;
    padding: 1px;
    width: 180px;
}

#login .button {
    /*
    background-color: rgb(12,24,128);
    color: white;
    font-weight: bold;
    width: 100px;
    border: solid 1px white;
    margin-left: 10px;
    padding: 0px;
    */

    margin: 5px 0px;
    padding: 1px 2px;
    background-color: #99B0CF;
    border: 1px solid #555;
    text-decoration: none;
    color: #222;
    font-weight: bold;
    font-size: 1.0em;
    width: 100%;
}

#login table td {
    width: 100%;
}
#login table td {
    padding: 2px;
}


/* ------------------- PROJECTS ----------------- */

table.list {
    width: 100%;
    border: 1px solid #bbb;
}
table.list td, table.list th {
    padding: 2px 5px;
    border-left: 1px solid #bbb;
    border-right: 1px solid #bbb;
}
table.list tr.header {
    background-color: #aaa;
    font-weight: bold;

}
table.list tr.odd {
    background-color: #eee;
}

#projectList a.selected {
    font-weight: bold;
}

table.list tr.hover td {
    background-color: #d6eaff;
}
table.list td.center {
    text-align: center;
}
/* ------------------- Project detail ----------------- */

table.projectDeploy td.error, table.projectDeploy td.warning, table.projectDeploy span.error {
    color: #bb0000;
    font-weight: bold;
}

table.projectDeploy td.ok {
    color: #00cc00;
    font-weight: bold;
}

table.projectDeploy td.ignore {
    text-decoration: line-through;
}

table.projectVersionList {
    margin-top: 5px;
}

table.projectVersionList tr.selected {
    font-weight: bold;
    background-color: #d6eaff;
}

table.projectVersionList td.infoMessage {
    font-style: italic;
	text-align: center;
    color: #666;
}

table.projectVersionList td.preserved-no a {
  opacity: 0.3;
}
table.projectVersionList td.preserved-no a:hover {
  opacity: 1;
}

table.projectVersionList td.version-note .version-note-preview {
  cursor: pointer;
  white-space: nowrap;
}

table.projectVersionList td.version-note .version-note-preview .original-text {
  display: inline-block;
  margin-left: 5px;
  max-width: 320px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

table.projectVersionList td.version-note .version-note-editor {
  max-width: 320px;
}
table.projectVersionList td.version-note .version-note-editor .cancel {
  margin-right: 8px;
  cursor: pointer;
}
table.projectVersionList td.version-note .version-note-editor textarea {
  margin-top: 8px;
  min-width: 100px;
  max-width: 320px;
  width: 100%;
}


/*
#projectList .list .uploader {
    width: 40px;
    white-space: nowrap;
    overflow: hidden;
}
*/

/* ------------------- Project deploy detail ----------------- */

table.projectDeployDetail {
    width: 100%;
}
table.projectDeployDetail td {
    border: 1px solid #888;
    vertical-align: top;
    padding: 2px 4px;
}

table.projectDeployDetail th {
    border: 1px solid #888;
    background-color: #aaa;
    padding: 2px 4px;
}
table.projectDeployDetail td.error {
    color: #f00;
}
table.projectDeployDetail a {
    text-decoration: none;
}

/* ------------------- Project version detail ----------------- */

#formDiffDialog div.content {
    overflow: scroll;
    height: 620px;
    margin: 4px 0px;
    background-color: #f5f5f5;
    padding: 4px;
}
div.diff {
    font-size: 0.8em;
}

div.diff .equal {
    color: #888;
}

div.diff .insert {
    color: #00bb00;
    font-weight: bold;
}

div.diff .delete {
    color: #bb0000;
    font-weight: bold;
}

div.content code {
    font-size: 1.2em;
}

div.errorMessage {
    margin: 10px 0px;
    padding: 5px;
    background-color: #ffaaaa;
    border: 2px solid #ff4444;
    font-weight: bold;
}
/*
.diffControll a {
    display: block;
    float: left;
    text-decoration: none;
    margin: 0px 2px;
    border: 1px solid #aaa;
    background-color: #99b0cf;
    padding: 3px 5px;
}
.diffControll a.selected {
    font-weight: bold;
}
/************************************/
/*       questionary list           */
/************************************/

#leftMenu {
    float: left;
    border: 0px solid black;
    width: 300px;
}

#content {
}

#questionaryList {
    float: none;
}
#formList {
    float: left;
    width: 900px;
    margin: 3px 1px;
    clear: none;
}
/*
div.nextForm {
float: right;
}

#nextForm {
font-weight: bold;
}
*/
div.inlineFrame {
    /*    border: solid #999999 1px; */
    border: solid #99B0CF 1px; 
    margin: 3px;
}
div.inlineFrame div.header, div.inlineFrame div.header a {
    background-color: #99B0CF;
    padding: 1px 4px;
    color: #FFF;
    font-weight: bold;
}

div.inlineFrame div.header span a {
    color: #013983;
}

div.inlineFrame ul {
    list-style: none;
    color: #333;
    margin: 3px 0px 0px 0px;
    padding: 0px 0px 0px 5px;
}

div.inlineFrame a {
    text-decoration: none;
}
div.inlineFrame li.selected a {
    font-weight: bold;
    color: #B00;
}
div.inlineFrame a.selected {
    font-weight: bold;
    color: #B00;
}

/* largeFrame is content frame */
div.largeFrame {
    border: solid #99B0CF 1px;
    margin: 1px;
}
div.largeFrame div.header {
    background-color: #999999;
    padding: 1px 4px;
    color: #FFF;
    font-weight: bold;
}

div#formFrame {
    float: left;
    width: 900px;
}
div#formFrame div.header {
    background-color: #99B0CF;
}

/* form */
div.form {
    margin: 10px;
}

div.form .highlight {
    background-color: #ffaaaa;
}

/* answerList */

div#answerList td.page {
    padding-right: 10px;
    font-weight: bold;
}
div#answerList td.variable {
    padding-right: 10px;
}
div#answerList td.answer {
    text-align: left;
    font-weight: bold;
    color: #B00;
}

div#answerList table.main {
    width: 100%;
}
div#answerList tr.bottomLine {
    border-bottom: 1px solid;
}

div#answerList tr.alt {
    background-color: #e8f0fb;
}

div#answerList div#variableListMissingList div.header {
    background-color: #BB0000;
    color: #FFF;
    font-weight: bold;
}
div#answerList div#variableListMissingList div.inside {
    border: 2px solid #BB0000;
    font-weight: bold;
}

/* versionList */
div#versionList .inside {
    overflow: auto;
    max-height: 200px;
}

div#versionList td.download {
    padding-left: 10px;
}

div#versionList tr.selected {
    font-weight: bold;
    color: #B00;
}

div.inlineFrame {
    clear: both;
}

div.inlineFrame a.button {
    float: right;
    margin-left: 3px;
}

div.inlineFrame:after {
    content: ".";
    display: block;
    height: 1px;
    clear: both;
    visibility: hidden;
}

/* respondentAttributeList */

div#respondentAttributeList table {
    border-collapse: separate;
    border-spacing: 3px;
    width: 100%;
}

div#respondentAttributeList td.name {
    color: #013983;
    font-weight: bold;
}

div#respondentAttributeList td.value {
    border: #e8f0fb 1px solid;
    width: 80%;
}

div#respondentAttributeList td.drop {
    width: 16px;
}

span.minimizer {
    float: right;
}

/* formbeans versions */
div#messageDialog .status {
    font-weight: bold;
    padding-right: 10px;
}
div#messageDialog .status.ok {
    color: #00cc00;
}
div#messageDialog .status.error {
    color: #f00;
}

table.versionList td {
    border-top: 1px solid #99b0cf;
    padding: 2px 10px;
}
table.versionList th {
    padding-bottom: 5px;
    padding: 2px 10px;
}


/* ----------------------- FormGroup List ---------------------- */
div#formGroupList .inside {
    width: 275px;
    overflow: hidden;
}

div.inlineFrame ul.formGroupList, div.inlineFrame li.rootFormGroup > ul  {
    padding-left: 0px;
}
div.inlineFrame ul {
    padding-left: 10px;
}
ul.formGroupList li {
    margin-left: 4px;
    padding-left: 0px;
    list-style: none;
    font-weight: normal;
    white-space: nowrap;
}
ul.formGroupList li.formGroup {
    list-style: none;
    margin-left: 5px;
    font-weight: bold;
}

ul.formGroupList li.rootFormGroup {
    list-style: none;
    margin-left: 0px;
    padding-left: 0px;
    font-weight: bold;
}


/* ------------------------ Edit Form Dialog --------------------- */

#editFormDialog #editFormSource {
    width: 100%;
    height: 99%;
    font-family: monospace;
}

#editFormDialog .savingMessage {
    font-size: 1.3em;
    text-align: center;
    margin-top: 300px;
}

#toggleLeftMenu {
    width: 120px;
    float: left;
}

/* ------------------------ resultPresentation --------------------- */

div.resultGraph {
    float:left;
}
div.resultGraph span.bar {
    background-color: #d77f2f;
    float:left;
    margin-top: 2px;
    margin-left: 4px;
}
div.resultGraph span.barSmall {
    background-color: #d77f2f;
    float:left;
    margin-top: 1px;
    margin-left: 4px;
    clear:both;
}
div.resultGraph span.value {
    float:left;
    width: 25px;
    text-align: center;
}

div.printGraphTextValues, div.printGraphComboValues {
    display: none;
}



/*****************************************************************************/
/*******************************      menu      ******************************/
/*****************************************************************************/


/* pulldown menu */

.pullDownMenu {
  position: relative;
  height: 23px;
}

.pullDownMenu ul {
	list-style: none;
	margin: 0px;
	padding: 5px 0px 0px 0px;
}

.pullDownMenu ul li {
	float: left;
	padding: 0px;
}

.pullDownMenu ul li a {
	display: block;
	padding: 2px 5px 2px 5px;
}

.pullDownMenu ul li a.disabled {
	background-color: #ccc;
	color: #888;
	text-decoration: none;
	display: block;
	padding: 2px 5px 2px 5px;
}
.pullDownMenu a.disabled:hover {
	background-color: #ccc;
	color: #888;
}

.pullDownMenu ul li ul li {
	height: auto;
	padding: 0px;
	z-index: 99;
}

.pullDownMenu ul li ul {
	clear: both;
	float: left;
}

.pullDownMenu ul li ul li a {
	width: 200px;
	padding: 2px 5px 2px 5px;
	height: auto;
	text-align: left;
	z-index: 99;
}

.pullDownMenu ul li ul {
	margin: 0px 0px 0px 0px;
	padding: 1px 0px 0px 0px;
	position: absolute;
	width: 140px;
	left: -999em;
	z-index: 29;
}

.pullDownMenu ul li ul ul {
	margin: -1em 0 0 140px;
}

.pullDownMenu li:hover ul ul, .pullDownMenu li.menuHover ul ul {
	left: -999em;
}

.pullDownMenu li:hover ul, .pullDownMenu li li:hover ul, .pullDownMenu li.menuHover ul, .pullDownMenu li li.menuHover ul {
	left: auto;
}

div.message {
	color: #BB0000;
	font-size: 1.2em;
	font-weight: bold;
	padding-bottom: 20px;
}

table.quotaList td, table.quotaList th {
	padding: 2px 4px;
	border: 1px solid #aaa;
}

table.quotaList tr.delimeter td {
	background-color: #888;
}

table.quotaList tr.complement td {
	background-color: #FFD073;
}

#formProgress {
	font-weight: normal;
/*	font-size: 0.8em;*/
/*	border: 1px solid #99B0CF;*/
	display: inline-block;
	float: right;
}
#formProgress #bar {
    background-color: white;
    border: 1px solid #014A96;
    font-size: 1px;
    height: 7px;
    line-height: 11px;
    margin-top: 2px;
    text-align: left;
    width: 200px;
	display: inline-block;
}

#formProgress #bar #barFill {
    background-color: #014A96;
}

/* ------------------------ htmlTextExport --------------------- */
.textExport {
    font-size: 1em !important;
}

#textExport .loadingMessage {
    font-size: 1.4em;
}
#textExport.centerMessage {
    /*text-align: center;*/
    padding: 10px;
}

#textExport #updateTextExport {
    font-size: 1.4em;
    font-weight: bold;
    padding: 4px 10px;
}

/* ---------------- SE2 ---------------- */
#se2FormContent {
    font-size: initial;
}

#se2EventLog {

}
.se2EventLogName {
    color: #99B0CF;
    display: block;
}
.se2EventLogItem {
    border-bottom: 1px solid #99B0CF;
    padding: 4px 2px;
}


table.formLayout {
    margin:10px;
}
table.formLayout td {
    padding: 2px 10px 0px 10px;
}

table.formLayout td.name {
    text-align: right;
}
table.formLayout input {
    min-width: 250px;
}

ul.languageList li {
    margin-top: 20px;
    font-size: 120%;
}

.form-row:not(:last-child) {
  margin-bottom: 8px;
}
.text-right {
  text-align: right;
}

.note {
  margin: 10px;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.note ul li {
    list-style-type: disc;
    margin-left: 20px;
    padding: 4px 0;
}