html {height: 100% }
 
body { height: 100%; margin: 0; padding: 0 }

#map-canvas { height: 100% }

#tool-box {
	position:absolute;
    left:100px;
    top:20px;
    width:200px;
    padding:10px;
    background: #FFFFFF;
	font-family: Arial,sans-serif;
	font-size: 12px;
	color: #555;
	border:#DDD 1px solid;
}

#tool-box.compare {
	width:300px;
}

#tool-box a {
	color: #555;
	font-decoration: none;
}

#tool-box a:hover {
	color: #555;
	font-decoration: underline;
}

#tool-box #loginBox{
	border-bottom: 1px solid #888888;
}

#tool-box #loginBox form{
    margin-bottom:10px;
}

#tool-box #loginBox span {    
	display: inline-block;
    width: 70px;
}

#tool-box #loginBox span.msg {    
	display: block;
    width: 100%;
    text-align:center;
    margin-bottom:10px;
}

#tool-box #loginBox span.error {    
	color: red;
}

#tool-box #loginBox input {
	width: 100px;
}

#tool-box #seasonList {
	display:none;
	padding-top: 10px;
	padding-bottom: 10px;    
	padding-left: 0;
	border-top: 1px solid #888888;
	border-bottom: 1px solid #888888;
}

#tool-box #seasonList li {
	list-style-type:none;
}

#tool-box #seasonBox:hover #seasonList {
	display:block;
}

#tool-box #countryList {
}

#tool-box .countryBox {
	padding-bottom: 5px;
	cursor: pointer;
}

#tool-box .countryBox .countryName {
	font-weight: bold;
}

#tool-box .countryBox .countryCount, 
#tool-box .countryBox .countryQty {
	display: inline-block;
	width: 46%;
	font-weight: bold;
}

#tool-box.compare .countryBox .countryCount, 
#tool-box.compare .countryBox .countryQty {
	display: inline-block;
	width: 23%;
	font-weight: bold;
}

#tool-box .right {
	text-align: right;
}

#tool-box .countryBox .countryQty {
	text-align: right;
}

#tool-box #subCountryList {
	display:none;
}

#tool-box .countryBox:hover #subCountryList {
	display:block;
	margin-top:20px;
	padding-top:20px;
	padding-bottom:20px;
	border-top: 1px solid #888888;
	border-bottom: 1px solid #888888;
    max-height: 400px;
    overflow: auto;
}

#tool-box .countryBox .regionList {
	display:block; //TODO display:none;
	border-bottom: 1px solid #888888;
	padding-bottom:10px;
	margin-bottom:20px;
}

#tool-box .countryBox:hover .regionList {
	display:block;
}

#tool-box .regionBox .regionColor {
	width: 50px;
	height: 20px;
	opacity: 0.4;
}

#tool-box .regionBox .regionColor,
#tool-box .regionBox .regionCount{
	display: inline-block;
	width: 25%;
} 

#tool-box .regionBox .regionQty {
	display: inline-block;
	width: 40%;
}

#tool-box.compare .regionBox .regionColor,
#tool-box.compare .regionBox .regionCount{
	display: inline-block;
	width: 15%;
}

#tool-box.compare .regionBox .regionQty {
	display: inline-block;
	width: 23%;
}

#tool-box .regionBox .regionQty {
	text-align: right;
}

#tool-box .regionBox .deptListContainer {
	display:none;
	position:relative;
	left: 200px;
	top:-20px;
	height:0px;
}

#tool-box.compare .regionBox .deptListContainer {
	left: 300px;
}

#tool-box .regionBox .deptList {
    width:300px;
    background: #FFFFFF;
    border: 1px solid #888888;
}

#tool-box.compare .regionBox .deptList {
	width:500px;
}

#tool-box .regionBox:hover .deptListContainer {
	display:block;
}

#tool-box .regionBox:hover .deptList .deptBox td{
	text-align:right;
}

#tool-box .regionBox:hover .deptList .deptBox td.deptName{
	text-align: left;
	width: 150px;
}

#tool-box .regionBox:hover .deptList .deptBox th.seasonName{
	text-align: center;
}

#tool-box .regionBox:hover .deptList .deptBox td.seasonSpacer,
#tool-box .regionBox:hover .deptList .deptBox th.seasonSpacer{
	width: 20px;
}

table.summarySales {
	padding-bottom:10px;
}

table.summarySales th {
	text-align:right;
	width: 60px;
}

table.summarySales th.first {
	text-align:left;
	width: 40px;
}
table.detailSales th {
	text-align:left;
}

div.infoWindow{
	line-height: 1.35;
    white-space: nowrap;
}