/* This file is part of Lime Survey Template : citronade Copyright (C) 2007-2012 The LimeSurvey Project Team / Carsten Schmitz Copyright (C) 2010-2012 GsiLL / Denis Chenu you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This template is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. You should have received a copy of the GNU General Public License along with this program. If not, see . */ /* This part don't have to be modified */ /* Base style only */ html{font-size:100%} body{font-family:Arial, Helvetica, FreeSans, sans-serif;font-size:.85em;line-height:1.4em;color:#000;background:#FFF;margin:0;padding:0} html,body{height:100%} h1,h2,h3,h4,h5,h6{line-height:1.2em;font-weight:700;font-style:normal;margin:1em 0 .5em} h1{font-size:1.5em} h2{font-size:1.3em} h3{font-size:1.2em} h4{font-size:1.1em} ul,ol{margin:.75em 0 .75em 32px;padding:0} address{font-style:italic;margin:.75em 0} a{text-decoration:underline} a:link,a:visited{color:#11C} a:visited{color:#339} a:hover,a:focus,a:active{color:#00F} a:active{outline:none} a img{border:none} strong{font-weight:700} form,fieldset{border:none;margin:0;padding:0} input,button,select{vertical-align:middle} abbr[title]{border-bottom:1px dotted;cursor:help} blockquote{border-left:solid 2px #ddd;margin:.75em 0 .75em 20px;padding:0 0 0 10px} q cite,q q{font-style:normal} blockquote p,li p{margin:.5em 0} dt{font-weight:700;margin:.75em 0 0} dd{margin:.25em 0 .25em 32px} table{border-collapse:separate;border-spacing:0;border:1px solid gray;margin:0} table td,table th{border:1px solid #ccc;vertical-align:top;padding:4px} article,aside,dialog,figure,footer,header,hgroup,menu,nav,section{display:block} ul#surveylist{list-style:none} .hide{position:absolute;top:auto;left:-999999px} #progress-wrapper{width:252px;font-size:12px;height:20px;margin:0 auto} #progress-wrapper #progress-pre{float:left;width:45px;text-align:right;margin:0 5px 0 0} #progress-wrapper .ui-widget-content{float:left;width:150px;height:1em;text-align:left;border-color:#666;border-style:solid;border-width:1px} #progress-wrapper .ui-widget-header{background-color:#AAA;background-image:none;border:1px solid #666} #progress-wrapper #progress-post{float:left;width:45px;text-align:left;margin:0 0 0 5px} .ui-slider{width:15em;display:inline-block;border:1px solid #666;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;margin:.4em 0 .2em} .slider_showmin{float:left;width:3em;font-size:.7em;font-weight:400;text-align:left;color:#666;margin:1.4em 0 0} .slider_showmax{float:right;width:3em;font-size:.7em;font-weight:400;text-align:right;color:#666;margin:1.4em 0 0} .slider_lefttext{display:inline-block;position:relative;top:-.5em;padding-right:1em;text-align:right;font-size:.9em;color:#666} .slider_righttext{display:inline-block;position:relative;top:-.5em;padding-left:1em;font-size:.9em;color:#666} .slider_callout{overflow:hidden;position:absolute;top:-1.3em;margin-left:.8em;text-align:right;color:#333;font-size:.9em} .ie .ui-slider{display:block;float:left;} .ie .slider_lefttext {float: left;margin-top:1em;} .ie .slider_righttext {float: left;margin-top:1em;} .no-js .slider_showmin,.no-js .slider_showmax {display:none;} .no-js .slider_lefttext, .no-js .slider_righttext {display:none;} #percentcomplete{height:20px;display:block;margin:5px 0} h5,h6{font-size:1em} p,dl{margin:.75em 0} em,q,cite{font-style:italic} /* --------------------------------------------- */ /* Basic adaptation of the template : */ /* color and image */ /* --------------------------------------------- */ body {background:#FEFEFE;color:#444;} a:link {color: #5670A1;} a:visited {color: #5670A1;} a:hover, a:focus, a:active {background-color: #E5F8A8;color: #5670A1;text-decoration:none;} /* Global margin and with*/ /* width of limesurvey contents parts */ .wrapper,#content{padding:0;margin:0 auto;max-width:1024px;width:auto !important; width:1024px} /* Head decoration */ #head{ border-bottom:2px solid #AAA; border-top:2px solid #CCC; color:#5670A1; background:#dbdbdb url(header-bkg.png) repeat-x center bottom; } #head a#link-logo:hover,#head a#link-logo:focus,#head a#link-logo:active{background:transparent;} #head a#link-logo {outline: 0;} /* remove the outline on logo click */ #sitename{line-height:2;margin:0;} /* survey title color */ #title{color:#FFF;background:#5670A1;border-bottom:2px solid #C9EF50;} /* survey list */ #surveylist-container h3{color:#5670A1} ul#surveylist li a{color:#5670A1;} ul#surveylist li a.surveytitle{color:#5670A1;} /* footer color*/ #footer{background:#121A28;color:#FFF;} #footer a{color:#E5F8A8;} #footer a:hover, #footer a:focus, #footer a:active {background-color: #E5F8A8;color: #5670A1;} /* survey tool decoration */ #languagechanger select, .tools input, .tools a, input.submit, input#savebutton, input#loadbutton, input#registercontinue, .navigator input {border:1px solid #ABB8D1;background:#FEFEFE;color:#415479; -moz-box-shadow: 2px 2px 5px #ccc;-webkit-box-shadow: 2px 2px 5px #ccc;box-shadow: 2px 2px 5px #ccc; } #languagechanger select:hover, .tools input:hover, .tools a:hover, .navigator input:hover, input.submit:hover, input#savebutton:hover, input#loadbutton:hover, input#registercontinue:hover, #languagechanger select:focus, .tools input:focus, .tools a:focus, .navigator input:focus, input.submit:focus, input#savebutton:focus, input#loadbutton:focus, input#registercontinue:focus {color:#415479;background:#dcdfe6;border-color:#ABB8D1; -moz-box-shadow: 2px 2px 5px #415479;-webkit-box-shadow: 2px 2px 5px #415479;box-shadow: 2px 2px 5px #415479; } #languagechanger select:hover option{background:#FEFEFE;} /* for disabled tools */ .tools input[disabled], .navigator input[disabled], input.submit[disabled], input#savebutton[disabled], input#loadbutton[disabled], input#registercontinue[disabled], #languagechanger select[disabled] {border:1px solid #dbdbdb;background:#FEFEFE;color:#dbdbdb;cursor:inherit;} .ie .tools input, .ie .tools a, .ie .navigator input, .ie input#savebutton, .ie input#loadbutton {height:2em} .no-js input.saveall,.no-js input.clearall,.no-js input#moveprevbtn {display:none} /* gloabl information block */ .note,#tokenmessage{border:#8195BA 1px solid;background:#EEF6FF;} /* Group decoration */ .groupdescription{border: 0 solid #5670A1;border-top:0px none #5670A1;background:#EEF6FF;} .grouptitle{border: 0 solid #5670A1;border-bottom:0px none #5670A1;background:#5670A1;color:#FEFEFE} /* Question bloc decoration */ .question-wrapper{background-color:#FEFEFE;border:1px solid #5670A1;} .question-wrapper .question-text{background:#5670A1;padding:0.5em 1.5em;color:#FEFEFE} .question-wrapper .question-text a{color:#FEFEFE} .question-wrapper .question-text a:hover{color:#5670A1} .question-wrapper .question-text{font-weight:bold;} .question-wrapper .question-text strong,.question-wrapper .question-text b{font-weight:bolder;}/* see for strong and b to add some color */ .asterisk {display:none} .mandatory .asterisk {display:inline;} .asterisk {color:#FF8900;} .showqnumcode-X .qnumcode {display:none;} .qnumcode {font-style:italic;} /* input decoration */ .form input[type=text],#tokenform input[type=text] {border:1px solid #999;} .form input[type=text],#tokenform input:focus,{background-color:#F0F0F0;border-color:#666} /* tip color */ .error{color:#944} .good{color:#494} .problem{color:#944} /* input error after*/ /* If you want some round box, add round style */ .round{-moz-border-radius: 4px;-webkit-border-radius: 4px;border-radius:4px;} /* limesurvey specific tool */ /* Replacement of default progress bar */ #progress-wrapper .ui-widget-content { border-color: #161c28; background: #fefefe; color: #000; } #progress-wrapper .ui-widget-header { border-color:#161c28; background: #5670a1; color: #fefefe; font-weight: bold; } .ie .ui-slider{display:inline;} .ui-slider{border-color:#5670A1;} .slider_showmin {color:#5670A1;} .slider_showmax {color:#5670A1;} .slider_lefttext {color:#5670A1;} .slider_righttext {color:#5670A1;} .slider_callout {color: #161c28;} /* index */ #index .container{margin-top: 2em;border: 1px solid #5670A1;background:#EEF6FF;} #index .container h2{padding:0.2em 1em 0.5em;margin:0 0 0;font-size:1.1em;} #index .container h2{background:#5670A1;color:#FEFEFE;font-size:1.2em} #index .hdr{color:#5670A1;padding:0 0.5em;} #index .row{padding:0.1em 1em;cursor: pointer;color:#5670A1;text-decoration: underline;} #index .current{padding:0.1em 1em;cursor: pointer;color:#5670A1;text-decoration: none;font-weight:bold;} #index .missing{/*background: url()*/} #index .row:hover, #index .row:focus, #index .row:active {background-color: #E5F8A8;color: #5670A1;text-decoration:none;} #index .container .submit{margin:0 auto 0.5em;display:block} /* --------------------------------------------- */ /* More template adaptation */ /* --------------------------------------------- */ #container{margin:0;} /* Global container */ .ie6 #container,.ie7 #container{text-align:center} .wrapper,#content{overflow:auto;position:relative;} .ie6 .wrapper,.ie6 #content,.ie7 .wrapper,.ie7 #content{text-align:left;} #container{min-height:100%;position:relative;} #head{position:relative;} #head h1{display:inline;} #head img#logo{vertical-align:middle;} /* for the footer */ #content{padding-bottom:4.8em;} #footer {text-align:center;padding:0.8em 0 0.4em;margin:0;font-size:0.8em;font-weight:normal;} #footer{border-width:1px 0;} #footer{width:100%;position:absolute;bottom:0;left:0;} .ie6 #footer{position:relative;} .ie6 #content{padding-bottom:1em;} #footer ul#credits{width:100%;list-style: none outside;margin:0;padding:0;text-align:center;display:block;} #footer ul#credit a {display: block;} #footer ul#credit li a.ui-state-hover {font-weight:normal;}/* to be corrected */ #footer ul#credits li {list-style: none inside;margin:0;padding:0;text-align:center;} #footer ul#credits li{display:inline-block;width:33%;} #footer ul#credits li.first{text-align:left;} #footer ul#credits li.last{text-align:right;} .ie6 #footer ul#credits li,.ie7 #footer ul#credits li{width:33%;display:block;float:left;} @media screen and (max-width: 480px) { #footer ul#credits li{display:block;width:100%;} #footer ul#credits li.first{text-align:center;} #footer ul#credits li.last{text-align:center;} } /* survey title bar */ #title{margin:0;text-align:center;padding:0;} /* specific decoration */ p.url{font-size:1.2em;text-align:center;font-weight:bold} table.printouttable{width:99%} #languagechanger{margin:0.5em 0;text-align:center} /* survey list (home page) */ #surveylist-container{text-align:center} h2#surveytitle{font-size:1.2em;text-align:left;line-height:2em;} ul#surveylist li a{color:#5670A1;} /* Tool button and link */ /* tools input */ .tools input,.tools a,.navigator input,input.submit,input#savebutton,input#loadbutton,input#registercontinue,#languagechanger select {font-family:FreeSans,Arial,Helvetica,sans-serif;font-size:1em;vertical-align:middle;} tools input,.tools a,input.submit,.navigator input,input#savebutton,input#loadbutton,input#registercontinue {box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;}/* same box sizing for link and button */ .tools input,.tools a,input.submit,input#savebutton,input#loadbutton,input#registercontinue,.navigator input {margin:0;padding:3px 6px;text-decoration:none;cursor: pointer;} #languagechanger select {margin:0;padding:1px 2px;} .tools,.navigator,.tools :active,.navigator :active,.tools :focus,.navigator :focus { outline: 0 none; } .tools ::-moz-focus-inner,.navigator ::-moz-focus-inner {border:0;} .tools input,.tools a,.navigator input,input.submit,input#savebutton,input#loadbutton,input#registercontinue,#languagechanger select {-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;} /* tools list */ ul.tools{list-style: none ;margin: 0.5em ; padding: 0 ;text-align: left;} ul.tools div,ul.tools li{margin:0.1em 0;padding:0;display:inline;} ul.tools li{margin-right:1em;} ul.info{list-style: none ;text-align: center;} ul.info li{margin:0.5em 0;font-size:1.05em;} ul.info a {} .navigator{text-align:center;} /* progress */ #percentcomplete{height:2em;margin:0.5em 0;} #progress-wrapper {height: 2em;} /*surveylist (home page) */ #surveylist{margin: 0.5em auto;padding: 0;text-align: left;overflow:auto;display:inline-block;} #surveylist li{padding:0.5em 10px;} #surveylist li a.surveytitle{display:block;font-weight:bold;font-size:1.2em;padding:3px 10px;margin-bottom: 4px;border-bottom:1px dotted;text-decoration:none;} #surveylist li a.surveytitle:hover,#surveylist li a.surveytitle:focus{border-bottom:1px dotted #FFF;} /* specific box */ .note,#tokenmessage{width:80%;margin:0.5em auto;padding:1em;} #tokenform ul{list-style: none ;margin: 0.5em auto;padding: 0;text-align: center;} #tokenform ul li{} /* specific box */ #privacy{font-size:90%;font-style: italic;} #surveydescription{font-size:1.1em;color:#5670A1} #assessment table{width:80%;margin:0 auto;} div.form table{margin:0.4em auto;} div.form table td{border:0 none #CCC;} div.form table table{border:0 none #CCC;} div.form table table td{padding:0;} /* Group decoration */ .group{margin-bottom: 2em} .groupdescription{padding:0 1.5em;margin:0 0 0.5em;} .grouptitle{line-height:2em;padding:0 1em;margin:0;font-size:1.1em;} /* Question decoration */ .question-wrapper{margin:1em 0;} .question-text{border-bottom:none 0px #FFF;} .question-wrapper .answers-wrapper{overflow:auto;overflow-y:hidden;} .answers-wrapper{padding:0.5em 1em;margin:0.5em auto;} .question-help,.help{padding:0 1em;margin:0.5em auto 0;clear:both;} .question-help img{margin:1px 5px 5px 1px;} /* tip bloc */ .help-wrapper ,.tip{font-style:italic;margin:0.5em auto;width:96%;line-height: 150%;} .help-wrapper {font-size:0.8em;} .help-wrapper .error,.help-wrapper .error-wrapper{color:#944;font-weight:bold} .help-wrapper .success,.help-wrapper .good,.help-wrapper .ok{color:#444} .help-wrapper .problem{color:#944} .help-wrapper .errormandatory{color:#944;font-weight:1em;} .help-wrapper .errormandatory br:first,.help-wrapper .errormandatory strong br:first{display:none;} .mandatory br{display:none;}/* don't put linefeed at start of an error box */ .help-wrapper .mandatory{display:none;} .input-error .help-wrapper .mandatory{display:block;} .answer-wrapper .tip{text-align:left;font-size:0.8em;} /* input error */ input[type="text"].tip,input.tip,input.tip{border:0;background:transparent} /* input decoration */ .answers-wrapper input.text,.answers-wrapper textarea,.answers-wrapper input[type=text] {margin:3px;padding:2px;} .form input[type=text],.answers-wrapper input.text,.answers-wrapper textarea, .answers-wrapper input[type=text] {border:1px solid #999;-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius:3px;} .mandatory .answers-wrapper textarea.empty,.mandatory .answers-wrapper input[type=text].empty, .answers-wrapper textarea.error, .answers-wrapper input[type=text].error{ border:1px solid #944;color:#444;background-color:#FEF; } .mandatory .answers-wrapper textarea.good,.mandatory .answers-wrapper input[type=text].good { border:1px solid #999;color:#444;background-color:#FFF; } .answers-wrapper textarea.good, .answers-wrapper input[type=text].good{ border:1px solid #494;color:#444 } .other .answers-wrapper textarea.good,.other .answers-wrapper input[type=text].good{ border:1px solid #494;color:#444 } .answers-wrapper textarea.empty, .answers-wrapper input[type=text].empty{ border:1px solid #999;color:#444;background-color:#FFF; } .answers-wrapper textarea[disabled], .answers-wrapper input.text[disabled], .answers-wrapper input[type=text][disabled] , .answers-wrapper input.text.good[disabled], .answers-wrapper input.good[type=text][disabled] , .answers-wrapper input.text.error[disabled], .answers-wrapper input.error[type=text][disabled] , .answers-wrapper textarea.empty[disabled], .answers-wrapper input[type=text].empty[disabled] { background-color:#FFF;border-color:#EEE;color:#EEE; } .answers-wrapper textarea:focus, .answers-wrapper input.text:focus, .answers-wrapper input[type=text]:focus{ background-color:#FFF;border-color:#666;color:#222; -moz-box-shadow: 1px 1px 3px #555; -webkit-box-shadow: 1px 1px 3px #555; box-shadow: 1px 1px 3px #555; } .answers-wrapper input.checkbox[disabled],.answers-wrapper input.radio[disabled]{ opacity:0.3; } /* specific questions color and background*/ table.question{border-color:#D5DBE7;} table.question tbody{border-color:#D5DBE7;} table.question tr{border-color:#D5DBE7;} table.question th{border-color:#D5DBE7;} table.question td{border-color:#EFF1F6;} table.question thead td{border-color:#D5DBE7;} table.question tbody td.ddarrayseparator:hover{background:#EFF1F6;} .array-flexible-column table.question col.even {background:#FEFEFE} .array-flexible-column table.question col.odd {background:#F4F6F9} table.question tr.array1,table.question tbody tr.array1:hover th {background:#FEFEFE} table.question tr.array2,table.question tbody tr.array2:hover th {background:#F4F6F9} table.question tbody tr:hover {background:#D5DBE7} table.question tbody tr td:hover{background:#E5F8A8} /* for boilerplate color and background */ .boilerplate {} /* not using (todo: verify) */ .printouttitle {} .surveytitle {} .surveytitle:hover {} /* --------------------------------------------- */ /* JQUERY ui replace */ /* --------------------------------------------- */ /*** Start jQuery UI Theme Styles ***/ button.ui-button::-moz-focus-inner { border: 0; padding: 0; /* Get rid of extra padding in focused button in FF */ } .ui-corner-all { -moz-border-radius: 4px; border-radius:4px; } .ui-button { position: relative; padding: 0.1em 0 0.1em 0; cursor: pointer; font-family: FreeSans,Arial,Helvetica,sans-serif; font-size: 1.0em; font-weight: normal; line-height: normal; } .ui-button-icon-only { width: 2.2em; } button.ui-button-icon-only { width: 2.4em; /* Button elements seem to need a little more width */ } .ui-button-icons-only { width: 3.4em; } button.ui-button-icons-only { width: 3.7em; } /* Button text elements */ .ui-button-text-only .ui-button-text { padding: 0 1em; } .ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { text-indent: -9999999px; } .ui-button-text-icon-primary .ui-button-text { padding: 0 0.7em 0 1.7em; } .ui-button-text-icon-secondary .ui-button-text { padding: 0 1.7em 0 0.7em; } .ui-button-text-icons .ui-button-text { padding: 0 1.7em; } input.ui-button { padding: 0.1em 1em 0.1em 1em; /* No icon support for input elements, provide padding by default */ } /* Button icon element(s) */ .ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: 50%; margin-top: -8px; } .ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px; } .ui-button-text-icon-primary .ui-button-icon-primary, .ui-button-text-icons .ui-button-icon-primary, .ui-button-icons-only .ui-button-icon-primary { left: .4em; } .ui-button-text-icon-secondary .ui-button-icon-secondary, .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .4em; } .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .4em; } /* Button sets*/ .ui-buttonset { margin-right: 7px; } .ui-buttonset .ui-button { margin-left: 0; margin-right: -.3em; } /* IE6/7 hacks 8 */ .ui-button, input.ui-button { *padding: 0.1em 0 0.1em 0; } .ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { *margin-top: -9px; } .ui-button-text-icon-primary .ui-button-text { *padding: 0 0 0 1.0em; } .ui-button-text-icon-secondary .ui-button-text { *padding: 0 1.2em 0 0; } .ui-button-text-icons .ui-button-text { *padding: 0 1.0em; } /*** End jQuery UI Theme Styles ***/ /* Component containers ----------------------------------*/ .ui-widget { font-family: Arial, Helvetica, FreeSans, sans-serif; font-size: 1.1em; } .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Arial, Helvetica, FreeSans, sans-serif;; font-size: 1em; } .ui-widget-content { border: 1px solid #161c28; background: #fefefe; color: #000; } .ui-widget-content a { color: #000; } .ui-widget-header { border: 1px solid #161c28; background: #5670a1; color: #fefefe; font-weight: bold; } .ui-widget-header a { color: #fefefe; } /* Interaction states ----------------------------------*/ .ui-state-default, .ui-widget-content .ui-state-default { border: 1px solid #abb8d1; background: #fefefe; font-weight: normal; color: #5670a1; outline: none; } .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #5670a1; text-decoration: none; outline: none; } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus { border: 1px solid #abb8d1; background: #eff1f6; font-weight: normal; color: #415479; outline: none; } .ui-state-hover a, .ui-state-hover a:hover { color: #415479; text-decoration: none; outline: none; } .ui-state-active, .ui-widget-content .ui-state-active { border: 1px solid #415479; background: #d5dbe7; font-weight: normal; color: #161c28; outline: none; } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #161c28; outline: none; text-decoration: none; } /* Interaction Cues ----------------------------------*/ .ui-state-highlight, .ui-widget-content .ui-state-highlight {border: 1px solid #fcefa1; background: #fefefe; color: #363636; } .ui-state-highlight a, .ui-widget-content .ui-state-highlight a { color: #363636; } .ui-state-error, .ui-widget-content .ui-state-error {border: 1px solid #cd0a0a; background: #fef1ec; color: #cd0a0a; } .ui-state-error a, .ui-widget-content .ui-state-error a { color: #cd0a0a; } .ui-state-error-text, .ui-widget-content .ui-state-error-text { color: #cd0a0a; } .ui-state-disabled, .ui-widget-content .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; } .ui-priority-primary, .ui-widget-content .ui-priority-primary { font-weight: bold; } .ui-priority-secondary, .ui-widget-content .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; } /* Overlays */ .ui-widget-overlay { background: #aaaaaa 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); } .ui-widget-shadow { margin: -8px 0 0 -8px; padding: 8px; background: #aaaaaa 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); -moz-border-radius: 8px; -webkit-border-radius: 8px; } .alert .ui-dialog-titlebar {display:none} /* ------------------------------------------------- START: Question styles ------------------------- */ /* ===================================== == Full list of question classes ======= .boilerplate ,.numeric ,.choice-5-pt-radio ,.yes-no ,.gender ,.date ,.numeric-multi ,.numeric ,.list-radio ,.list-radio-flexible ,.list-with-comment ,.list-dropdown ,.list-dropdown-flexible ,.ranking ,.numeric-multi ,.language ,.multiple-opt-comments ,.multiple-short-txt ,.text-short ,.text-long ,.text-huge ,.numeric-multi ,.array-5-pt ,.array-10-pt ,.array-yes-uncertain-no ,.array-increase-same-decrease ,.array-flexible-row ,.array-flexible-column ,.slider ,.array-multi-flexi ,.array-multi-flexi-text ,.array-flexible-duel-scale */ /* answer table */ table.question{border-width:0 0 1px 0;border-style:solid;width:99%;} table.question tbody{border-width:0 1px 0 0;border-style:solid;} table.question thead th{border-width:1px 1px 0px 0px;border-style:solid;} table.question thead td,table.question thead th:first-child{border-width:0px 1px 0px 0px;border-style:solid;} table.question tbody th{border-width:1px 1px 0px 1px;border-style:solid;} table.question tbody td{border-width:1px 1px 0px 0px;border-style:solid;} table.question tbody th.answertext,table.question tbody th.arraycaptionleft{text-align:right;} table.question tbody th.answertextright{text-align:left;} table.question thead th{text-align:center;vertical-align:middle} table.question tbody td{text-align:center;vertical-align:middle} table.question tbody td.ddarrayseparator{border-top-width: 0px;} /* remove the list dot */ .answers-wrapper ul { list-style: none; margin:0.75em 0; } .answers-wrapper li { list-style-type: none; text-align: left; margin: 1em 0; } .answers-wrapper label:hover { color:#222; } .ie .multiple-opt-comments .answers-wrapper, .ie .multiple-short-txt .answers-wrapper, .ie .numeric-multi .answers-wrapper, .ie .multiple-opt .answers-wrapper {overflow:hidden;} /* some inline list */ .choice-5-pt-radio .answers-wrapper ul li ,.yes-no .answers-wrapper ul li ,.gender .answers-wrapper ul li { display: inline; padding: 0 1em 0 0; text-align:left; } @media screen and (max-width: 640px) { .choice-5-pt-radio .answers-wrapper li ,.list-radio-flexible .answers-wrapper li ,.list-radio .answers-wrapper li ,.list-with-comment .answers-wrapper li { margin-left: 0; } } .list-radio-flexible li{width:auto;} .list-radio-flexible ul{width:auto;margin:0 auto 0.5em;} table.rank{width:98%;table-layout:fixed;} table.rank, table.rank table{border:0px none #FFF;border-collapse:collapse} table.rank td{border-width:1px;} table.rank table td{border-width:0px;} .numeric-multi ul.slider.computed { width: 14em; } .boilerplate {} .choice-5-pt-radio .answers-wrapper ul ,.yes-no .answers-wrapper ul ,.gender .answers-wrapper ul { text-align: center; } .choice-5-pt-radio .answers-wrapper ul li ,.yes-no .answers-wrapper ul li ,.gender .answers-wrapper ul li { display: inline; padding: 0 2em 0 0; text-align:left; } p.question { margin-left: 1em;margin-right: 1em; font-weight: normal; text-align:center; } table.rank, table.rank table{border:0px none #FFF;border-collapse:collapse} table.rank{margin:0.3em auto;} table.rank select{width:99%;min-width:10em;padding-left:0.3em;} table.rank td{border:1px solid #D5DBE7} table.rank table td{border:0px none #D5DBE7} table.rank input{border:1px solid #999} .list-dropdown-flexible .question, .list-dropdown .question, .language .question { text-align:center; } .list-with-comment div.list { width: 47%; float: left; padding: 0.5em; } .list-with-comment p.select { width: 47%; float: left; padding: 0.5em; margin: 0; } .list-with-comment div.list p { margin: 0; text-align: left; } .list-with-comment p.comment { margin: 0%; padding: 0.5em; text-align: left; float: left; width: 47%; } .list-with-comment p.comment textarea { width: 100%; } @media screen and (max-width: 480px) { .list-with-comment div.list , .list-with-comment p.select , .list-with-comment p.comment { width: 99%; float: none; } } .multiple-opt-comments ul ,.multiple-short-txt ul ,.numeric-multi ul ,.multiple-opt ul { padding: 0 0.5em; margin: 1em 0; width:99%; } .numeric-multi ul {} .numeric-multi ul.computed { float:left; padding-left: 0;padding-right: 2em; } .numeric-multi ul.slider.computed { width: 14em; } .numeric-multi ul ,multiple-opt ul ,.multiple-opt-comments ul ,.multiple-short-txt ul { display: block; width:99%; } .numeric-multi ul li , .multiple-opt ul li , .multiple-opt-comments ul li , .multiple-short-txt ul li { display: block; } .numeric-multi ul li label ,.multiple-short-txt ul li label { text-align:right; } .multinum-slider{text-align:center;display:inline;} .numeric-multi ul li span.input ,.multiple-opt-comments ul li span.comment ,.multiple-short-txt ul li span { text-align: left; } .numeric-multi .answers-wrapper ul , .multiple-short-txt .answers-wrapper ul , .multiple-opt-comments .answers-wrapper ul { display:table; } .numeric-multi .answers-wrapper ul li , .multiple-short-txt .answers-wrapper ul li , .multiple-opt-comments .answers-wrapper ul li { display:table-row; } .numeric-multi .answers-wrapper ul li label, .numeric-multi .answers-wrapper ul li span , .multiple-short-txt .answers-wrapper ul li label, .multiple-short-txt .answers-wrapper ul li span , .multiple-opt-comments .answers-wrapper ul .option, .multiple-opt-comments .answers-wrapper ul .comment { display:table-cell; vertical-align:middle; width:50%; padding:0.3em 0.5em 0.7em; } .numeric-multi .answers-wrapper ul li label span , .multiple-short-txt .answers-wrapper ul li label span { display:inline; width:auto } .numeric-multi .answers-wrapper ul li span span , .multiple-short-txt .answers-wrapper ul li span span { display:inline-block; width:5em; text-align:center; font-weight:bold; } .ie6 .numeric-multi ul li label,.ie7 .numeric-multi ul li label ,.ie6 .multiple-opt-comments ul li span.option,.ie7 .multiple-opt-comments ul li span.option ,.ie6 .multiple-short-txt ul li label,.ie7 .multiple-short-txt ul li label { clear:left; float:left; width:45%; padding: 0.3em 1em 0 0; } .multiple-opt .answers-wrapper ul li , .list-radio .answers-wrapper ul li , .list-radio-flexible .answers-wrapper ul li { padding-right:0;padding-left:35%; } .multiple-opt .answers-wrapper ul li label , .multiple-opt-comments .answers-wrapper ul li label , .list-radio .answers-wrapper ul li label , .list-radio-flexible .answers-wrapper ul li label , .list-with-comment .answers-wrapper ul li label { display:inline-block;vertical-align: middle; } .multiple-opt-comments .answers-wrapper ul li .option , .list-with-comment .answers-wrapper ul li { padding-left:30px; } .multiple-opt .answers-wrapper ul li input.checkbox , .multiple-opt-comments .answers-wrapper ul li input.checkbox , .list-radio .answers-wrapper ul li input.radio , .list-radio-flexible .answers-wrapper ul li input.radio , .list-with-comment .answers-wrapper ul li input.radio { margin-left:-30px;vertical-align: middle; } .multiple-opt .answers-wrapper ul li.other input.checkbox{visibility: hidden;} @media screen and (max-width: 640px) { .multiple-opt .answers-wrapper ul li .multiple-opt-comments .answers-wrapper ul li , .list-radio .answers-wrapper ul li , .list-with-comment .answers-wrapper ul li , .list-radio-flexible .answers-wrapper ul li { padding-left:30px; } .multiple-opt-comments .answers-wrapper ul .comment input { width:99%; } } @media screen and (max-width: 480px) { .numeric-multi .answers-wrapper ul li label, .numeric-multi .answers-wrapper ul li span , .multiple-short-txt .answers-wrapper ul li label, .multiple-short-txt .answers-wrapper ul li span , .multiple-opt-comments .answers-wrapper ul .option, .multiple-opt-comments .answers-wrapper ul .comment { display:block; width:99%; } } .text-short input ,.text-short textarea ,.text-long textarea ,.text-huge textarea { margin-right: 0;margin-left: 1em; text-align:left; } .text-short .question ,.text-short .answers-wrapper ,.text-long .answers-wrapper ,.text-huge .answers-wrapper { text-align:center; } /* multi column */ ul.cols-2 , table.cols-2 , ul.cols-3 , table.cols-3 , ul.cols-4 , table.cols-4 , ul.cols-5 , table.cols-5 , ul.cols-6 , table.cols-6 , ul.cols-7 , table.cols-7 , ul.cols-8 , table.cols-8 { width: 98%; margin: 0% auto 0% auto; } ul.cols-2 li , ul.cols-2-ul , ul.cols-3 li , ul.cols-3-ul , ul.cols-4 li , ul.cols-4-ul , ul.cols-5 li , ul.cols-5-ul , ul.cols-6 li , ul.cols-6-ul , ul.cols-7 li , ul.cols-7-ul , ul.cols-8 li , ul.cols-8-ul { float: left; padding: 0; white-space: normal } .list-radio-flexible .answers-wrapper ul.cols-2 li ,.list-radio-flexible .answers-wrapper ul.cols-2-ul li ,.list-radio-flexible .answers-wrapper ul.cols-3 li ,.list-radio-flexible .answers-wrapper ul.cols-3-ul li ,.list-radio-flexible .answers-wrapper ul.cols-4 li ,.list-radio-flexible .answers-wrapper ul.cols-4-ul li ,.list-radio-flexible .answers-wrapper ul.cols-5 li ,.list-radio-flexible .answers-wrapper ul.cols-5-ul li ,.list-radio-flexible .answers-wrapper ul.cols-6 li ,.list-radio-flexible .answers-wrapper ul.cols-6-ul li ,.list-radio-flexible .answers-wrapper ul.cols-7 li ,.list-radio-flexible .answers-wrapper ul.cols-7-ul li ,.list-radio-flexible .answers-wrapper ul.cols-8 li ,.list-radio-flexible .answers-wrapper ul.cols-8-ul li ,.list-radio .answers-wrapper ul.cols-2 li ,.list-radio .answers-wrapper ul.cols-2-ul li ,.list-radio .answers-wrapper ul.cols-3 li ,.list-radio .answers-wrapper ul.cols-3-ul li ,.list-radio .answers-wrapper ul.cols-4 li ,.list-radio .answers-wrapper ul.cols-4-ul li ,.list-radio .answers-wrapper ul.cols-5 li ,.list-radio .answers-wrapper ul.cols-5-ul li ,.list-radio .answers-wrapper ul.cols-6 li ,.list-radio .answers-wrapper ul.cols-6-ul li ,.list-radio .answers-wrapper ul.cols-7 li ,.list-radio .answers-wrapper ul.cols-7-ul li ,.list-radio .answers-wrapper ul.cols-8 li ,.list-radio .answers-wrapper ul.cols-8-ul li ,.multiple-opt .answers-wrapper ul.cols-2 li ,.multiple-opt .answers-wrapper ul.cols-2-ul li ,.multiple-opt .answers-wrapper ul.cols-3 li ,.multiple-opt .answers-wrapper ul.cols-3-ul li ,.multiple-opt .answers-wrapper ul.cols-4 li ,.multiple-opt .answers-wrapper ul.cols-4-ul li ,.multiple-opt .answers-wrapper ul.cols-5 li ,.multiple-opt .answers-wrapper ul.cols-5-ul li ,.multiple-opt .answers-wrapper ul.cols-6 li ,.multiple-opt .answers-wrapper ul.cols-6-ul li ,.multiple-opt .answers-wrapper ul.cols-7 li ,.multiple-opt .answers-wrapper ul.cols-7-ul li ,.multiple-opt .answers-wrapper ul.cols-8 li ,.multiple-opt .answers-wrapper ul.cols-8-ul li , ul.cols-2 li , ul.cols-2-ul li , ul.cols-3 li , ul.cols-3-ul li , ul.cols-4 li , ul.cols-4-ul li , ul.cols-5 li , ul.cols-5-ul li , ul.cols-6 li , ul.cols-6-ul li , ul.cols-7 li , ul.cols-7-ul li , ul.cols-8 li , ul.cols-8-ul li { padding: 0 0.5em;margin:0 0 0.5em; } ul.cols-2 li input.checkbox, ul.cols-2-ul li input.checkbox , ul.cols-2 li input.radio, ul.cols-2-ul li input.radio , ul.cols-3 li input.checkbox, ul.cols-3-ul li input.checkbox , ul.cols-3 li input.radio, ul.cols-3-ul li input.radio , ul.cols-4 li input.checkbox, ul.cols-4-ul li input.checkbox , ul.cols-4 li input.radio, ul.cols-4-ul li input.radio , ul.cols-5 li input.checkbox , ul.cols-5-ul li input.checkbox , ul.cols-5 li input.radio , ul.cols-5-ul li input.radio , ul.cols-6 li input.checkbox , ul.cols-6-ul li input.checkbox , ul.cols-6 li input.radio , ul.cols-6-ul li input.radio , ul.cols-7 li input.checkbox, ul.cols-7-ul li input.checkbox , ul.cols-7 li input.radio, ul.cols-7-ul li input.radio , ul.cols-8 li input.checkbox, ul.cols-8-ul li input.checkbox , ul.cols-8 li input.radio, ul.cols-8-ul li input.radio { margin-left: 0 !important;margin-right: 0 !important; } ul.cols-2 li , ul.cols-2-ul , table.cols-2 td { width: 49.9%; } ul.cols-3 li , ul.cols-3-ul , table.cols-3 td { width: 33.3%; } ul.cols-4 li , ul.cols-4-ul , table.cols-4 td { width: 24.9%; } ul.cols-5 li , ul.cols-5-ul , table.cols-5 td { width: 19.9%; } ul.cols-6 li , ul.cols-6-ul , table.cols-6 td { width: 16.6%; } ul.cols-7 li , ul.cols-7-ul , table.cols-7 td { width: 14.2%; } ul.cols-8 li , ul.cols-8-ul , table.cols-8 td { width: 12.4%; } input.text,textarea{ text-align: start; } /* STYLES NOT YET DEFINED - - - - - .yes-no {} .gender {} */ /* Tips / Validation Messages */ /* If the question is invalid, but has not been submitted, give it a pleasant warning color */ .hide-tip .good { display: none; } .hide-tip .error { } .input-error .hide-tip .error { display: block; }