.uk-overlay-default{background-color: rgba(0,0,0,0.9) !important;}
#start-counter {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.9);
  z-index: 9999;
  cursor: pointer;
}
#start-counter .text{
  margin-top:10%;	
  font-size:10rem;
  text-align:center;
  color:#fff;
	
}

strong {color:white!important;}
.btn-hazard {margin-bottom:2%;}
.multiVideo .questionOverlay p, .videoResponse .content-model p {
    color: #FFF;
    font-size: 14px !important;
    margin: 0 0 10px !important;
}

.btn-clip {
    display: inline-block;
    padding: 5px 15px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #f8ad56;
    color: #333;
    background-image: none;
    background:#FF8F5C;
    /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffe600), color-stop(75%, #fbb116));*/
    font-weight: bold;
    cursor: pointer;
    /*
    background: rgb(251, 225, 1);
    background: -moz-linear-gradient(90deg, rgb(251, 225, 1) 20%, rgb(255, 179, 1) 80%);
    background: -webkit-linear-gradient(90deg, rgb(251, 225, 1) 20%, rgb(255, 179, 1) 80%);
    background: -o-linear-gradient(90deg, rgb(251, 225, 1) 20%, rgb(255, 179, 1) 80%);
    background: -ms-linear-gradient(90deg, rgb(251, 225, 1) 20%, rgb(255, 179, 1) 80%);
    background: linear-gradient(180deg, rgb(251, 225, 1) 20%, rgb(255, 179, 1) 80%);
    */
}


/*.btn-clip {background-image: linear-gradient(to right, #ffb347 0%, #FF8F5C 51%, #FF8F5C 100%);}*/
.btn-clip:hover { background-position: right center; } 

/*** videoResponse.css ***/

.videoResponse {
	position:relative;
	border:1px solid #ccc;
	/*
	height:490px;
	width:800px;
	*/
	overflow:auto;
	padding:0;
	margin:0 0 10px;
	overflow:visible;
}

.practise .videoResponse
{
	margin:40px 0 35px;
}

.videoResponse .flags,
.videoResponse .hazards {
	position:absolute;
	left:4.5%;
	width:95.5%;
	background:red;
	z-index:99;
}

.videoResponse .feedback {
	/*
	position:absolute;
	bottom:95px;
	left:0;
	width:100%;*/
}

.videoResponse .feedback img
{
	margin-bottom:10px;
}

.videoResponse .prompt {
	/*
	position:absolute;
	top:40px;
	left:0;
	width:100%;
	*/
}

.videoResponse .content-model {
	background-color:white;
	padding:10px;
	border-radius:15px;
	margin:0 auto;
	color:#FFF;
	background:linear-gradient(to bottom, rgb(53, 57, 106) 0%,rgb(29, 58, 112) 100%);
	border:1px solid #0e1d57;
	opacity:0.95;
	width:70%;
	margin-top:10%;
}


.multiVideo .questionOverlay p,
.videoResponse .content-model p {
	color:#FFF;
	font-size:14px !important;
	margin:0 0 10px !important;
}

.videoResponse .content-model.summary {
	background:#3E416D;
	/*linear-gradient(to bottom, rgb(53, 57, 106) 0%,rgb(29, 58, 112) 100%);*/
	/*width:552px;*/
	margin:0 auto;
	padding:15px 0 10px;
	font-weight:bold;
	text-align:center;
	border:1px solid #0E0C39;
	opacity:0.95;
	margin-top:10%;
}

.videoResponse .content-model.summary p {
	color:#fff !important;
	font-weight:bold !important;
	line-height:normal !important;
}

.videoResponse .content-model.summary p.results {
	font-size:30px !important;
	margin:0 0 10px !important;
}

.videoResponse .content-model.summary p.results span {
	font-size:40px !important;
}

.videoResponse .content-model.summary .actions {
	margin:15px 0 0;
	padding:15px 0 0;
	border-top:1px solid #7DAAC8;
}

.videoResponse .flags {
	bottom:0px;
}

.videoResponse .hazards {
	bottom:-30px;
}

