@charset "UTF-8";

/*
	For /quiz pages
	© Christian Answers Network (Films for Christ)
	Last edit 4.24.2021 pst
*/

*{font-family:'Roboto', sans-serif;}

body {
	topmargin:0;
	leftmargin:0;
	marginwidth:0;
	marginheight:0;
	color:#000;
	background:#333;
	font-family:"Roboto", "Open Sans", "Helvetica", "Arial", "sans-serif";
}

body#quiz {}
	body#quiz h1 {
/* 
		position:relative;
		top:-160px;
		z-index:10;
		color:#fff;
		text-align:center;
 */
	}

body#quizanswerpage {}
	body#quizanswerpage h1 {
		margin:0;
		padding:0;
	}


body#answerletterresults {/* see javascript, but not currently using this feature */
	background:#fff;
	padding:0 20px 40px 20px;
	line-height:200%;
	text-align:center;
}
	body#answerletterresults .quizitems {/* see javascript */
		padding-right:20px;
	}
	body#answerletterresults span {
		color:red;
	}

#quizLeftCol {
	padding:10px 0 0 0;
	width:170px;
	background:#f5df4d;/* IlluminatingYellow */
}
#quizRightCol {
	background-color:#fff;
	margin:0;
	padding:0;
}
#maincontent {
	padding:0 20px 20px 20px;
}

.imgflexbox {
	max-width:380px;
	padding:0 10px;
}

#canlogo {}

a {
	color:#000;
}
	a:link {
		text-decoration:none !important;
		border-bottom:2px solid #a7c6e5;/* TrustBlue */
	}
	a:visited {
		text-decoration:none !important;
		border-bottom:2px solid #333;
	}

/* headers========== */
h1 {
	margin-top:50px;
	color:#000;
	font-size:24px;
	font-style:italic;
}
	h1 span {
		padding-left:15px;
		font-size:32px;
		font-style:normal;
	}

div#titlebox {/* for use with title over dark background image */
	position:relative;
	display:inline-block;
}
	#titlebox img {
		width:100%;
		max-width:1920px;
	}
	#titlebox #titleboxtext {
		position:absolute;
		z-index:99;
		top:65%;/* Adjust value to move positioned div up and down */
		color:#fff;
		text-align:center;
		margin:0 !important;
		padding:0 !important;
		left:0;
		right:0;
		background: -moz-linear-gradient(rgba(0,0,0,.4),rgba(0,0,0,.4));
background: -webkit-linear-gradient(rgba(0,0,0,.4),rgba(0,0,0,.4));
background: linear-gradient(rgba(0,0,0,.4),rgba(0,0,0,.4));
filter: unquote("progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#b3000000',GradientType=0 )");
	}
		#titlebox #titleboxtext h1 {
			color:#fff;
			margin:0;
			padding:0;
			text-shadow:4px 3px 3px #000;
		}

/* 
div#titlebackground {
	width:100%;
	max-width:1920px;
	height:300px;
	max-height:1018px;
	background-color:#333;
	background-image:url(/img/edenicnaturescene1920-dp.jpg);
	background-size:cover;
}
div#titleondarkimage {
	padding:220px 0 0 0;
	color:#fff;
	font-size:24px;
	font-style:normal;
	font-style:italic;
	text-align:center;
	text-shadow:4px 3px 3px #000;
}
 */


	div#titleondarkimage span {
		padding-left:15px;
		font-size:32px;
		font-weight:bold;
	}
h2 {
	color:#000;
	font-size:18px;
	margin:30px 0 10px 0;
}
/* end headers */

ol {
	margin:0 20px 50px 0;
	padding:0 0 0 20px;
}

fieldset {
	border:none;
	padding:0;
}

#quizbuttons {
	margin-top:30px;
}

.custombuttons input[type=button] {
	position:relative;
	background:#f5df4d;/* IlluminatingYellow */
	border-width:2px;
	border-style:outset;
	border-radius:10px;
	text-decoration:none;
	font-weight:bold;
	padding:20px 20px;
	margin-right:10px;
	cursor:pointer;
	-moz-box-shadow:0px 0px 10px #333;
	-webkit-box-shadow:0px 0px 10px #333;
	-o-box-shadow:0px 0px 10px #333;
	box-shadow:0px 0px 10px #333;
	-moz-box-shadow:0 0 10px #333;
	-webkit-box-shadow:0 0 10px #333;
	-o-box-shadow:0 0 10px #333;
	box-shadow:0 0 10px #333;
}
	input[type=button]:hover {
		color:#fff;
	}
	input[type=button]:active {
		transform:translate3d(3px);
		-moz-box-shadow:0px 0px 5px #333;
		-webkit-box-shadow:0px 0px 5px #333;
		-o-box-shadow:0px 0px 5px #333;
		box-shadow:0px 0px 5px #333;
		-moz-box-shadow:0 0 5px #333;
		-webkit-box-shadow:0 0 5px #333;
		-o-box-shadow:0 0 5px #333;
		box-shadow:0 0 5px #333;
	}

.questions div {
	margin:30px 0 20px 10px;
	padding:10px 15px;
	background:#e7e9e7;/* BlancDeBlanc */
	font-weight:bold;
	border-radius:8px;
}

