/*************************************************************
 * litw.css
 * 
 * Stylesheet for all experiments on Lab in the Wild.
 * 
 * Author: Yuechen Zhao
 * Last Modified: Dianna Hu - July 16, 2013
 *
 * © Copyright 2014 LabintheWild
 * For questions about this file and permission to use
 * the code, contact us at info@labinthewild.org
 *************************************************************/
/* remove callout menu functionality */
* { 
	-webkit-touch-callout: none;
}

/* styles for the entire page */
body {
	margin: 0;
	padding: 0;
	font-family: Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif;
	font-size: 16px;
	line-height: 22px;
	color: #222;
	
}


a:link, a:visited, a:hover { text-decoration:none; color:#0099cc; }
a:active { color: #003b4e; }

img, a img { border: none; }

/* page structure */
#header { display: none; }
#logo { float: left; margin-top: 30px; margin-bottom: 15px; }

.separator {
	margin-top: 31px;
	margin-bottom: 20px;
	height: 10px;
	clear: both;
	display: block;
	width: 100%;
	border-top: 2px dotted #366;
}

#share_text { float:right; margin-top:15px; font-size: 13px; color:#888; }
#share_this { clear:right; float: right; margin-top: 5px; display:none; }

#content, #error { width: 800px; margin: 0 auto; }

#error { padding-top: 50px; display: none; width: 550px !important; text-align: justify;}
#error h2 { text-align: center; color: #f00; }

.slide { display: none; }
.warn { color: #f00; font-weight: bold; }
.bolded-blue { font-weight: bold; color: #3f6379; }

/* likert scale */
#likert_scale {
	display: block;
	margin: 0 auto;
	width: 710px;
	border: 0px;
}
#likert_scale input { margin-left: 15px; margin-right: 15px; }

/* next button */
#next_button { margin-top: 25px; margin-bottom: 20px; text-align: right; }
#next_button button {
	background: url("../img/next.png");
	width: 100px;
	height: 60px;
	border: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
#next_button button:active { background: url("../img/next_active.png"); }

#next_button2 { margin-top: 25px; margin-bottom: 20px; text-align: right; } 
#next_button2 button {
	background: url("../img/nextOLD.png");
	width: 100px;
	height: 60px;
	border: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
#next_button2 button:active { background: url("../img/next_activeOLD.png"); }

#next_button2_new { margin-top: 25px; margin-bottom: 20px; text-align: right; } 
#next_button2_new button {
	background: url("../img/nextNEW2.png");
	width: 74px;
	height: 87px;
	border: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}


/* comments page */
#comments { text-align: center; }

textarea.comments_box {
	padding: 15px;
	font-size: 14px;
	font-family: Optima, Arial, sans-serif;
	width: 560px;
	height: 70px;
	color: #999;
	display: block;
	margin: 0 auto;
}

/* AJAX loader */
#ajax_working {
	position: relative;
	z-index: 300;
	display: none;
	width: 100%;
	text-align: center;
}
#ajax_working img 
{
	width: 30px;
	height: 30px;
	vertical-align: middle;
}

/* noscript styles */
#noJS {
	text-align: center;
	font-size: 16px;
	width: 650px;
	margin: 0 auto;
	margin-top: 30px;
}

#noJS p { text-align: justify; }

#noJS h2 {
	color: #f00;
}

#noJS img {
	width: 200px;
	height: auto;
}

/* by default, do not display results footer */
#results2 {
    display: none;
}

#tests-table img {
	width: 150px;
	height: 100px;
}

/* motivation inquiry form styles */
.motivation-form {
	text-align: left !important;
	font-size: 16px !important;
}

.motivation-form input[type=radio] {
	cursor: pointer;
	margin-right: 10px;
}

.motivation-form .option-set-header {
	font-style: italic;
	margin-bottom: 5px;
	margin-top: 30px;
}

.motivation-form label {
	margin-right: 5px;
	cursor: pointer;
}

.motivation-form .motivation-header {
	font-size: 22px;
	margin-bottom: 20px;
}

.motivation-form td {
	width: 100px;
	max-width: 100px;
	padding-bottom: 0;
	padding-top: 0;
	padding-right: 0;
	padding-left: 0;
	text-align: center;
}