/*
John Hancock Observatory Stylesheet v1.0
Target: Screen
*/
* { margin:0; padding:0;}/* CSS RESET */
/*  Site Map */

#siteMap ul li { 
margin-left:20px;
list-style:none;
}

.siteMap_parent {
	list-style:none;
	margin-left:20px;
}

body {
	font-family:  Verdana, Helvetica, Arial, sans-serif;
	font-size: 100%;
	font-weight: normal;
	color: #666;
	line-height: 18px;
	background:url(/images/bg_tile.gif) repeat #474749 ;
}
p, dl {font-size: 70%;}

li {font-size: 11px;}

ul, ol  {font-size: 70%; padding-bottom: 5px; margin-left:30px;}

ol li,ul li {margin:10px 0;}

h1  {font-size: 180%; font-weight: bold;}

h2  {
	font-size: 140%;
	font-weight: normal;
	color:#2eaee2;
	padding-top:5px;
	padding-bottom:5px;
	margin-top:0px;
	margin-bottom:13px;
	border-bottom:#CCC 1px solid;
	border-top:#CCC 1px solid;  
}

h3  {font-size: 90%; font-weight: bold; margin-top:15px; border-bottom:#CCCCCC 1px solid; margin-bottom:10px;}

h4 {font-size: 80%; font-weight: bold; margin-top:15px;}

blockqoute {padding:10px;}

table {border:0px; padding:0px;}

img {border:none;}

a {text-decoration: none; color:#636363;}
a:hover {color:#999;}
label {text-align:right; font-size:70%;}
input {font-family:"Segoe UI", Verdana, Arial, sans-serif;}

/*Layout */
#container {margin:0 auto; width:1020px; display:block;}
#header {background:url(/images/bg_head.png) no-repeat; padding:21px 36px 0px 36px; height:185px; position:relative; z-index:9999;}
#content {background:url(/images/bg_content.png) repeat-y; padding:0px 36px; overflow:hidden; height:100%}
#content_left {width:180px; display:block; float:left; margin-right:27px; background:#FFF; }
#content_mid {width:530px; display:block; float:left; margin-bottom:40px; background:#FFF;}
#content_right {width:170px; display:block; float:right; margin-left:27px; margin-right:1px; background:#FFF;}
#content_right p {margin-bottom:10px;}
#content_wide {width:740px; display:block; float:right; margin-bottom:40px; margin-right:1px; background:#FFF;}
#footer {background:url(/images/bg_footer.png) no-repeat center bottom; padding:13px 36px 50px 36px; font-size:70%;  margin:0 auto; display:block; height:30px;}

/*Header Styles */

#top { position:relative; }
#chicago06 { position:absolute; top:16px; right:258px; }
#chicago06 a img { border:none; } 

#socialmedia {
	position:absolute;
	top:2px;
	right:106px;
}

#translations { display:none; position:absolute; top:26px; right:157px; list-style-type:none;  }
#translations li { float:left; width:26px; height:18px; margin-right:5px; }
/*#flag-china { background:url(images/flag-china.png) no-repeat; }
#flag-france { background:url(images/flag-france.png) no-repeat; }
#flag-germany { background:url(images/flag-germany.png) no-repeat; }
#flag-japan { background:url(images/flag-japan.png) no-repeat; }
#flag-spain { background:url(images/flag-japan.png) no-repeat; }*/


/*.title {
		display:block; 
		text-indent:-9999px; 
		background:url(/images/jho_logo.jpg) no-repeat; 
		width:195px; height:120px; 
		float:left; 
		margin-top:13px; 
		overflow: hidden;
		}*/

.title { background:url(images/main-logo.png) no-repeat; width:194px; height:109px; float:left; display:block; text-indent:-9999px; margin-top:13px; }

.clear {clear:both;}
.weather {
	float:right;
	display:block;
	padding-top:50px;
	padding-right:600px;
	font-size:65%;
}
#ticketCorner {display:block; background:url(/en/images/ticketcorner.jpg) no-repeat; float:right; text-indent:-9999px; width:130px; height:128px; margin-right:-25px;}
#ticketCorner:hover {background:url(/en/images/ticketcorner.jpg) 0 -128px no-repeat;}

/*Nav Styles */
#nav1down{background:url(images/nav-plan-your-visit.png) no-repeat 0px -24px; width:139px;}
#nav1{background:url(images/nav-plan-your-visit.png) no-repeat; width:139px;}

#nav2{background:url(images/nav-events-and-deals.png) no-repeat; width:140px;}
#nav2down{background:url(images/nav-events-and-deals.png) no-repeat 0px -24px; width:140px;}

#nav3{background:url(images/nav-kids-zone.png) no-repeat; width:108px;}
#nav3down{background:url(images/nav-kids-zone.png) no-repeat 0px -24px; width:108px;}

#nav4{background:url(images/nav-building-an-icon.png) no-repeat; width:145px;}
#nav4down{background:url(images/nav-building-an-icon.png) no-repeat 0px -24px; width:145px;}

#nav5{background:url(images/nav-groups-and-trades.png) no-repeat; width:142px;}
#nav5down{background:url(images/nav-groups-and-trades.png) no-repeat 0px -24px; width:142px;}

#nav6{background:url(images/nav-corporate-events.png) no-repeat; width:156px;}
#nav6down{background:url(images/nav-corporate-events.png) no-repeat 0px -24px; width:156px;}

#nav7{background:url(images/nav-media-room.png) no-repeat; width:118px;}
#nav7down{background:url(images/nav-media-room.png) no-repeat 0px -24px; width:118px;}

#nav1 ul{background:url(/images/subnav_1.png)}
#nav2 ul{background:url(/images/subnav_2.png)}
#nav3 ul{background:url(/images/subnav_3.png)}
#nav4 ul{background:url(/images/subnav_4.png)}
#nav5 ul{background:url(/images/subnav_5.png)}
#nav6 ul{background:url(/images/subnav_6.png)}
#nav7 ul{background:url(/images/subnav_7.png)}

#nav1down ul{background:url(/images/subnav_1.png)}
#nav2down ul{background:url(/images/subnav_2.png)}
#nav3down ul{background:url(/images/subnav_3.png)}
#nav4down ul{background:url(/images/subnav_4.png)}
#nav5down ul{background:url(/images/subnav_5.png)}
#nav6down ul{background:url(/images/subnav_6.png)}
#nav7down ul{background:url(/images/subnav_7.png)}

/* Left Side Styles */

#Left_2, #Left_1 { border-bottom:#CCC 1px solid; padding-bottom:2px;}
#side_search {display:block; background:url(/images/side_searchbg_03.jpg) no-repeat; width:170px; height:66px; padding-top:40px; padding-left:12px; border-top:#CCC 1px solid; border-bottom:#CCC 1px solid;}
#side_search #search {width:160px;}

p.sideNav { padding:10px 0; border-top:#CCC 1px solid;}
p.sideNav a {padding:3px; display:block; padding-left:32px;}
p.sideNav a#plan_active { color:#3583A3; background:url(images/side_arrow_1.jpg) 15px 6px no-repeat;}
p.sideNav a#events_active { color:#A93774; background:url(images/side_arrow_2.jpg) 15px 6px no-repeat;}
p.sideNav a#things_active {color:#2eaee2; background:url(images/side_arrow_1.jpg) 15px 6px no-repeat;}
p.sideNav a#whats_active {color:#e64097; background:url(images/side_arrow_2.jpg) 15px 6px no-repeat;}
p.sideNav a#kids_active {color:#c8c841; background:url(images/side_arrow_3.jpg) 15px 6px no-repeat;}
p.sideNav a#building_active {color:#3e5b64; background:url(images/side_arrow_4.jpg) 15px 6px no-repeat;}
p.sideNav a#group_active {color:#f8971d; background:url(images/side_arrow_5.jpg) 15px 6px no-repeat;}
p.sideNav a#corporate_active {color:#9bc1ce; background:url(images/side_arrow_6.jpg) 15px 6px no-repeat;}
p.sideNav a#media_active {color:#9f77b4; background:url(images/side_arrow_7.jpg) 15px 6px no-repeat;}

/*Content Styles */
#content_mid p, #content_wide p {margin-bottom:15px; color:#636363;}
#content_mid a, #content_wide a {color:#27aae1;}
/* .headline {border-bottom:#CCC 1px solid; margin-bottom:10px;} */

.subbox {border:#CCC 1px solid; width:200px; height:200px; float:left; display:block; padding:15px;}
.subbox h3 {color:#2eaee2; padding-left:20px; background:url(/images/subbox_arrow_03.gif) no-repeat 0px;}
#subbox1{margin-right:10px;}
#subbox2{margin:0px 11px;}
#subbox3{margin-left:10px;}

.img_link {text-indent:-9999px; display:block; overflow:hidden;}
#book_group {background:url(/images/groups_buttons_06.jpg) no-repeat; width:221px; height:32px;}
#book_school {background:url(/images/groups_buttons_11.jpg) no-repeat; width:221px; height:32px;}
#book_form {background:url(/images/groups_buttons_03.jpg) no-repeat; width:221px; height:32px; float:right; margin-top:-32px;}
#book_event {background:url(/images/corp_event_button_03.jpg) no-repeat; width:185px; height:35px;}
#corp_dl2 { background:url(/images/corp_dl2.jpg) no-repeat; width:200px; height:35px; float:right; margin-top:-32px;}
#corp_dl {background:url(/images/corp_dl_07.jpg) no-repeat; width:197px; height:35px;}
#corp_1 {background:url(/images/corp_head_1_06.jpg) no-repeat; width:530px; height:26px; margin-bottom:0px;}
#corp_2 {background:url(/images/corp_header_2_14.jpg) no-repeat; width:530px; height:26px; margin-bottom:0px;}
#corp_catering_1 {background:url(/images/corp_catering_16.jpg) no-repeat; width:165px; height:35px; float:left;}
#corp_catering_2 {background:url(/images/corp_catering_18.jpg) no-repeat; width:113px; height:35px; float:left;}
#corp_catering_3 {background:url(/images/corp_catering_20.jpg) no-repeat; width:226px; height:35px; float:left;}

.corporate_box {padding:15px;  margin-bottom:10px;  border:#CCCCCC 1px solid; border-top:none;}
.corp_list {margin-bottom:5px; font-size:70%;}
.corp_list li {background:url(/images/corp_list_bullet_07.jpg) no-repeat 0px 8px; padding-left:15px; list-style:none; margin-bottom:5px;}

div.lrg_event {float:left; margin-top:20px; display:block; width:720px;}
div.lrg_event img {float:left; margin-right:5px; display:block;}
#content_wide div.lrg_event div {background:#f0d3e3; padding:15px; min-height:167px; float:right; display:block; width:493px; font-size:90%; color:#601d42; }

#content_wide div.lrg_event div p {color:#601d42; line-height:13px; }


/*whats on ? */
.event {float:left; width:530px; margin:5px 0px; line-height:14px;}
#content_wide div.event p, #content_mid div.event p {margin:0;}
.event img{float:left;}
#content_wide .event_title, #content_mid .event_title {background:url(/images/whatson_boxhead_03.jpg) no-repeat right; color:#FFF; padding:5px 10px; width:375px; float:right; margin-bottom:5px;}
#content_wide .event_txt, #content_mid .event_txt { background:#d7c0d6; color:#6c264e; padding:10px; float:right; width:374px; min-height:71px;}
#content_wide .event_title2, #content_mid .event_title2 {background:url(/images/whatson_head_2_06.jpg) no-repeat right; color:#FFF; padding:5px 10px; width:375px; float:right; margin-bottom:5px;}
#content_wide .event_txt2, #content_mid .event_txt2 { background:#f0d3e3; color:#6c264e; padding:10px; float:right; width:374px;}
#content_wide .event_txt a, #content_mid .event_txt a{color:#b1387a;}

.event_bg{
	background:#d7c0d6; color:#6c264e;
}
/*Building An Icon */
.cite {padding-left:200px;}
.icon_list {margin-bottom:10px;}
.icon_list li {padding-left:20px; list-style:none; background:url(/images/icon_bullet_03.jpg) no-repeat 5px 8px; margin-bottom:10px}
#iconinvert {
	margin-top:-14px;
	color:#6e9293;
	background-color:#d8dee0;
	font-size: 70%;
	padding-top: 15px;
	padding-right: 45px;
	padding-bottom: 15px;
	padding-left: 45px;
	text-align: center;
}


/* Corporate Events  */

#corpinvert {
	margin-top:-14px;
	color:#3e5b64;
	background-color:#e1ecf1;
	font-size: 70%;
	padding-top: 15px;
	padding-right: 45px;
	padding-bottom: 15px;
	padding-left: 45px;
	text-align: center;
}


/* Things to do */
#blueinvert {
	color:#34525d;
	background-color:#bee5f6;
	font-size: 70%;
	padding-top: 15px;
	padding-right: 45px;
	padding-bottom: 15px;
	padding-left: 45px;
	text-align: center;
}
.boldwhite {color:#FFF; font-weight:bold;}
.dblue {color:#27aae2;}
#content_wide .multi_tour, #content_mid .multi_tour{background:#42839F url(/images/things_box_bg_03.jpg) no-repeat right top; color:#FFF; padding:15px; width:365px; float:right; margin-bottom:5px; }
#air_water {background:url(/images/things_title_head_11.jpg) no-repeat; width:529px; height:33px;}
#air{background: url(/images/air_bg_14.jpg) no-repeat #d4eef9; margin-top:-20px;height:190px;}
#air2 {margin:20px; padding-left:210px;}

/* Contact */
#submitForm {margin-left:20px; margin-top:20px;}
#contact_form {float:left; margin-top:20px;}
.vcard {
	float:right;
	font-size:70%;
	padding:0px 10px;
	border-left-color: #999999;
	border-left-style: solid;
	border-left-width: 1px;
	margin-top:20px;
}
.adr {margin-bottom:20px;}

/*Media Room */
#purpleList {margin-bottom:20px;}
#purpleList dt {color:#9e76b4; padding-left:20px; background:url(/images/purple_arrow.gif) no-repeat;}
#purpleList dd {padding-left:20px; margin-bottom:10px;}
#purpleinvert {
	margin-top:-14px;
	color:#464646;
	background-color:#e5dde9;
	font-size: 70%;
	padding-top: 15px;
	padding-right: 45px;
	padding-bottom: 15px;
	padding-left: 45px;
	text-align: center;
	width: 649px;
}

/*Whats On */
.whats_on_list {margin-bottom:20px;}
.whats_on_list dt{float:left; width:200px; color:#6c264e; font-weight:bold;}
.whats_on_list dl{float:left;}

#pinkinvert {
	margin-top:-5px;
	color:#6d4765;
	background-color:#f0d3e3;
	font-size: 70%;
	padding-top: 15px;
	padding-right: 45px;
	padding-bottom: 15px;
	padding-left: 45px;
	text-align: center;
} 
#content_wide.event_txt a {color:#6C264E; border-bottom:1px solid #6c264E;}
div#content_wide.whatson a, div#content_mid.whatson a {color:#6C264E; border-bottom:1px solid #6c264E;}



/*Kids */
ul.green {list-style:none; font-size:70%; margin-bottom:20px;}
ul.green li {
	padding-left:20px;
	background:url(/images/green_bullet.gif) no-repeat;
	background-position:0px 5px;
	padding-bottom: 5px;
}
#greenishinvert {
	margin-top:-14px;
	color:#666666;
	background-color:#e9e9c4;
	font-size: 70%;
	padding-top: 15px;
	padding-right: 45px;
	padding-bottom: 15px;
	padding-left: 45px;
	text-align: center;
}


/*Groups */

#groupinvert {
	margin-top:-14px;
	color:#7a7671;
	background-color:#fde0bb;
	font-size: 70%;
	padding-top: 15px;
	padding-right: 45px;
	padding-bottom: 15px;
	padding-left: 45px;
	text-align: center;
}

div#content_wide.groups a, div#content_mid.groups a {color:#f8971d; text-decoration:underline;}
.blue_arrow {background:url(/images/blue_arrow_07.gif) no-repeat; padding:0px 15px;}
.scorange { color:#f8971d; font-weight:bold;}
dl#group_directions dt {font-weight:bold; margin-top:20px;}
.groups_map { height:90px; padding-left:20px;}
.groups_list {font-size:70%; list-style:none;}
#light_orange { background:url(/images/group_trolley_promo.jpg) no-repeat; background-color:#fde0bb; height:175px;padding:25px 25px 0 160px; width:345px;}
#group_trolley {background:url(/images/groups_trolley_title_03.jpg) no-repeat; width:530px; height:33px;}
#map {background:url(/images/map_icon.jpg) no-repeat; width:90px; height:90px; float:left;}

ul.link_list {margin:0;}
ul.link_list li {background:#fde0bb url(images/groups_links_bullet_03.jpg) 5px -1px no-repeat; list-style:none; padding:2px 0 2px 30px;  border-bottom:#FFF 1px solid; width:100%; display:block; margin:0; }
div#content_mid.groups ul.link_list li a{color:#c4633a; text-decoration:none;}


.pressrelease {
	background-color: #f0eaf1;
	font-size: 70%;
	padding-left: 45px;
	height: 40px;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;
	margin-bottom: 5px;
	background-image: url(/images/press_rel_bg.gif);
	background-repeat: no-repeat;
}
#pressreleases a {
	color:#765981;
	font-weight: bold;
	display:block;
}
#content_mid #firstone {color:#FFF; background:url(/images/media_room_box_active_03.jpg) no-repeat;}
#content_mid #firstone a {color:#FFF;}
#content_wide .event_title3, #content_mid .event_title3 {background:url(/images/media-room_head_bg_03.jpg) no-repeat right; color:#FFF; padding:5px 10px; width:374px; float:right; margin-bottom:5px;}
#content_wide .event_txt3, #content_mid .event_txt3 { background:#e4dee6; color:#553860; padding:10px; float:right; width:374px; min-height:73px;}

/*Search Results */
.page_num {font-size:80%; background: url(images/pagenum_back.gif) no-repeat #B3BCC1; padding:2px 25px; text-transform:uppercase;}
.result a {font-size:80%;}

/*Careers */
.career_head{background: url(images/careers_header_icon_03.gif) no-repeat #9dbfc9; padding:2px 25px; color:#FFF;}

/*Home Styles*/
#mainImg {width:948px; height:286px; display:block; margin-bottom:13px;}
#homeGallery {width:708px; height:290px; display:block; margin-bottom:9px; float:left; position:relative; z-index:0; }
#twitter { width:230px; height:290px; float:right; background:url(images/twitter-bg.png) no-repeat #1eb7e9; }

.home_boxes {display:block; float:left; width:229px; height:228px; margin:4px;}
#homebox1 {margin:0px 5px 0px 0px;}
#homebox2 {margin:0px 5px;}
#homebox3 {margin:0px 5px;} 
#homebox4 {margin:0px 0px 0px 6px;}
#footer_links {float:left; font-size:80%; text-align:center; margin:0 auto;}
#search {margin-right:9px; margin-top:0px; float:left; font-size:80%; width:231px;}
#newsTicker {margin-bottom:10px; float:left;}
#tollfree {position:absolute;left:5px;bottom:5px;}
#footer a {padding-left:13px;}
#footer_home {width:950px; margin-left:0px; float:left; position:relative;}
#footer_contact {font-size:80%}
#content_footer_links {font-size:80%; margin-left:210px; width:530px; text-align:center; border-top:#CCC 1px solid;}
#wide_content_footer_links {font-size:80%; width:539px; text-align:center; border-top:#CCC 1px solid; float:left; margin-left:210px;}
/* new version */
#foot_links {font-size:80%; width:948px; clear:both; margin-top:5px; text-align:center; border-top:#CCC 1px solid; float:left; }



.home_promo { float:left; width:230px; height:263px; overflow:hidden; margin-right:9px; color:#fff; }
.home_promo h2 { line-height:normal; margin:0; margin-left:15px; height:20px }
.home_promo_body { padding:15px; padding-top:11px; }
.home_promo.no_right_marg { margin-right:0px; }
.home_promo p { color:#fff; margin-bottom:5px; line-height:15px; }
.home_promo a { color:#fff;  }
.home_promo a:hover { color:#fff; text-decoration:underline;  }


.home_promo p.home_promo_title { font-size:12px; padding:2px 0 0 12px; margin:0;}
.home_promo h5 { font-size:12px; margin-bottom:5px; }

#hp_1 { background-color:#990000; }
#hp_2 { background-color:#f8981d; clear:right; }
#hp_3 { background-color:#e73e97; clear:right; }
#hp_4 { background:url(/images/purple-repeater.png) repeat-x top #a386be; clear:right; }

#social_media { list-style-type:none; margin-left:20px; padding-top:7px; }
#social_media li { clear:both; margin-bottom:0px; position:relative; line-height:normal; height:33px;  }
#social_media li a { color:#fff; font-size:14px; }
#social_media li a:hover { color:#333; }
#social_media li a span {  float:left; position:absolute; left:46px; top:10px; }
#social_media li img { float:left; display:block; padding-right:13px; width:32px; }

#twitter_update_list { list-style-type:none; margin-top:45px; padding-left:0; height:196px; overflow-y:scroll; overflow-x:hidden; padding-bottom:10px; margin-left:0; }
#twitter_update_list li { color:#fff; border-bottom:1px dotted #fff; margin:0; padding:10px 10px 5px 10px; line-height:120%; }
#twitter_update_list li:hover { background-color:#6EBDE3; }
#twitter_update_list li a { color:#333; }


/* Ticker styles */


.tickercontainer { /* the outer div with the black border */
	/*background: #E3E516; */
	width: 394px; 
	height: 21px; 
	margin: 0; 
	padding: 0;
	overflow: hidden;
	position:absolute;
	left:314px;
	top:111px;
	border-top:1px solid #E5438F;
	border-bottom:1px solid #E5438F;
	padding:4px 0;
}

.tickercontainer .mask { /* that serves as a mask. so you get a sort of padding both left and right */
	position: relative;
	left: 10px;
	top: 4px;
	width: 424px;
	overflow: hidden;
}
ul.newsticker { /* that's your list */
	position: relative;
	left: 450px;
	font: bold 10px Verdana;
	list-style-type: none;
	margin: 0;
	padding: 0;

}
ul.newsticker li {
	float: left; /* important: display inline gives incorrect results when you check for elem's width */
	margin: 0;
	padding: 0;
	color:#E5438F;
	white-space:nowrap;
}


/* LANGUAGE TOOLS ------------------------------------------------- */


h2.welcome-heading 	{ 
	font-size:30px; 
	border-bottom:1px solid #CCCCCC;
	border-top:1px solid #CCCCCC;
	color:#2EAEE2;
	font-weight:normal;
	margin-bottom:13px;
	margin-top:0;
	padding-bottom:5px;
	padding-top:5px;
	}

h2.question { 
	color:#2EAEE2; 
	font-size:21px; 
	line-height:1.2em; 
	border-top:none; 
	margin-bottom:10px; 
	margin-top:10px; 
	}






/* TOOLS ------------------------------------------------- */

.clear { clear: both; }
.clearfix { zoom: 1; /* for IE7 */ }
.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}
* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}
* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}
.accessibility {
	position: absolute;
	left: -999px;
	width: 900px;
	background: none;
	}
	