ul.choices {
	margin:0;
	list-style:upper-alpha;
}
	ul.choices li {
		margin-bottom:15px;
		padding-left:10px;
	}
	ul.choices li label {
		display:block;
		line-height:40px;
	}
	ul.choices input {
		margin:0 10px 0 10px;
	}
	ul.choices ul {
		margin-top:15px;
	}

ul.possibleanswers {/* OLD phase out */
	margin:0;
	list-style:lower-alpha;
}
	ul.possibleanswers li {/* OLD phase out */
		margin:0;
		padding:0;
	}
	ul.possibleanswers input {/* OLD phase out */
		margin:0 10px 0 0;
	}

#correctanswerscalculated {
	margin-top:10px;
	padding:0;
	font-size:16pt;
	font-weight:bold;
	text-align:center;
	border:1px solid 3ccc;
	border-radius:8px;
}

.correctanswer {
	position:relative;
	left:-20px;
	margin:0;
	padding:20px;
	width:auto;
	font-weight:bold;
	list-style-position:inside;
	border-radius:8px;
	-moz-box-shadow:0px 0px 10px #ccc;
	-webkit-box-shadow:0px 0px 10px #ccc;
	-o-box-shadow:0px 0px 10px #ccc;
	box-shadow:0px 0px 10px #ccc;
	-moz-box-shadow:0 0 10px #ccc;
	-webkit-box-shadow:0 0 10px #ccc;
	-o-box-shadow:0 0 10px #ccc;
	box-shadow:0 0 10px #ccc;
}
	.correctanswer .explanation {
		font-weight:300;
		list-style-position:outside;
	}

/* radiobuttons========== */
@keyframes click-wave {
	0% {
		height:40px;
		width:40px;
		opacity:0.35;
		position:relative;
	}
	100% {
		height:200px;
		width:200px;
		margin-left:-80px;
		margin-top:-80px;
		opacity:0;
	}
}
.option-input {
	-webkit-appearance:none;
	-moz-appearance:none;
	-ms-appearance:none;
	-o-appearance:none;
	appearance:none;
	position:relative;
	top:13.33333px;
	right:0;
	bottom:0;
	left:0;
	transition:all 0.15s ease-out 0s;
	background:#cbd1d8;
	border:none;
	color:#000;
	cursor:pointer;
	display:inline-block;
	margin-right:0.5rem;
	outline:none;
	position:relative;
	z-index:1000;
}
.option-input:hover {
	background:#9faab7;
}
.option-input:checked {
	background:#f5df4d;/* IlluminatingYellow */
}
.option-input,
.option-input:checked::before {
	height:30px;
	width:30px;
	line-height:30px;
}
.option-input:checked::before {
	position:absolute;
	content:'✔';
	display:inline-block;
	font-size:26.66667px;
	text-align:center;
}
.option-input:checked::after {
	-webkit-animation:click-wave 0.65s;
	-moz-animation:click-wave 0.65s;
	animation:click-wave 0.65s;
	background:#f5df4d;/* IlluminatingYellow */
	content:'';
	display:block;
	position:relative;
	z-index:100;
}
.option-input.radio {
	border-radius:50%;
}
.option-input.radio::after {
	border-radius:50%;
}
/* END radiobuttons========== */


#grades {
	text-align:center;
}
	#percentage input {
		margin-left:7px;
		font-size:24px;
		font-weight:bold;
		border:0;
	}
#gradecalculator input.button {
	font-size:12pt;
	background:none;
	cursor:pointer;
	font-weight:normal;
}
	#gradecalculator input.button:hover {
		background:#375e32;
		color:#fff;
	}

.answer span {
	color:#339933;
	font-weight:bold;
}

#footer {
	border-top:1px solid #999;
	background:#e7e9e7;/* BlancDeBlancGray */
	margin:0 0 20px 0;
	padding:5px 20px 0 20px;
	min-height:100px;
}
	#footer p {
		font-size:10pt;
		line-height:100%;
	}
	#footer a {
		font-weight:normal;
	}
	#footer #cannavbuttons {
		float:right;
		margin-top:10px;
		width:auto;
	}
	#footer #cannavbuttons a {
		border-bottom:none;
	}
	
	#footer #cannavbuttons img {
		margin-right:5px;
		width:125px;
		height:50px;
	}
		#footer #cannavbuttons div {
			margin:5px 0 0 0;
		}

/* 
body,
p,
h1,
h2,
h3,
h4,
a,
td,
li,
div,
input {
	font-family:"Open Sans", "sans-serif";
}
 */

/* 
p {
	line-height:150%;
	font-weight:normal;
	margin-right:20px;
}
 */

/* 
#quiz p {
	line-height:150%;
	font-weight:bold;
	margin-right:20px;
}
	#quiz p.answer {
		font-weight:normal;
	}
	#quiz p.answer span {
		color:#339933;
		font-weight:bold;
	}
 */

/* LINKS========== */
/* 
a {}
	a:link {
		color:#000;
		background:none;
		text-decoration:none;
	}
	a:visited {
		color:#333;
		background:none;
		text-decoration:none;
	}
	a:hover {
		color:#ff0000;
		background:#f8dc00;
		text-decoration:none;
	}
	a:active {
		color:#ff00ff;
		background:none;
		text-decoration:underline;
	}
 */

/* GENERAL LISTS========== */
/* 
li {
	line-height:150%;
	margin-bottom:40px;
}
 */

/* END general lists */