body{
background: #0066cc; 
font-family: verdana, arial, helvetica, sans serif; 
font-style: normal; 
font-size: 13px; 
color: #ffffff;
}

.center {
text-align: center;
float: center;}



/*** wrapper section ***/

	
.container {
width: 800px;
float: middle;
margin-right: 18%;
margin-left: 18%;
margin-top: 0px;
border: 3px solid #74b4f3 !important;
padding: 0 0 0 0;
text-align: center;
}


h1{
background: inherit; 
color: #ffffff; 
font-family: verdana,arial,helvetica,sans serif; 
font-weight: bold; 
font-size: 18pt;
text-align: center;
}


h2{
background: inherit; 
color: #ccffff; 
font-family: verdana,arial,helvetica,sans serif; 
font-weight: bold; 
font-size: 15pt;
text-align: center;
}

 
h3{
background: inherit; 
color: #ffffff; 
font-family: verdana,arial,helvetica,sans serif; 
font-weight: bold; 
font-size: 12pt;
text-align: center;
}


h4{
background: inherit; 
color: #ffffff; 
font-family: verdana,arial,helvetica,sans serif; 
font-weight: bold; 
font-size: 10pt;
text-align: center;
}


a:link{
background: inherit; 
font-family: verdana,arial,helvetica,sans serif; 
font-weight: bold; 
color: #A3F3F6; 
text-decoration: none;
}


a:visited{
background: inherit; 
font-family: verdana,arial,helvetica,sans serif; 
font-weight: bold; 
color: #A3F3F6; 
text-decoration: none;
}

a:hover{ 
background: navy; 
font-weight: bold; 
color: #F6F3A3; 
text-decoration: none;
}

a:active{ 
background: inherit; 
text-decoration: none; 
font-weight: bold; 
color: #A3F3F6;
}


img {
border: 0;
text-align: left;
float: left;
padding: 0 5px 0 0;
}



p {
font-family: verdana,arial,helvetica,sans serif; 
font-size: 13px; 
color: #ffffff;
text-align: left;
margin: 15px 15px 15px 15px;
padding: 15px;
border: dashed 1px #74B4F3;

}


.table {
width: 790px;
height: 600px;
float: middle;

}



/*** Header section ***/


.banner {
color:inherit;
height:100px;
margin:0 0 0;
text-align:center;
width: 100%;
border: 0;
}



/*** Top Nav Menu Bar *** /


.topnav {
text-align: center;
width: 790px;
height:30px;
border:  solid 1px #000000 !important;
padding: 5px;
margin: 0 0 0 0;

}


.navbar {
display: block;
width: 80px;
height: 35px;
padding: 15px;
border: solid 3px #74B4F3;

}




/*** Main Body Content *** /


.mainbody {
text-align: left;

}



	.imageBox,.imageBoxHighlighted{
		width:130px;	/* Total width of each image box */
		height:160px;	/* Total height of each image box */
		float:left;
	}
	.imageBox_theImage{
		width:110px;	/* Width of image */
		height:125px;	/* Height of image */

		/*
		Don't change these values *
		*/
		background-position: center center;
		background-repeat: no-repeat;
		margin: 0 auto;
		margin-bottom:2px;
	}

	.imageBox .imageBox_theImage{
		border:1px solid #DDD;	/* Border color for not selected images */
		padding:2px;
	}
	.imageBoxHighlighted .imageBox_theImage{
		border:3px solid #316AC5;	/* Border color for selected image */
		padding:0px;

	}
	.imageBoxHighlighted span{	/* Title of selected image */
		background-color: #316AC5;
		color:#FFFFFF;
		padding:2px;
	}

	.imageBox_label{	/* Title of images - both selected and not selected */
		text-align:center;
		font-family: arial;
		font-size:11px;
		padding-top:2px;
		margin: 0 auto;
	}

	/*
	DIV that indicates where the dragged image will be placed
	*/
	#insertionMarker{
		height:150px;
		width:6px;
		position:absolute;
		display:none;

	}

	#insertionMarkerLine{
		width:6px;	/* No need to change this value */
		height:145px;	/* To adjust the height of the div that indicates where the dragged image will be dropped */

	}

	#insertionMarker img{
		float:left;
	}

	/*
	DIV that shows the image as you drag it
	*/
	#dragDropContent{

		opacity:0.4;	/* 40 % opacity */
		filter:alpha(opacity=40);	/* 40 % opacity */

		/*
		No need to change these three values
		*/
		position:absolute;
		z-index:10;
		display:none;

	}


/*** Footer *** /

.footer {
text-align: center;
float: center;
}


.a2a_dd {
border: 0;
float: middle;
text-align: center;
}



