/* CSS Document */ /* Neutralize styling: Elements we want to clean out entirely: */ html, body, form, fieldset { margin: 0; padding: 0; font: 100%/120%; } /* Neutralize styling: Elements with a vertical margin: */ h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address { margin: 1em 0; padding: 0; } /* Apply left margin: Only to the few elements that need it: */ li, dd, blockquote { margin-left: 1em; } /* Miscellaneous conveniences: */ form label { cursor: pointer; } fieldset { border: none; } input, select, textarea { font-size: 100%; font-family: inherit; } body { margin: 0; background: url(images/bg_page.gif) top left repeat-x #d1e5ec; color: #333333; FONT-FAMILY: Arial, Helvetica, Verdana, sans-serif; min-width: 920px; text-align: center; } img {border: 0;} a:link {text-decoration: underline; color: #000099; background-color: transparent;} a:visited {text-decoration: underline; color: #000099; background-color: transparent;} a:hover {text-decoration: underline; color: #0099cc; background-color: transparent;} /*-- GENERAL BITS --------------*/ .container {margin: 0 auto; width: 920px; padding: 0; border: 0; position: relative; text-align: left;} .mainContainer {margin: 0; float: left; display: inline; width: 920px;} /*-- HEADER---------------------*/ .headerArea {float: left; display: inline; width: 920px; height: 125px; margin: 0;} .headerLogo {float: left; display: inline; margin: 0 0 0 30px; width: 200px; height: 125px;} .headerStrapline {float: right; display: inline; margin: 48px 30px 0 0; width: 300px; height: 30px;} .navbar {float: left; display: inline; margin: 0; width: 920px; height: 35px; background: url(images/nav_bar_bg.gif) top left no-repeat #353692;} .navbar ul {display: inline; float: left; list-style: none; margin: 8px 0 0 30px; padding: 0;} .navbar li {display: inline; float: left;} .navbar li a {display: inline; float: left; height: 20px;} .navbar li span {display: none;} .navOption {margin: 0 39px 0 0;} .navOptionEnd {margin: 0;} #nav01 a {background: url(images/nav_home_off.gif) top left no-repeat; width: 47px; height: 20px;} #nav01 a:hover {background: url(images/nav_home_on.gif) top left no-repeat;} #nav01on a {background: url(images/nav_home_on.gif) top left no-repeat; width: 47px; height: 20px;} #nav02 a {background: url(images/nav_about_us_off.gif) top left no-repeat; width: 72px; height: 20px;} #nav02 a:hover {background: url(images/nav_about_us_on.gif) top left no-repeat;} #nav02on a {background: url(images/nav_about_us_on.gif) top left no-repeat; width: 72px; height: 20px;} #nav03 a {background: url(images/nav_mobile_solutions_off.gif) top left no-repeat; width: 127px; height: 20px;} #nav03 a:hover {background: url(images/nav_mobile_solutions_on.gif) top left no-repeat;} #nav03on a {background: url(images/nav_mobile_solutions_on.gif) top left no-repeat; width: 127px; height: 20px;} #nav04 a {background: url(images/nav_mobile_services_off.gif) top left no-repeat; width: 121px; height: 20px;} #nav04 a:hover {background: url(images/nav_mobile_services_on.gif) top left no-repeat;} #nav04on a {background: url(images/nav_mobile_services_on.gif) top left no-repeat; width: 121px; height: 20px;} #nav05 a {background: url(images/nav_mobile_technology_off.gif) top left no-repeat; width: 142px; height: 20px;} #nav05 a:hover {background: url(images/nav_mobile_technology_on.gif) top left no-repeat;} #nav05on a {background: url(images/nav_mobile_technology_on.gif) top left no-repeat; width: 142px; height: 20px;} #nav06 a {background: url(images/nav_charity_off.gif) top left no-repeat; width: 55px; height: 20px;} #nav06 a:hover {background: url(images/nav_charity_on.gif) top left no-repeat;} #nav06on a {background: url(images/nav_charity_on.gif) top left no-repeat; width: 55px; height: 20px;} #nav07 a {background: url(images/nav_contact_off.gif) top left no-repeat; width: 60px; height: 20px;} #nav07 a:hover {background: url(images/nav_contact_on.gif) top left no-repeat;} #nav07on a {background: url(images/nav_contact_on.gif) top left no-repeat; width: 60px; height: 20px;} /*-- FOOTER --*/ .footer {float: left; display: inline; width: 920px; margin: 0 0 0 0; padding: 0 0 40px 0; background: url(images/home_main_area_bottom.gif) top left no-repeat;} .footer p {float: left; display: inline; font-size: 11px; color: #333333; line-height: 24px; margin: 35px 0 0 30px;} .footer h6 {float: right; display: inline; font-weight: normal; font-size: 11px; color: #333333; line-height: 24px; margin: 35px 30px 0 0;} .iconFacebook {background: url(images/icon_facebook.png) center left no-repeat; padding: 3px 0 3px 24px; line-height: 24px;} /*-- HOMEPAGE INTRO --*/ .homeIntroArea {float: left; display: inline; width: 920px; height: 276px; background: url(images/home_intro_image.jpg) 470px 0px no-repeat;} .homeIntroArea h1 {margin: 30px 0 10px 30px; text-indent: -9000px; line-height: 1em; background: url(images/home_intro_strapline.gif) top left no-repeat; width: 333px; height: 31px;} .homeIntroArea p {font-size: 14px; color: #333333; line-height: 1.5em; width: 420px; margin: 0 0 0.8em 30px;} /*-- HOMEPAGE FLASH --*/ .homeIntroFlashArea {float: left; display: inline; width: 420px; height: 276px; margin: 0 0 0 30px;} .homeIntroFlashArea h1 {margin: 30px 0 10px 0; text-indent: -9000px; line-height: 1em; background: url(images/home_intro_strapline.gif) top left no-repeat; width: 333px; height: 31px;} .homeIntroFlashArea p {font-size: 14px; color: #333333; line-height: 1.5em; width: 420px; margin: 0 0 0.8em 0;} .homeFlashHolder {float: left; display: inline; width: 420px; height: 276px; margin: 0 30px 0 0;} /*-- HOME MAIN AREA --*/ .homeMainArea {float: left; display: inline; width: 920px; margin: 0; background: url(images/home_main_area_top.gif) top left no-repeat #FFFFFF;} .homeBoxout {float: left; display: inline; width: 200px;} .homeBoxout img {border: 0; margin: 0;} .homeBoxout h2 {margin: 0 0 10px 0; text-indent: -9000px; line-height: 1em;} .homeBoxout p {font-size: 12px; color: #333333; line-height: 1.5em; margin: 0.5em 0 0.7em 0; width: 200px;} .homeBoxout h6 {font-size: 12px; color: #333333; line-height: 1.5em; margin: -0.1em 0 0.7em 0; width: 200px;} #homeBoxoutMobileSolutions {margin: 30px 20px 10px 30px; background: url(images/home_image_mobile_solutions.jpg) 0px 30px no-repeat;} #homeBoxoutMobileSolutions h2 {background: url(images/sub_mobile_solutions.gif) top left no-repeat; width: 136px; height: 20px;} #homeBoxoutMobileServices {margin: 30px 20px 10px 0; background: url(images/home_image_mobile_services.jpg) 0px 30px no-repeat;} #homeBoxoutMobileServices h2 {background: url(images/sub_mobile_services.gif) top left no-repeat; width: 129px; height: 20px;} #homeBoxoutMobileTechnology {margin: 30px 20px 10px 0; background: url(images/home_image_mobile_technology.jpg) 0px 30px no-repeat;} #homeBoxoutMobileTechnology h2 {background: url(images/sub_mobile_technology.gif) top left no-repeat; width: 153px; height: 20px;} .homeBanners {float: right; display: inline; width: 200px; margin: 30px 30px 0 0;} .homeBanners img {border: 0; margin: 0;} #homeBannerTop {margin: 25px 0 15px 0;} #homeBannerBottom {margin: 0 0 20px 0;} /*-- CONTENT PAGES --*/ .mainArea {float: left; display: inline; width: 920px; margin: 10px 0 0 0; background: url(images/main_area_top.gif) top left no-repeat #FFFFFF;} .mainLeftColumn {float: left; display: inline; margin: 20px 20px 0 0; width: 230px;} .mainLeftColumnAlt {float: left; display: inline; margin: 0 20px 0 0; width: 230px;} .mainContentColumn {float: left; display: inline; margin: 10px 0 0 0; width: 420px;} .mainContentColumn h1 {margin: 30px 0 5px 0; text-indent: -9000px; line-height: 1em;} .mainContentColumn h2 {font-size: 14px; color: #333333; line-height: 1.2em; margin: 1em 0 -0.8em 0;} .mainContentColumn p {font-size: 13px; color: #666666; line-height: 1.6em;} .mainContentColumn p strong {font-size: 13px; color: #333333; font-weight: bold; line-height: 1.6em;} .mainContentColumn img {border: 0;} .mainContentColumn ul {margin: 5px 0 5px -10px; padding: 0; font-size: 13px; line-height: 1.5em; list-style: none; color: #666666;} .mainContentColumn li {position: relative; background-image: url(images/bullet.gif); background-position: 0px 9px; background-repeat: no-repeat; padding: 3px 0 3px 12px;} .mainContentColumn h6 {font-size: 11px; font-weight: bold; color: #333333;} .mainContentColumn h6 em {color: #CC0000;} .mainContentColumn form {padding: 0; margin: 10px 0 0 0;} .mainContentColumn label {font-size: 13px; font-weight: bold; color: #333333; width: 100px; display: inline; float: left; padding: 4px 0 0 0; margin: -4px 10px 0 0;} .mainContentColumn label em {color: #CC0000;} .formContactText {width: 280px; border: 1px solid #5c7f8b; background-color: #FFFFFF; font-size: 13px; padding: 4px;} .formContactSelect {width: 280px; background-color: #FFFFFF; font-size: 13px;} .formContactButton {border: 0; margin: 10px 0 0 110px;} .quoteHolder {float: left; display: inline; width: 420px; margin: 10px 0 20px 0; padding: 0 0 15px 0; background: url(images/quote_box_bottom.gif) bottom left no-repeat;} .quoteContent {float: left; display: inline; width: 420px; margin: 0; padding: 0 0 5px 0; background: url(images/quote_box_top.gif) top left no-repeat #cc0202;} .quoteContent blockquote {font-size: 13px; font-style: italic; line-height: 1.6em; width: 380px; margin: 15px 0 5px 20px; color: #FFFFFF;} .quoteContent h6 {font-size: 13px; font-weight: normal; line-height: 1.2em; margin: 0; width: 380px; margin: 0 0 0 20px; color: #FFFFFF;} /*-- RIGHT COLUMN --*/ .mainRightColumn {float: right; display: inline; width: 200px; margin: 85px 30px 0 0;} .mainRightColumn h3 {margin: 0 0 5px 0; text-indent: -9000px; line-height: 1em;} .mainRightColumn img {margin: 10px 0 10px 0;} .mainRightColumn p {font-size: 12px; line-height: 1.7em; color: #666666;} .mainRightColumn p strong {font-weight: bold; color: #333333;} /*-- SIDE NAVIGATION BAR --*/ #navcontainer {width: 200px; margin: 0 auto; padding: 1em 0; font-size: 14px; text-align: center;} ul#navlist {text-align: left; list-style: none; padding: 0; margin: 10px 0 20px 0; width: 100%; border-bottom: 1px solid #d1e5ec;} ul#navlist li {display: block; margin: 0; padding: 0; font-size: 14px; font-weight: bold;} ul#navlist li a {display: block; width: 200px; padding: 0.7em 0 0.7em 0; border-width: 1px 0 0 0; border-color: #d1e5ec #FFF #d1e5ec #FFF; border-style: solid; color: #333399; text-decoration: none; background: #FFFFFF;} #navcontainer>ul#navlist li a {width: auto;} ul#navlist li#active a {background: #FFFFFF; color: #5c7f8b;} ul#navlist li a:hover {color: #333399; background: transparent; background-color: #e8f2f6;} ul#navlist li#active a:hover {color: #5c7f8b; background: transparent; background-color: #FFFFFF;} /*-- LEFT COLUMN BACKGROUNDS --*/ #leftBgMobileSolutions {background: url(images/page_mobile_solutions.jpg) 0px 60px no-repeat; height: 337px;} #leftBgBlackberryDevices {background: url(images/page_blackberry.jpg) 0px 50px no-repeat; height: 458px;} #leftBgAppleIphone {background: url(images/page_apple_iphone.jpg) 0px 50px no-repeat; height: 518px;} #leftBgIphone2 {background: url(images/page_iphone_new.jpg) 0px 50px no-repeat; height: 226px;} #leftBgAboutUs {background: url(images/page_about_us.jpg) 0px 70px no-repeat; height: 360px;} #leftBgCharity {background: url(images/page_charity.jpg) 0px 60px no-repeat; height: 445px;} #leftBgMobileServices {background: url(images/page_mobile_services.jpg) 0px 60px no-repeat; height: 505px;} #leftBgMobilisationSolutions {background: url(images/page_mobilisation_solutions.jpg) 0px 0px no-repeat; height: 380px;} #leftBgUplandsApplications {background: url(images/page_uplands_applications.jpg) 0px 80px no-repeat; height: 423px;} #leftBgSatelliteNavigation {background: url(images/page_satellite_navigation.jpg) 0px 70px no-repeat; height: 326px;} #leftBgAssetTracking {background: url(images/page_asset_tracking.jpg) 0px 50px no-repeat; height: 443px;} #leftBgVehicleSecurity {background: url(images/page_vehicle_security.jpg) 0px 50px no-repeat; height: 535px;} #leftBgVehicleSafety {background: url(images/page_vehicle_safety.gif) 0px 150px no-repeat; height: 404px;} #leftBgFleetInstallations {background: url(images/page_fleet_installations.jpg) 0px 120px no-repeat; height: 255px;} #leftBgMobileTechnology {background: url(images/page_mobile_technology.jpg) 0px 70px no-repeat; height: 305px;} #leftBgSpecialistAccessories {background: url(images/page_specialist_accessories.jpg) 0px 10px no-repeat; height: 530px;} /*-- PAGE TITLES --*/ #titleMobilePhones {background: url(images/title_mobile_phones.gif) top left no-repeat; width: 182px; height: 30px;} #titleBlackberryDevices {background: url(images/title_blackberry_devices.gif) top left no-repeat; width: 237px; height: 30px;} #titleAppleIphone {background: url(images/title_apple_iphone.gif) top left no-repeat; width: 166px; height: 30px;} #titleAboutUs {background: url(images/title_about_us.gif) top left no-repeat; width: 420px; height: 30px;} #titleCharity {background: url(images/title_charity.gif) top left no-repeat; width: 233px; height: 30px;} #titleManagedServices {background: url(images/title_managed_services.gif) top left no-repeat; width: 225px; height: 30px;} #titleMobilisationSolutions {background: url(images/title_mobilisation_solutions.gif) top left no-repeat; width: 266px; height: 30px;} #titleUplandsApplications {background: url(images/title_uplands_applications.gif) top left no-repeat; width: 254px; height: 30px;} #titleSatelliteNavigation {background: url(images/title_satellite_navigation.gif) top left no-repeat; width: 240px; height: 30px;} #titleAssetTracking {background: url(images/title_asset_tracking.gif) top left no-repeat; width: 180px; height: 30px;} #titleVehicleSecurity {background: url(images/title_vehicle_security.gif) top left no-repeat; width: 198px; height: 30px;} #titleVehicleSafety {background: url(images/title_vehicle_safety.gif) top left no-repeat; width: 177px; height: 30px;} #titleFleetInstallations {background: url(images/title_fleet_installations.gif) top left no-repeat; width: 218px; height: 30px;} #titleContactUs {background: url(images/title_contact_us.gif) top left no-repeat; width: 138px; height: 30px;} #titleThankYou {background: url(images/title_thank_you.gif) top left no-repeat; width: 129px; height: 30px;} #titleMobileSolutions {background: url(images/title_mobile_solutions.gif) top left no-repeat; width: 204px; height: 30px;} #titleMobileServices {background: url(images/title_mobile_services.gif) top left no-repeat; width: 193px; height: 30px;} #titleMobileTechnology {background: url(images/title_mobile_technology.gif) top left no-repeat; width: 229px; height: 30px;} #titleSpecialistAccessories {background: url(images/title_specialist_accessories.gif) top left no-repeat; width: 273px; height: 30px;} #titleiPhone {background: url(images/title_iphone.gif) top left no-repeat; width: 87px; height: 30px;} /*-- SUB HEADINGS --*/ #subInMobileSolutions {background: url(images/sub_in_mobile_solutions.gif) top left no-repeat; width: 163px; height: 20px;} #subSeeAlso {background: url(images/sub_see_also.gif) top left no-repeat; width: 76px; height: 20px;} #subInMobileServices {background: url(images/sub_in_mobile_services.gif) top left no-repeat; width: 155px; height: 20px;} #subContactDetails {background: url(images/sub_contact_details.gif) top left no-repeat; width: 132px; height: 20px;} #subInMobileTechnology {background: url(images/sub_in_mobile_technology.gif) top left no-repeat; width: 190px; height: 20px;} /*-- CONTACT PAGE --*/ .contactLeftColumn {float: left; display: inline; margin: 87px 20px 0 30px; width: 200px;} .contactLeftColumn img {border: 0;} .contactLeftColumn p {font-size: 11px; line-height: 1.5em;}