/* Form Manager - The Form Assembly 3.0 -
 * Main Stylesheet (applies to all themes)
 * Copyright (c) 2006-2007 Veer West LLC
 * Jan. 2007
 */

/**
 * CLEARFIX: http://stackoverflow.com/a/1633170/335304
 * fa in fa-clearfix means formassembly - this avoids any possible conflicts
 * with bootstrap CSS etc.
 *
 * For modern browsers:
 * 1. The space content is one way to avoid an Opera bug when the
 *    contenteditable attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that are clearfixed.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.fa-clearfix:before,
.fa-clearfix:after {
	content: " "; /* 1 */
	display: table; /* 2 */
}
.fa-clearfix:after {
	clear: both;
}
/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.fa-clearfix {
	*zoom: 1;
}
/* END CLEARFIX */


#cakeSqlLog {
	/* display: none; */
}
/* General Style Info */
body {
	font-size: 62.5%;
	margin:0;
	padding:0;
}
a img {
	border:none;
}
.small {
	font-size: 75% !important;
}
.important {
}
.quiet {
	color: #999;
}
.announcement {
	padding:10px 25px;
}
.announcement .dismiss {
	float: right;
	margin-left:20px;
}
.frame ol, .frame ul {
	margin: 0;
}
.frame li {
	margin-bottom: 0.5em;
}
/* Layout */
#header {
	height: 60px;
	padding: 5px 20px 0 20px;
}
#header h1 {
	margin: 0;
	font-size:200%;
}
#header #navigation {
	position: absolute;
	top: 39px;
	left: 18px;
}



#main {

}
#content {
	min-height: 450px;
	font-size: 1.2em;
}
#footer {
	clear: both;
	padding: 15px;
	text-align: center;
}
#footer a {
	text-decoration: none;
}
h2 {
	font-size: 1.5em;
	line-height: 28px;
	padding: 0;
	margin: 0;
}
h3 {
	font-size: 1.2em;
	margin: 1em 0;
}
form {
	margin: 0;
	padding: 0;
}
/* MAIN CONTENT LAYOUT */
.oneColumn {
	min-width: 400px;
	max-width: 550px;
	margin: 0 auto;
	padding: 25px;
	min-height: 200px;
}
.oneFullColumn {
	padding: 25px;
}
.oneLargeColumn {
	width: 770px;
	margin: 0 auto;
	min-height: 200px;
	padding:25px 0;
}
.oneOfTwoColumns {
	width: 45%;
	min-height: 220px;
	float: left;
	padding: 25px;
}
.twoOfTwoColumns {
	min-height: 220px;
	padding: 25px 25px 25px 50%;
}
.sideBar {
	width: 33%;
	float: left;
	padding: 25px 0 25px 25px;
}
.toolBar 				{ width: 100%; }
.toolBar td				{ padding: 0 25px; vertical-align: bottom; }
.toolBar .left 			{ width: 35%; }
.toolBar .right 		{ text-align: right; white-space: nowrap; }
.toolBar h2 			{ margin: 0; padding: 0; vertical-align: baseline; font-size: 1.6em;   }


.mainContent {
	min-height: 200px;
	padding: 25px 25px 25px 37%;
}
.subNav {
	width: 100%;
	margin: 5px 0 0 0;
}
.subNav .views {
	line-height: 23px;
}
.subNav  ul {
	margin: 0;
	padding: 0 10px;
	overflow: auto;
}
.subNav li {
	float: left;
	margin: 0 5px 0 0;
	padding: 0 4px;
	list-style-type: none;
	vertical-align: middle;
	line-height: 3em;
}
.subNav .selected {
}
.subNav  li h3 {
	margin: 0;
	padding: 0;
}
.subNav  li a {
}
.filter 			{ padding: 0; margin: 0 0 10px 0; }
.filter legend 		{ margin: 0 8px; }
.filter .oneField	{ padding: 3px 0; }
.filter .preField 	{ min-width: 5em; }

