body { 
	margin: 0;
	background-color: #fff;	
}

body, p { 	
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

p
{
     padding-bottom: 10px;   
}

.attr {
/* attribution in study mode */
	font-size: 9px;
	
}

#study-on-off { visibility: visible; }

ul.bulleted li { 
	list-style-type: disc;
	list-style-position:inside;  
	text-indent: 22px;
 }

#navIETbl {
	padding: 0;
	margin: 0;
	
}

#QuizTitleETC {
	width: 80%;
	margin-left: 15px;
}

img.tips {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif') -22px 0px;
	border: none;	
}

img.notes {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif') 0px 0px;
	border: none;
	margin-right: 8px;
}

img.edit {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif') -46px 1px;
	border: none; 
	margin-right: 8px;
}

img.public {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif') -67px 0px;
	border: none;
	margin-right: 8px;
}

img.fave_unsaved {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif') -89px 0px;
	border: none;	
	margin-right: 8px;
}

img.fave_saved {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif') -89px -22px;
	border: none;	
	margin-right: 8px;
}

img.notes:hover, img.notes:active {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif') 0px -23px ;
	margin-right: 8px;
}


img.tips:hover, img.tips:active {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif')  -22px -23px;	
}


img.edit:hover, img.edit:active {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif')  -46px -23px;
	margin-right: 8px;
}


img.public:hover, img.public:active {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif')  -67px -22px;
	margin-right: 8px;
}

img.fave_unsaved:hover, img.fave:active {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif')  -89px -22px;
	margin-right: 8px;
}

img.fave_saved:hover, img.fave:active {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite-new4.gif')  -89px 0px;
	margin-right: 8px;
}

#myNavOuter {
	position:relative;
	z-index: 5;
}

#myNav tr {
	background: #174749; /*#174749  */
	width: 100%;
	padding: 0px;
	margin: 0px;
	 height: 31px;   /*  can't get rid of 1 pixel at bottom */
}

#buttonList {
	margin: 15px 0 0 0;
	padding: 0;
}
#buttonList  li {
	display: inline-block;
	list-style-type: none;
	padding: 0 5px 0 0;
	*display: inline;    /* *display is an ie7 hack */
	
	
}


 
a.tooltip {outline:none; }
a.tooltip strong {line-height:30px;}
a.tooltip:hover {text-decoration:none;} 
a.tooltip span {
    	z-index:10;
	display:none;
	padding:14px 20px;
    	margin-top:35px; 
	/*margin-left:-195px;*/
	margin-left:-100px;
	width:180px; 
	line-height:16px;
}
a.tooltip:hover span{
    	display:inline; 
	position:absolute; 
	color:#111;
    	border:2px solid #174749; 
	background:#ffffff;
}

/* not used ?
.callout-leftside {z-index:20;position:absolute;top:30px;border:0;left:-12px;}
 
.callout {z-index:20;position:absolute;top:-20px;border:0;left:92px;}  */
   
/*CSS3 extras*/
a.tooltip span
{
    border-radius:4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
        
    -moz-box-shadow: 5px 5px 8px #CCC;
    -webkit-box-shadow: 5px 5px 8px #CCC;
    box-shadow: 5px 5px 8px #CCC;
}

a.tooltipwider span {	
	margin-left:-175px; /* was -195px */
	width:280px; 
}

.ContentText {
/*font-family:Verdana, Arial, Helvetica, sans-serif;*/
FONT-SIZE: 12px;
}

.ContentTextSmall {          
/*font-family:Verdana, Arial, Helvetica, sans-serif;*/
font-size:9px;
}




#scoreTracker {
	/*font-family:sans-serif;*/
	font-size: 10px;
}



#headerTable {
	
}

#headerTable td {
	padding: 15px 30px 0 15px;
}

#searchArea {
	margin: 0 15px 0 0;
	padding: 0px;
	width: 230px;
	float: right;		
}

#header {
	height: 90px;
	background-color: #FFFFFF;
	margin-bottom: 10px;
}

#topArea {
	display:inline-block;
	position: relative;
	/*border: 1px solid black;*/
}


#topAreaDetailNope {
	position: absolute; 
	z-index: 0;
	top: 0;
	left: 0;
	border:1px solid black;
}

