/*
 * MULTIPLE_CHOICE.CSS - SYSTEM
 * 
 * Core styles for question type 'multiple-choice'.
 *
 */

/*******************************************************************************
 * DEFAULT - WILL BE USED FOR ANY DEVICE UNLESS OVER-RIDDEN FOR SPECIFIC DEVICES.
 *******************************************************************************/

.rcMultiChoice
{
	font-size: 120%;
}

.rcMultiChoice .rcOption
{
	margin-top:1em;
	color: #fff;
	background-color: #333;
	cursor:pointer;
	*cursor:hand;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.rcMultiChoice .rcOption table tr td
{
	vertical-align: middle;
}

.rcMultiChoice .rcOption .rcRadioCont
{
	background-color: #fff;
	margin:1em;
}

.rcMultiChoice .rcOption .rcRadioCont.faded
{
	background-color: #ccc;
}

.rcMultiChoice .rcOption .rcRadio
{
	width:1.5em;
	height: 1.5em;
	margin:0;
	padding:0;
	border:0;
	background-color: #ccc;
}

.rcMultiChoice .rcOption.on .rcRadio
{
	background-color: #fff;
}

.rcMultiChoice .rcOption.ticked .rcRadio
{
	*background-color: #819238;
	background-size: contain;
	*background-image: none;
	background-position: center;
	*background-size: auto;
}

.rcMultiChoice .rcOption.crossed .rcRadio
{
	*background-color: #f32121;
	background-size: contain;
	*background-image: none;
	background-position: center;
	*background-size: auto;	
}

.rcMultiChoice .rcOption .rcOptionText
{
	float:left;
	padding: 0.5em 0.5em 0.5em 0em;
}

.rcMultiChoice .rcWarntext
{
	font-family:sans-serif, verdana, arial, helvetica;
	font-size: 90%;
	margin-top: 1em;
	float:left;
	padding: 0.7em 0.7em 0em 0.7em;
	text-align:left;
	width:60%;
	color:#f32121;
	line-height: 1.3em;
	display:none;
}

.rcMultiChoice .rcWarntext.correct
{
	color:#889c37;
	font-weight:bold;
}

.rcMultiChoice .rcWarntext.incorrect
{
	font-weight:bold;
}

.rcMultiChoice a.rcSubmitButton
{
	clear:both;
	font-family: sans-serif, verdana, arial, helvetica;
	display:block;
	color:#fff;
	text-decoration: none;
	padding: 0.5em 0.7em;
	float:right;
	margin-top: 1em;
	outline:none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.rcMultiChoice a.rcSubmitButton.rcSubmitForImages,
.rcMultiChoice a.rcSubmitButton.rcSubmitForTruefalse
{
	float: left;
}

.rcMultiChoice a.rcSubmitButton.rcSubmitForImages
{
	margin-left: 5px;
}

.rcMultiChoice a.rcSubmitButton:hover, .rcObject .rcMultiChoice a.rcSubmitButton.rcTouch.ton
{
	background-color: #889c37;
}

.rcMultiChoice a.rcSubmitButton.off, .rcObject .rcMultiChoice a.rcSubmitButton.off.rcTouch:hover
{
	background-color: #999;
	cursor:default;
}

.rcMultiChoice a.rcSubmitButton.off:hover, .rcObject .rcMultiChoice a.rcSubmitButton.off.rcTouch.ton
{
	background-color: #999;
}

/* TRUE FALSE */

.rcMultiChoice.rcTrueFalse .rcOption
{
	float: left;
	width: auto;
	min-width: 120px;
	*width: 120px;
	margin-right: 20px;
}

.rcMultiChoice.rcTrueFalse .rcOption table,
.rcMultiChoice.rcTrueFalse .rcOption table td
{
	width: 100%;
}

.rcMultiChoice.rcTrueFalse .rcOption .rcOptionText
{
	float:none;
	text-align: center;
}

.rcMultiChoice.rcTrueFalse .rcOption.on
{
	background-color: #833607;
}

.rcMultiChoice.rcTrueFalse .rcOption.ticked
{
	background-color: #819238;
	color: #fff;
}

.rcMultiChoice.rcTrueFalse .rcOption.crossed
{
	background-color: #f32121;
	color: #fff;
}

.rcMultiChoice.rcTrueFalse a.rcSubmitButton
{
	float:left;
}

/* IMAGE OPTION */

.rcMultiChoice .rcOptionImage {
	float:left;
	border: 5px solid #fff;
	margin: 20px 20px 0 0;
	cursor: pointer;
	*cursor: hand;
}

.rcMultiChoice .rcOptionImage img {
	width: auto;
	display: block;
	padding:0;margin:0;border:0;
}


/*******************************************************************************
 * DESKTOP LARGE - WILL OVERRIDE DEFAULT ON DEVICES WITH A WIDTH GREATER THAN 1200px
 * (use preceding class .desktop_l)
 *******************************************************************************/

body.desktop_l
{}

.desktop_l .rcModule
{}

.desktop_l .rcMultiChoice .rcOption
{
	width: 80%;
}

.desktop_l .rcLeftCol .rcMultiChoice .rcOption,
.desktop_l .rcRightCol .rcMultiChoice .rcOption,
.desktop_l .rcMultiChoice.rcTrueFalse .rcOption
{
	width:auto;	
}

.desktop_l .rcMultiChoice a.rcSubmitButton
{
	margin-right:20%;
	*margin-right:19%;
}

.desktop_l .rcMultiChoice a.rcSubmitButton.rcSubmitForImages,
.desktop_l .rcMultiChoice a.rcSubmitButton.rcSubmitForTruefalse
{
	margin-right: 20px;
}

.desktop_l .rcLeftCol .rcMultiChoice a.rcSubmitButton, .desktop_l .rcRightCol .rcMultiChoice a.rcSubmitButton
{
	margin-right:0;
}


/*******************************************************************************
 * DESKTOP SMALL - WILL OVERRIDE DEFAULT ON DEVICES WITH A WIDTH OF BETWEEN 980px AND 1200px 
 * (use preceding class .desktop_s)
 *******************************************************************************/

body.desktop_s
{}

.desktop_s .rcModule
{}


/*******************************************************************************
 * TABLET LARGE - WILL OVERRIDE DEFAULT ON DEVICES WITH A WIDTH OF BETWEEN 768px AND 980px 
 * (use preceding class .tablet_l)
 *******************************************************************************/

body.tablet_l
{}

.tablet_l .rcModule
{}

.tablet_l .rcMultiChoice .rcOption
{
	width: 100%;
}

.tablet_l .rcMultiChoice a.rcSubmitButton,
.tablet_l .rcMultiChoice a.rcSubmitButton.rcSubmitForImages,
.tablet_l .rcMultiChoice a.rcSubmitButton.rcSubmitForTruefalse
{
	margin-right: 0;
}


/*******************************************************************************
 * TABLET SMALL: - WILL OVERRIDE DEFAULT ON DEVICES WITH A WIDTH OF BETWEEN 480px AND 768px 
 * (use preceding class .tablet_s)
 *******************************************************************************/

body.tablet_s
{}

.tablet_s .rcModule
{}

/*******************************************************************************
 * MOBILE: - WILL OVERRIDE DEFAULT ON DEVICES WITH A WIDTH OF LESS THAN 480px
 * (use preceding class .mobile)
 *******************************************************************************/

body.mobile
{}

.mobile .rcModule
{}

.mobile .rcMultiChoice table tr td
{
	vertical-align:top;
}

.mobile .rcMultiChoice .rcOption .rcRadioCont
{
	margin:0.7em;
}

.mobile .rcMultiChoice .rcOption .rcOptionText
{
	padding: 0.5em 0.3em 0.5em 0;
}

.mobile .rcMultiChoice .rcWarntext
{
	padding: 0em 0.5em 0em 0.5em;	
}

.mobile .rcMultiChoice a.rcSubmitButton.rcSubmitForImages
{
	margin-right: 5px;
}

/* TRUE FALSE */

.mobile .rcMultiChoice.rcTrueFalse .rcOption
{
	float: left;
	min-width: 0;
	width: 40%;
	margin-right:5%;
}
