html, body {
	margin: 0;
	padding: 0;
}

div#wrapper {
    margin: auto;
    padding: 10px;
}

div#topbar {
	margin: auto;
	padding-top: 5px;
	padding-bottom: 10px;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	width: 100%;
}

div#title {
    font: 1.5em Arial, Helvetica, sans-serif;
    font-weight: bold;
}

div#expiration
{
    color: #666;
	font: 0.7em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}
 
div.spacer {
	height: 10px; 
}

div#selector
{
    /* nothing */
    padding-top: 5px;
}

div#selector_widget
{
    display: inline-block;
    padding-right: 3px;
    vertical-align: top;
}

select#subelements
{
    /* nothing */
}

select#sections
{
    /* nothing */
}

select#questions
{
    /* nothing */
}

div#info
{
    margin: auto;
    padding-bottom: 10px;
	width: 100%;
	color: #666;
	font: 12px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	display: inline-block;
}

i#total_icon
{
    color: #666;
    padding-left: 1px;
    padding-right: 1px;
}

i#attempted_icon
{
    color: #006;
    padding-left: 1px;
    padding-right: 1px;
}

i#correct_icon
{
    color: #060;
    padding-left: 1px;
    padding-right: 1px;
}

i#incorrect_icon
{
    color: #600;
    padding-left: 1px;
    padding-right: 1px;
}

i#skipped_icon
{
    color: #000;
    padding-left: 1px;
    padding-right: 1px;
}

span#subelement,
span#section,
span#question
{
    /* nothing */
}

span.info
{
    margin: 0;
}

div#content
{
    margin:auto;	
	width:100%;
	overflow:hidden;
};

#panel1 {
	width:100%;
	/*height:400px;*/
	/*right:0px;*/
	/*position:absolute;*/
	clear: both;
}

#panel2 {
	width:100%;
	/*height:400px;*/
	/*right:-100%;*/
	/*position:absolute;*/
	display: none;
	clear: both;
} 

div.question_wrapper
{
	margin-bottom: 10px;
}

div#question_text
{
	color: #000;
	font: bold 1.1em "Lucida Grande", Lucida, Verdana, sans-serif;
	margin-bottom: 20px;
}

div.options_wrapper
{
    /* nothing */
}

div#loading
{
    margin: auto;
    width: 100%;
}

div.option
{
	margin-bottom: 10px;
	cursor: pointer;
}

div.option_num
{
	float: left;
	border: 1px solid #000;
	padding: 3px 5px;
	font: 1em Arial, Helvetica, sans-serif;
}

div.option_text,
div#summary_stats
{
	margin-left: 30px;
	padding: 3px;
	font: 1em Arial, Helvetica, sans-serif;
}

div.summary_wrapper
{
    display: none;
}

div#finished_text
{
	color: #000;
	font: bold 1.1em "Lucida Grande", Lucida, Verdana, sans-serif;
	margin-bottom: 20px;
	text-align: right;
	width: 45%
}

div#summary_stats
{
    /* display: flex;
    justify-content: space-between; */
}

div.stat_line
{
    /* nothing */
}

div.stat_text
{
    display: inline-block;
    padding-right: 10px;
    width: 45%;
    text-align: right;
}

div.stat_number
{
    display: inline;
}

div.stat_widget
{
    display: inline;
    padding-right: 10px;
}

div.stat_percent
{
    display: inline;
    font: 12px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	padding-left: 10px;
}

div.feedback_wrapper
{
	padding-top: 10px;
	padding-bottom: 10px;
}

div#footer
{
    position: fixed;
    bottom: 0px;
    left: 5px;
    right: 5px;
}

div#footer_panel
{
	margin-top: 20px;
	display: block;
	background-color: #FFF;
	border-style: solid;
    border-color: #000;
    border-width: 1px;
    border-bottom-width: 0px;
    border-top-left-radius: 7px;
    -moz-border-radius-topleft: 7px;
    border-top-right-radius: 7px;
    -moz-border-radius-topright: 7px;
}

div#button_panel
{
    display: flex;
    justify-content: space-between;
}

div.button_box
{
    display: inline;
}

/* buttons */

div#config_widget
{
    padding-top: 2px;
    padding-left: 5px;
}

div#settings
{
    padding-top: 5px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
    
    background-color: #FFF;
    display: none;
}

div#settings_group
{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

div#settings_group_2
{
    padding-left: 10px;
}

div#selector_controls
{
    display: inline-block;
}

div#question_order
{
    /* nothing */
}

div#sequential_wrapper,
div#arrl_wrapper
{
    display: block;
}

span#sequential_text,
span#arrl_text,
span#random_questions_text,
span#random_answers_text
{
    font: 12px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

div#randomization_wrapper
{
    /* nothing */
}

div#random_questions_wrapper,
div#random_answers_wrapper
{
    display: block;
}

div#sub_footer
{
    display: flex;
    justify-content: space-between;
}

div#credits_wrapper
{
    margin-top: 5px;
    margin-left: 5px;
    display: inline;
}

span#credits_text,
span#about_text
{
    color: #666;
	font: 0.5em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

div#about_wrapper
{
    margin-top: 5px;
    margin-left: 15px;
    display: inline;
}







div#correct,
div#incorrect {
    display: block;
}

span#correct {
	font: 1em Arial, Helvetica, sans-serif;
	background-color: #0C0;
	padding: 7px;
	border: 1px solid #000;
}

span#incorrect {
    font: 1em Arial, Helvetica, sans-serif;
	color: #FFF;
	background-color: #C00;
	padding: 7px;
	border: 1px solid #000;
}


div#replay_opts {
	margin-top: 20px;
}

div#retry,
div#restart,
div#reset {
	color: #43f;
	margin-top: 10px;
    cursor: pointer;
}

span.replay_opt {
	padding: 7px;
}


span.replay_opt:hover {
	background: #CCC;
	padding: 7px;
}


/*
@media screen and (max-width:100%) {
	#topbar{margin-left:1%;margin-right:1%;	width:96%;}
	
	#panel1{margin:1%;	width:98%;}
	#panel2{margin:1%;	width:98%;}

	#options_wrapper {
		width:80%;
		word-wrap: break-word;
	}
	
	#question_text {
		width:50%;
		word-wrap: break-word;
	}

	.option_text {
		width:50%;
		word-wrap: break-word;
	}

}

@media screen and (max-width:460px) {
	
}
*/