﻿/* 
** Sumo Website
** Copyright Sumo Group Pty. Ltd. */

html { font-size: 100%; height: 100%; }
table { font-size: 100%; }

body { margin: 0; height: 100%; font-family: Arial, Tahoma, Helvetica, sans-serif; font-size: 71%; color: #666; background: #e2e2e2 url(images/body-bg.gif) repeat-x top left; }

.notvisible { visibility: hidden; text-decoration: none; }
.donotshow { display: none; }
p { margin: 0 0 15px 0; }
img { border: none; display: block; }

a { color: #666; text-decoration: none; font-weight: bold; }
a:hover { color: #ed8300; }

h1 { color: #666; margin: 0; line-height: normal; font-size: 210%; font-weight: normal; }
h2 { color: #666; margin: 0; line-height: normal; font-size: 180%; font-weight: normal; }
h3 { color: #666; margin: 0; line-height: 120%; font-size: 130%; font-weight: normal; }
h4 { color: #666; margin: 0; line-height: normal; font-size: 115%; font-weight: normal; }
h5 { color: #666; margin: 0; line-height: normal; font-size: 108%; }
h6 { color: #666; margin: 0; line-height: normal; font-size: 100%; }

form { padding: 0; margin: 0; }
#aspnetForm { width: 100%; height: 100%; }

.clearfloats { clear: both; height: 0px; font-size: 1px; line-height: 0px; }
.clearleft { clear: left; height: 0px; font-size: 1px; line-height: 0px; }

.firstchild { padding-top: 0 !important; margin-top: 0 !important; }

.printonly,
#printheader { display: none; }

object#sumoMain { margin: 0 0 -10px 0; padding: 0; outline: none; }


/* Flash Container */
#sumoMainContainer { width: 100%; min-height: 100%; position: relative; top: 0; left: 0; }
* html body #sumoMainContainer { height: 100%; }


/* Main Head */
#main_head { height: 126px; background: url(images/sumo-logo.gif) no-repeat 44px 58px; }
#main_head a { display: block; position: absolute; top: 52px; left: 39px; width: 82px; height: 78px; outline: none; text-decoration: none; text-indent: -9999px; }


/* Main Content */
#main_container { width: 960px; padding-top: 26px; padding-bottom: 85px; font-size: 108%; }
#navigation { float: left; width: 165px; padding: 0 0 0 45px; }
#subnav { float: left; width: 165px; }


/* Navigation Elements */
ul.navitems { margin: 0; padding: 0; list-style: none; }
ul.navitems li a { display: block; font-weight: normal; padding: 2px 0; color: #757575; }
ul.navitems li a:hover { color: #ed8400; }
ul.navitems li a.active { font-size: 140%; color: #676767; padding-bottom: 5px; }

#navigation ul.navitems { width: 100px; }
#navigation ul.navitems li a { width: 99px; }
#subnav ul.navitems { width: 165px; }
#subnav ul.navitems li a { width: 118px; color: #656565; padding: 3px 0; }
#subnav ul.navitems li a:hover, #subnav ul.navitems li a.active { color: #ed8400; }

ul.third-level { margin: 0; padding: 0; list-style: none; }
ul.third-level li { padding: 0 0 25px 0; line-height: 140%; }
ul.third-level li .sub-title { line-height: normal; font-size: 155%; color: #000; font-weight: bold; display: block; margin-bottom: 4px; }
ul.third-level li a { font-weight: bold; display: block; color: #ed8300; text-decoration: none; padding-top: 6px; }
ul.third-level li a:hover { color: #000; }

.thirddeep-links { border-bottom: 1px solid #dbdbdb; margin-bottom: 25px; }
.thirddeep-links ul { float: left; width: auto; margin: 0; padding: 0; list-style: none; }
.thirddeep-links ul li { display: block; float: left; width: auto; }
.thirddeep-links a { float: left; width: auto; display: block; padding: 0 10px 9px 10px; margin-right: 12px; color: #a7a7a7; font-weight: bold; font-size: 108%; }
.thirddeep-links a:hover, .thirddeep-links a.active { color: #ED8400; }
.thirddeep-links a.firstchild { padding-left: 0px; }


/* Copy */
h1#pagetitle { font-size: 42px; color: #666666; margin: -59px 0 20px -3px; width: 750px; height: 42px; }

#wideright { float: right; width: 750px; }
#wideright #copycontainer { width: 750px; }
#copy { float: right; width: 585px; position: relative; }
#error { padding-left:43px; }

.intro-para p:first-child { font-size: 150%; line-height: 130%; }

.twocolcopy-left { float: left; width: 345px; line-height: 150%; }

h2.landingheading { margin: 20px 0 0 0; width: 555px; height: 38px; padding: 12px 0 0 19px; font-size: 17px; color: #fff; background: url(images/landing-title-blockbg.png) no-repeat top left; }

a.show-releated { margin: 0 0 0 0; display: block; width: 155px; height: 31px; background: url(images/internal-showRelatedJobs.png) no-repeat top left; outline: none; text-decoration: none; }
a.show-releated:hover { background-position: top right; }


/* News Items Listing */
.news-items-list { width: 265px; float: left; }
.news-items-list ul { margin: 0; padding: 0; list-style: none; width: 265px; }
.news-items-list ul li { width: 265px; border-bottom: 1px solid #dbdbdb; }
.news-items-list ul li a { display: block; width: 254px; padding: 8px 10px 8px 0; color: #a1a1a1; background: url(images/arrow-right-grey.gif) no-repeat -999px -999px; font-weight: normal; }
.news-items-list ul li a span { display: block; padding-top: 1px; font-weight: bold; font-size: 90%; color: #757575; }
.news-items-list ul li a:hover { color: #ED8400; background-position: right center; }
.news-items-list ul li a.active { color: #484848; background-position: right center; }
.news-items-list ul li a.active { font-weight: bold; }


/* News Item Body */
.news-item-body { float: right; width: 415px; color: #555555; }
.news-item-body h1.news-item-title { margin: -6px 0 0 0; padding-bottom: 8px; color: #313131; width: 415px; font-size: 34px; }
.news-item-body .news-date { color: #a1a1a1; margin-bottom: 25px; font-weight: bold; }


/* Our Portfolio Landing */
ul.porfolioitems { margin: 0; padding: 0; list-style: none; }
ul.porfolioitems li { display: inline; }
ul.porfolioitems li a.portfolio-item { float: left; width: 99px; height: 116px; margin: 5px 0 0 0; padding: 15px 10px 15px 31px; background: url(images/portfolio-item-bg.png) no-repeat 16px 0px; color: #363636; font-size: 90%; font-weight: bold; outline: none; }
ul.porfolioitems li a.portfolio-item:hover { background-position: top right; }
ul.porfolioitems li a.portfolio-item img { width: 94px; height: 88px; margin: 0 0 5px 0; }


/* Project full details */
h1.portfolio-full-title { font-size: 42px; color: #656565; margin: -59px 0 20px -3px; width: 585px; height: 42px; }
.project-left { float: left; width: 337px; }
.project-left img.feature-image { width: 337px; height: 196px; margin: 0 0 14px 0; }
.project-left a.url { display: block; color: #ed8300; outline: none; font-weight: bold; font-size: 90%; margin: 0 0 13px; }
.project-left a.url:hover { color: #666666; }
.project-left .project-desc { line-height: 140%; }


/* Project Gallery Thumbs */
.project-gallery { float: left; width: 248px; }
.project-gallery a.gallery-item { float: left; display: block; margin: 0 0 20px 26px; width: 80px; border: 1px solid #d8d8d8; }
.project-gallery a.gallery-item img { width: 80px; height: 57px; }
.project-gallery a.gallery-item:hover { border-color: #000; }
.project-gallery ul { margin: 0; padding: 0; list-style: none; }
.project-gallery ul li { display: inline; }

.featured-project { float: right; width: 206px; }


/* Generic Internal */
.generic-left { float: left; width: 385px; }
.generic-right { float: right; width: 338px; padding: 20px 0 0 0; }


/* Services Sub Page */
h1.subpage-title { font-size: 42px; color: #656565; margin: -59px 0 20px -3px; width: 585px; height: 42px; }

.subpage-container { width: 585px; }

.services-left { float: left; width: 325px; }
.services-right { float: right; width: 233px; padding: 20px 0 0 0; }

.services-right a.related-projects { margin: 10px 0 0 0; display: block; width: 155px; height: 33px; outline: none; background: url(images/services-show-related-projs.png) no-repeat; }
.services-right a.related-projects:hover { background-position: bottom left; }

#service-related { display: none; position: absolute; top: 0; left: 0; width: 585px; margin: -4px 0 0 -4px; }
#service-related a.backto-servicesinfo { display: block; margin: 25px 0 0 17px; width: 155px; height: 33px; outline: none; background: url(images/hide-related-projs.png) no-repeat; }
#service-related a.backto-servicesinfo:hover { background-position: bottom left; }

.thirddeep-copy { line-height: 140%; }


/* Grey Box */
.greybox-tl { background: #333 url(images/greybox-tl.gif) no-repeat top left; color: #fff; line-height: 140%; }
.greybox-tr { background: url(images/greybox-tr.gif) no-repeat top right; }
.greybox-bl { background: url(images/greybox-bl.gif) no-repeat bottom left; }
.greybox-br { background: url(images/greybox-br.gif) no-repeat bottom right; padding: 21px 25px 21px 25px; }

.greybox-br h1,
.greybox-br h2,
.greybox-br h3,
.greybox-br h4,
.greybox-br h5,
.greybox-br h6 { color: #fff; font-weight: bold; }
.greybox-br a { font-weight: bold; color: #fff; text-decoration: underline; }
.greybox-br a:hover { color: #ed8400; text-decoration: none; }


/* Footer elements */
#footer { padding-top: 49px; font-size: 11px; line-height: 150%; }
#footer .contactdetails { font-size: 100%; width: 135px; margin: 0 0 6px 0; padding: 0 0 8px 0; border-bottom: 1px solid #cecece; color: #666; line-height: normal; font-weight: normal; }
#footer a { font-weight: bold; text-decoration: none; }

#footer a.join-c2a { display: block; width: 62px; height: 61px; margin-top: 15px; background: url(images/join-our-maillist.gif) no-repeat top left; }
#footer a.join-c2a:hover { background-position: bottom left; }


/* View Flash */
#viewflash { position: absolute; left: 0; bottom: 0; width: 100%; min-width: 960px; height: 0px; overflow: hidden; padding: 0; background: url(images/view-version-bg.png) repeat top left; color: #4f616f; }
* html body #viewflash { background: #cbcbcb; background-image: none; }
#viewflash div { padding: 12px 0 0 45px; }
#viewflash strong { text-decoration: underline; }
#viewflash a { font-weight: bold; color: #4f616f; }
#viewflash a.flashlink { padding: 0 3px 0 0; color: #000; }
#viewflash a:hover { color: #fff !important; }


/* Contact Form */
label.formlabel { display: block; clear: both; float: left; width: 110px; color: #313131; font-weight: bold; padding: 3px 0 0 0; font-size: 90%; }
label.formlabel.moc { padding-top: 0; }
input.text { margin: 0 0 15px 0; width: 200px; float: right; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #777; }
select { margin: 0 0 15px 0; width: 206px; float: right; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #777; }
textarea { margin: 0 0 15px 0; width: 200px; float: right; height: 70px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #777; }
.signUp { margin: 0 0 15px 0; width: 200px; float: right; }
.signUp input { float: left; margin: 0; }
.signUp label { display: block; margin: 0 0 0 20px; font-weight: bold; }

a.whatsthis { clear: left; font-weight: normal; font-size: 82%; padding: 0 2px 0 20px; line-height: 150%; }

input.submitcontact { clear: both; float: right; margin: 10px 137px 10px 0; }

#form-response { font-weight: bold; }
#form-response h1 { font-size: 24px; color: #ed8400; margin: 0 0 10px -1px; width: 750px; height: 24px; }


/* 404 Page Not found */
#page-error { padding: 0 310px 15px 0; background: url(images/404-sumo-man.gif) no-repeat top right; }
#page-error h1 { margin: 0; text-indent: -9999em; height: 92px; background: url(images/404-oopstitle.gif) no-repeat top left; }
#page-error h2 { margin: 0 0 10px 0; font-size: 155%; font-weight: normal; }
#page-error ul { margin: 0; padding: 5px 0 5px 35px; }
#page-error li { margin-bottom: 12px; }
#page-error a.backto { color: #ed8400; }
#page-error a.backto:hover { color: #000; }


/* Sitemap */
ul.html-sitemap { float: left; width: 280px; padding-right: 25px; margin: 0; padding: 0; list-style: none; }
ul.html-sitemap ul { margin: 0; padding: 5px 25px 30px 5px; }
ul.html-sitemap li { display: block; }
ul.html-sitemap li a { color: #000; }
ul.html-sitemap li.sitemap-home { display: none; }
ul.html-sitemap li.sitemap-portfolio,
ul.html-sitemap li.sitemap-jobs { clear: left; }
ul.html-sitemap li li { float: none; width: auto; line-height: normal; padding-bottom: 3px; }
ul.html-sitemap li li a { color: #666; font-weight: normal; font-size: 90%; }
ul.html-sitemap li a:hover { color: #ED8300; }