.metaData {
	padding: 0;
	margin: 0 0 10px 0;
}
.metaData legend {
	margin: 0 8px;
}
.metaData .preField {
	min-width: 13em;
}
.responseMetadata {

}
.responseMetadata .preField {
	min-width: 10em !important;
}
.unreadCount {
	font-weight: bold;
}
.sideBar .list {
	display: table; /* forces the width to expand if content can't fit */
	width: 99%;
}
.timelineChart {
	margin: 40px auto;
	width: 310px;
	display: block;
}
.list h3 {
	margin:0;
	padding: 10px 0 4px 5px;
}
.list table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 3px;
}
.list table .alternate {
}
.list table tr:hover {
}
.list table .primaryColumn {
	white-space: nowrap;
}
.list table .selected {
}
.list table td {
	padding: 4px;
}
table th {
	text-align: left;
	padding: 0 4px;
}
.list .metaData {
	border: none;
	padding: 3px 5px;
}
.list table .tools {
	width: 70px;
	text-align: right;
	white-space: nowrap;
}
table .iconColumn {
	width: 20px;
	text-align: center !important;
}
.list .unread {
	font-weight: bold;
}
.list .logSuccess {
	color: #070;
}
.list .logInfo {
	color: #009;
}
.list .logFailure {
	color: #F00;
}
.pagination {
	padding: 2px 0 8px 7px;
	color: #666;
}
.pagination .pages {
	float: right;
}

/* Edit Properties Screens */
.editProperties {

}
.editProperties .oneField {
	margin-bottom: 0.5em;
}
.editProperties .inputWrapper {
	vertical-align: top;
	display:-moz-inline-stack;
	display: inline-block;
	zoom:1;
}
.editProperties .inputWrapper .hint {
	line-height: 18px; font-size: 11px;
}
.editProperties .preField {
	min-width: 13em;
}
.editProperties textarea {
}
.editProperties #thankYouMessage, .editProperties #expiredMessage {
	width: 39em;
}
.editProperties .frame ul  {
	list-style-type: none;
	padding: 0 0 0 15px;
}
.editProperties #selectLanguage option {
	padding: 3px;
}
.editProperties .aliases {
	width: 175px;
	float: right;
	font-size: x-small;
	background-color: #F8F8F8;
	padding: 0 3px;
}
.editProperties .aliases dt {
	margin: 6px 0 0 0;
	padding: 0;
}
.editProperties .aliases dd {
	margin: 0;
	padding: 0;
	color: #555;
}
/* right-aligned action link next to an information item. */
.followupAction {
	display: block;
	width: 200px;
	float: right;
	margin: 0.6em 0 0 0;
}
ul.actionList.float {
    margin:0;
    padding:0;
    float: left;
}
ul.actionList li {

    min-width: 225px;
    list-style-type: none;
    margin:0;
    padding:0.5em 0;
}
/* switch behavior on a link, show twistie : */
a.swtchIsOff {
	padding-left: 14px;
	background-image: url(../images/twistie-closed.gif);
	background-repeat: no-repeat;
	background-position: 0 2px;
}
a.swtchIsOn {
	padding-left: 14px;
	background-image: url(../images/twistie-open.gif);
	background-repeat: no-repeat;
	background-position: 0 2px;
}

/* Misc. */
.icon {
	vertical-align: middle;
}
.sourceCode {
	white-space: pre;
	overflow: scroll;
	font-family: Courier, sans-serif;
	background-color: #eee;
	border: 1px solid #ccc;
	padding: 5px;
}
#flashMessage {
	padding: 15px 25px;
}
/* Aggregate graph legend */
.legend {
	margin: 20px 0;
}
/* YUI Widget */
#dateFromCalendar {
	display: none;
	position: absolute;
	z-index: 100;
}
#dateToCalendar {
	display: none;
	position: absolute;
	z-index: 101;
}
#dateFromReadOnly, #dateToReadOnly {
	font-weight: bold;
}
.clickable {
	cursor: pointer;
}
.deletable:hover {
	background-color: #ffc;
}
.deletable .deleteLink {
	visibility: hidden;
}
.deletable:hover .deleteLink {
	visibility: visible;
}
.sideBar .index  {
	margin: 0 0 6px 0;
	padding: 0 0 0 6px;
	font-size: 1.2em;
	line-height: 150%;
}
.index  {
	font-size: 1.2em;
	line-height: 150%;
}
.sideBar .index .more {
	font-weight: bold;
}
.sideBar .index ul {
	margin: 0 0 6px 0;
	padding: 3px 0 0 12px;
	font-size: 90%;
}
.sideBar .index li {
	margin: 0;
	padding: 0 0 3px 0;
	list-style-type: none;
}
.sideBar .index  h3 {
	color: #555;
	border-bottom: 1px solid #CCC;
}
.sideBar .index .nav {
	font-size: 0.8em;
}
.documentation {
	font-size: 1.2em;
	line-height: 150%;
	padding-top: 1em;
}
.documentation li {
	padding-top: 0.7em;
}

