/*************************************************************
 * style.css
 * 
 * Stylesheet for the experiment.
 * 
 * Author: Yuechen Zhao
 * Last Modified: July 25, 2012
 *
 * © Copyright 2012 Intelligent and Interactive Systems
 * Group, Harvard University.
 * For questions about this file and permission to use
 * the code, contact us at info@labinthewild.org
 *************************************************************/


.btn {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
	background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
	background-color:#ffffff;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#666666;
	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.btn:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
	background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0);
	background-color:#f6f6f6;
}
.btn:active {
	position:relative;
	top:1px;
}



#next {
	cursor: pointer;
}


input[type='checkbox'] {
	height: 20px;
	width: 20px;
}

input[type='radio'] {
	height: 20px;
	width: 20px;
}

/* for table*/
.dimension {
	width: 410px;
	height: 410px;	
}



/* for lighting images */
#bulb {
	width: 50px;
	height: auto;
}

.cap {
	font-style: italic;
	font-size: 15px;
}

#age {
	width: 48px;
	height: auto;
}

#idk {
	height: 50px;
	width: auto;
}

/* instructions */
#inst {
	margin: 0 auto;
	width: 670px;
}

#inst img {
	margin: 0 auto;
	display: block;
}

#buttons {
	margin: 0 auto;
	width: 670px;
}

#colorful_inst {
	margin: 0 auto;
	width: 670px;
}

#disp {
	margin: 0 auto;
	width:670px;
}

#disp img {
	margin: 0 auto;
	display: block;
}

/* stimulus display */
#stims {
	margin-top: 20px;
}

#stims img {
	width: 600px;
	height: auto;
	display: block;
	margin: 0 auto;
	border: 1px solid #000;
}

#likert { margin-top: 70px; margin-bottom: 70px; }

/* headings */
#heading h2 {
	margin-top: 30px;
	margin-bottom: 10px;
	text-align: center;
}

#progress {
	text-align:center;
	margin-top:0px;
}

/* results */
#results_text,#easel,#results_stim {
	text-align: justify;
}

#results-stim {
	margin: 0 auto;
}

#people-bar {
	width: 250px;
	height: 58px;
	margin: 0 auto;
}

#triangles {
	width: 800px;
	height: 50px;
	margin: 0 auto;
}

.result-box {
	padding-left: 20px;
	padding-right: 20px;
}

#colorful-pref {
	margin-top: 20px;
	margin-bottom: 20px;
	padding-left: 20px;
	padding-right: 20px;
	border-top: 2px solid #3f6379;
	border-bottom: 2px solid #3f6379;
	background: #f2f2f2;
}

#toClick {
	width: 30px;
	height: auto;
}

input[name='light'] {
	height: 70px;
	width: auto;
}




#lig {
	height: auto;
	width: 60px;
}