.videoResponse .flags span {
	margin:3px 0 0 6px;
	font-size:1.231em;
	display:block;
}

.videoResponse .flags span.exception {
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	font-size:1em;
	display:block;
}

.videoResponse .flags span.exception > span {
	background:linear-gradient(to bottom, rgba(20,124,192,1) 0%,rgba(29,58,112,1) 100%);
	width:250px;
	margin:0 auto;
	font-size:1em;
	text-align:center;
	padding:10px;
	border-radius:15px;
	margin:0 auto;
	color:#FFF;
	border:1px solid #0e1d57;
	opacity:0.95;
	display:block;
}

.videoResponse .playback-summary {
	font-size:14px !important;
	position:absolute;
	bottom:75px;
	left:0;
	width:100%;
}
.videoResponse .hazards > div {
	position:absolute;
	background:linear-gradient(to right, #FF0 0%, #F9F918 100%) repeat scroll 0 0 #ca585800;
	/*linear-gradient(to right, #FFFF00 0%, #FEFECC 100%) repeat scroll 0 0 transparent;*/
	color:#000;
	border-radius:6px;
	overflow:hidden;
	border:1px solid #000;
}

.videoResponse .hazards > div > span
{
	position:relative;
	float:left;
	width:20%;
	height:26px;
	line-height:26px;
	text-align:center;
	font-size:16px;
	font-weight:bold;
}

.videoResponse .hazards > div > div
{
	clear:both;
	height:20px;
	line-height:20px;
	background:#000;
	color:#fff;
	text-align:center;
	font-size:10px;
	font-weight:700;
}

.videoResponse .hazards > div > span:not(:first-child):after
{
	display:block;
	content:" ";
	position:absolute;
	top:0;
	left:0;
	width:1px;
	height:26px;
	background:#000;
}

.videoResponse .hazards > div.small > span
{
	font-size:12px;
}

.videoResponse .hazards > div.xsmall > span
{
	font-size:9px;
}

.videoResponse .btn-clip {
	font-weight:bold;
	margin:2px;
}

.videoResponse > div {
	z-index:99;
}

.videoResponse.videoContentEmbed {
	/*
	width:800px;
	height:500px;
	*/
}

.videoResponse .feedbackDescription {
	margin:0 15px;
	text-align:left;
}

.videoResponse .hazards {
	cursor:help;
}

.videoResponse .content-model.summary p.summaryheader
{
	font-size:18px !important;
	margin:0 0 5px !important;
}

.videoResponse .content-model.summary .feedbackDescription p {
	font-size:13px !important;
	line-height:20px !important;
	font-weight:400 !important;
}

.videoResponse .content-model.summary .feedbackDescription p > span {
	font-weight:700 !important;
}

/* standalone view only */

.videoResponseWrap {
	background-color:#CBC8E3;
	float:left;
	height:525px;
	min-width:897px;
	overflow:auto;
	padding:0.3em 2em 1.5em;
}

.videoResponseWrap .videoResponseContent {
	background-color:#FFFFFF;
	float:left;
	margin:0;
	overflow:visible;
	padding:10px 5px 6px 42px;
	position:relative;
	width:96%;
}

.videoResponse.practice
{
    width:70%;/*48%*/
	margin:0 auto;
	margin-bottom:50px;
}

@media (max-width: 750px) { 
	.videoResponse.practice
	{
		width:100%;
		margin:0 auto;
		margin-bottom:20px;
	}	
}

/** videoControls.css ***/

.hasVideoControls
{
	position:relative;
}
.hasVideoControls .videoControls
{
	position:absolute;
	bottom:-30px;
	left:0;
	width:4%;
	height:30px;
	background:#fff;
	padding:4px;
	border:1px solid #ccc;
}

.hasVideoControls .videoControls a
{
	display:block;
	text-indent:-999px;
	overflow:hidden;
	cursor:pointer;
}

.hasVideoControls .videoControls a.pause
{
	border-left:6px #3E426C solid;
	border-right:6px #3E426C solid;
	width:16px;
	height:20px;
	margin:0px 3px;
}

.hasVideoControls .videoControls a.play,
.hasVideoControls .videoControls span.inactive
{
	border-bottom:11px transparent solid;
	border-left:20px #3E426C solid;
	border-top:11px transparent solid;
	width:0;
	height:0;
	margin:0px 3px;
}

.hasVideoControls .videoControls span.inactive
{
	display:block;
	opacity:0.25;
}

.hasVideoControls .videoControls a:hover
{
	opacity:0.75;
}

.hasVideoControls .durationBar {
	border:1px solid #ccc;
	position:absolute;
	bottom:-30;
	right:0;
	width:96%;
	height:30px;
	margin-bottom:5px;
	/*border:solid 1px #9FABB3;*/
	background-color:#fff;
	/*border-radius:10px;*/
	z-index:0;
	box-sizing:border-box;
	overflow:hidden;
	padding:5px;
}

.hasVideoControls .durationBar.clickable
{
	cursor:pointer;
}

.hasVideoControls .positionBar
{
	width:0;
	height:19px;
	color:white;
	font-weight:bold;
	background:linear-gradient(to bottom, rgba(62,66,108,1) 0%,rgba(29,58,112,1) 100%);
	text-align:center;
	z-index:2;
}

.hasVideoControls .feedback
{
	position:absolute;
	/*bottom:165px;*/
	left:0;
	/*
	width:100%;
	*/
}


/*** dsa-video ***/



.questionOverlay
{
	display:none;	
	position:absolute;
	left:95px;
	top:100px;
	right:95px;
	padding:10px;
	z-index:2;
	background-color:white;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	border-radius:15px;
	color:white;
	background:linear-gradient(to bottom, rgb(53, 57, 106) 0%,rgb(29, 58, 112) 100%);
	border:1px solid #0e1d57;
	opacity:0.95;
}
.questionOverlay-none
{
	display:none;	
	position:absolute;
	left:95px;
	top:10px;
	right:95px;
	padding:10px;
	z-index:2;
	background-color:white;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	border-radius:15px;
	color:white;
	background:rgb(20,124,192); /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzE0N2NjMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxZDNhNzAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background:-moz-linear-gradient(top, rgba(20,124,192,1) 0%, rgba(29,58,112,1) 100%); /* FF3.6+ */
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(20,124,192,1)), color-stop(100%,rgba(29,58,112,1))); /* Chrome,Safari4+ */
	background:-webkit-linear-gradient(top, rgba(20,124,192,1) 0%,rgba(29,58,112,1) 100%); /* Chrome10+,Safari5.1+ */
	background:-o-linear-gradient(top, rgba(20,124,192,1) 0%,rgba(29,58,112,1) 100%); /* Opera 11.10+ */
	background:-ms-linear-gradient(top, rgba(20,124,192,1) 0%,rgba(29,58,112,1) 100%); /* IE10+ */
	background:linear-gradient(to bottom, rgba(20,124,192,1) 0%,rgba(29,58,112,1) 100%); /* W3C */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#147cc0', endColorstr='#1d3a70',GradientType=0 ); /* IE6-8 */
	border:1px solid #0e1d57;
	opacity:0.95;
}