.documentation h2 {
	margin: 1em 0 0 0;
	padding: 5px;
	background-color: #F1F1F1;
	font-weight: normal;
}
.documentation h3 {
	margin-top: 2em;
	border: none !important;
	color: #859F81;
	font-size: 1.5em;
	font-weight: normal;
}

.documentation p {
}


.documentation .highlight {
	color:  #555;
	background-color: #E8F5E7;
	padding: 4px;
	line-height: 140%;
}

.documentation .code {
	overflow:visible;
	background-color: #f6f6f4;
	font-family: Courier;
}
/* JQUERY Tabs */
/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .tabs-nav {
        display: none;
    }
}

/* Skin */
.tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0 0 0 4px;
}
.tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.tabs-nav li {
    float: left;
    margin: 0 0 0 1px;
}
.tabs-nav a {
    display: block;
    position: relative;
    top: 1px;
    z-index: 2;
    padding: 4px 10px 4px;

    line-height: 1.2;
    text-align: center;
    text-decoration: none;

	background-color: #F1F8F1;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright: 4px;
	-webkit-border-top-right-radius: 4px;
	-webkit-border-top-left-radius: 4px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	margin: 0 2px 0 0;
	white-space: nowrap;
}

.tabs-nav .tabs-selected a {
	background-color: #f9f9d2;
	border-bottom: 1px solid #f2f2d2;

}
.tabs-nav .tabs-selected a, .tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active {
    background-position: 0 -50px;
    outline: 0; /* @ Firefox, switch off dotted border */
}
.tabs-nav .tabs-disabled a:hover, .tabs-nav .tabs-disabled a:focus, .tabs-nav .tabs-disabled a:active {
    background-position: 0 0;
}
.tabs-nav .tabs-selected a:link, .tabs-nav .tabs-selected a:visited,
.tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.tabs-nav .tabs-disabled, .section.disabled {
    opacity: .4;
}
.tabs-container {
    border-top: 1px solid #97a5b0;
    padding: 1em 8px;
    background: #fff; /* declare background color for container to avoid distorted fonts in IE while fading */
}
/* Uncomment this if you want a little spinner to be shown next to the tab title while an Ajax tab gets loaded
.tabs-loading span {
    padding: 0 0 0 20px;
    background: url(loading.gif) no-repeat 0 50%;
}*/

/* Button */
.quickLinkButton {
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#96BC92', endColorstr='#628784'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.5,#6E9793), color-stop(0.5,#628784)); /* for webkit browsers */
	background: -moz-linear-gradient(top,  #6E9793 50%,  #628784 50%); /* for firefox 3.6+ */
	background-color:#628784;
	-moz-border-radius:5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	color:#fff;
	font-size:10px;
	padding: 1px 1px 1px 5px;
	cursor: pointer;
	opacity: .5;
}
.quickLinkButton:hover {
	opacity: 1;
}

/* Account / Plan tab */
#plan.editProperties .preField { min-width: 0; width: 120px; color: #444; }

 /* User Logs */
.logScrollArea { max-height: 200px;  overflow: auto; }
.logDate { white-space: nowrap; vertical-align: top }


/*Authentication settings*/
#accessType .errMsg{
    margin-left: 14em;
}

