/*
    Stylesheet for TMB Adaptive Delay Discounting.

	Copyright 2022 The Many Brains Project, Inc. and McLean Hospital.

     This code is made available under a GNU Lesser General Public License 3.0
     (LGPLv3).
     https://www.gnu.org/licenses/lgpl-3.0.html.

    Last updated: Nov 2022
    Author: Paolo Martini
    Version: DelayDiscount_AoU.v1.Nov22

*/

*
{
	border-radius: 0;
	box-sizing: border-box;
}

*::after, *::before
{
	box-sizing: border-box;
}

html
{
    width: 100vw;
    height: 100vh;
}

body
{
	width: 100vw;
	height: 100vh;
	margin: auto;
	background: #ffffff;
	color: #000000;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 13pt;
	text-align: center;
}

.button
{
	border: 2px solid #f1c40f;
	border-radius: 1em;
	background: transparent;
	color: #000000;
	box-shadow: 0 5px 15px 5px grey
}

.button:active
{
	box-shadow: 0 5px 15px 1px lightgrey
}

.button:focus
{
	outline: none
}

#counter
{
	height: 50px;
	width: 200px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -200px;
	margin-left: -100px;
	text-align: center;
	font-size: 20pt;
}

#choice
{
	height: 200px;
	width: 500px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -100px;
	margin-left: -250px;
	text-align: left;
	font-size: 24pt;
}

#instructions
{
	height: 100px;
	width: 500px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: 150px;
	margin-left: -250px;
	text-align: center;
	font-size: 20pt;
	color: red;
}

.choiceOpt
{
	font-family: monospace;
	border: 5px solid white;
}

#delay
{
	color: blue;
	z-index: -1;
	pointer-events: none;
}

#choiceA, #choiceB
{
	z-index: -1;
	pointer-events: none;
}