binary-choice.less

@import "~theme";
.binary-choice {

	.main {

		.side-panels;

		.text-left, .text-right {
			.anchor-bottom;
			text-align: center;
			width: 100%;
			margin-bottom: 1em;
			color : @primary;


			.select-kbd {
				.touchevents &{ display: none; }
			}

			.select-touch {
				.no-touchevents &{ display: none; }
			}
		}

		.tap {
			position: absolute;
			z-index: 999;

			&.tap-main-left, &.tap-main-right{
				top: 30%;
				width : 50%;
				height : 70%;
			}

			&.tap-top-left, &.tap-top-right {
				top: 0;
				width : 50% - @panel-width;
				height : 30%;
			}

			&.tap-top-left {
				// background-color: #555;
				left: @panel-width;
			}
			&.tap-top-right {
				// background-color: #55F;
				left: 50%;
			}

			&.tap-main-left {
				left: 0%;
			}

			&.tap-main-right {
				left : 50%;
			}

			.no-touchevents &{ display : none;}

		}


		.feedback {
			position: absolute;
			height: 7%;
			background-color: @secondary;
			width : 50% - @panel-width;
			top: 90%;

			.no-touchevents &{ visibility : hidden; }
			
		}

		.feedback-left {
			left : @panel-width;
			.feedback;
		}

		.feedback-right {
			left: 50%;
			.feedback;

		}

		.divider {

			position: absolute;
			height: 60%;
			left: 50%;
			top:20%;
			width: 1px;
			border-right: 3px solid #EEE;
		}

		.stimuli {

			position : absolute;
			height: 60%;
			width: 47 - @panel-width; // Gives margin of 2% each time
			top: 20%;

			&.left {
				left : @panel-width + 2;
			}

			&.right {
				left : 51%;
			}

		}


	}

}