#accessType a.disabled{
    display: none;
}



/*Search and sort forms*/
#form_list #form_filter {


}
#form_list #form_filter a {}
#form_list #form_filter form {
	padding: 5px;
}
#form_filter .expander {
 	cursor: pointer;
 	float: right;
 	margin-top: 2px;
 	padding: 0px 5px 0 12px;
 	background-image: url(../images/twistie-closed.gif);
 	background-repeat: no-repeat;
 	background-position: center left;
}
#form_filter.expanded .expander {
	background-image: url(../images/twistie-open.gif);
}
#form_filter.expanded {
	background-color: #FaFafa;
	border-bottom: 1px solid #eee;
}
#form_filter .expandable  {
	clear: both;
	overflow: auto;
	height:  0px;
}
#form_filter.withTransition .expandable {
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
}
#form_filter.expanded .expandable {
	height: 88px;

}

.list #clear {
	visibility: hidden;
 	font-size: 85%;
 	padding: 4px 4px;
}
.list #form_sort label {
	font-size: 85%;
}
.list #form_sort {
	line-height: 24px;
 	float: right;
 	display:inline-block;
 	text-align: right;
}
.list #form_cat{
 	line-height: 24px;
 	display:inline-block;
 	font-size: 85%;
 	text-align: left;

}
.list .formID {
	font-size: 90%;
	color:#BBB;
 }

.list #form_search{

}

.list #form_search input{
    width: 97%;
    padding: 5px 5px;
    border: 1px solid #cccccc;
    border-radius:5px;
}
.list #sortMethod {

}

.list #form_search input[value]{
    color:#AAAAAA;
}

 .list li #categorized{
     padding: 5px 0 0 10px;
 }

.tinymce-fullscreen-button {
    border: 1px solid #b1b1b1;
    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25) rgba(0,0,0,0.25);
    display:inline-block;
    padding: 0px 4px;
    margin-top:2px;
    margin-left: 4px;
    background-color: #f0f0f0 !important;
    font-family: Arial;
    font-size: 12px;
    line-height: 16px;
    border-radius: 2px;
    vertical-align: top;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-tap-highlight-color: transparent;


    font-weight: bold;
	cursor: pointer;

}

.mce-container .tinymce-syntax-checker-statusbar-error, .mce-widget .tinymce-syntax-checker-statusbar-error {
	color: red;
}

.tinymce-fullscreen-button:before {
    content: "ƒ";
}
.hidden {
	display: none !important;
	visibility: hidden !important;
}

/* TinyMCE RTL */
.mce-force-rtl, .mce-container .mce-force-rtl, .mce-widget .mce-force-rtl { direction: rtl; }




/* Payment Connectors */
.breadcrumb { margin: 4px 2px; font-size:90%; text-align: right}
.breadcrumb .oi { vertical-align: bottom; display: inline-block; }
.connector-header { margin: 0; border-top-left-radius: 5px;  border-top-right-radius: 5px;
                    background-color:#419fd4; color:#Fff;
                    padding: 15px 10px; text-shadow: 0 1px 0 rgba(0,0,0,0.35);
                }
