body { background:#fff; font-family:Arial, helvetica, sans-serif; font-size:80%; color:#4d4d4d; margin:0 }

p { margin:5px 0 0 }
form { margin:5px 0 0 }
a { color:#4d4d4d; text-decoration:none }
a:hover { color:#c22322 }
h1 { margin:0 0 5px; font-size:140%; color:#c22322; text-transform:uppercase }
h2 { margin:0; font-size:110%; color:#c22322 }
h3 { margin-bottom:0; font-size:100%; color:#4d4d4d }

img { border:0 }
hr { height:1px; border:0; color:#4d4d4d; background:#4d4d4d }
input, textarea, select { width:97%; padding:2px; background:#efefef; border:1px solid #ccc; color:#4d4d4d }
select { padding:2px; background:#efefef; border:1px solid #ccc; color:#4d4d4d }
label { font-weight:bold }


.header { width:100%; height:230px; font-family:Helvetica, Arial, sans-serif; text-transform:uppercase; background:url(graphics/header/bg.gif) 0 0 repeat-x }
.header .options { width:1000px; height:33px; margin:0 auto; padding-top:20px; font-size:90% }
.header .options a { margin-left:25px; color:#777 }
.header .options a:hover { color:#c22322 }

.header .content { width:980px; margin:0 auto; padding-top:29px }
.header .logo { float:left; margin-left:23px }
.header .mainmenu { float:right; padding-top:25px }
.header .mainmenu a { margin-left:55px }



.layout { width:1000px; margin:0 auto }


#leftcolumn { width:167px }
#companyinfo { padding-top:40px; text-align:center }
#companyinfo h1 { font-size:105%; margin-bottom:10px }
#intro { padding:35px 12px 12px; font-size:90%; background:url(graphics/bg-intro.jpg) 0 100% no-repeat; text-align:center }
#intro ul, #intro li { margin:0 0 15px; padding:0; list-style:none; font-size:105%; font-weight:bold }
#intro a { color:#c22322 }
#intro a:hover { text-decoration:underline }


#main { float:right; width:810px }
#header { margin:22px 0 25px; padding-right:0px }
#contentarea { padding:20px 4px 0 5px }
#contentarea h1 { padding-left:10px }

#home { position:relative; float:right; top:7px }
#services { width:100%; font-size:75% }
#mainmenu { margin-top:10px; padding-left:4px }
#mainmenu a { margin-right:30px }


/* --- CSS Dropdown Menus --- */
#csstopmenu, #csstopmenu ul { float:right; margin:0; padding:0; list-style:none }
#csstopmenu ul.submenus { position:absolute; top:15px; left:0; width:300px; z-index:1; padding:5px 0 }
#csstopmenu li { float:left; position:relative }
#csstopmenu li a { padding:5px }

.submenus { display:none; width:10em; position:absolute; top:0; left:0; background-color:#e8e8e8 }
.submenus li { width:100% }
.submenus li a { display:block; width:100% }
html>body .submenus li a { /* non IE6 browsers */ width:auto }
.submenus li a:hover { color:blue }

#csstopmenu li>ul {/* non IE browsers */ top:auto; left:auto }
#csstopmenu li:hover ul, li.over ul { display:block }
html>body #clearmenu { /* non IE6 browsers */ height:3px }



/* --- Boxouts --- */
.boxout, .boxout_mini { float:left }

.mini { width:93px; margin-right:9px; padding:0 1px 0 8px; background:#efefef url(graphics/boxes/bg-2.jpg) 0 0 repeat-x; font-size:90% }
.mini_head { height:10px; background:url(graphics/boxes/bg-mini-top.jpg) 0 0 no-repeat }
.mini_foot { height:10px; background:url(graphics/boxes/bg-mini-btm.jpg) 0 0 no-repeat }

.single { width:160px; margin-right:14px; padding:0 13px 0; background:#efefef url(graphics/boxes/bg-2.jpg) 0 0 repeat-x }
.single img { float:left }
.single_head { height:10px; background:url(graphics/boxes/bg-1-top.jpg) 0 0 no-repeat }
.single_foot { height:10px; background:url(graphics/boxes/bg-1-btm.jpg) 0 0 no-repeat }

.double { width:295px; margin-right:9px; padding:0 13px 0; background:#efefef url(graphics/boxes/bg-2.jpg) 0 0 repeat-x }
.double h2 { margin-left:65px }
.double p { margin-left:65px }
.double img { float:left }
.double_head { height:10px; background:url(graphics/boxes/bg-2-top.jpg) 0 0 no-repeat }
.double_foot { height:10px; background:url(graphics/boxes/bg-2-btm.jpg) 0 0 no-repeat }

.triple { width:515px; margin-right:9px; padding:0 13px 0; background:#efefef url(graphics/boxes/bg-3.jpg) 0 0 repeat-x }
.triple h1 { margin-left:55px }
.triple h2 { margin-left:65px; margin-top:15px }
.triple h3 { margin-left:65px }
.triple p { margin-left:65px }
.triple img { float:left }
.triple input, .triple textarea, .triple select { background:#f7f7f7 }
.triple_head { height:10px; background:url(graphics/boxes/bg-3-top.jpg) 0 0 no-repeat }
.triple_foot { height:10px; background:url(graphics/boxes/bg-3-btm.jpg) 0 0 no-repeat }

.fullwidth { width:748px; padding:0 18px 10px 13px; background:#efefef url(graphics/boxes/bg-3.jpg) 0 0 repeat-x }
.fullwidth h2 { margin-left:65px }
.fullwidth p { margin:0 0 0 65px }
.fullwidth p a { text-decoration:underline }
.fullwidth img { float:left }
.fullwidth input, .fullwidth textarea, .fullwidth select { background:#f7f7f7 }
.fullwidth_head { height:10px; background:url(graphics/boxes/bg-full-top.jpg) 0 0 no-repeat }
.fullwidth_foot { height:10px; background:url(graphics/boxes/bg-full-btm.jpg) 0 0 no-repeat }

.formbox { width:240px; font-size:90% }
.formbox_head { height:10px; background:url(graphics/boxes/line-lgrey-pixel.gif) 0 0 repeat-x }
.formbox_head .headleft { float:left; width:10px; height:10px; background:url(graphics/boxes/line-lgrey-tl.gif) 0 0 no-repeat }
.formbox_head .headright { float:right; width:10px; height:10px; background:url(graphics/boxes/line-lgrey-tr.gif) 0 0 no-repeat }
.formbox .formleft { padding-left:15px; background:url(graphics/boxes/line-lgrey-pixel.gif) 0 0 repeat-y }
.formbox .formright { padding-right:15px; background:url(graphics/boxes/line-lgrey-pixel.gif) 100% 0 repeat-y }
.formbox_foot { height:10px; background:url(graphics/boxes/line-lgrey-pixel.gif) 0 100% repeat-x }
.formbox_foot .footleft { float:left; width:10px; height:10px; background:url(graphics/boxes/line-lgrey-bl.gif) 0 100% no-repeat }
.formbox_foot .footright { float:right; width:10px; height:10px; background:url(graphics/boxes/line-lgrey-br.gif) 100% 100% no-repeat }

.strip { width:100%; height:100px; background:url(/graphics/boxes/bg-strip.jpg) 100% 0 no-repeat }
.strip .icon { float:right; padding:10px 15px 0 0 }
.strip h2 { padding:10px 10px 0 567px }
.strip p { padding:5px 10px 0 567px }

.listing { width:360px; margin-right:9px; padding:0 13px 0; background:#efefef url(graphics/boxes/bg-2.jpg) 0 0 repeat-x }
.listing_head { height:10px; background:url(graphics/boxes/bg-listing-top.jpg) 0 0 no-repeat }
.listing_foot { height:10px; background:url(graphics/boxes/bg-listing-btm.jpg) 0 0 no-repeat }
.listing img { float:left }
.listing h2 { margin-left:65px }
.listing p { margin-left:65px }
.listingthumbs { float:right }
.listingthumbs img { margin:10px 0 0 5px }
.listingthumbs a { background:none }

.project { width:450px; margin-right:9px; padding:0 13px 0; background:#efefef url(graphics/boxes/bg-2.jpg) 0 0 repeat-x }
.project_head { height:10px; background:url(graphics/boxes/bg-project-top.jpg) 0 0 no-repeat }
.project_foot { height:10px; background:url(graphics/boxes/bg-project-btm.jpg) 0 0 no-repeat }
.project img { float:left }
.project h2 { margin-left:65px }
.project p { margin-left:65px; padding-bottom:10px }
.project p a { text-decoration:underline }
.projectthumbs { float:right; width:287px; font-size:90%; text-align:right }
.projectthumbs img { margin:5px 0 1px }

.client { float:left; margin:0 0 0 65px; padding:10px; border:1px dashed #999 }
.client p { margin-left:0; padding-bottom:0; font-style:italic }
.client a { text-decoration:underline }

.newsletter_body { width:515px; margin-right:9px; padding:0 13px 0; background:#efefef url(graphics/boxes/bg-3.jpg) 0 0 repeat-x }
.newsletter_body p { margin:20px 0 0 10px }
.newsletter_head { height:10px; background:url(graphics/boxes/bg-3-top.jpg) 0 0 no-repeat }
.newsletter_foot { height:10px; background:url(graphics/boxes/bg-3-btm.jpg) 0 0 no-repeat }

.calltoaction { float:left; width:476px; margin-top:20px }
.calltoaction .head { height:10px }
.calltoaction .foot { height:10px }
.calltoaction .web .head { background:url(graphics/boxes/bg-calltoaction-top.jpg) 0 0 no-repeat }
.calltoaction .web .foot { background:url(graphics/boxes/bg-calltoaction-btm.jpg) 0 0 no-repeat }
.calltoaction .multimedia .head { background:url(graphics/boxes/bg-calltoaction-top-mm.jpg) 0 0 no-repeat }
.calltoaction .multimedia .foot { background:url(graphics/boxes/bg-calltoaction-btm-mm.jpg) 0 0 no-repeat }
.calltoaction .body { padding:0 14px; background:#f3f4f4 url(graphics/boxes/bg-calltoaction.jpg) 0 0 repeat-x }
.calltoaction .web .body { border-left:1px solid #af0f0f; border-right:1px solid #af0f0f }
.calltoaction .multimedia .body { border-left:1px solid #e44f00; border-right:1px solid #e44f00 }
.calltoaction .body img { margin:0 12px 5px 0; vertical-align:middle }
.calltoaction .body a { padding-right:20px; font-weight:bold; text-transform:uppercase }
.calltoaction .body a.web { background:url(graphics/arrow-large-web-design.gif) 100% 50% no-repeat }
.calltoaction .body a.multimedia { background:url(graphics/arrow-large-multimedia.gif) 100% 50% no-repeat }




/* --- Service Colours --- */
h1.web, h2.web, h1.web a, h2.web a { color:#c22322; text-transform:uppercase }
a.web { padding-right:8px; color:#c22322; background:url(graphics/arrow-web-design.gif) 100% 50% no-repeat }
a.web:hover { text-decoration:underline }
h1.multimedia, h2.multimedia, h2.multimedia a { color:#e44f00 }
a.multimedia { padding-right:8px; color:#e44f00; background:url(graphics/arrow-multimedia.gif) 100% 50% no-repeat }
a.multimedia:hover { text-decoration:underline }
h1.newsletters, h2.newsletters, h2.newsletters a { color:#e4a100 }
a.newsletters { padding-right:8px; color:#e4a100; background:url(graphics/arrow-newsletters.gif) 100% 50% no-repeat }
a.newsletters:hover { text-decoration:underline }
h1.tours, h1.objects, h2.tours, h2.tours a, h2.objects, h2.objects a { color:#86af0f }
a.tours, a.objects { padding-right:8px; color:#86af0f; background:url(graphics/arrow-tours-objects.gif) 100% 50% no-repeat }
a.tours:hover, a.objects:hover { text-decoration:underline }
h1.three_d, h2.three_d, h2.three_d a { color:#0f93af }
a.three_d { padding-right:8px; color:#0f93af; background:url(graphics/arrow-3d.gif) 100% 50% no-repeat }
a.three_d:hover { text-decoration:underline }
h1.print, h2.print, h2.print a { color:#1f499f }
a.print { padding-right:8px; color:#1f499f; background:url(graphics/arrow-design-for-print.gif) 100% 50% no-repeat }
a.print:hover { text-decoration:underline }
h1.branding, h2.branding, h2.branding a { color:#7618a5 }
a.branding { padding-right:8px; color:#7618a5; background:url(graphics/arrow-branding.gif) 100% 50% no-repeat }
a.branding:hover { text-decoration:underline }
h1.consulting, h2.consulting, h2.consulting a { color:#c017b6 }
a.consulting { padding-right:8px; color:#c017b6; background:url(graphics/arrow-consulting.gif) 100% 50% no-repeat }
a.consulting:hover { text-decoration:underline }

.red { color:#c22322 }




/* ---Footer --- */
#footer { margin:30px 0 50px; color:#666; font-size:80% }
#footer a { margin-right:20px; color:#666 }
#footer a:hover { color:#c22322 }




.left { float:left }
.right { float:right }
.center { text-align:center }
.clear { clear:both; height:0; line-height:0; font-size:1%; /*for IE*/ }
.clear_left { clear:left; height:0; line-height:0; font-size:1%; /*for IE*/ }
.clear_right { clear:right; height:0; line-height:0; font-size:1%; /*for IE*/ }


#trace, .trace { border:solid 1px #ff0000 }