#surveys_keywords a {
    margin-right: 3px;
}

#surveysList {

}

#surveysList h1 {
    float: left;
}

#surveysListSearchForm {
    float: right;
}

#surveysList ul.items {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

#surveysList ul.items > li {
    padding-bottom: 20px;
    overflow: hidden;
}

#surveysList ul.items > li > .header > h2 {
    display: inline;
}

#surveysList ul.items > li > .header > .buttonS {
    display: inline;
    float: right;
}

#surveysList ul.items > li > p.description {
    font-size: 12px;
    color: #555;
}

/** *********************************************************************
 *                      HEADER, MISC
 */

ul.infos {
    list-style: none;
    margin: 0;
    padding: 0;
    color: #999;
}

ul.infos > li {
    font-size: 13px;
    margin-right: 20px;
    float: left;
    white-space: nowrap;
}

ul.infos .link {
    font-size: 13px;
    font-weight: bold;
    text-decoration: underline;
    color: #009966;
}

.survey-header {
    padding-bottom: 0;
    overflow: hidden;
}

.survey-header > h1 {
    margin-bottom: 10px;
}

.survey-header > .menu {
    list-style-type: none;
    clear: both;
    padding: 0;
    margin-left: 0;
    overflow: hidden;
}

.survey-header > .menu > li {
    display: block;
    float: left;
    margin-right: 2px;
}

.survey-header > .menu > li > a {
    padding-left: 15px;
    padding-right: 15px;
}

span.premium {
    color: maroon;
    font-weight: bold;
}

a.premium, a.premium:visited, a.premium:hover {
    background-color: maroon;
    color: white;
    font-size: 11px;
    font-weight: bold;
    text-decoration: blink;

    display: block;
    float: left;
    margin: 4px 3px 0 0;
    padding: 3px 13px 3px 15px;
}

.disabled-layer {
    position: relative;
}

.disabled-layer > .disabled-layer-mask {
    z-index: 90000;
    position: absolute;
    left: 0;
    top: 0;
    background: yellow;
    opacity: .50;
    filter: alpha(opacity = 50);
    width: 100%;
    height: 100%;
}

.survey-header > .menu > li.premium > a {
    background: maroon;
}

/** *********************************************************************
 *                      RESULTS
 */

.element {
    background: transparent url('img/default/element_bg.png') repeat-x bottom;
    margin: 10px 0 10px 0;
    padding: 5px;
    border: 1px solid #ccc;
    overflow: auto;
}

.question > .content {
    margin-left: 80px;
}

.element .number {
    float: left;
    width: 50px;
    padding: 5px;
    padding-right: 15px;
    font-size: 36px;
    font-weight: bold;
    color: #bbb;
    text-align: right;
}

.element .questiontext {
    font-size: 16px;
    font-weight: bold;
}

.element .image {
    text-align: center;
    margin-top: 5px;
}

.element .image > img {
    border: 0;
    max-width: 70%;
    margin: 20px;
}

.element .hint {
    margin-top: 3px;
    font-size: 13px;
    color: maroon;
}

.element label {
    font-size: 12px;
    font-weight: bold;
}

.SQReset > label {
    color: maroon;
    font-size: 11px;
    font-weight: bold;
    font-style: normal;
}


.results_data td {
    padding: 1px;
    vertical-align: top;
}

.results_data .percents {
    text-align: right;
    font-weight: bold;
    width: 50px;
}

.results_data .percents2 {
    text-align: right;
    font-size: 12px;
    padding-top: 2px;
    width: 40px;
}

.results_data .percents_row {
    text-align: right;
    font-weight: bold;
    color: blue;
    width: 50px;
}

.results_data .percents_col {
    text-align: right;
    font-weight: bold;
    color: red;
    width: 50px;
}

.results_data .totals {
    text-align: right;
    width: 40px;
}

.results_data .charts, .results_data .charts_row, .results_data .charts_col {
    width: 100px;
}

.results_data .charts span {
    background-color: aqua;
    background-image: url('img/results_chart_bg.png');
}