.questionOverlay .controls.rePlay {
	float:right;
}

p.questionText{
	/*color:#007dc4;*/
	color:white;
	font-size:1.1em;
}


.questionOverlay input[type='radio'] {
   /*-webkit-appearance:none;*/
}
/*
.questionOverlay label + input[type="radio"]:checked {
	background-color:#bbb;
	color:red;
}
*/
.questionOverlay input[type="radio"] {
	width:0%;
	float:left;
	-webkit-appearance:none;

}
.questionOverlay label {
	width:96%;
	float:left;
	font-size:0.9em;
	clear:both;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	padding:5px 10px;
	background-color:#3a4d86;
	margin-bottom:5px;
	border:1px solid #1e3970;
}
.questionOverlay input[type="radio"]:checked + label{
	background-color:#d1e8f4;
	color:#065890;
 }

 .questionOverlay > div {
	float:left;
}

.questionOverlay > div.illustration {
	width:100px;
}

.questionOverlay > div.illustration > img {
	margin:0 auto;
	display:block;
}

.questionOverlay > div.illustration + div {
	width:470px;
	margin:0 0 10px 10px;
}

.questionOverlay > div.illustration + div.explanation p
 {
	font-size:13px !important;
	line-height:20px !important;
	margin:0 0 2px !important;
}

 .questionOverlay > div.controls {
	position:relative;
	float:none;
 }

 .questionOverlay > div + div.controls {
	clear:both;
 }

 .questionOverlay > div.controls .message {
	position:absolute;
	top:6px;
	right:15px;
	font-weight:bold;
 }

 .questionOverlay > div.end {
	float:none;
	clear:both;
 }

