.quiz *{

	padding: 0;

	margin: 0;

	box-sizing:border-box;

	-moz-box-sizing:border-box; /* Firefox */

}



.quiz{

	max-width: 699px;

	min-height: 400px;

	display:block;

	margin: 20px auto;

	font-size: 14px;

    font-family: "Futura MD","Trebuchet MS",Arial,sans-serif;

	background-repeat: no-repeat;

	background-position: bottom right;

	background-image:url("/wp-content/interactive/include/images/watermark.png"), rgb(255,255,255); /* Old browsers */

	background-image:url("/wp-content/interactive/include/testskills/images/watermark.png"), -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(145,199,245,1) 100%); /* FF3.6+ */

	background-image:url("/wp-content/interactive/include/testskills/images/watermark.png"), -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(145,199,245,1))); /* Chrome,Safari4+ */

	background-image:url("/wp-content/interactive/include/images/watermark.png"), -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(145,199,245,1) 100%); /* Chrome10+,Safari5.1+ */

	background-image:url("/wp-content/interactive/include/images/watermark.png"), -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(145,199,245,1) 100%); /* Opera 11.10+ */

	background-image:url("/wp-content/interactive/include/images/watermark.png"), -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(145,199,245,1) 100%); /* IE10+ */

	background-image:url("/wp-content/interactive/include/images/watermark.png"), linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(145,199,245,1) 100%); /* W3C */

	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#91c7f5',GradientType=0 ); /* IE6-9 */

	position: relative;

	border: 1px solid #ff0000;

	-moz-border-radius: 10px;

	-webkit-border-radius: 10px;

	border-radius: 10px;

	text-align: left;

}



.frame{

	display:block;

	width: 100%;

	padding-bottom: 2.57%;

	background: transparent url("/wp-content/interactive/include/images/frame-sprite-test.png") no-repeat;

	background-size: cover;

	position: absolute;

	z-index: 999;

}



#frame-top{

	top:0;

	left:0;

}



#frame-bottom{

	background-position: 0 100%;

	padding-bottom: 3%;

	bottom:0;

	left:0;

}



.title-container{

	margin-top: 40px;

	padding-left: 15px;

	font-size: 21px;

}



.screen{

	display:block;

	vertical-align: middle;

	position: relative;}



.screen-content{

	width: 100%;

	margin: auto auto;

	padding: 5px 15px 10px 15px;

	position: relative;

	overflow:hidden;



}

.start-screen{

	text-align:left;

}



.start-content{

	display:block;

	width:auto;

}



.intro-title{

	color: #990000;

	font-weight: bold;



}



.start-content form{

	text-align: center;

	margin-top:40px;

	line-height: normal;

}



.text-input-label{

	font-weight: bold;

	font-size: 16px;

}



.start-content form input[type="text"]{

	font-size: 17px;

	max-width: 346px;

	width: 100%;

	height: 46px;

	text-align:center;

}



.quiz-message{



}



