/*
Copyright (C) 2013 peter

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/
/* 
    Created on : 11-dic-2013, 18:06:39
    Author     : peter
*/

/*                                  WEBINAR JAM                           */
div.wj_embed_wrapper, div.wj_expanded, div.wj_bottombar{
	width: 100%;
	padding:0;
	margin:0 auto;
	height: 350px;
	text-align:center;
}
div.wj_container {
	width: 100%;
	margin:0 auto;
/*	border: 1px solid white;*/
}

div.wj_row{
	width: 100%;
	margin:0 auto;
/*	border: 1px solid white; */
}
.wj_embed_wrapper_grid{
	margin:0 auto;
}
.wj_timezone_text{
	color:red;
}

/*                                  WEBINAR JAM                           */
/* Show error messages in red */
td { 
	padding: 0 2px 0 2px;
	text-align: center;
	}
th { 
	padding: 0 2px 0 2px;
	text-align: center;
	}
.resalted {
	background-color:#FF3E3E;
	background-color:red;
	color:white;
	font-weight:600;
}
.ready {
	background-color:#3C3;
	color:black;
	font-weight:600;
}
.onwork {
	background-color:#FC3;
	color:black;
	font-weight:600;
}
.DeadDate {
	color:red;
	font-weight:600;
}
table.form td {
	text-align:left;
}
table.form label {
	font-weight:600;
}
/* ............................... ALERT BOXES .............................*/
.alert-box {
    color:#555;
    border-radius:10px;
    font-family:Tahoma,Geneva,Arial,sans-serif;font-size:11px;
    padding:10px 10px 10px 36px;
    margin:10px;
	letter-spacing:1px;
}
.alert-box span {
    font-weight:bold;
    text-transform:uppercase;
}
.error {
    background:#ffecec url('//entries.cambridgemb.com/images/error.png') no-repeat 10px 50%;
    border:1px solid #f5aca6;
}
.success {
    background:#e9ffd9 url('//entries.cambridgemb.com/images/success.png') no-repeat 10px 50%;
    border:1px solid #a6ca8a;
}
.warning {
    background:#fff8c4 url('//entries.cambridgemb.com/images/warning.png') no-repeat 10px 50%;
    border:1px solid #f2c779;
}
.notice {
    background:#e3f7fc url('//entries.cambridgemb.com/images/notice.png') no-repeat 10px 50%;
    border:1px solid #8ed9f6;
}
/* ............................... ALERT BOXES .............................*/
/* ............................ CUSTOM CHECKBOXES ......................*/
/* ............................ TICK ......................*/
#tick {
    display:inline-block;
    width: 20px;
    height:20px;
    background:transparent; /* #c9ff00; */
    border-radius:50%;
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    transform: rotate(45deg);
}

#tick:before{
    content:"";
    position: absolute;
    width:3px;
    height:9px;
    background-color:green; /*#fff; */
    left:11px;
    top:6px;
}

#tick:after{
    content:"";
    position: absolute;
    width:3px;
    height:3px;
    background-color:green; /*#fff;*/
    left:8px;
    top:12px;
}
/* ............................ CROSS ......................*/
#cross {
    display:inline-block;
    width: 20px;
    height:20px;
    background:transparent; /* #c9ff00; */
    border-radius:50%;
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    transform: rotate(45deg);
}

#cross:before{
    content:"";
    position: absolute;
    width:3px;
    height:9px;
    background-color:red; /*#fff; */
    left:11px;
    top:6px;
}

#cross:after{
    content:"";
    position: absolute;
    width:9px;
    height:3px;
    background-color:red; /*#fff;*/
    left:8px;
    top:9px;
}
/* ............................... EXCLAMATION ..............................*/
.exclamation {
    padding-left:0.7em;
    position: relative;
}

.exclamation input {
    padding-left: 0.7em;
    margin-left: -0.7em;
}

.exclamation::before {
    display:block;
    position: absolute;
    left:0.1em;
    top: 0.14em;
    content:"";
    width:0; height:0;
    border-width: 0.5em 0.18em 0 0.18em;
    border-style: solid;
    border-top-color:red; 
    border-bottom-color:transparent; 
    border-left-color:transparent; 
    border-right-color:transparent;
}
.exclamation::after{
    display:block;
    content:"";
    position: absolute;
    width:0; height:0;
    border:0.13em solid red;
    border-radius:0.13em;
    top:0.75em;
    left:0.15em;
}
/* ............................ CUSTOM CHECKBOXES ......................*/
/* ............................ SORTABLE HEADINGS ......................*/
.headerSortDown:after,
.headerSortUp:after{
    content: ' ';
    position: relative;
    left: 3px;
    border: 5px solid transparent;
	margin-right:3px;
}
.headerSortDown:after{
    top: 10px;
    border-top-color: white;
}
.headerSortUp:after{
    bottom: 10px;
    border-bottom-color: white;
}

