/* NOTE
	This is the stylesheet for Orange mobile working
	products website.
	
========================================================================*/

/* CONTAINERS */
body {text-align:center; font:62.5% arial, helvetica, sans-serif;}
p {margin:12px 0 15px 0;}
a {color:#FF6600;}
a:hover {cursor:pointer;}
h4 {font-weight:bold;}
#page {text-align:left; margin: 59px auto; /margin: 44px auto; width:740px; font-size:1.2em;}
#top {position:relative; height:65px; background: url('../images/hr-orange.gif') repeat-x bottom; margin-top:1px;}
#top a#print-page {position:absolute; top: 0; right:0; background:green;}
#navigation {width:100%; overflow:hidden; height:43px; background: url('../images/nav-background.gif') top right #f5f5f4;}
#navigation ul li {float:left;}
#content {margin-top:20px;}
#footer {background: url('../images/hr-grey.gif') repeat-x; margin-top:20px; padding-top:12px;}
#footer ul li {display:inline;}

/* IMAGE REPLACEMENT, NAVIGATION */
.replace {position:relative; overflow:hidden;}
.replace em {display:block; position:absolute; top:0; left:0; z-index:1; width:100%; height:100%; background-repeat:no-repeat;}
* html>body .replace {overflow:visible; font-size:5px;}

/* print page link */
#top a#print-page,
#top a#print-page em {width:100px; height:60px; background:url('../images/print-page.gif') no-repeat;}

/* more information graphic */
#top #for-more-information {position:absolute; top:-20px; right:0;}
#top #for-more-information,
#top #for-more-information em {width:246px; height:60px; background:url('../images/top-cta.gif') no-repeat;}


/*========================================================================
	NAVIGATION & FOOTER
=========================================================================*/

/* MAIN NAVIGATION */
#navigation a, #navigation a em {display:block; height:43px;}
#navigation a:hover, #navigation a:hover em {background-position: 0 50%;}
#navigation a.active, #navigation a.active em {background-position: bottom;}

/* WI-FI NAVIGATION */
#nav-wifi-workplaces, #nav-wifi-workplaces em {background: url('../images/nav-wifi-workplaces.gif') no-repeat; width:133px;}
#nav-mobile-working-products, #nav-mobile-working-products em {background: url('../images/nav-mobile-working-products.gif') no-repeat; width:187px;}
#nav-mobile-know-how, #nav-mobile-know-how em {background: url('../images/nav-mobile-know-how.gif') no-repeat; width:145px;}
#nav-find-the-right-product, #nav-find-the-right-product em {background: url('../images/nav-find-the-right-product.gif') no-repeat; width:167px;}

/* WI-FI SUB NAVIGATION */
#wifi-sub-navigation {padding:10px 10px 10px 40px; background:url('../images/search-icon.gif') no-repeat #f5f5f4; border-bottom:3px solid #d4d4d4;}
#wifi_search label,
#wifi_search input {float:left;}
#wifi_search input#search {padding:3px; margin-right:10px; width:380px; float:left; width:378px;}
a#wifi-submit_replace, a#wifi-submit_replace em {float:left; display:block; width:62px; height:26px; background:url('../images/search-btn.gif') no-repeat;}
a:hover#wifi-submit_replace, a:hover#wifi-submit_replace em {background-position:-1px -27px;}
a.wifi-submit_replace {float:left;}
#wifi_search label.radio {float:left; display:block; width:auto; margin-left:15px; padding:4px 0 4px 15px; background:url(../images/wifi-search-divider.gif) no-repeat;}
#wifi_search label.radio input {margin-right:5px;}

#wifi-search-legend {padding:10px 10px 10px 40px; background:#f5f5f4;}
#search-in-progress {background:#ffffff; width:100%; height:530px; font-weight: bold; font-size:1.6em;} 


/*========================================================================
	CONTENT
=========================================================================*/


/* ========= WIFI WORKPLACES ========= */

/* MAP */
#map {background:white; border:1px solid #eeeeee; padding:4px;}
#map #map-place-holder {background:#ffffff; width:100%; height:530px;}
#map-drawer {margin-top:10px; width:740px; overflow:auto; min-height:250px; color:#999;}
* html #map-drawer {height:230px;}
#map-drawer ul {width:1490px; overflow:hidden;}
#map-drawer ul li {float:left; width:140px; margin-right:10px;}
#map-drawer ul li.last {margin-right:0px;}
#map-drawer a img {padding:4px; margin-bottom:10px; border:1px solid #EEEEEE;}
#map-drawer a:hover img {border:1px solid #FF9933;}
#map-drawer h3 {color:#000; margin:0;}


/* ========= MOBILE WORKING PRODUCTS ========= */

/* TOP AREA */
#mobile-working-products #top-area {width:739px; position:relative; min-height:149px; padding:19px 0 33px 0; color:#FFF; background:#000 url(../images/img-top-area-mobile-working.jpg) no-repeat;}
#mobile-working-products #top-area h2 {width:321px; height:55px; margin-left:18px;} 
#mobile-working-products #top-area h2 em {background:url(../images/title-work-where-you-want.gif) no-repeat;}
#mobile-working-products #top-area p {margin:20px 0 0 18px; width:378px;}

/* sub navigation */
#mobile-working-products #sub-navigation {position:absolute; bottom:0; left:10px;}
#mobile-working-products #sub-navigation li {float:left; margin-right:3px;}
#mobile-working-products #sub-navigation a {height:33px; display:block;}
#mobile-working-products #sub-navigation a#sub-nav-mobile-email, 
#mobile-working-products #sub-navigation a#sub-nav-mobile-email em {width:117px; background:url(../images/sub-nav-mobile-email.gif) no-repeat;}
#mobile-working-products #sub-navigation a#sub-nav-mobile-broadband, 
#mobile-working-products #sub-navigation a#sub-nav-mobile-broadband em {width:156px; background:url(../images/sub-nav-mobile-broadband.gif) no-repeat;}
#mobile-working-products #sub-navigation a#sub-nav-internet-on-your-phone, 
#mobile-working-products #sub-navigation a#sub-nav-internet-on-your-phone em {width:187px; background:url(../images/sub-nav-internet-on-your-phone.gif) no-repeat;}
#mobile-working-products #sub-navigation a:hover em {background-position:0 -33px !important;}

/* CONTENT AREA */
#mobile-working-products #content-area {padding:23px 21px 30px 20px; background:url(../images/bg-content-area-bottom.gif) bottom no-repeat;}

#footer{font-size:11px;color:#999;}
#footer a {padding:0 5px;}