.quiz-button , .touch .quiz-button:hover{

	display:block;

	padding: 0 30px 0 30px;

	margin:auto;

	position:relative;

	border: 1px solid #ccc;

	background-color: #666;

	color: white;

    font-weight: bold;

	border: 2px solid #990000;

	margin-top: 20px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;

	border-radius: 5px;

	font-size: 17px;

	z-index: 100;

	background: #b3dced; /* Old browsers */

    background: -moz-linear-gradient(top, #b3dced 0%, #f6ded5 0%, #cc3300 75%); /* FF3.6+ */

    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b3dced), color-stop(0%,#f6ded5), color-stop(75%,#cc3300)); /* Chrome,Safari4+ */

    background: -webkit-linear-gradient(top, #b3dced 0%,#f6ded5 0%,#cc3300 75%); /* Chrome10+,Safari5.1+ */

    background: -o-linear-gradient(top, #b3dced 0%,#f6ded5 0%,#cc3300 75%); /* Opera 11.10+ */

    background: -ms-linear-gradient(top, #b3dced 0%,#f6ded5 0%,#cc3300 75%); /* IE10+ */

    background: linear-gradient(to bottom, #b3dced 0%,#f6ded5 0%,#cc3300 75%); /* W3C */

    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3dced', endColorstr='#cc3300',GradientType=0 ); /* IE6-9 */

	-moz-box-shadow:    2px 2px 0px 0px rgba(0,0,0,.3);

	-webkit-box-shadow: 2px 2px 0px 0px rgba(0,0,0,.3);

	box-shadow:         2px 2px 0px 0px rgba(0,0,0,.3);

}





.quiz-button:hover{

	color: yellow;

}



.quiz-button.disabled{

	opacity: .5;

}



.start-button{

	width: 93px;

}



.quiz-content{

}



.stat-container{

	position:absolute;

	top:10px;

	left:5px;

	width: 120px;

	border: 2px solid #66CC00;

	-moz-border-radius: 10px;

	-webkit-border-radius: 10px;

	border-radius: 10px;

	background-color: #fff;

	display:none;

	text-align: center;

	font-size: 8px;

	z-index: 100;

}



.score-container{



}



.counter {

	display: inline-block;

	width: 50px;

	height: 26px;

	border: 1px solid #ccc;

	margin-left: 10px;

	color: #ff0000;

	border: 2px solid #66CC00;

	-moz-border-radius: 10px;

	-webkit-border-radius: 10px;

	border-radius: 10px;

	background-color: #CCFFCC;

	text-align: center;

	font-size: 13px;

}



.timer-container{

	vertical-align: middle;

}



.timer{

	display:inline-block;

	border: 1px solid #ccc;

	width: 83px;

}



.timer-bar{

	background-color: blue;

	height: 5px;

}



.question-container{

	position: relative;

}



.question{

	display:block;

	width: 100%;

	color: #000;

	font-weight: bold;

}



.question-counter{

	color: #990000;

	margin-bottom: 5px;

	font-weight: bold;

}



.answers {

	display:block;

	width: auto;

	margin-top: 15px;

	font-weight: bold;

	color: #000;

	counter-reset: headings 0;



}



.answer-container{

	position:relative;

	margin-bottom: 10px;

	overflow: hidden;

	display:block;

	line-height: 25px;



}



.answer-container:hover .answer:before{

	background-position: 0 -32px;

}



.answer-container:hover, .answer.disabled.selected{

	background-position: 0 -37px;

}



.answer-container.selected .answer:before{

	background-position: -65px;

}



.answer {

	cursor: pointer;

	margin-left: 33px;

	line-height: 16px;

	position: relative;

	padding-top: 6px;

	min-height: 27px;

}



.answer:before{

	counter-increment: headings 1;

	content: counter(headings, upper-alpha);

	display:block;

	position:absolute;

	top: 0;

	right: 100%;

	width:27px;

	height: 27px;

	background: transparent url("/wp-content/interactive/include/images/answer-sprite.png") no-repeat;

	margin-right: 5px;

	float:left;

	text-align:center;

	color: #fff;

	font-weight:bold;

	font-size:20px;

	line-height: 27px;

}



.answer-container.disabled {

	cursor: default;

	opacity: .5;

}



.answer-container.disabled .answer{

	cursor: default;

}



.answer-container.disabled .hint-button{

	cursor: default;

}



.answer-container.disabled:hover {

	background-position: 0 0;

}



.answer-container.disabled .hint-button:hover {

	background-position: -200px 0;

}





.hint-button{

	border: none;

	background: transparent url("/wp-content/interactive/include/images/button-sprites.png") -200px 0 no-repeat;

	color: white;

	cursor: pointer;

	position: absolute;

	top:0;

	right: 0;

	text-indent: 100%;

	width: 18px;

	height: 18px;

	overflow: hidden;

}



.hint-button:hover{

	background-position: -200px -36px;

}



.hint-button.disabled{

	cursor: default;

}



.quiz-image-container{

	display:block;

	float:right;

	position: relative;

	margin: 5px 0px 5px 10px;

}



.quiz-image{

	border: 3px solid #66CC33;

	background-color: #000;

	-moz-border-radius: 10px;

	-webkit-border-radius: 10px;

	border-radius: 10px;

	max-width: 320px;

	overflow:hidden;

}



.quiz-image img{

	max-width: 100%;

	max-height: 100%;

}



.hint-container{

	display: none;

	width: 100%;

	min-height: 80px;

	margin-top: 5px;

	border: 3px solid #66CC33;

	background-color: #405989;

	text-align: center;

	overflow: hidden;

	-moz-border-radius: 10px;

	-webkit-border-radius: 10px;

	border-radius: 10px;

	color:#FFFFFF;

	font-size: 12px;



}



.hint-container.correct{

	background-color: green;

	font-size: 26px;

}



.hint-container.wrong{

	background-color: red;

	font-size: 18px;

}



.feedback-screen{

	display:block;

	vertical-align: middle;

	text-align:left;

	font-weight: bold;



}



.feedback-popup{

	display:block;

	width: 190px;

	height: 120px;

	position: absolute;

	color: #000;

	background: transparent url("/wp-content/interactive/include/images/feedback-popup-bg-sprite.png");

}



.feedback-popup.correct{

	color: 66CC33

}



.feedback-popup.wrong{

	color: red;

}



.feedback-popup-content-container{

	display:table;

	vertical-align: middle;

	text-align: center;

	width: 170px;

	height: 100px;

	position:absolute;

}



.feedback-popup-content{

	display:table-cell;

	vertical-align: middle;

	text-align: center;

}



.feedback-comment{

	display:block;

	margin-top: 20px;

}



.feedback-screen form{

	margin-top: 50px;

}



@media only screen

and (max-width: 590px){





	.quiz{

		width: 100%;

		height: auto;

	}



	.quiz *{

		border: none;

		-moz-border-radius: 0;

		-webkit-border-radius: 0;

		border-radius: 0;

		-moz-box-shadow:    none;

		-webkit-box-shadow: none;

		box-shadow:         none;

	}



	.quiz-button{

		width: 95%;

		position: relative;

		top:auto;

		left: auto;

		bottom: auto;

		margin-top:10px;

		font-size: 24px;

	}



	.screen{

		display:block;

		margin: 20px auto 20px auto;

		width: 95%;

	}



	.screen-content{

		margin: auto;

		width: 100%;

		padding:0;

		display:block;

		border: none;

		margin: auto;

	}



	.stat-container{

		width: 95%;

		margin: auto;

		margin-top: 10px;

		height: auto;

		top:0;

		left:0;

		position: relative;

		border: none;

		background-color: #ccc;

		padding: 5px;

	}



	.score-container{

		width: 40%;

		display:inline-block;

	}



	.counter{

		height: auto;

	}



	.timer-container{

		width: 48%;

		display:inline-block;

	}



	.quiz-content{

		max-height: none;

	}



	.answers{

		display: block;

		float: none;

		width: 100%;

	}



	.answer-container, .touch .answer-container:hover{

		font-size: 16px;

		color: #000;

		background: rgb(153,255,0); /* Old browsers */

		background: -moz-linear-gradient(top,  rgba(153,255,0,1) 0%, rgba(51,153,102,1) 100%); /* FF3.6+ */

		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(153,255,0,1)), color-stop(100%,rgba(51,153,102,1))); /* Chrome,Safari4+ */

		background: -webkit-linear-gradient(top,  rgba(153,255,0,1) 0%,rgba(51,153,102,1) 100%); /* Chrome10+,Safari5.1+ */

		background: -o-linear-gradient(top,  rgba(153,255,0,1) 0%,rgba(51,153,102,1) 100%); /* Opera 11.10+ */

		background: -ms-linear-gradient(top,  rgba(153,255,0,1) 0%,rgba(51,153,102,1) 100%); /* IE10+ */

		background: linear-gradient(to bottom,  rgba(153,255,0,1) 0%,rgba(51,153,102,1) 100%); /* W3C */

		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99ff00', endColorstr='#339966',GradientType=0 ); /* IE6-9 */

	}



	.answer-container:hover{

		color: #fff;

		background: rgb(149,196,245); /* Old browsers */

		background: -moz-linear-gradient(top,  rgba(149,196,245,1) 0%, rgba(0,51,102,1) 100%); /* FF3.6+ */

		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(149,196,245,1)), color-stop(100%,rgba(0,51,102,1))); /* Chrome,Safari4+ */

		background: -webkit-linear-gradient(top,  rgba(149,196,245,1) 0%,rgba(0,51,102,1) 100%); /* Chrome10+,Safari5.1+ */

		background: -o-linear-gradient(top,  rgba(149,196,245,1) 0%,rgba(0,51,102,1) 100%); /* Opera 11.10+ */

		background: -ms-linear-gradient(top,  rgba(149,196,245,1) 0%,rgba(0,51,102,1) 100%); /* IE10+ */

		background: linear-gradient(to bottom,  rgba(149,196,245,1) 0%,rgba(0,51,102,1) 100%); /* W3C */

		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#95c4f5', endColorstr='#003366',GradientType=0 ); /* IE6-9 */

	}



	.answer-container:hover, .answer.disabled.selected{

		background-position: 0 0;

	}



	.answer {

		margin-left: 0;

		display:block;

		height: 100%;

		padding: 5px;

	}



	.hint-button{

		margin-top: 5px;

	}



	.quiz-image-container{

		display:block;

		float: none;

		width: auto;

		margin: auto;

		text-align: center;



	}

	.quiz-image{

		display: inline-block;

	}



	.feedback-popup{

		height: 100% !important;

		width: auto !important;

		top:0 !important;

		left:0 !important;

		right:0 !important;

		bottom:0 !important;

		background: transparent none;

		overflow:hidden;

	}



	.feedback-popup-content-container{

		width: 100% !important;

		height: 100% !important;

		position:relative;

		top:0 !important;

		left:0 !important;

		overflow:hidden;

	}

	.feedback-popup-content{

	}



}