.multiVideo
{
	/*width:800px;*/
}

 .multiVideo .marker,
 .videoHazard .marker  {
	position:absolute;
	border:6px #FE1325 solid;
	display:block;
	z-index:999;
	border-radius:50%;
	box-sizing:border-box;
 }

 
 .videoHazard #coord_x,
.multiVideo #coord_x
{
	position:absolute;
	top:0;
	left:0;
	/*
	width:800px;
	height:2px;
	*/
	background:rgba(255,0,0,0.5);
	z-index:100
}

.videoHazard #coord_y,
.multiVideo #coord_y
{
	position:absolute;
	top:0;
	left:0;
	width:2px;
	height:450px;
	background:rgba(255,0,0,0.5);
	z-index:100
}

.videoHazard #coord_msg,
.multiVideo #coord_msg
{
	position:absolute;
	top:0;
	left:0;
	height:20px;
	background:rgba(255,255,255,0.5);
	z-index:100;
	white-space:nowrap;
}

.videoHazard #coord_circle,
.multiVideo #coord_circle
{
	position:absolute;
	top:0;
	left:0;
	width:100px;
	height:100px;
	border-radius:50px;
	border:2px solid rgba(255,0,0,0.5);
	z-index:100
}


 .multiVideo .markerData,
 .videoResponse .markerData {
	position:absolute;
	right:0px;
	bottom:40px;
	width:50%;
	z-index:999;
 }

 .multiVideo .markerData > span,
 .videoResponse .markerData > span {
	float:right;
	background:#FFF none;
	color:#F00;
	opacity:0.7;
	border-radius:3px;
	padding:0 5px;
	margin:5px;
	display:block;
 }

 .multiVideo .markerData > span + span,
 .videoResponse .markerData > span + span {
	clear:both;
 }

 .videoHazard .markerData > span > span {
	background:#F00 none;
	color:#FFF;
	margin:2px 5px 2px 0;
	padding:0 5px;
	border-radius:2px;
	display:inline-block;
 }


.questionOverlay .explanation ul {
	list-style:disc outside;
	margin-left:14px;
}


.clip-outof {
  position: absolute;
  top: 10px;
  left: 12px;
  z-index: 130;
  color: #fff;
}
.clip-setting {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 150;
  font-size: 12px;
  color: #fff;
  text-shadow: 2px 2px 2px #000;
  text-align: center;
}
.clip-setting p {
    color: #fff;
    font-family: inherit;
    margin: 0;
}
.clip-setting span {
  cursor: pointer;
}
.clip-setting img {
  display: block;
  margin: 0 auto;
  opacity: 0.8;
}
.clip-setting .end-test img {
  width: 82px;
  margin-top: 8px;
  margin-bottom: 4px;
}
.clip-setting img {
  margin-bottom: 0 !important;
}
@media (max-width: 980px) {
  .clip-setting img {
    max-width: 25px !important;
  }
}
@media (max-width: 480px) {
  .clip-setting p {
	  display: none;
  }
  .clip-setting .end-test img {
    width: 53px;
	}
	.clip-setting {
    top: 5px;
    right: 2px;
	}
	.clip-setting img{
    margin-bottom: 5px;
	}
  .clip-setting img {
    max-width: 40px !important;
  }
}