/*
Four Responsive Ranges:
No media query = 1024px+, default values and non-CSS3 browsers
@media screen and (min-width:768px) and (max-width:1024px)
@media print, screen and (min-width:480px) and (max-width:768px) 
@media screen and (max-width:480px)

Print view is based on (min-width:480px) and (max-width:768px) design with a few additional "@media print" styles to hide navigation/menu items not needed.

Image sizes standard ratio = 16x9
Gallery Full Image: 470px x 264px
Gallery Vertical Slice Image: 157px x 264px
Image size for 4 column layout: 200px x 112px
Image size for 6 column layout: 130px x 73px
*/


/*-----------------------------------------------------------------------------------------------------------*/
/* TOP BANNER LAYOUT
/*-----------------------------------------------------------------------------------------------------------*/

/* IE6 */
* html #Banner {height: 55px;}

#Banner {
    background-color:#2d4492;
    min-height:55px;
    height:auto; 
    padding:0px 0px 0px 0px;
    margin: 0px 98px 0px 0px}

#Banner h1 {
    color:#ffffff;
    padding: 5px 0px 5px 5px;
    margin: 0px 0px 0px 0px;
    white-space:pre-wrap;
    font-size:130%;}

#Banner a {color: #ffffff;}
	
#Banner ul {list-style-type: none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
#Banner li {display: inline; color:#ffffff; padding: 5px 10px 5px 5px; line-height:1.5em;white-space: nowrap;}
   
@media screen and (max-width:480px){
    #Banner {margin-right: 0px;}
    #Banner li {line-height:1em}}

#BannerExtras {float:right; width:250px}

@media screen and (min-width:480px) and (max-width:768px) {
    #BannerExtras {width:150px}}

@media screen and (max-width:480px) {
    #BannerExtras {width:150px}}


/*-----------------------------------------------------------------------------------------------------------*/

#BannerTitle {float:left;}


/*-----------------------------------------------------------------------------------------------------------*/

#BannerSearch {text-align:right; vertical-align:middle;  white-space:nowrap}
#BannerSearch input[type="text"] {margin:5px -16px 5px 2px; width:160px; font-size:90%; background-color:#eaeaea;}
#BannerSearch label {display:none;}
#BannerSearch input[type="image"] {vertical-align:middle; margin-right:5px;}	
#BannerSearch input[type="submit"] {font-size:90%; display:none}	

@media screen and (min-width:480px) and (max-width:768px) {
    #BannerSearch input[type="text"] {width:110px}}

@media screen and (max-width:480px) {
    #BannerSearch input[type="text"] {width:110px}}

@media print {
    #BannerSearch {display:none}}

/*-----------------------------------------------------------------------------------------------------------*/

#BannerMenu {width:auto; clear:left; }
#BannerMenu li { color:#000000; padding: 2px 5px 2px 5px; }

.SelectedMenuItem {background-color: #f9f9f9;}
#Banner .SelectedMenuItem a {color: #000000; }

    
@media print {
      #BannerMenu {display:none}}

/*-----------------------------------------------------------------------------------------------------------*/

#BannerLinks {clear:left; float:right; text-align:right; font-size:90%}

#BannerLinks ul {margin-top:6px}

#BannerLinks A:link, #BannerLinks A:visited, #BannerLinks A:active{color: #eaeaea; }
	
@media print {
    #BannerLinks {display:none}}

/*-----------------------------------------------------------------------------------------------------------*/

#Logo
    {border-left:5px solid #ffffff; float:right;}


/*-----------------------------------------------------------------------------------------------------------*/

/* IE6 */
* html #Summary {height: 60px;}

#Summary {
    background-color:#eaeaea; padding: 0px;
    margin: 5px 98px 10px 0px;
    min-height:60px;
    height:auto}

#Summary h1 {
    color:#000000;
    padding:  5px 0px 5px 5px;
    margin: 0px 0px 0px 0px;
    white-space:pre-wrap;
    font-size:120%;	}



/*-----------------------------------------------------------------------------------------------------------*/
/* FOOTER
/*-----------------------------------------------------------------------------------------------------------*/

#Footer ul { text-align:right;  list-style-type: none; margin: 0px 0px 0px 0px; padding: 5px 5px 5px 0px; background-color:#eaeaea; }
#Footer li {display: inline; padding: 5px 10px 5px 10px; line-height:2em; height:2em; white-space: nowrap; border-right: 1px solid #000000; }
#Footer img {vertical-align: middle;}
#Footer .LastItem {border-right:0px;}


@media print {
    #Footer {display:none}}
    
/*-----------------------------------------------------------------------------------------------------------*/