@charset "UTF-8";
/* CSS Document */

body{
font-family: 'Roboto', Helvetica, Arial, sans-serif;

color:#000;
margin:0px;
text-align: center
}
textarea{
font-family: 'Roboto', Helvetica, Arial, sans-serif;


}

/* main backgrounds */



form,.finalpage{
text-align:left;
border: 0px;
width:auto;
padding:20px;
line-height:20px;
font-size:16px;
margin: 0px;
padding-bottom:0px;
}
	#mainposition{	
width:  90%;
margin: 0 auto;
background:#FFFFFF;		
border-left: 1px solid #CCCCCC;
border-right: 1px solid #CCCCCC;

text-align:left;
-webkit-box-shadow: 4px 8px  #aaaaaa,  -4px 0 8px #aaaaaa;   
-moz-box-shadow: 4px 0 8px #aaaaaa,  -4px 0 8px #aaaaaa;   
box-shadow: 4px 0 8px #aaaaaa,  -4px 0 8px #aaaaaa; 
}

#header{
padding:20px;
background:#de1d0c;
}

h1{

margin-top:0px;
}
#header p{
font-family: 'Roboto', Helvetica, Arial, sans-serif;
font-size: 55px;
color:#ffffff;
}
#header.smaller p{
font-size: 28px;

}
a:link,a:visited {color: #de1d0c;  text-decoration:underline;} 

a:hover {color: #CCCCCC;  text-decoration:none;}

#annotate{
font-size:11px;
text-align:right;
}


label {
}
p
{ margin: 0; padding: 0; }


/* show / hides needed for routing */
.sshow{
Z-INDEX: 100;
Right: 0px;
WIDTH: 100%;
POSITION: relative;
TOP:0px;
visibility: visible;
}
.hhide{
Z-INDEX: 1;
Right: 0px;
WIDTH: 1px;
Height: 1px;
POSITION: absolute;
TOP:0px;
visibility: hidden;
}

#progress{
margin-top:20px;
margin-bottom:15px;

position:relative;
width:100%;
padding: 0px;
height: 17px;
white-space:nowrap;
overflow:hidden;
-moz-border-radius: 15px;
border-radius: 15px;
border: solid 1px #ffffff;
}
#header #progress p{
font-size:11px;
margin:0px;
margin-left:5px;
color:#de1d0c;
}
#progress div{
display:block;
}
#progresscolor{
-moz-border-radius: 10px;
border-radius: 10px;
position:relative;
background-color: #ffffff;
color:#de1d0c;
overflow:hidden;
height: 15px;
border: solid 1px #ffffff;
}



/* submit button */
.next,.end{
z-index: 1;
border: 0px;
margin:0px;
overflow:hidden;
text-align:right;

}
.next{
padding:20px;
background:#de1d0c;
margin-left:-20px;
margin-right:-20px;
}
.next input{
cursor:pointer;
background:#FFFFFF;
color:#de1d0c;
font-size:28px;
border: 1px solid #FFFFFF;
border-radius:10px;
padding:10px;
width:200px;
}
.next input:hover{
opacity:0.8;
filter:alpha(opacity=80);
}
/* completed, kick message */
#message{
text-align:center;
position:relative;
font-weight:bold;
font-size:17px;	
margin:20px;
}
#message .continue{
background:#CCCCCC;
padding:4px;
display:block;

width:130px;
margin:auto;
margin-top:10px;
border-radius:4px;
border: 1px solid #000000;
color:#000000;
font-weight:normal;
}
#message:hover .continue{