#topArea2ndLevel {
	position: absolute; 
	top: 0;
	left: 0;
	z-index: -999;
	display:inline-block;
	border: 3px solid red;
	width: 650px;
	height:70px;
	background-color: #ffffff;	
	padding: 15px;
}

#supporterText {
	display:inline-block;
	position: absolute; 
	top: 90;
	left: 0;
}



#topAdArea {
	display:inline-block;
	/*border: 1px solid black;*/
}

#logo {
	display:inline-block;
	margin-right: 30px;
	
}

#logo img {
margin-top: auto;
	margin-bottom: auto;

}
#blankMap {
	position:relative;
	z-index: 1;
	
}

#blankMap, #singleColorMap, #labeledMap, #studyMap, #labeledMapC {
	margin-top: 15px;

}

#hardToClick {	
    width: 70%;
    margin: 0 auto;
}

.center {
	 width: 10%;
	 margin: 0 auto;
}

p.centerText {	
	text-align:center;
	margin: 5px 0;
	padding: 0;
}


.promoMsgImg {
	margin-top: 15px;
}
.promoMsgTxt {
	/*background-color: #729b56;*/
	border: solid black 1px;
	width: 468px;
	/*height: 60px;*/
	text-align: center;
	padding: 20px;
	margin-top: 15px;
}


#footer {
	height: 50px;
	background-color: #ddd;
	clear: both;
	width: 100%;

	position : relative;

	border-top : 2px solid #174749;
	text-align:center;
	/*font-family: sans-serif;*/
	font-size: 12px;
	padding-top: 20px;
	margin-top: 30px;
}


.followPage {
    position: fixed;
}


#QAInnerBox {
	background-color: #ffffff;
	border: 1px solid #174749;
	padding: 15px;
	height: 95px;	
}

#QAInnerFlagBox {
	background-color: #ffffff;
	border: 1px solid #174749;
	padding: 15px;
	height: 190px;
	
}

#left {
	float: left;
	width: 190px;
}

#right {
	margin-left: 210px;
    font-size: 12px; 
    font-weight: bold; 	
}

#questionArea { 
    color: #576d94; 
   /* font-family: Verdana, sans-serif; */
    font-size: 12px; 
    font-weight: bold; 	
}

P.imgFooter { text-align: center }

h1 {
    color: #576d94; 
  /*  font-family: Verdana; */
    font-size: 18px;
    font-weight: bold; 
    margin-bottom: 0;	


}


#uncheckedbox {
	visibility: visible;
}

#checkedbox {
	visibility: hidden;
	position: relative;
	left: -26px;
}

#boxInstruction {
	position: relative;
	left: -25px;
	top: -4px;
}


#nextQuestionText { 
    color: #0000ff; /*#669966; */
   /* font-family: Verdana, sans-serif; */
    font-size: 12px;
    font-weight: bold; 
   /* visibility: hidden;  */
    padding: 5px 0 5px 0;
}


#correctResult { 
    color: #669966; 
   /* font-family: Verdana, sans-serif; */
    font-size: 12px;
    font-weight: bold; 
   /* visibility: hidden;  */
}

#incorrectResult { 
    color: #6A0922; 
   /* font-family: Verdana, sans-serif; */
    font-size: 12px;
    font-weight:  bold; 
}

#showmelink {
    visibility: hidden;
}

#errMsg, .error { color: #990000; font-weight: bold; }	