.results_data .charts_row span {
    background-color: aqua;
    background-image: url('img/results_chart_bg.png');
}

.results_data .charts_col span {
    background-color: red;
    background-image: url('img/results_chart_red_bg.png');
}

.results_data .charts span, .results_data .charts_row span, .results_data .charts_col span {
    background-repeat: repeat-x;
    background-position: top left;
    display: inline-block;
    overflow: hidden;
    height: 9px;
}

.results_data .texts {
    text-align: left;
}

.results_data .title {
    border-top: 1px solid #999;
    padding: 0;
}

.results_data .texts a {
    font-size: 11px;
    font-weight: bold;
    cursor: pointer;
}

.results_data .texts ol {
    font-size: 11px;
    max-height: 100px;
    overflow: scroll;
    margin: 0;
    display: none;
}

#results_export_switcher, #results_crosstables_switcher {
    margin-left: 20px;
    cursor: pointer;
}

#results_export, #results_crosstables {
    display: none;
}

#results_filter, #results_export, #results_crosstables, #results_link {
    margin-top: 7px;
    padding-top: 3px;
    border-top: 1px solid #999;
}

#results_filter_edit, #results_filter_delete, #results_crosstables_request {
    display: none;
}

#comments .comment {
    margin: 8px 0 2px 0;
}

#comments .comment .name {
    display: block;
    float: left;
    width: 140px;
    text-align: right;
    overflow: hidden;
}

#comments .comment .time {
    display: block;
    float: left;
    clear: left;
    width: 140px;
    text-align: right;
    overflow: hidden;
}

#comments .comment .text {
    display: block;
    margin-left: 150px;
    border-left: 1px solid #ccc;
    min-height: 40px;
}

.element_comments {
    clear: both;
    font-size: 12px;
}

.element_comments a {
    cursor: pointer;
    font-weight: bold;
}

.element_comments ol {
    max-height: 80px;
    overflow: scroll;
    border: 1px solid #ccc;
    margin: 0;
    display: none;
}

/** *********************************************************************
 *                      FILTER
 */

#filter_simple_editor {
    clear: both;
    max-height: 300px;
    overflow: auto;

    padding: 4px 0 4px 0;
    margin: 4px 0 0 0;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
}

#filter_rpn_editor {
    padding: 4px 0 0 0;
    margin: 4px 0 0 0;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
}

#filter_editor_rpn_container {
    max-height: 269px;
    overflow: auto;

    padding: 4px 0 4px 0;
    margin: 4px 0 0 0;
    border-top: 1px solid black;
}

#filter_simple_editor, #filter_rpn_editor {
    display: none;
}

.filter_survey_structure {
    border-top: 1px dashed #aaa;
    border-left: 1px dashed #aaa;
    border-right: 1px dashed #aaa;
}

.filter_survey_structure, .filter_survey_structure label, .filter_survey_structure input, .filter_survey_structure select {
    font-size: 12px;
}

.filter_survey_structure td, .filter_survey_structure th {
    border-bottom: 1px dashed #aaa;
}

.filter_survey_structure th {
    background-color: lightgoldenrodyellow;
}

.filter_survey_structure tr:hover {
    background-color: wheat;
}

.filter_survey_structure tr.set, .filter_survey_structure tr.set:hover {
    background-color: khaki;
}

.filter_survey_structure input, .filter_survey_structure select, .filter_survey_structure select option {
    padding: 0;
}




/** *********************************************************************
 *                      RESPONSE PREVIEW
 */

.question > .content > .rform {
    float: left;
}

.question > .content > .rform th, .question > .content > .rform td {
    padding: 4px;
}

.question > .content > .rform input {
    vertical-align: top;
}

.element .comment > label {
    display: block;
}

.element .comment > textarea {
    font-size: small;
}

.SQReset > label {
    cursor: pointer;
}

.SQReset {
    padding-top: 5px;
}

.hover:hover {
    background-color: #ffc;
    cursor: pointer;
}

.hoverOver {
    background-color: #ffc;
}

.question > .content {
    margin-left: 80px;
}