border: 2px solid #000000;
padding:3px;
}
/* deviding lines */
.line{
position:relative;
margin-left:-20px;
margin-right:-20px;
margin-top:20px;
margin-bottom:20px;
border-top: 1px solid #747069;
-webkit-box-shadow: 2px 0 5px 2px #ddd; 
-moz-box-shadow: 2px 0 5px 2px #ddd; 
box-shadow: 2px 0 5px 2px #ddd; 
overflow:hidden;
clear:both;
}
.thinline{
position:relative;
margin-top:10px;
background-color:#747069;
height:2px;
width: 100%;
}
HR{margin-top:10px;padding-top: 10px; color: #747069; height: 2px;}


/* inputs */
input,select{
font-size:14px;

cursor:hand;
line-height:18px;
color:#000;
}

.txtarea{

border:1px solid #747069;

padding:4px;
font-size: 15px;
color:#000;
}
.textfield{
border:1px solid #747069;
padding:4px;
text-indent:3px;
font-size: 15px;

}

	select, input, textarea,.slidercontainer{
width:70%;
padding:5px;
}


/* main prompt, and options */
.prompt,heading{
display: block; 
text-align:left; 
padding-bottom: 10px;
padding-top: 5px;
line-height:22px;

}

.radio_prompts,.checkbox_prompts{
position:relative;
font-size:16px;
cursor:pointer;
line-height:24px;
display:-moz-inline-box;
display:inline-block;
margin-bottom:20px;
margin-right: 5px;
word-wrap: break-word;
text-align:right;
vertical-align:top;
}
.radio_prompts:hover,.checkbox_prompts:hover{
opacity:0.8;
filter:alpha(opacity=80);


}
.horizontal_radios{
padding: 0px;
padding-left:8px;
}




.ui-slider .ui-slider-handle{
height:40px;
background:#de1d0c;
cursor:pointer;
}
.ui-slider-horizontal .ui-slider-handle{
width:20px;
height:40px;
top:-15px;
}
.ui-slider-vertical .ui-slider-handle{
height:20px;
}
.vslider {
    display: block;
    float: right;
    overflow: hidden;
    position: relative;
    text-align: center;
width: 140px;
height:350px;
}
.vslider div{
margin:auto;
margin-top:10px;
height:300px;
}
.vsliderlabel {
    display: block;
    float: right;
    font-size: 14px;
    margin: 5px 5px 10px;

    position: relative;
    text-align: center;
    width: 130px;
}


.grid_label{
 display:block;float:left;position:relative;text-align:center;
font-size:15px;

}

.gridkey{
position:relative;
	margin-bottom:20px;
 clear:both;
 width:70%;float:right;
}
.grid{
position:relative;

}
.grid_icons{

margin:0px;
list-style:none;
width:100%;
}
.grid_icons ul{
margin:0px;
padding:0px;
}
.grid_icons li{
height:100px;


background-position:center;
background-repeat:no-repeat;
background-color:#dddddd;
cursor:pointer;
}
.grid_icons li:hover, .grid_icons li.thinking{
background-color:#de1d0c;

}
 .grid_icons li.picked{
 background-color:#000000;
 }
.grid label{

height:100px;
text-align:right;

}
.grid label div{
padding-right:10px;
padding-top:30px;
}
.grid .prompt{
width:30%;
float:left;
height:100px;
padding:0px;
border-bottom:1px solid #de1d0c;
}
.grid .prompt table{
width:100%;
text-align:right;
padding-right:20px;
height:100px;
}
.gridcontainer{
width:70%;

margin-bottom:0px;
text-align:center;
float:right;
border-bottom:1px solid #de1d0c;
}
.grid li{
display:block;float:left;
}
.slidercontainer{
width:70%;
padding:0px;
margin-top:20px;
margin-bottom:40px;
float:right;
}


.slider_label{
width:100%;

}
.slider_label td{
text-align:center;
 font-size:14px;
}
.sliderkey{
width:100%;
}
.slider{
text-align:center;
margin:auto;
margin-top:20px;
width:90%;
}
.image_prompts,.image_prompts_check,.option_prompts,.option_prompts_check{
display:block;
width:20%;
height:150px;
cursor:pointer;
color:#000000;
float:left;
margin-right:10px;
margin-bottom:10px;
border-radius:10px;
border: 2px solid #de1d0c;
overflow:hidden;
}
/* image checkboxes */
.image_prompts{

background-position:center;
background-repeat:no-repeat;
background-color:#ffffff;

}
.image_prompts .tick{
display:none;
}
.image_prompts_check .tick{
display:block;
width:100%;
height:150px;
background-image:url(images/transtick.png);
background-size:100%;
background-position:center;
background-repeat:no-repeat;
border-radius:15px;

}
.image_prompts_dislike .tick{
display:block;
width:100%;
height:150px;
background-image:url(images/transdislike.png);
background-size:100%;
background-position:center;
background-repeat:no-repeat;
border-radius:15px;

}
.check_likedislike .image_prompts .details,.check_likedislike .image_prompts_check .details,.check_likedislike .image_prompts:hover .details{
display:none;
}
.image_prompts .details{
display:block;
text-align:center;
bottom:0px;
padding:5px;
background:#ffffff;
opacity:0.8;
filter:alpha(opacity=80);
margin-top:5px;
}
.image_prompts_check .details,.image_prompts .details,.image_prompts_check:hover .details{
display:block;
opacity:0.8;
filter:alpha(opacity=80);
}
.image_prompts:hover .details{
display:block;
opacity:1;
filter:alpha(opacity=100);
}
		
/* large word checkboxes */


.option_prompts{
background-repeat:no-repeat;
background-color:#FFFFFF;
}
.option_prompts:hover{
opacity:0.5;
filter:alpha(opacity=50);

}
.option_prompts textarea{
display:none;
}

.option_prompts_check{
background-image:url(images/tick.png);
background-size:100%;
background-position:center;
background-repeat:no-repeat;
background-color:#ffffff;
}

.option_prompts table,.option_prompts_check table{
font-size:16px;
font-weight:bold;
width:100%;
height:150px;
text-align:center;
word-wrap:break-word;
}
.option_prompts_check textarea{
margin-left:8px;
margin-top:8px;
font-size:13px;

display:block;
width:100%;
height:140px;
padding:5px;
border:1px solid #000000;
overflow: auto; 
}


/* javascript games */
.axis_me {
margin:10px;
position: absolute;
height:100px;
display:block;
cursor:pointer;
z-index:2;
}
.axis_me div{
display:block;
margin:10px;
text-align:center;
}
.axis_me .tip{
margin:0px;
margin-top:-10px;
margin-left:40px;
padding:3px;
font-size:12px;
opacity:0;
filter:alpha(opacity=0);

}
.axis_me:hover .tip{
margin:0px;
margin-top:-10px;
margin-left:40px;
padding:2px;
font-size:12px;
opacity:0.6;
filter:alpha(opacity=70);
background:#de1d0c;
color:#FFFFFF;
}




#drag_cont {
margin-top:20px;
height: 500px; 
width: 100%;
position: relative;

}
#drag_cont.rotated{
	height:260px;
}
#drag_cont.rotated .drops{
	height:120px;
}
.drag_me {
border: 1px solid #000000;
border-radius:10px;

background-repeat:no-repeat;
font-size:16px;

margin-right:10px;
margin-bottom:10px;
float:left;
display:block;
cursor:pointer;
z-index:2;
line-height:17px;
box-shadow: 4px 0 8px #aaaaaa,  -4px 0 8px #aaaaaa; 
background-position:center center;
}
.drag_me p{
padding:10px;

}
.drag_me.dropped{
opacity:0.7;
background-color:#FFFFFF;
box-shadow: none; 
}
.drag_me:hover{
opacity:0.7;
background-color:#FFFFFF;
filter: alpha(opacity=70);
}
.drops{
height:200px;
position:absolute;
bottom:0px;
}
.drops.withimage{
background:#FFFFFF;
background-position:center bottom;
background-repeat:no-repeat;
}