.headerSortLeft:after,
.headerSortRight:after{
    content: ' ';
    position: relative;
    left: 0px;
	top:0px;
	margin-right:3px;
}
.headerSortLeft:after{
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 8.7px 5px 0;
	border-color: transparent #007bff transparent transparent;
}
.headerSortRight:after{
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 0 5px 8.7px;
	border-color: transparent transparent transparent black;
}

.headerUnsorted:after{
    content: ' ';
    position: relative;
    left: 3px;
    border: 5px solid transparent;
}
.headerUnsorted:after{
    top: 10px;
    border-top-color: silver;
}

/* ............................ SORTABLE HEADINGS ......................*/
/* ............................... ARROWS ..............................*/
.arrow_right{
    background:red;
	position:relative;
}
.arrow_right:after{
	position: relative;
    content:' ';
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid silver;
	display:inline-table;
	top:-4px;
	left:3px;
	margin-right:3px;
}

.arrow_left{
    background:red;
	position:relative;
}
.arrow_left:after{
	position: relative;
    content:' ';
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-right: 6px solid silver;
	display:inline-table;
	top:-4px;
	left:3px;
	margin-right:3px;
}

.arrow_up{
    background:red;
	position:relative;
}
.arrow_up:after{
	position: relative;
    content:' ';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid white;
	display:inline-table;
	top:-7px;
	left:3px;
	margin-right:3px;
}

.arrow_down{
    background:red;
	position:relative;
}
.arrow_down:after{
	position: relative;
    content:' ';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid white;
	display:inline-table;
	top:0px;
	left:3px;
	margin-right:3px;
}

/* ............................... ARROWS ..............................*/

