/* Style sheet for EXCOM org chart */

@media not screen and (max-width: 480px) {

#orgchart {
	width: 450px;
	height: 275px;
	overflow: hidden;
	position: relative;
	}
#orgchart > img,
#imagemap {
	position: absolute;
	top: 0;
	left: 0;
	width: 450px;
	height: 550px;
	}
	
#orchart > p {
	margin-left: 500px;		/* force overflow in graphical browsers */
	}

#imagemap {
	width: 425px;
	height: 275px;
	z-index: 20;
	background: transparent;
	}
#imagemap li,
#imagemap span {
	display: block; 
	margin-left: 500px;		/* force overflow in graphical browsers */
	}
#imagemap a {
	position: absolute;
	}

a#wh {
	left: 168px;
	top: 1px;
	width: 154px;
	height: 33px;
	}
	a#wh:hover,
	a#wh:focus {
		background: transparent url(orgchart.png) -168px -276px no-repeat;
		}

a#esg {
	left: 171px;
	top: 92px;
	width: 154px;
	height: 17px;
	}
	a#esg:hover,
	a#esg:focus {
		background: transparent url(orgchart.png) -171px -367px no-repeat;
		}

a#advisory {
	left: 329px;
	top: 61px;
	width: 105px;
	height: 57px;
	}
	a#advisory:hover,
	a#advisory:focus {
		background: transparent url(orgchart.png) -329px -336px no-repeat;
		}

#agencies > a {
	left: 8px;
	top: 14px;
	width: 156px;
	height: 196px;
	}
	#agencies > a:hover,
	#agencies > a:focus {
		background: transparent url(orgchart.png) -8px -289px no-repeat;
		}

#agencies li a {
	left: 16px;
	width: 122px;
	height: 21px;
	}
	a#dod {
		top: 18px;
		}
		a#dod:hover,
		a#dod:focus {
			background: transparent url(orgchart.png) -16px -293px no-repeat;
			}
	a#dot {
		top: 39px;
		}
		a#dot:hover,
		a#dot:focus {
			background: transparent url(orgchart.png) -16px -314px no-repeat;
			}
	a#state {
		top: 60px;
		}
		a#state:hover,
		a#state:focus {
			background: transparent url(orgchart.png) -16px -335px no-repeat;
			}
	a#doi {
		top: 81px;
		}
		a#doi:hover,
		a#doi:focus {
			background: transparent url(orgchart.png) -16px -356px no-repeat;
			}
	a#usda {
		top: 102px;
		}
		a#usda:hover,
		a#usda:focus {
			background: transparent url(orgchart.png) -16px -377px no-repeat;
			}
	a#doc {
		top: 124px;
		}
		a#doc:hover,
		a#doc:focus {
			background: transparent url(orgchart.png) -16px -399px no-repeat;
			}
	a#dhs {
		top: 145px;
		}
		a#dhs:hover,
		a#dhs:focus {
			background: transparent url(orgchart.png) -16px -420px no-repeat;
			}
	a#jcs {
		top: 166px;
		}
		a#jcs:hover,
		a#jcs:focus {
			background: transparent url(orgchart.png) -16px -441px no-repeat;
			}
	a#nasa {
		top: 187px;
		}
		a#nasa:hover,
		a#nasa:focus {
			background: transparent url(orgchart.png) -16px -462px no-repeat;
			}

a#nco {
	left: 168px;
	top: 140px;
	width: 154px;
	height: 60px;
	}
	a#nco:hover,
	a#nco:focus {
		background: transparent url(orgchart.png) -168px -415px no-repeat;
		}

#bottomboxes > a {
	left: 0;
	top: 206px;
	width: 450px;
	height: 67px;
	}
	#bottomboxes > a:hover,
	#bottomboxes > a:focus {
		background: transparent url(orgchart.png) 0 -481px no-repeat;
		}

#bottomboxes li a {
	top: 218px;
	width: 111px;
	height: 55px;
	}
	a#cgsic {
		left: 3px;
		}
		a#cgsic:hover,
		a#cgsic:focus {
			background: transparent url(orgchart.png) -3px -493px no-repeat;
			}
	a#giwg {
		left: 114px;
		}
		a#giwg:hover,
		a#giwg:focus {
			background: transparent url(orgchart.png) -114px -493px no-repeat;
			}
	a#npef {
		left: 227px;
		}
		a#npef:hover,
		a#npef:focus {
			background: transparent url(orgchart.png) -227px -493px no-repeat;
			}

}


@media only screen and (max-width: 480px) {

#orgchart > img {
	display: none;
	}
#orgchart > ul {
	list-style: none;
	}
#orgchart ul li {
	list-style: none;
	margin-left: 0;
	}
#orgchart > ul > li {
	margin-bottom: 1.5em;
	}
#orgchart > ul > li > a,
#orgchart > ul > li > ul > li > a,
	#adhoc {
	width: 80%;
	margin: auto;
	}
#orgchart ul li .orgbox {
	display: block;
	padding: 5px 0;
	margin: 0.5em auto;
	background: #fff;
	border: solid #ddd 1px;
	border-radius: 4px;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
	}
	#orgchart ul li a:hover .orgbox,
	#orgchart ul li a:focus .orgbox,
	#orgchart ul li a:active .orgbox {
		background: orange;
		}
a#esg {
	display: inline;
	}
}