.drops.textonly div{
display:block;
margin:5px;
text-align:center;
margin-top:-30px;
font-weight:bold;
 font-size: 18px;
  position:absolute;
 width:100%;
}
.drops.textonly{
margin-right:10px;
border-radius:10px;

}
.drops.textonly{
border:2px solid #000000;
background:#4DDB71;
}
.drops.textonly.drop0{
background:#4DDB71;
}
.drops.textonly.drop1{
background:#4DDB71;
}
.drops.textonly.drop2{
background:#4DDB71;
}
.drops.textonly.drop3{
background:#4DDB71;
}
.drops.textonly.drop4{
background:#4DDB71;
}
.drops.textonly.hover{
background-color:#ffffff;
}
.drag_cont.rotated .drops{
	cursor:pointer;
}

.drag_cont.rotated .drops:hover,.drag_cont .drops.hover{
	opacity:0.8;
	filter: alpha(opacity=80);
	border:  2px dashed #000000;
}
#drag_me_image{
font-size: 0px;
}
.drag_me div{
display:block;
margin:5px;
text-align:center;
}
.drag_cont.rotated .drag_me{
display:none;	
left:40.5%;
float:none;
}
.drag_cont.rotated .drag_me.focused{
display:block;	
left:40.5%;

position:absolute;
top:0px;
}

.drag_cont.rotated .dropped{
opacity:0;
filter: alpha(opacity=0);
height:0px;
}
.drag_cont.rotated .dropped.focused{
	height:auto;
}
.sortable{

}
.sortable_item{
width:200px;
list-style-type:none;
text-indent:0px;
list-style-position:inside;
padding:10px;
margin:10px;
border:1px solid #cccccc;
cursor:pointer;
height:100px;
}
.sortable_item_placeholder{
list-style-type:none;
text-indent:0px;
list-style-position:inside;
width:200px;
background:#eeeeee;
padding:10px;
margin:10px;
border:1px solid #eeeeee;
cursor:pointer;
height:100px;
}

.sortable_item_placeholder p,.sortable_item p{
padding:10px;
}

.quicktags,.quicktags_result{
text-align:center;
}
.quicktags_result h1{

}

.quicktags_result .tag{
color:red;

}
.quicktags_result .tags{
border: 1px solid black;
width:200px;
margin:auto;
}
.tagfield{
border: 1px solid black;

}
.ui-stars-star,
.ui-stars-cancel {
	float: left;
	display: block;
	overflow: hidden;
	text-indent: -999em;
	cursor: pointer;
}
.ui-stars-star a,
.ui-stars-cancel a {
	width: 28px;
	height: 26px;
	display: block;
	position: relative;
	background: url(assets/crystal-stars.png) no-repeat 0 0;
	
}
.ui-stars-star a {
	background-position: 0 -56px;
}
.ui-stars-star-on a {
	background-position: 0 -84px;
}
.ui-stars-star-hover a {
	background-position: 0 -112px;
}
.ui-stars-cancel-hover a {
	background-position: 0 -28px;
}
.ui-stars-star-disabled,
.ui-stars-star-disabled a,
.ui-stars-cancel-disabled a {
	cursor: default !important;
}