/*.double_arrow_up, .double_arrow_down, .double_arrow{
    background:transparent;
	position:relative;
	margin-left:-12px;
	margin-right:-3px;
	background: transparent;
	float:right;
}
.double_arrow_up:before{
	position: relative;
    content:' ';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid white;
	display:inline-block;
	top:-5px;
	left:16px;
	margin-right:3px;
}
.double_arrow_up:after{
	position: relative;
    content:' ';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #777;
	display:inline-block;
	top:2px;
	left:1px;
	margin-right:3px;
}

.double_arrow_down:before{
	position: relative;
    content:' ';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #777;
	display:inline-block;
	top:-5px;
	left:16px;
	margin-right:3px;
}
.double_arrow_down:after{
	position: relative;
    content:' ';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid white;
	display:inline-block;
	top:2px;
	left:1px;
	margin-right:3px;
}

.double_arrow:before{
	position: relative;
    content:' ';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #777;
	display:inline-block;
	top:-5px;
	left:16px;
	margin-right:3px;
}
.double_arrow:after{
	position: relative;
    content:' ';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #777;
	display:inline-block;
	top:2px;
	left:1px;
	margin-right:3px;
}*/
/* ............................... MOCKS ..............................*//* ............................... MOCKS ..............................*/
/* ............................... MOCKS ..............................*//* ............................... MOCKS ..............................*/
.exam_rubric{
	text-align:justify;
}
.exam_rubric form{
	text-align:center;
}
#exam{
	text-align:center;
	border: 0;
	color:red;
	font-size: 12px;
	font-size: 1em;
	font-weight:100;
	font-family:Verdana, Geneva, sans-serif;
	font-stretch:extra-expanded;
	padding:0;
	margin:0 auto;
}
#exam form{
	border: 0;
	margin:10px;
	padding:0;
}
.exam_header{
	color:black;
	font-size:18px;
	font-weight:600;
	margin-top:50px;
}
.mock_divider{
	color: rgba(0,0,0,1);
	background-color: rgba(0,0,0,1);
	height: 5px;
	border: 0;
	clear:left;
}
.part_divider{
	color: transparent;
	background-color: transparent;
	height: 0;
	border: 0;
	clear:left;
}
.example_divider{
	height: 0;
	border: 0;
	padding:0;
	clear:left;
}
.question_divider{
	height: 0;
	border: 0;
	padding:0;
	clear:left;
}
div.mock_part{
	border: 1px solid black;
	background-color:rgba(0,0,0,0.02);
	width:98%;
	margin: 0 auto 20px auto;
	clear:left;
}
.part_header{
	border: 1px solid black;
	background-color:rgba(0,0,0,0.2);
	color:black;
	font-size:16px;
	font-weight:600;
	padding:5px;
	text-align:justify;
}
.part_rubric{
	border: 1px solid black;
	background-color:rgba(0,0,0,0.2);
	color:black;
	font-weight:100;
	padding:5px;
	margin: auto auto 0 auto;
	text-align:justify;
}
div.part_media{
	border: 1px solid transparent;
	margin: 22px auto 0 auto;
	color:black;
	float:left;
	text-align:center;
	width:40%;
	display: inline-block;	
	clear:left;
	padding: 0 10px;
}
div.part_questions{
	border: 1px solid transparent;
	margin: 22px auto 0 auto;
	color:black;
	text-align:center;
	width:auto;
	display: inline-block;	
	clear:left;
	padding: 0;
}
div.mock_question{
	border: 0;
	margin: 0 auto auto 0;
	margin: 0;
	padding: 0;
	color: black;
	border: 1px solid transparent;
	width: 100%;
}
div.question_media{
	width:auto;
	float:left;
}
.mock_question_element{
	padding: 10px 10px 5px 10px;
	margin: 0 auto 15px auto;
	border:1px solid black;
	background-color:rgba(0,0,0,0.05);
	width:auto;
}
.mock_question_element.mock_example{
	background-color:rgba(0,0,0,0.2);
	box-shadow: 0.5em 0.5em 0.5em rgba(0,0,0,0.3);
}
.mock_question_element.answered{
	background-color:white;
	box-shadow: 0.5em 0.5em 0.5em rgba(0,0,0,0.3);
}
ol.part_media{
	padding: 0;
	margin: 0;
	list-style-position:inside;
	list-style-type: none;
}
/*****************************/
li.mock_example{
	font-weight:600;
	list-style-type:none;
}
li.mock_question{
	font-weight:600;
	list-style-type:none;
	white-space:normal;
}
li.mock_option{
	white-space: normal;
	margin-top:0;
	margin-bottom:20px;
}
img.part_media{
	border: 1px solid black;	
	margin: 10px auto;
	width:100%;
}
ol.mock_option{
	margin: 10px 10px;
}
label.paper_toolbar{
	color:black;
	font-weight:600;
	margin-left:30px;
}
span.paper_toolbar{
	margin-bottom:30px;
	margin-right: 10px;
}
div.mock_toolbar{
	margin: 0 auto;
	width:95%;
	clear:left;
	text-align:center;
}
form.toolbar input[type="submit"]{
	margin-bottom: 10px;
}
input[type="submit"].selected_part{
	color: red;
	font-weight:600;
}
/*****************************/
ul .mock_question_element{
	list-style-type: none;
}
.mock_question .mock_question_element{
	clear:left;
}
.mock_question input[type="text"] {
	width:300px;
//	font-size:14px;
	letter-spacing:1px;
}
ol .mock_option{
	list-style-type:upper-alpha;
	float:left;
	margin: 10px 10px;
}
ol .mock_list_option{
	list-style-type:upper-alpha;
	margin: 10px 10px;
}
ol .mock_text_option{
	list-style-type:none;
	width: 200px;
}
.mock_option input[type="radio"]{
	margin: auto 5px auto 0;
}
.mock_option input[type="text"]{
//	font-size:14px;
	letter-spacing:1px;
}
.mock_option textarea{
//	font-size:14px;
	letter-spacing:1px;
	width:100%;
	height:250px;
}
input[type="radio"]:checked+label.mock_option_answer{
	font-weight: bold;
	text-decoration:underline;
	color:red;
}
input[type="radio"]:checked+label.mock_option_answer img.option_media{
	border:2px solid red;
}
label.mock_option_answer{
	font-weight:100;
	margin:auto 15px auto 0;
}
/*****************************/
@media screen and (min-width: 1580px) { /* default */ 
	div.part_media.type1{
		width: 60%;
	}
	div.part_questions.type1{
		width:30%;
	}
}
@media screen and (max-width: 1440px){
	div.part_media.type1{
		width: 60%;
	}
	div.part_questions.type1{
		width:30%;
	}
}
@media screen and (max-width: 1280px){ 
	div.part_media.type1{
		width: 60%;
	}
	div.part_questions.type1{
		width:30%;
	}
}
div.part_media.type1{
	margin-top:13px;
}
div.mock_question.type1{
}
img.type1{
	width:100%;
}
li.mock_option.type1{
}
/*****************************/
div.part_questions.type2{
	width:90%;
}
li.type2{
	list-style-type:upper-alpha;
	display:list-item;
}
/*****************************/
div.part_media.type3{
	margin-top:13px;
}
div.part_questions.type3{
	width:	100%;
}
div.mock_question.type3{
	border: 1px solid black;
	padding: 1px;
	width:auto;
	margin-bottom: 20px;
	background-color:rgba(0,0,0,0.05);
	box-shadow: 0.5em 0.5em 0.5em rgba(0,0,0,0.3);
}
ul.type3{
	background-color:transparent;
	border: 0;
}
img.type3{
	width:100%;
}
.question_media.type3{
	border: 0;
	padding:10px;
	margin: 0 auto 0 auto;
	background-color:transparent;
	width:auto;
}
.type3 textarea{
	width:100%;
	height:300px;
}
/*****************************/
div.part_media.type4{
	width:60%;
	margin-top:13px;
}
div.part_questions.type4{
	width:30%;
}
div.mock_question.type4{
}
img.type4{
	width:100%;
}
.type4 label{
	font-weight:100;
	font-style:italic;
}
.type4 input[type="text"]{
	margin-left:0;
	width: 90%;
	display:block;
}
/*****************************/
div.part_media.type5{
	margin-top:13px;
}
div.mock_question.type5{
}
li.mock_option.type5{
}
li.mock_option.type5 label{
}
ol.type5{
	list-style-type: upper-alpha;
}
.part_media li.type5{
	white-space:nowrap;
	font-weight:600;
	border: 1px solid transparent;
	list-style-type:upper-alpha;
	float:left;
	margin: 10px 20px 10px 20px;
	width:40%;
}
img.part_media.type5{
	border: 1px solid transparent;
}
/*****************************/
div.part_media.type6{
	width:50%;
}
div.mock_question.type6{
}
.type6 .mock_example input{
}
img.type6{
	width:100%;
}
/*****************************/
div.part_media.type7{
	margin-top:13px;
	width:60%;
}
div.part_questions.type7{
	width:30%;
}
div.mock_question.type7{
}
img.type7{
	width:100%;
}
/*****************************/
div.part_media.type8{
	width: 96%;
}
div.part_questions.type8{
	width:auto;
}
div.mock_question.type8{
}
img.type8{
	width:auto;
}
li.mock_option.type8{
}
/*****************************/
div.part_media.type9{
	width:96%;
}
div.part_questions.type9{
	width:auto;
}
div.mock_question.type9{
	border: 0;
	width:auto;
}
ul.type9{
	display:inline-block;
	width: 100%;
}
img.type9{
}
.type9 label{
	font-weight:100;
	font-style:italic;
}
.type9 input[type="text"]{
	margin-left:0;
	width: 99%;
	display:block;
}
/*****************************/
div.part_questions.type10{
	border: 0;
	width:100%;
}
div.mock_question.type10{
	border: 0;
	clear:both;
	width:100%;
}
div.question_media.type10{
	border:0;
	display:inline-block;
	float:left;
}
ul.type10{
	margin-top: 30px;
	border:1px solid black;
	display:inline-block;
	width: 60%;
}
li.type10{
	clear:both;
}
/*****************************/
div.part_media.type11{
	width: 60%;
}
div.part_questions.type11{
//	border: 1px solid transparent;
	width:30%;
}
div.mock_question.type11{
}
li.mock_option.type11{
}
li.mock_option.type11 label{
}
.part_media li.type11{
	white-space:nowrap;
	font-weight:600;
	border: 1px solid transparent;
	list-style-type:none;
	float:left;
	margin: 0 20px;
	width:40%;
}
img.part_media.type11{
	width:100%;
}
/*****************************/
div.part_media.type12{
	margin-top:13px;
	border: 0;
	width: 50%;
}
div.part_questions.type12{
	border: 0;
	width:45%;
}
div.mock_question.type12{
}
img.type12{
	width:100%;
}
li.mock_option.type12{
	clear:left;
}

/* The Modal (background) */
.modal {
    display:table;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal hr {
	clear:both; 
	border: 0px solid transparent; 
	margin-top: -0.5em; 
	margin-bottom: -0.5em;
}

.middle {
    display: table-cell;
    vertical-align: middle;
}

/* Modal Content/Box */
.modal-content {
    margin: 10px auto;
    padding: 20px;
    border: 1px solid #888;
    display: inline-block;
    max-width: 100em; 
    width: 90%; /* Could be more or less, depending on screen size */
    overflow: auto; /* Enable scroll if needed */    
}