/* color styles:  body is Color A (white), 
                  header is Color B, 
				  left and right box headers are Color C, 
				  left and right box backgrounds are Color D 
/* For HIPPO, Color A = white #FFFFFF, 
              Color B = light gray-blue #EAEFFA, 
			  Color C = med gray-blue #7892C2,
			  Color D = light gray-blue #EAEFFA
To use this page for future projects, these are the four color changes that will need to be made.
*/



body {
	width: 800px;
	margin: 0 auto 0 auto; /* auto keeps page centered in window */
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 12px;
	background-color: #FFFFFF;
}

/* Since the body width is set at 800px, for the other styles, you can use a 
percentage, e.g., 100% of body width.  If you want a border, you will need to
subtract a bit, e.g., for a border:3px; make the width: 100% - 6px; (you can
do math in the width statements). */


/************** header styles ****************/
#headerwrap { 
    width: 100%; 
	background: transparent no-repeat left bottom; 
	margin: 0 auto; 
	/* padding-left: 16px; */
}                            

#footerwrap { 
    clear: both;      /* never, ever, forget the clear command */
	width: 100%; 
	background: transparent no-repeat left bottom; 
    /* padding: 0px 10px 0px 10px; /* top right bottom left */
}

#header { 
    width: 100% - 2px;  /* 100% - 6px; for 3px border */
	margin: 0 auto; 
	padding: 5px 0 0; 
    background-color: #EAEFFA; /* light grey-blue */
    color: #000000;
    font-weight: bold;
    font-size: 20px;
    border: 1px solid #7892C2;
    text-align: center;
	overflow: hidden;
}
#header h1 { 
    height: 125px; 
	width: 10px; 
	background: transparent; 
	margin: 0 0 0px; 
	float: left; 
} 
/* color for h2 is the font color for project title */
#header h2 {
	background: transparent; 
	margin: 0 0 0px; 
	color: #27467E;
}                 

#header table {
    border: 0px solid #000;
}

#header td {
    padding: 2px;
}

                          
/* What's New section */
#topbar { 
	padding: 0px; 
	font-weight: bold; 
	width: 100%;  /* 800px; */
    background: #ffffff; 
	min-height: 0%;  
	border: 0px solid #ffffff
	text-align: center;
}

/* What's New section */
#newshead { 
	font-size: 21px; 
	font-weight: bold;
	color: #ffffff; 
	padding: 0px; 
	width: 100% - 2px; /* 800px; */
	background: #7892C2; 
	min-height: 0%;
	border: 1px solid #000000; 
	padding: 5px; 
	text-align: center;
}

/* What's New section */
#newsbox { 
	width: 100% - 2px; /* 800px; */
    padding: 5px; 
	min-height: 0%; 
	border: 1px solid #000000; 
	background: #EAEFFA;
    font-weight: normal; 
	text-align: left;
}

/* LEFT COLUMN */
#left { 
    width: 49.5%; /* 390px; */ 
	float: left; 
	color: #333;
}

/* RIGHT COLUMN */
#right { 
	width: 49.5%; /* 400px; */ 
	float: right; 
	color: #333; 
}

/* these are the left-hand column headers and boxes */

/* project description */
#left_head { 
	font-size: 18px; /* 14 */
	font-weight: bold;
    color: #ffffff;
	padding: 0px; 
	background: #7892C2; /* med gray-blue */
	min-height: 0%;
    border: 1px solid #000000;
	padding: 5px; 
	text-align: center;
}

/* project description */
#left_box { 
    padding: 5px;
    min-height: 0%; 
	border: 1px solid #000000;
	background: #EAEFFA; /* #ffffff */
	font-weight: normal;
    text-align: left;
}

#left_box h2 {
    font-size: 12px;
    font-weight: bold;
	text-align: center;
}

/* these are the right-hand column headers and boxes */