.warn { color: #CC6666; font-weight: normal; font-size: small;}	
		  
.errorMsg {
	color: #6A0922;
    font-size: 10px;  
    font-weight:  bold; 
	/*font-style: italic;*/
}

.successMsg {
	color: #669966; 
    font-size: 12px;
    font-weight: bold; 
}

.fbfind {
	position:relative;
	top: 5px;
	bottom:0;	
}

.smallText{
	font-size: 11px;
	 
	/* margin-left: auto; */
    /* margin-right: auto ; */
}

.bordered {
 	/* border: 5px solid black; */

}

.QAbox {
	background-color: #dddddd;
	/* border: 1px solid #174749;  */
	
	width: 100%;
	border-spacing:0;
  	border-collapse:collapse;
}

.toprow {

 /*border: 1px solid #174749;  */

}


.secondrow {
/*	border-top: 1px solid #174749;  
	 border-left: 1px solid #174749;  
	border-right: 1px solid #174749;  
	border-bottom: 1px solid #174749;  */
	border: 1px solid #174749;  
}



.QAbox td {
	padding: 10px;
}


.box {
	background-color: #dddddd;
	border: 1px solid #174749;
	min-width:  300px;
	margin-top: 10px;
	padding: 5px 5px 5px 5px;
	
}

.shareicon {
	display: inline;	
	padding-right: 4px;
	position:relative;
	top:5px;
}

#sharebox {
	position: relative;

}

.nowrapStyle { white-space:nowrap;}


#NameHolder
{
    z-index:100;
    position:absolute;    
    color: #060a6d;
    font-size:12px;
    font-weight:bold;
    left:0px;
    top:300px;
	width: 190px;
	background-color: #fff;
	border: 1px solid black;
	padding: 10px;
}

#instructions {
	border: 2px solid green;
	padding: 10px;
	margin-top: 5px;
}


/* boxes */

.popbox {
	width: 445px;
	border: 2px solid #174749; /* was 669966  */
	background-color: #ffffff;
	/*padding-right: 20px;*/
	padding: 0px 0px 20px 30px;
 	
	color: #000000;
	/* font-family: sans-serif; */
	/* font-size: 12px; */
	border-radius:4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
        
    -moz-box-shadow: 5px 5px 8px #CCC;
    -webkit-box-shadow: 5px 5px 8px #CCC;
    box-shadow: 5px 5px 8px #CCC;

	z-index: 2000; /* was 4. I need to get it on top of the typeahead input area. Nav zindex is around 9999, and typeahead zindex is around 1000 */
}

.boxTitle {
	/*font-family: sans-serif;*/
	color: #174749;  /* was 669966  */
	font-weight: bold;
	/* padding-left: 15px; */
	
	
	font-size: 16px;
	margin-bottom: 5px;
	margin-top: 20px;
}

.close {
	float: right;
	color: #174749;  /* was 669966  */
	
	font-weight: bold;
	text-decoration: none;
	/*font-family: sans-serif;*/
	font-size: 16px;
}
.popbox ul {
	margin-left: 0;
	padding-left: 0;
}

.popbox li {
	/* font-size: 14px; */
	text-indent: none;
	margin: 10px 0;  /* some space between each li item */
	
}

.outerModalBox {
	
	background-color: #ff0000;

}

.scrollable {
	 overflow:auto;

}

#resultsbox {
	 background: #FFFFFF;
	 overflow:auto;  /* this will allow the box to scroll if necessary */
	max-height: 370px;

	/*position: fixed;
  	top: 278px;
  	left: 690px;
  	margin-top: -50px;
  	margin-left: -100px; */

	position: fixed;
  	top: 55%;
  	left: 45%;
  	margin-top: -50px;
  	margin-left: -100px;

}

.missedHeading {
	font-weight: bold;
	

}

.yellowbox {
	border: solid 1px #999933;
	background-color: #FFFF99;
	padding: 8px;
	margin-top: 10px;

}


#tipsbox, #settingsbox, #notesbox, #mapCreditBox,#answerbox, #resultsbox, #studyinfo, #messagebox, #milestonebox, #errormsgbox, #instructionsbox, #favesbox, #editbox, #premiumeditbox {
	visibility: hidden;
	background: #FFFFFF;
}


#mapCreditBox {
	 background: #FFFFFF; 
}

#messagebox {
	 background: #FFFFFF;
}

#milestonebox {
	 background: #FFFFFF;
}

#msAchieved {
   /* font-weight: bold;
	font-size: 14px;*/
}

.msAchievedTitle {
	font-weight: bold;
	font-size: 14px;
}
.msAchievedText {
font-weight: normal;
	font-size: 12px;
}

#tipsbox {
	 background: #FFFFFF; /* url(../images/bigbulb140.gif) no-repeat top right; */
}

.popboxContent {
	max-height: 320px;
	padding-right: 15px;
	margin-right: 0;
 	
}


