

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

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

p
{
     padding-bottom: 10px;   
}


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



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

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

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

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

img.notes:hover, img.notes:active {
	height:22px;
	width: 22px;
	background: url('../images/icons/note-bulb-sprite3.gif') 45px 22px ;
}


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

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

#myNav tr {
	background: #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;
	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;
}

.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;
}






#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 {
	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;
}



#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: 80px;
	
}

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

#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;
}


.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;}



/* boxes */

.popbox {
	width: 445px;
	border: 2px solid #174749; /* was 669966  */
	background-color: #000000;
	/*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: 4;
}

.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;
	

}

#tipsbox, #settingsbox, #notesbox, #mapCreditBox,  #resultsbox, #studyinfo, #messagebox, #milestonebox {
	visibility: hidden;
}


#mapCreditBox {
	 background: #FFFFFF; 
}

#messagebox {
	 background: #FFFFFF;
}

#milestonebox {
	 background: #FFFFFF;
}

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

#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 {
	 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, can't remember why it needs it, is it 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;
}

.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;
}