.starify{

width:220px;
margin:auto;
margin-top:10px;
margin-bottom:50px;
text-align:center;
}
.media{
text-align:center;
}

#imageloader{

text-align:center;
}
#imageloader table{
opacity: 0;
filter: alpha(opacity=0);text-align:center;
margin:auto;

}
#imagequestion{
padding-left:40px;
padding-right:40px;

}
#imageloader img{
margin:auto;

}

#imageloader td{

color:#000000;
text-decoration:none;
font-size:15px;
}
#imageloader .key{
background-image:url(img/key.gif);
margin-bottom:10px;
margin-top:10px;
height:85px;
width:90px;
background-size:cover;
}
#imageloader .key p{
display:block;
font-size:34px;
font-weight:bold;
text-transform:uppercase;
padding-top:20px;
}
#message{
line-height:24px;
display:none;
cursor:pointer;
color:red;
}
h2{
font-size: 22px;

}
.imageholder{
margin:auto;
width:70%;
height:560px;
background:#000000;
text-align:center;
padding:0px;
overflow:hidden;
}
.imageholder .stim{
background-repeat:no-repeat;
display:block;
float:left;
width:50%;
height:280px;
background-position: center center;
cursor:pointer;
margin-top:0px;
overflow:hidden;
}
.imageholder .stim img{
width:280px;
height:280px;
padding:0px;
margin:0px;
}
.stim.word p{
background:#ffffff;
width:80%;
display:block;
margin:auto;
margin-top:20px;
padding:10px;
height:220px;
}
.stim.word p:hover{
opacity:0.6;

}

#image_rate{
padding:5px;
}
#touchleft,#touchright{
cursor:pointer;
}
#touchleft:hover,#touchright:hover{
opacity:0.7;
}
.descriptor{
position:relative;
height:auto;
width:auto;
display:block;
visibility: visible;
text-align:center;
font-weight:bold;
font-size:17px;	
margin:10px;
}
	img[usemap] {
		border: none;
		height: auto;
		max-width: 100%;
		width: auto;
	}
	.map{
	width:100%;
	text-align:right;
	}
	.mapimg{
	display:block;
	float:right;
	background:#de1d0c;
	clear:both;
	}
	
	
	
	
	input[type=radio],.radios_list input,.radios_list input{
	width:auto;
	}
	input[type=checkbox],.checkboxes_list input{
	width:auto;
	}
	
	/* jQuery.Rating Plugin CSS - http://www.fyneworks.com/jquery/star-rating/ */
div.rating-cancel,div.star-rating{float:left;width:34px;height:30px;text-indent:-999em;cursor:pointer;display:block;background:transparent;overflow:hidden}
div.rating-cancel,div.rating-cancel a{background:url(img/delete.gif) no-repeat 0 -32px}
div.star-rating,div.star-rating a{background:url(img/star.gif) no-repeat 0 0px}
div.rating-cancel a,div.star-rating a{display:block;width:32px;height:100%;background-position:0 0px;border:0}
div.star-rating-on a{background-position:0 -32px!important}
div.star-rating-hover a{background-position:0 -64px}
/* Read Only CSS */
div.star-rating-readonly a{cursor:default !important}
/* Partial Star CSS */
div.star-rating{background:transparent!important;overflow:hidden!important}
/* END jQuery.Rating Plugin CSS */
.nicenumber{
float:left;
margin:10px;
margin-left:-30px;
margin-top:-10px;
display:block;
padding:5px;
background:#ffffff;
border-radius:6px;
border: 2px solid #de1d0c;	
}
.nicenumber .qid{
background:#CCCCCC;
padding:4px;
display:block;
float:right;
margin-left:10px;

font-size:11px;	
}
.fancybox img{
  border: 1px solid #000066
}
.check_slideshow{
overflow:hidden;
}
.check_slideshow img{
display:none;


}
.check_slideshow .checkslideshow0 img{
display:block;


width:250px;


position:relative;
z-index:2;
margin-bottom:10px;
margin-right:60px;
}

.check_slideshow .checkslideshow0 span{
background-image: url(img/startslide.png);
display:block;
width:140px;
height:50px;
margin-right:-40px;
margin-top:-120px;
margin-bottom:50px;
position:relative;
z-index:4;
}
#cookiewarn{
display:none;
}