.question > .content > .rform {
    margin-top: 10px;
}

/** ---------------------------------- Specific for questions from default template ------------ */

.SQSCOpenInput {
     margin: 8px 0 5px 0;
}

.SQSCTable input, .SQMCTable input, .SQSDTable input {
    vertical-align: sub;
}

.SQSCTable label, .SQMCTable label, .SQSDTable td label {
    cursor: pointer;
}

.SQSDTable .slider {
    width: 200px;
    float: right;
    /*height: 10px;*/
}

.SQRanking th.available, .SQRanking th.ranking {
    width: 40%;
}

.SQRanking ul {
    list-style-type: none;
    padding: 10px;
    border: 1px solid #aaa;
    min-height: 50px;
    min-width: 150px;
}

.SQRanking ol {
    list-style-type: decimal;
    list-style-position: inside;
    padding: 10px;
    border: 1px solid #aaa;
    min-height: 50px;
    min-width: 150px;
}

.SQRanking li {
    margin: 3px 3px 3px 0;
    padding: 2px 10px 2px 10px;
    border: 1px solid #ccc;
    background-color: #f5f5f5;
    cursor: move;
}

.SQRanking li div {
    overflow: hidden;
}

.SQRanking li div img {
    float: right;
    width: 20px;
    padding-left: 3px;
    height: 20px;
    cursor: pointer;
}

.SQRanking .available .deleteImg {
    display: none;
}

.SQRanking .ranking .moveImg {
    display: none;
}

.SQRanking .placeholder {
    border: 1px dashed black;
}

.SQSCOpenInput, .SQEmail input, .SQText input, .SQText textarea {
    width: 400px;
}

.SQNumber .number {
    text-align: right;
}

.SQMatrixTable .title {
    border-top: 1px solid #999;
    padding: 0;
}

.SQMatrixTable label {
    padding: 5px;
}

/** ---------------------------------- Slider ---------------------------------- */
div.sliderBox {
  height: 3em;
  /*border: 1px solid black;*/
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 5px;
  position: relative;
  width: 100%;
}

div.tooltipSlider {
  position: absolute;
  border: 1px solid black;
  background-color: yellow;
  -moz-border-radius: 4px;
  padding: 2px;
  top: 2px;
}

div.sliderWidget {
  bottom: 5px;
  position: absolute;
  width: 200px;
}

.ui-slider { position: relative; text-align: left; }
.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 0.8em; height: 1.2em; cursor: default; }
.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; }

.ui-slider-horizontal { height: .6em; }
.ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; }
.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }
.ui-slider-horizontal .ui-slider-range-min { left: 0; }
.ui-slider-horizontal .ui-slider-range-max { right: 0; }

.ui-slider-vertical { width: .8em; height: 100px; }
.ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; }
.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; }
.ui-slider-vertical .ui-slider-range-min { bottom: 0; }
.ui-slider-vertical .ui-slider-range-max { top: 0; }


/** *********************************************************************
 *                      TOKENS
 */

#tokens {
    margin: 10px 0 10px 0;
    padding: 0;
    list-style-type: none;
}

#tokens li {
    padding-top: 2px;
}

#tokens span {
    font-size: 12px;
}

/** *********************************************************************
 *                      EDITOR - GALLERY
 */

#gallery-image {
    text-align: center;
}

#gallery-image img {
    max-height: 100px;
    max-width: 100px;
}

#editor-gallery {
    display: none;
    max-height: 200px;
    overflow: auto;
    border: 1px solid #ccc;
    clear: both;
    margin-top: 10px;
}

#editor-gallery ul {
    margin: 0;
    padding: 0;
}

#editor-gallery li {
    clear: both;
    overflow: hidden;
    padding: 3px;
}

#editor-gallery li:hover {
    cursor: pointer;
    background-color: #eee;
}

#editor-gallery li img {
    max-height: 100px;
    width: 100px;
    float: left;
    border: 1px solid black;
    margin-right: 10px;
}

#editor-gallery li span {
    font-size: 11px;
    cursor: text;
}