#right_head { 
	font-size: 18px; 
	font-weight: bold;
    color: #ffffff; 
	padding: 0px; 
	background: #7892C2; 
	min-height: 0%;
    border: 1px solid #000000; 
	padding: 5px; 
	text-align: center;
}

/* Publications, etc. */
#right_box { 
	text-align: left;
    background-color: #EAEFFA;
	min-height: 0%; 
	border: 1px solid #000000; 
	padding: 5px; 
	font-weight: normal;
}

/* Meetings and presentations index special font size */

#meetings {
    font-size: 16px;
}


/************** data by phase styles ****************/
#col_head { 
	font-size: 15px; 
	font-weight: bold;
        color: #ffffff; 
	padding: 0px; 
	background: #7892C2;
	min-height: 0%;
    border: 1px solid #000000; 
	text-align: center;
}
#col_box{
    text-align: left;
    background-color: #EAEFFA;
    min-height: 0%;
    border: 1px solid #000000;
    font-weight: normal;
    padding: 15px;
}

/************** movie by phase styles ****************/
#movie_head { 
	font-size: 15px; 
	font-weight: bold;
        color: #ffffff; 
	padding: 0px; 
	background: #7892C2;
	min-height: 0%;
        border: 1px solid #000000; 
	text-align: center;
}
#movie_box{
    text-align: center;
    background-color: #EAEFFA;
    min-height: 0%;
    height: 150px;
    border: 1px solid #000000;
    font-weight: normal;
    padding: 15px;
}
#empty_box{
    text-align: center;
    background-color: #AAAAAA;
    min-height: 0%;
    height: 150px;
    border: 1px solid #000000;
    font-weight: normal;
    padding: 15px;
}

/************** footer styles ****************/

#footerSponsors {
	font-size: 10px; 
	padding: 0px;
    font-weight: bold; 
	width: 100%; /* 800px; */ 
	min-height: 0%;  
	text-align: center;
    clear: both;
    color: #cccccc;
    padding: 10px 0px 10px 0px; /* top right bottom left */
    margin-top: 0px;
}


#footer {
    font-weight: bold; 
	width: 100%; /* 800px; */
	min-height: 0%;  
	text-align: center;
    clear: both;
    color: #000000; 
    padding: 10px 10px 10px 10px;
    margin-top: 10px; /* was 0 */
}

#footer img {
    padding: 4px 4px 4px 0px;
    vertical-align: middle;
}

/* not used in vortex2 */
#sponsorsbox { 
	width: 100%; /* 800px; */
	padding: 5px; 
	min-height: 0%; 
	border: 0px solid #000000; 
	background: #EFEBD5;
    font-weight: normal; 
	text-align: left;
}

/* not used in vortex2 */
#sponsorsRightbox { 
    width: 60%; /* 475px; */
	font-size: 15px;
    padding: 5px; 
	min-height: 0%; 
	border: 1px solid #000000; 
	background: #EFEBD5;
    font-weight: bold; 
	text-align: left;
}

/* used in footer */
#sponsorsLeftbox { 
    width: 40%; /* 325px; */
	font-size: 15px;
    padding: 5px; 
	min-height: 0%; 
	border: 1px solid #000000; 
	background: #EFEBD5;
    font-weight: bold; 
	text-align: left;
}

div { background-color: #ffffff; margin: 0px; color: #000000; }


h1 { font: bold 20pt/24pt verdana, arial, Helvetica, sans-serif; color: black }
h2 { font: bold 16pt/20pt verdana, arial, Helvetica, sans-serif; color: black }
h3 { font: bold 12pt/16pt verdana, arial, Helvetica, sans-serif; color: black }
a:link { color: #0000BA; text-decoration: none } 
a:active { color: #0000BA; text-decoration: none } 
a:visited { color: #0000BA; text-decoration: none }
a:hover { color: #ff0000; text-decoration: none }  
hr { height: 1px; color: #000000;}