#notescontent {
	max-height: 370px;
	padding-right: 10px;
	margin-right: 0;
 	border: 1px solid red;
}

#tipscontent {

}

#notesbox, #editbox, #premiumeditbox, #favesbox {
	 background: #FFFFFF; /* url(../images/bigclip.gif) no-repeat top right; */
	/*overflow:auto; */   /* this will allow the box to scroll if necessary */
	max-height: 400px;
}


#studyinfo {
    background: #FFFFFF;
}


/* #notesbox {
	position: absolute;
	top: 300px;
	left: 300px;	
	visibility: hidden;
	
} */

.boxStudy {
  position: relative;
}

.boxCentered {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -100px;
}

/* tips is using this; so is favesbox; it is just to make sure the two boxes don't totally overlap */
.boxCentered2 {
  position: fixed;
  top: 55%;
  left: 55%;
  margin-top: -50px;
  margin-left: -100px;
}

/* Used for achievements pop-up */
.boxBottomCentered {
  position: fixed;
  top: 65%;
  left: 45%;
  margin-top: -50px;
  margin-left: -100px;
}
.exploreBox {
	width: 400px;
	/*border: 1px solid red;*/
}
.initiallyHidden {
	position: relative;
	visibility: hidden;
	background: #FFFFFF;
}

#exploreBoxNameHolder {
	font-weight:bold;
	 color: #000;
	 padding: 10px;
	 border: 1px solid green;
	 width: 325px;
}

#listInstruction {
	font-weight: bold;
	padding-left: 10px;
	margin-top: 10px;	
}

/* for text input of answers */
.inputError {
	border: 2px solid red;
	background-color: pink;

}

#hintArea {
  font-size: 10px;
}		


.newButton
{
    border-right-color: #174749;
    border-right-style: solid;
    border-right-width: 1px;
    border-left-color:#174749;
    border-left-style: solid;
    border-left-width: 1px;
    border-bottom-color: #174749;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-top-color: #174749;
    border-top-style: solid;
    border-top-width: 1px;
    text-align: center;
    font-weight: normal;
    height: 30px;
    font-family:  Tahoma,Trebuchet,Verdana,Arial,Sans-Serif;
 
   font-size: 14px;


    color: #FFFFFF;
    border-radius: 5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
  -khtml-border-radius:5px;	
    background: #3B686A; /* old browsers */
    background: -moz-linear-gradient(top, #3C686A 0%, #3B686A 50%, #3B686A 51%, #365D5E 100%); /* firefox */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3B686A), color-stop(50%,#3B686A), color-stop(51%,#3B686A), color-stop(100%,#365D5E)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3C686A', endColorstr='#365D5E',GradientType=0 ); /* ie */
     background: -o-linear-gradient(top, #3C686A, #365D5E);
}

.newButton:hover
{
    color: white;   
    border-radius: 6px;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    -khtml-border-radius:6px;
    background: #3B686A; /* old browsers */
    background: -moz-linear-gradient(top, #4F7779 0%, #4F7779 50%, #3B686A 51%, #3B686A 100%); /* firefox */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4F7779), color-stop(50%,#4F7779), color-stop(51%,#3B686A), color-stop(100%,#3B686A)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4F7779', endColorstr='#3B686A',GradientType=0 ); /* ie */
    background:  -ms-linear-gradient(top, #4F7779 0%, #3B686A 100%);	
     background: -o-linear-gradient(top, #4F7779, #3B686A);
}

.newButton:active
{
	position: relative;
	top:1px;
	left: 1px;
}

.plainlink
{
    color: black;
	text-decoration: none;
}
/* terms and conditions */
.termtitle {
	text-decoration: underline;
	font-weight: bold;
}
ol.no_indent {
	padding: 0;
	list-style-position: inside;
}

/* for inactive areas on image maps */
area.inactive {
    cursor: default;
    display: block;
}
/* this was found on customQuizStep2of2Layout and moved here, but I think it's only used on myQuizzes, which has its own definition on page. padding 2px over there */
.buttonblock {
	padding: 4px;
	font-size: x-small;
	color: white;
	background: #174749;
	text-decoration: none;

}