.connector-header h3 { margin:0;}
.payment-connector h4 { color:#FF7200; font-weight: normal; font-size: 80%;  margin: 2em 0 0 0;}

.connector-header p { font-size:90%;}
.connector-enabled {
    background-color:#f4f4f4; color:#527752;
    padding: 15px 10px;
    font-size:120%;
}
.connector-enabled .large { font-size: 150%; vertical-align: middle; color:green;}
.connector-disabled {
    background-color:#f4f4f4; color:#333;
    padding: 15px 10px;
    font-size:120%;
}
.connector-disabled .large { font-size: 150%; vertical-align: middle; color:red;}
.payment-connector fieldset legend {
    color: #FF7200 !important;
	margin-bottom: 0.5em;
}
.payment-connector .fieldHint {
    color: #999;
    font-size: 90%;
    padding-left: 2px;
}

.payment-connector input[type=text] {
    border: 1px inset;
    color:#444;
    padding: 5px;
    margin: 2px;
}

.payment-connector .run-mode-bar {
    border-left: 1px solid #CCC;

    border-right: 1px solid #CCC;
}
.payment-connector .run-mode { width: 40%; float: left; padding: 4px 12px; }
.payment-connector .run-mode .oneField { }
.payment-connector .run-mode label { min-width: 70px; display: inline-block; padding: 15px 0; }
.payment-connector .run-mode .warning-box { width: 60%; float: right; }
.payment-connector .run-mode .warning-box p.small { margin: 1em 0 0 1.6em; }
.payment-connector .clear-both { clear: both; }
.payment-connector .run-mode .oneField { padding-top: 6px; padding-bottom: 6px; }

.payment-connector .wholeLine {
	display: block;
}

.payment-connector .oneField label, .payment-connector .label-container {
    width: 180px;
    display: block;
	overflow: hidden;
	float: left;
}
.payment-connector .oneField label {
	margin-top: 8px;
}
.payment-connector .metadata-key-value-row .label-container label {
	display: inline-block;
	width: auto;
	margin-right: 1px;
}
.payment-connector .metadata-key-value-row .label-container input {
	width: 120px;
}

.payment-connector .editProperties {
    border-top:none;
    clear:both;
    padding-top:20px;
}
.payment-connector label.preField { margin-top: 2px; }
.payment-connector .inputFieldWithDescription {
    display: block;
	margin-left: 185px; /* corresponds to the width of .payment-connector .oneField label */
	overflow: visible; /* other values would prevent field selector from showing */
}
.payment-connector .inline { display: inline-block; }
.payment-connector .editProperties .preField { width: 23%; vertical-align: top; }
.payment-connector .inputFieldWithDescription .sourceFieldSelector,
.payment-connector .inputFieldWithDescription .sourceValueInput, .payment-connector .inputFieldWithDescription .sourceValueInputWithTinyMce {
    border: 1px inset; color:#444; padding: 5px; margin: 2px;
}
.payment-connector .inputFieldWithDescription .sourceValueInput { width: 380px; max-width: 380px; }
.payment-connector .inputFieldWithDescription .sourceValueInputWithTinyMce { width: 356px; max-width: 356px; }
.payment-connector .metadata-key-value-row .sourceValueInputWithTinyMce, .payment-connector .item-container .sourceValueInputWithTinyMce { width: 332px; max-width: 332px; }
.payment-connector .inputFieldWithDescription .sourceValueInputContainer { display: inline-block; }
.payment-connector .sourceTypeSelector { margin: 0 6px 2px 2px; padding: 1px; vertical-align: top }
.payment-connector .inputFieldWithDescription input[type=checkbox] { vertical-align: middle; }
.payment-connector .inputFieldWithDescription .sourceTypeSelector, .payment-connector .inputFieldWithDescription select { margin: 7px 6px 2px 2px; padding: 1px;  vertical-align: top;}
.payment-connector input.setting[type=checkbox] { vertical-align: bottom; margin: 0 3px 0 0; }
.payment-connector .save-bar { text-align: right; padding: 14px 8px;}
.payment-connector .save-bar .status { display: inline-block; margin-right: 1em; }
.payment-connector .save-bar .save-button { background-color: #FF7A0F; color: #FFF; font-size:150%; }
.payment-connector .save-bar .save-button:hover { background-color: #F5F5F5;}

.payment-connector .choice-button { font-size:80%; margin-left: 2px;}

.payment-connector .button, .payment-connector .okbutton { cursor: pointer; display:inline-block; border: 1px solid transparent; border-radius: 5px; -moz-border-radius: 4px; -webkit-border-radius: 4px; background-color: #595F5D; padding:3px 10px; line-height: 100%; color:#fff}
.payment-connector .button:hover, .payment-connector .okbutton:hover { text-decoration: none; background-color: #fff;  color:#000 !important;  border: 1px solid #BBB;  }
.payment-connector .button:visited, .payment-connector .okbutton:visited { color:#fff }


.payment-connector .float-left { display: block; float: left }
.payment-connector .repeatable .title,
.payment-connector .repeatable .add-button {
    padding: 2px 5px;
}
.payment-connector .repeatable .add-button .icon { margin-right:4px;}
.payment-connector .repeatable .title {
	color: #2B80AF;
	background-color: white;
	border: 1px solid #2B80AF;
	font-weight: bold;
}
.payment-connector .repeatable .item-top-panel {
}
.payment-connector .repeatable .item:first-child {
    border-top: 1px solid #f4f4f4;
}
.payment-connector .repeatable .item {
	background-color: #FAFAFA;
    padding:2px 4px;
    margin: 0;
    border-bottom: 1px solid #eee;
    border-left: 1px solid #f4f4f4;
    border-right: 1px solid #f4f4f4;
    border-top: 1px solid #FFF;
}
.payment-connector .repeatable .item .delete-button {
    width: 18px; float: right;
    padding: 2px 3px 2px 3px; margin:3px 1px 0 0;
    overflow: hidden; position: relative; z-index: 10;
    color: #FFF;
    white-space: nowrap;
}
.payment-connector .repeatable .item .delete-button .icon {
    vertical-align: baseline; margin-right: 4px;
    position: relative; z-index: 10;
}
.payment-connector .repeatable .item .delete-button:hover {
    -webkit-transition-duration: 0.4s;
    -webkit-transition-property: width;
    width: 70px;
    margin-left: -52px; /*70px - 18px*/
    z-index: 10;
    position: relative;
}
.payment-connector .repeatable .bottom-panel {
    margin-top:5px;
}

.payment-connector .choices-mapping .choice>label {
	width: 30%; max-width: 30%;
	padding-right: 10px;
	display: inline-block;
	text-align: right;
	vertical-align: middle;
}
.payment-connector .choices-mapping .choice>input {
	width: 40%;
}
.payment-connector .choices-mapping .choice>input.withTinyMce {
    width: 35%;
}
.payment-connector .connector-label {  display: block; float: right; }
.payment-connector .connector-label .icon { margin: 1px 4px 0 0; display:inline-block; vertical-align: middle;}
.payment-connector .connector-label .connector-label-text {
	font-size: 80%;
	color: rgba(0,0,0,0.5);
	font-weight: normal;
	display: inline-block;
	padding: 3px 6px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	background-color: rgba(255,255,255,0.8);
    box-shadow: 0px 1px 0px rgba(0,0,0,0.2);
	cursor: text;
    text-shadow: none;

}
.payment-connector .actions .buttons button { margin-left: 4px; }

.payment-connector .tinymce-fullscreen-button {
    height: 22px;
    width: 20px;
    text-align: center;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    line-height: 21px;
}

/* Form Field Selector */
.form-field-selector {
    display: inline-block; border: 1px solid #DDD;
    padding: 5px; margin: 2px;
    width: 320px; min-width: 320px; max-width: 320px;
    background-image: url('../images/twistie-open.gif');
    background-position: right 5px center;
    background-repeat: no-repeat;
}
.form-field-selector input, .form-field-selector input:focus {
    outline: 0; border: 0; margin: 0; padding: 0; width: 100%; height: 100%;
    background-color: transparent;
}
.form-field-selector:hover {  }
.form-field-selector .folded .no-value { color: black; }
.field-list-container {
    width: 330px; min-width: 330px; max-width: 330px; max-height: 400px;
    overflow-x: hidden; overflow-y: scroll;
    position: absolute; z-index: 99;
    background-color: #Fafafa;
    border: 1px solid #DDD;
    margin-top:5px;
    margin-left:-6px;
}
.form-field-selector .field-list-container .field-item {
    border-bottom: 1px solid #DDD;
    margin-bottom: -1px;
    padding: 4px;
    cursor: pointer;
}
.form-field-selector .no-fields-found { padding: 4px; color: #a9a9a9; }
.form-field-selector .field-list-container .field-item.highlighted {
    background-color: lightyellow;
}
.form-field-selector .field-item .section {
    padding: 2px 0;
    background-color: transparent;
}
.form-field-selector .label {
    font-weight: bold;
    display: inline-block; margin-right: 4px;
}
.form-field-selector .fieldId {
    color: #fd7a0f; border: 1px dotted #fd7a0f; border-radius: 2px; padding: 2px;
}
.form-field-selector .path {
    color: #a9a9a9;
}
.form-field-selector .label.highlight, .form-field-selector .fieldId.highlight {
    background-color: yellow;
}

/* ContentEditable React component */
.ContentEditable-react-component:empty:not(:focus):before {
	content:attr(data-placeholder)
}

.metadata-key-value-row {

}
.metadata-key-value-row .inputFieldWithDescription .sourceValueInput {
    width: 200px !important;
}


.tt-suggestion .fieldId { display:inline-block; padding-top:4px; float: right; color: #ccc; font-size:70%;}
.tt-hint {
            color: #999999;
        }

.tt-input { background-image: url(../images/twistie-open.gif);
            background-repeat: no-repeat;
            background-position: right 2px center; }
.twitter-typeahead {
}

.tt-dropdown-menu {
    background-color: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0 0 4px 4px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    margin-top: 0px;
    padding: 0 0 4px 0;
    width: 100%;
    max-height: 150px;
    overflow-y: auto;
    overflow-x: hidden;
}
.tt-suggestion {
    font-size: 14px;
    padding: 5px;
    cursor: pointer;
    border-bottom:1px solid #d4d3d5;
}
.tt-suggestion.tt-cursor {
    background-color: #0097CF;
    color: #FFFFFF;
}
.tt-suggestion p {
    margin: 0;
}

.tt-suggestion-category {
    background-color:#444444;
    padding:5px;
    font-size:10px;
    color:#f1eff2;
    margin:0px;
}
.tt-suggestion-category p {
    margin:0px;
}
.tt-sticky {
    -webkit-transform: translate3d(0,0,0);
}

.tt-previously-selected {
    background-color: #fff5da;
}


/* FORMULA EVALUATION PREVIEW */

.formula-evaluation-preview .error-message {
	color: red;
}
.tinymce-formassembly-jquery-dialog .formula-evaluation-preview .quote {
	color: blue;
	background-color: yellow;
	display: inline-block;
}
.formula-evaluation-preview .analysis .item {
	padding-top: 4px;
	padding-left: 18px;
	background: no-repeat 0 3px;
}
.formula-evaluation-preview .analysis .info {
	background-image: url("../images/information.png");
}
.formula-evaluation-preview .analysis .warning {
	background-image: url("../images/warning.gif");
	color: darkorange;
}
.formula-evaluation-preview .analysis .error {
	background-image: url("../images/exclamation.gif");
	color: red;
}
.formula-evaluation-preview .analysis code {
	background-color: yellow;
	color: black;
	padding: 0 2px;
}
.formula-evaluation-preview .response-id-editor input {
	width: 160px;
}
.formula-evaluation-preview .response-id-editor button {
	cursor: pointer; margin-left: 4px;
}

/* FORMULA EVALUATION PREVIEW in FORMULA EDITOR DIALOG */

.tinymce-formassembly-jquery-dialog .formula-evaluation-preview-container {
	padding-top: 6px;
	display: block;
	min-height: 94px;
	height: 94px;
	overflow-y: hidden;
}

.tinymce-formassembly-jquery-dialog .formula-evaluation-preview a.preview-button,
.tinymce-formassembly-jquery-dialog .formula-evaluation-preview a.preview-button:visited,
.tinymce-formassembly-jquery-dialog .formula-evaluation-preview a.change-button,
.tinymce-formassembly-jquery-dialog .formula-evaluation-preview a.change-button:visited,
.tinymce-formassembly-jquery-dialog .formula-evaluation-preview a.response-id,
.tinymce-formassembly-jquery-dialog .formula-evaluation-preview a.response-id:visited {
	color: #3F83C7;
	text-decoration: none;
}
.tinymce-formassembly-jquery-dialog .formula-evaluation-preview .header-panel {
	margin-bottom: 3px;
	padding-bottom: 2px;
	border-bottom: 1px dotted grey;
}