/**************************************************************************************************************************/ /* HTMLTag Redefinitions **************************************************************************************************/ /**************************************************************************************************************************/ body { color: #fff; background: #FFF; font-family: Arial, Helvetica, Sans-Serif; } .bodyteal { background: #164A55 url(/resources/images/backgrounds/aqua.jpg) no-repeat fixed top center; } .bodygrey { background: #777777 url(/resources/images/backgrounds/grey.jpg) no-repeat fixed top center; } .bodygreen { background: #0D7E41 url(/resources/images/backgrounds/green.jpg) no-repeat fixed top center; } .bodypurple { background: #553671 url(/resources/images/backgrounds/purple.jpg) no-repeat fixed top center; } .bodybrown1 { background: #764E2A url(/resources/images/backgrounds/brown_bar.jpg) no-repeat fixed top center; } .bodybrown2 { background: #563B34 url(/resources/images/backgrounds/brown_sig.jpg) no-repeat fixed top center; } .bodybrown3 { background: #A77B54 url(/resources/images/backgrounds/brown_light.jpg) no-repeat fixed top center; } .bodyred { background: #872D36 url(/resources/images/backgrounds/red.jpg) no-repeat fixed top center; } .bodyblack { background: #000000 url(/resources/images/backgrounds/black.jpg) no-repeat fixed top center; } .lightgrey { background: #d5d5d5 url(/resources/images/backgrounds/lightgrey.jpg) no-repeat fixed top center; } .fleft { float: left; } .fright { float: right; } .bodystaff { background: #164A55 url(/resources/images/pages/background_staff.jpg) no-repeat fixed top center; } h1 { font-size: 3em; font-weight: bold; color: #fff; margin-bottom: 0px; } h1.faces_title { margin-bottom: 40px; } h2 { font-size: 2em; font-weight: bold; color: #fff; margin-bottom: 10px; } h3 { font-size: 1.0em; font-weight: bold; color: #fff; margin-bottom: 10px; } p { line-height: 1.4em; margin-bottom: 1em; } p.large { font-size: 1.2em; } a img { border: 0px; } strong { font-weight: bold; } em { font-style: italic; } p.small { font-size: 0.8em; } /**************************************************************************************************************************/ /* Main layout styles *****************************************************************************************************/ /**************************************************************************************************************************/ #main { width:960px; margin: 0px auto; } #main_inner { float: left; width: 980px; display: inline; } #head { float: left; width: 960px; height: 90px; padding-top: 40px; margin-bottom: 10px; padding-left: 20px; } #content { width: 960px; float: left; } #left { float: left; width: 500px; display: inline; margin-right: 10px; } .padded { padding-left: 20px; } .padded_logo { padding-left: 40px; } .blog { min-height: 400px; padding-left: 190px; font-size:12px; } .blog_menu { width: 170px; float: left; padding-left: 40px; padding-top: 10px; font-size: 1.1em; font-weight: bold; line-height: 1.2em; margin-bottom: 70px; } .blog_menu li { margin-bottom: 5px; } .blog_menu li a { text-decoration: none; } .blog_menu h2 { font-size: 2.5em; margin-bottom: 30px; } .blog ol { list-style: decimal outside; } .blog ol li { padding-bottom:5px; line-height:1.4em; } .work_menu { width: 180px; float: left; } .work_menu ul { padding-bottom: 50px; } .work_menu li { margin-bottom: 5px; } .work_menu li a { text-decoration: none; } .blogBackLink { display: block; text-align:right; margin-bottom: 20px; width: 460px; } .commentLink { display: block; float:right; margin-bottom: 10px; margin-top: 15px; padding-left: 50px; width: 80px; height: 29px; background: #fff url(../images/add.png) left no-repeat; clear:both; } .logo { float: left; width: 180px; padding-top: 5px; } .portfolioBackLink { display: block; text-align:right; margin-bottom: 30px; } .pLeft { float: left; } .pRight { float: right; } .blogPages { text-align:right; border-bottom: 0px solid #CCC; padding-bottom: 10px; margin-bottom: 10px; width: 460px; } .intro { margin-bottom: 20px; margin-top: 10px; } #footer { width: 960px; float: left; margin-left: 0px; padding:30px 0px 25px 0px; margin-left: 15px; } #footer ul li { float: left; margin-bottom: 10px; font-size: 1.8em; margin-right: 20px; color: #999; } #footer ul li label { color: #FF0066; display: block; font-size: 12px; margin-bottom: 1px; font-weight: normal; } #footer p { clear: both; color: #999; } #footer div { min-width: 100px; float: left; font-size: 1.6em; line-height: 1.2em; padding-right: 0px; color: #9890A2; } #footer div a { color: #9890A2; } #footer div span { font-size: 0.7em; } #footer div.logos { padding-right: 150px; padding-top: 0px; padding-left: 0px; } #footer .contacttext p { color:White; padding:0px; margin:0px; line-height:20px; font-size:13px; font-weight:bold; margin-right:20px; } #footer .contacttext p a { color:White; padding:0px; margin:0px; line-height:20px; } #footer .contacttext p span { padding:0px; margin:0px; font-size:18px; } #right { float: left; width: 550px; height: 350px; display: inline; } #right-tall { float: left; width: 550px; height: 425px; display: inline; } #left ul li { line-height: 1.2em; margin-bottom: 5px; list-style-type: disc; list-style-position: inside; } #left ul { margin-bottom: 10px; } .blog p img { padding: 0px 20px 20px 0px; } .home_head { background-image: url(../images/titles/home_intro_1.png); text-indent: -1800px; width: 389px; height: 51px; margin-top: 10px; margin-bottom: 0px; } .home_intro { background-image: url(../images/titles/home_intro_2.png); text-indent: -1800px; width: 389px; height: 52px; margin-bottom: 20px; margin-top: 0px; } .history_intro { background-image: url(../images/titles/history_intro.png); text-indent: -1800px; width: 389px; height: 105px; margin-bottom: 20px; margin-top: 10px; } .services_intro { background-image: url(../images/titles/services_intro.png); text-indent: -1800px; width: 389px; height: 195px; margin-bottom: 20px; margin-top: 10px; } .work_intro { background-image: url(../images/titles/work_intro.png); text-indent: -1800px; width: 389px; height: 137px; margin-bottom: 20px; margin-top: 10px; } .contact_intro { background-image: url(../images/titles/contact_intro.png); text-indent: -1800px; width: 389px; height: 137px; margin-bottom: 20px; margin-top: 10px; } .newsletter_intro { background-image: url(../images/titles/newsletter_intro.png); text-indent: -1800px; width: 389px; height: 77px; margin-bottom: 20px; margin-top: 10px; } .thankyou_intro { background-image: url(../images/titles/thankyou_intro.png); text-indent: -1800px; width: 389px; height: 108px; margin-bottom: 20px; margin-top: 10px; } .services_head { background-image: url(../images/titles/services_heading.png); text-indent: -2000px; width: 660px; height: 85px; margin-bottom: 20px; } .servicecol { width:250px; padding-right:100px; margin: 10px 20px 40px 0px; float: left; } .servicecol h2 { font-size: 1.25em; color: #EB088D; margin-bottom: 2px; font-weight: normal; } .servicecol p.larger { font-size: 1.1em; } .servicecol h2.clientslarge { text-indent: -2000px; height: 44px; width: 248px; background-image: url(../images/titles/services_subtitle.png); } .rimage { min-height: 450px; padding-top: 70px; width: 355px; float: left; } .rimage h1 { margin-top: -70px; margin-bottom: 70px; } .rimage h1.largetext { margin: 0px; margin-bottom: 20px; } h1.contacthead { margin-top: 0px; margin-bottom: 40px; } .largetext { font-size: 2.2em; line-height: 26px; font-weight: bold } .largertext { font-size: 2.6em; line-height: 30px; } .midtext { font-size: 1.6em; line-height: 20px; font-weight: bold } .benefit { width: 224px; margin-right: 20px; float: left; min-height: 147px; margin-bottom: 40px; } .benefit p { font-size: 1.35em; line-height: 1.2em; } .posted { font-size: 1.1em; } .caselogo { margin-bottom: 20px; } .emph { font-size: 1.3em; line-height:22px; } .contact { float: left; min-width: 120px; margin-right: 20px; } .contact p { font-size: 1.3em; line-height: 1.2em; } #slides { display: none; } .faces { display: none; width: 47%; float: left; padding-right: 20px; } .visible { display: block; } #slides div { width: 380px; position: absolute; margin-top: 100px; margin-left: 200px } #slides div.services { width: 300px; position: absolute; margin-top: 20px; margin-left: 20px } #slides div.services h1 { margin-bottom: 50px; } .faces h2 { margin: 5px 0px 20px 0px; font-size: 1.1em; font-weight: bold; } #caseslides div { display: none; } .extrabottom { margin-bottom: 40px; } .closetop { margin-top:-35px; } .twitter { font-size: 1.3em; font-weight: normal; margin-bottom: 40px; } .benefithilite { color: #333333; } .fright { float: right; } #board { margin: 155px 10px 10px 15px; width: 180px; color: #000; display: none; } .third_col { width: 290px; float: left; margin-right: 50px; } .checkbox { width: 19px; height: 25px; padding: 0 5px 0 0; background: url(checkbox.gif) no-repeat; display: block; clear: left; float: left; } .filters { color: #888888; } .selected_filter { color: #ffffff; } .filters ul li a { color: #666666; } .filters ul li a.selected_filter { color: #ffffff; } .filters ul li a:hover { color: #cccccc; } #tab_content { } #tab_content .half_col { width: 40%; margin-right: 50px; float: left; } #tab_content .first { font-size: 1.3em; font-weight: normal; } #tab_content #faq .first { font-weight:bold; } .header .half_col { width: 47%; margin-right: 20px; float: left; } .header { width: 100%; } .header img { float: right; } .header .first { padding-top: 40px; } .header h1 { margin-bottom: 20px; } .header p { font-size: 1.4em; font-weight: bold; } .footer { font-size: 1.2em; font-weight: bold; margin: 40px 0px 30px 0px; } #face_thumbnails { float: right; } #face_thumbnails .face_tn { background: no-repeat top left; width: 217px; height: 135px; box-shadow: 4px 4px 7px #111; float: left; margin-right: 20px; margin-bottom: 20px; cursor: pointer; } #face_thumbnails .face_tn p { padding: 5px; background: url("/resources/images/black_bg.png") repeat top left; font-size: 11px; font-weight: bold; margin-top: 110px; } #face_thumbnails #mark { background-image: url("/resources/images/faces/mid/mark.jpg"); } #face_thumbnails #mark:hover { background-image: url("/resources/images/faces/mid/mark2.jpg"); } #face_thumbnails #gareth { background-image: url("/resources/images/faces/mid/gareth.jpg"); } #face_thumbnails #gareth:hover { background-image: url("/resources/images/faces/mid/gareth2.jpg"); } #face_thumbnails #matthew { background-image: url("/resources/images/faces/mid/matthew.jpg"); } #face_thumbnails #matthew:hover { background-image: url("/resources/images/faces/mid/matthew2.jpg"); } #face_thumbnails #terence { background-image: url("/resources/images/faces/mid/terence.jpg"); } #face_thumbnails #terence:hover { background-image: url("/resources/images/faces/mid/terence2.jpg"); } #face_thumbnails #jason { background-image: url("/resources/images/faces/mid/jason.jpg"); } #face_thumbnails #jason:hover { background-image: url("/resources/images/faces/mid/jason2.jpg"); } #face_thumbnails #markb { background-image: url("/resources/images/faces/mid/markb.jpg"); } #face_thumbnails #markb:hover { background-image: url("/resources/images/faces/mid/markb2.jpg"); } #face_thumbnails #katie { background-image: url("/resources/images/faces/mid/katie.jpg"); } #face_thumbnails #katie:hover { background-image: url("/resources/images/faces/mid/katie2.jpg"); } #face_thumbnails #dan { background-image: url("/resources/images/faces/mid/dan.jpg"); } #face_thumbnails #dan:hover { background-image: url("/resources/images/faces/mid/dan2.jpg"); } #face_thumbnails #steve { background-image: url("/resources/images/faces/mid/steve.jpg"); } #face_thumbnails #steve:hover { background-image: url("/resources/images/faces/mid/steve2.jpg"); } #face_thumbnails #hold1 { background-image: url("/resources/images/faces/mid/hold.jpg"); } #face_thumbnails #hold2 { background-image: url("/resources/images/faces/mid/hold2.jpg"); } #face_thumbnails #cv { background-image: url("/resources/images/faces/mid/your_cv.jpg"); } .faces .big_photo { width: 455px; height: 290px; background: no-repeat top left; margin-bottom: 20px; } .faces .big_photo h1 { color: #fff; padding: 200px 0px 0px 20px; font-size: 2.4em; } .faces .big_photo h2 { color: #ddd; padding-left: 20px; font-size: 1.4em; } .close_face { position: absolute; margin-left: 10px; margin-top: 10px; cursor:pointer; } #mark_large .big_photo { background-image: url("/resources/images/faces/large/mark.jpg"); } #gareth_large .big_photo { background-image: url("/resources/images/faces/large/gareth.jpg"); } #matthew_large .big_photo { background-image: url("/resources/images/faces/large/matthew.jpg"); } #terence_large .big_photo { background-image: url("/resources/images/faces/large/terence.jpg"); } #jason_large .big_photo { background-image: url("/resources/images/faces/large/jason.jpg"); } #markb_large .big_photo { background-image: url("/resources/images/faces/large/markb.jpg"); } #dan_large .big_photo { background-image: url("/resources/images/faces/large/dan.jpg"); } #steve_large .big_photo { background-image: url("/resources/images/faces/large/steve.jpg"); } #katie_large .big_photo { background-image: url("/resources/images/faces/large/katie.jpg"); } .faded div { background-image: url("/resources/images/black_bg.png"); position: absolute; margin-left: 0px; margin-top: 0px; width: 217px; height: 135px; z-index: 10; cursor: default; } /******************************************************************************/ /* Tabs ***********************************************************************/ /******************************************************************************/ .ui-tabs { position: relative; padding: .2em; zoom: 1; } .ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; } .ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; width: 135px; font-size: 1.2em; font-weight: bold; } .ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; color: #333333; width: 80px; padding-left: 35px; display: block; } .ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px; } .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; } .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */ .ui-tabs .ui-tabs-panel { clear: both; display: block; border-width: 0; background: url("/resources/images/tab_background.png") no-repeat bottom left; padding: 50px 0px 20px 50px; color: #333333; } .ui-tabs .ui-tabs-hide { display: none !important; } #top_corners { background: url("/resources/images/tab_background_top.png") no-repeat top left; height: 12px; } #top_strip { margin-left: 20px; background: url("/resources/images/tab_general.png") no-repeat top left; } /**************************************************************************************************************************/ /* Menu layout styles *****************************************************************************************************/ /**************************************************************************************************************************/ #menu { width: 740px; font-size: 1.3em; font-weight: bold; padding-top: 0px; } #menu, .submenu, .submenu_empty { float: left; display: inline; } ul.midtext { list-style-type: none; } ul.midtext li { padding-bottom: 10px; } .submenu, .submenu_empty { font-size: 12px; padding-left: 0px; padding-top: 0px; min-width: 300px; } .submenu_empty { background-image: none; } #menu li, .submenu li, .submenu_empty li { float: left; padding: 10px 30px 3px 0px; } #menu li a, .submenu li a , .submenu_empty li a { padding: 3px 3px 3px 0px; } .blogItem { float: left; border-bottom: 1px solid #9E9BCC; padding-bottom: 0px; margin-bottom: 45px; margin-top: 15px; clear: both; width: 460px; } .blogSep { border-bottom: 1px solid #9e9bcc; margin-bottom: 10px; clear:both; } .blogItem h1 { padding-top: 6px; } .blogItem .icon { float:left;padding-right:8px; } /**************************************************************************************************************************/ /* Classes ****************************************************************************************************************/ /**************************************************************************************************************************/ .portfolioThumbnail { border: solid 1px #EEEEEE; width: 187px; height: 122px; margin-right: 5px} .portfolioHead { float: left; padding-right: 40px; } .portfolioHead h3 { color: #8CC63F;font-size: 0.9em; margin-bottom: 3px; } .portfolioHead h1 { color: #9F9F9F;font-size: 1.2em; } .portfolioColumn { width: 260px; float:left; padding-right:40px; } .portfolioColumn h3 { color: #E1007E; font-size: 0.9em; margin-bottom: 10px; } .portfolioMainImage { padding-bottom: 15px; } /**************************************************************************************************************************/ /* Links ******************************************************************************************************************/ /**************************************************************************************************************************/ a:link { color: #D3D3D3; text-decoration: none; } a:visited { color: #D3D3D3; text-decoration: none; } a:hover { color: #ffffff; text-decoration: none; } a:active { color: #ffffff; text-decoration: none; } a.white:link { color: #ffffff; text-decoration: none; } a.white:visited { color: #ffffff; text-decoration: none; } a.white:hover { color: #ffffff; text-decoration: none; } a.white:active { color: #ffffff; text-decoration: none; } #left a:link { text-decoration: underline; } #left a:visited { text-decoration: underline; } #left a:hover { text-decoration: underline; } #left a:active { text-decoration: underline; } #menu ul li a:link { color: #D3D3D3; text-decoration: none; } #menu ul li a:visited { color: #D3D3D3; text-decoration: none; } #menu ul li a:hover { color: #fff; text-decoration: none; } #menu ul li a:active { color: #fff; text-decoration: none; } #menu ul li.selected a:link { color: #ffffff; } #menu ul li.selected a:visited { color: #ffffff; } #menu ul li.selected a:hover { color: #ffffff; } #menu ul li.selected a:active { color: #ffffff; } .submenu li.selected a:link { color: #ffffff; } .submenu li.selected a:visited { color: #ffffff; } .submenu li.selected a:hover { color: #ffffff; } .submenu li.selected a:active { color: #ffffff; } .blog a.selected { color: #ffffff; } .portfolio a.selected { color: #ffffff; } #submenu ul li a:link { color: #666; text-decoration: none; } #submenu ul li a:visited { color: #666; text-decoration: none; } #submenu ul li a:hover { color: #666; text-decoration: none; } #submenu ul li a:active { color: #666; text-decoration: none; } #submenu ul li.selected a { color: #000; } #board a:link { color: #333; } #board a:visited { color: #333; } #board a:hover { color: #666; } #board a:active { color: #666; } .blog_menu li.selected a { color: #ffffff; } .work_menu li.selected a { color: #ffffff; } .commentform { clear:both; border-top: 1px solid #CCC; padding-top: 20px; } .commentform label { width: 200px; display: block; float:left;} .commentform .commenttext { width: 350px; } .bottomline { border-bottom: 1px solid #9E9E9E; width: 100%; height:5px; padding: 0px; margin-bottom: 15px; } .dba { float:left; width: 180px; margin-bottom: 35px; } .address { float:left; width: 600px; } /**************************************************************************************************************************/ /* Portfolio **************************************************************************************************************/ /**************************************************************************************************************************/ #folioMenu ul li:hover { color:#fff; cursor:pointer; } #folioMenu .selected { color:#fff; } #folioMenu { font-size: 1.3em; font-weight: bold; padding-left: 22px; line-height: 30px; color: #D3D3D3; float:left; width:175px; } #folioItems { float:left; width:730px; z-index:7; } #folioItems .item { float:left; margin-bottom:8px; margin-right:10px; min-height:155px; width:225px; z-index:8; position:relative; overflow:hidden; } #folioItems .bg { height:155px; width:255px; z-index:9; position:relative; } #folioItems .bg .new { position:absolute; z-index:15; } #folioItems .infoContainer { position:relative; z-index:10; margin-top:-50px; margin-left:7px; width:206px; height:42px; overflow:hidden; } #folioItems .info { background-color:Black; height:25px; width:198px; float:left; margin-top:-41px; font-weight:bold; padding-top:10px; padding-left:10px; font-size:1.1em; z-index:11; position:absolute; top:83px; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; } .foliobrief { width:170px; color:#BCBCBC; line-height:14px; margin-left:0px; float:left; margin-top:0px; margin-right: 10px; } .foliobrief span { font-size:1.2em; color:#BCBCBC; padding-right:4px; } .foliobrief2 { width:100%; margin-left: 20px; line-height:14px; font-size:12px; float:left; margin-top:35px; padding:0px; color:#BCBCBC; } .foliobrief2 span { font-size:14px; color:#BCBCBC; padding-right:4px; padding:0px; } .foliobrief2 p { margin:0px; } #folioweb { width:700px; height:450px; float:left; } #folioweb h2 { padding-left:20px; color:#fefefe; display:inline; } #folioweb .folioweb_item { margin-left:25px; margin-top:20px; } #folioweb .prevNext, #folioweb .prevNextImg { color:#fefefe; float:right; font-size:1.1em; font-weight:bold; padding-right:25px; padding-top:7px; } #folioweb .prevNext a, #folioweb .prevNextImg a { color:#fefefe; } #folioweb .prevNext .nextProject , #folioweb .prevNextImg .nextProject { color:#fafafa; } /**************************************************************************************************************************/ /* Benefits ***************************************************************************************************************/ /**************************************************************************************************************************/ #benefits_shadow { background-image:url('/resources/images/benefits/shadow.png'); background-repeat:no-repeat; width:800px; height:350px; margin-left:-70px; margin-top:150px; } #benefits_grammarphone { background-image:url('/resources/images/benefits/grammarphone_lit.png'); background-repeat:no-repeat; width:237px; height:299px; margin-top:-460px; margin-left:70px; } #benefits_grammarphone:hover { background-image:url('/resources/images/benefits/grammarphone_lit.png'); } #benefits_cup { background-image:url('/resources/images/benefits/cup_lit.png'); background-repeat:no-repeat; width:172px; height:235px; margin-top:-265px; margin-left:345px; } #benefits_cup:hover { /* background-image:url('/resources/images/benefits/cup_lit.png'); */ } #benefits_milk { background-image:url('/resources/images/benefits/milk_lit.png'); background-repeat:no-repeat; width:234px; height:208px; margin-top:-150px; margin-left:225px; } #benefits_milk:hover { /* background-image:url('/resources/images/benefits/milk_lit.png'); */ } #benefits_bible { background-image:url('/resources/images/benefits/bible_lit.png'); background-repeat:no-repeat; width:102px; height:168px; margin-top:-195px; margin-left:445px; } #benefits_bible:hover { /* background-image:url('/resources/images/benefits/bible_lit.png'); */ } #benefits_magic { background-image:url('/resources/images/benefits/magic_lit.png'); background-repeat:no-repeat; width:114px; height:130px; margin-top:-90px; margin-left:360px; } #benefits_magic:hover { /* background-image:url('/resources/images/benefits/magic_lit.png'); */ } #benefits_text { width:300px; height:250px; color:#fff; margin-top:0px; font-size:1.4em; font-weight:bold; line-height:20px; float: left; } #benefits_text h2 { color:#fff; font-size:2.3em; margin-bottom:17px; } #benefits_montage { width: 300px; height: 450px; float: left; margin-left: 30px; margin-top: -50px; } /* Sub Menu Bits for the old SubNav with Bubble sat beneath the main menu -- Also Menu Control has changed, swap file names around */ /* .submenu_block { float:left; margin-top:7px; margin-left:7px; } /* .submenu { background:url(/resources/images/submenu_middle.png) no-repeat center top; height:37px; line-height:20px; vertical-align:middle; width:545px; } /* .submenu_sides { float:left; width:40px; height:37px; } /* Add one of these for each submenu moving the Background Position */ /* and padding if too many items (default is padding: 10px 30px 3px 0px;) */ /* .submenu_aboutus { background-position:-945px; } */ /* .submenu_aboutus li { float: left; padding: 10px 30px 3px 0px; } */ /* .submenu_services { background-position:-845px; } */ /* .submenu_services li { float: left; padding: 10px 30px 3px 0px; } */ /* .submenu_casestudies { background-position:-735px; } */ /* .submenu_casestudies li { float: left; padding: 10px 16px 3px 0px; } */ /* .submenu_work { background-position:-635px; } */ /* .submenu_work li { float: left; padding: 10px 30px 3px 0px; } */ /* .submenu_contact { background-position:-490px; } */ /* .submenu_contact li { float: left; padding: 10px 30px 3px 0px; } */ /* .submenu li a:link { color:white; font-size:12px; font-weight:bold; filter:alpha(opacity=40); -moz-opacity:0.4; -khtml-opacity: 0.4; opacity: 0.4; } */ /* .submenu li.selected a:link { font-size:12px; color: #ffffff; font-weight:bold; filter:alpha(opacity=100); -moz-opacity:1.0; -khtml-opacity: 1.0; opacity: 1.0; } */ /* .submenu li:hover a:link { font-size:12px; color: #ffffff; font-weight:bold; filter:alpha(opacity=100); -moz-opacity:1.0; -khtml-opacity: 1.0; opacity: 1.0; } */ /* Sub Menu for Drop Down Bubble */ #menu .submenuul { padding:6px 0px 15px 0px; display:none; list-style-type:none; position:absolute; margin:0px; width: 178px; margin-left:-45px; } #menu .submenuul .submenuli { text-indent:0px; height:32px; margin:0px; padding:0px; } #menu .submenuul .submenuli a { color:#fff; font-size:11px; font-weight:bold; display:block; width:178px; margin-left:12px; line-height:32px; } #menu li:hover ul { display: block; z-index: 1000; } #menu li>ul { top: auto; left: auto; } #menu li.selected .submenuul a { } #menu .submenuul a { padding: 0px; text-decoration: none; color: #FFF; border: none; margin: 0px; } #menu li a.lastmenu { border: 0px; } #menu .submenuul .submenu1 { height:49px; line-height:49px; } #menu .submenuul .submenu1 a { color:#fff; width:178px; line-height:65px; height:49px; } #menu .submenuul .submenu2 { } #menu .submenuul .submenu0 { height:31px; line-height:31px; } #menu .submenuul .submenu0 a { color:#fff; width:178px; line-height:31px; height:31px; } .casestudywrap { width:291px; height:101px; padding-bottom:15px; float:left; margin-right:80px; } .casestudy { width:291px; height:101px; /* background-color:#674186; border:solid 1px #8C67AA; */ border:solid 1px transparent; float:left; padding:5px 10px 0px 10px; position:relative; } .casestudy:hover { background:url(/resources/images/services/30trans.png) repeat; border:solid 1px #6F5587; } .casestudy_off { width:291px; height:101px; background-color:#462C5C; border:solid 1px #8B6FA1; float:left; padding:5px 10px 0px 10px; position:relative; margin-right:60px; margin-bottom:10px; color:#867196; } .casestudy .link { position:absolute; width:311px; height:116px; z-index:999; } .casestudy h3 { font-size:14px; margin-bottom:4px; color:White; } .casestudy h3 a { color:White; } .casestudy_off h3, .casestudy_off h3 a { color:#867196; } .casestudy span a { font-style:italic; float:left; color:White; } .casestudy_off span a { color:#867196; } .casestudy p a { float:left; padding-top:5px; width:220px; font-weight:bold; color:White; } .casestudy_off p a { color:#867196; } .casestudy img { float:left; position:absolute; right:0px; top:0px; } .portfolio_paging { font-size: 1.6em; padding: 8px 5px 0px 5px; } .portfolio_paging a { color: #555; } .portfolio_paging a:hover { color: #ffffff; } .portfolio_paging_selected a { color: #ffffff; } /**************************************************************************************************************************/ /* New Portfolio **********************************************************************************************************/ /**************************************************************************************************************************/ #new_branding, #new_web { padding-left:20px; z-index:1; position:relative; width: 710px; float: left; min-height: 450px; } #new_branding h1, #new_web h1 { padding-bottom:20px; } #new_branding .singleitem { float:left; width:365px; height:203px; background:url(/resources/images/portfolio/brand_shadow.png) no-repeat; margin-left:-16px; } #new_branding .singleitem .inner { width:332px; height:177px; overflow:hidden; margin-top:13px; margin-left:15px; position:relative; } #new_branding .singleitem .inner .colouritem { width:332px; height:177px; position:absolute; background:#ffffff; filter:alpha(opacity=20); -moz-opacity:0.2; -khtml-opacity: 0.2; opacity: 0.2; } #new_branding .singleitem a { display:block; position:absolute; width:332px; height:177px; text-decoration:none; z-index:6; } #new_branding .singleitem img { position:absolute; cursor:pointer; width:332px; height:177px; } #new_branding .singleitem .info { position:absolute; bottom:-35px; display:block; width:317px; height:35px; background:Black; z-index:3; line-height:35px; font-weight:bold; font-size:12px; padding-left:15px; cursor:pointer; filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; } #new_branding .bigcontainer { width:687px; height:434px; background:url(/resources/images/portfolio/brand_bigshadow.png) no-repeat bottom left; margin:-28px 0px 0px -33px; padding:36px 0px 30px 33px; z-index:2; position:relative; } #new_branding .bigimage { cursor:pointer; padding:0px; margin:0px; position:absolute; } #new_branding #dots { width:640px; text-align:center; padding-top:0px; } #new_branding #dots img { margin:0px 3px; cursor:pointer; } #new_branding .back { z-index:20; color:#ffffff; text-decoration:none; font-weight:bold; font-size:12px; padding-top:15px; z-index:3; position:relative; padding-bottom:10px; } #new_branding .back a { color:#5B5B5B; text-decoration:none; } #new_branding .back span { color:#5B5B5B; } #new_branding .back a:hover { color:#D3D3D3; } #new_web .singleitem { width:511px; height:257px; padding:18px 0px 0px 26px; background:url(/resources/images/portfolio/web_bigshadow.png) no-repeat; margin-left:-26px; } #new_web .singleitem .inner { width:485px; height:240px; position:relative; overflow:hidden; } #new_web .singleitem .inner img { position:absolute; z-index:1; cursor:pointer; } #new_web .singleitem .inner a { display:inline-block; width:485px; height:240px; text-decoration:none; z-index:4; position:absolute; } #new_web .singleitem .inner .white { widtH:485px; height:240px; background:#ffffff; position:absolute; z-index:2; filter:alpha(opacity=20); -moz-opacity:0.2; -khtml-opacity: 0.2; opacity: 0.2; cursor:pointer; } #new_web .singleitem .inner .info { position:absolute; bottom:-35px; display:block; width:485px; height:35px; background:Black; z-index:6; line-height:35px; font-weight:bold; font-size:12px; padding-left:15px; cursor:pointer; filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; } #services { padding-left:20px; } #services h1 { font-size:23px; padding-bottom:40px; color: #ffffff; } #services h1 span { color:#999999; } #services #col1 { width:280px; float:left; } #services #col1 p { font-size:18px; font-weight:bold; line-height:20px; } #services #col2 { width:246px; float:left; margin-left:40px; } #services #col3 { width:246px; float:left; margin-left:50px; } #services #col2 h2, #services #col3 h2 { font-size:16px; padding-left:12px; } #services #col2 p, #services #col3 p { padding-bottom:10px; width:220px; padding-left:12px; } #services .section { background:url(/resources/images/services/normal-bottom.png) no-repeat bottom left; position:relative; } #services .hoverlink { position:absolute; top:0px; left:0px; width:100%; height:100%; text-decoration:none; background:url(/resources/images/services/trans.png) repeat; } #services #leftcol { width:402px; float:left; position:relative; } #services #rightcol { margin-left:75px; width:402px; float:left; } #services .singleservice { position:relative; border:solid 1px transparent; padding:12px 0px 0px 10px; } #services .singleservice img { float:left; display:block; margin-bottom:12px; } #services .singleservice .text { float:left; width:263px; margin-left:35px; } #services .singleservice .text h2 { font-size:15px; line-height:15px; margin-bottom:5px; } #services .singleservice .text p { font-size:12px; line-height:14px; } #services .activeSection:hover { background:url(/resources/images/services/30trans.png) repeat; border:solid 1px #6F5587; } .foliobrief2 .portfolioFloatTitle { display:inline-block; width:130px; float:left; } .foliobrief2 .portfolioFloatText { display:inline-block; width:160px; float:left; font-size:11px; } #service_detail { width: 1000px; margin-left:20px; } #service_detail h1 { font-size:23px; color:#ffffff; } #service_detail h1 span { color:#999999; } #service_detail .lefttext { float:left; width:360px; font-size:12px; } #service_detail .lefttext .smallimage { float:left; display:inline-block; margin-top:40px; } #service_detail .lefttext .title, #service_detail .righttext h2 { font-size:20px; float:left; display:inline-block; margin:40px 0px 0px 15px; width:250px; line-height:22px; font-weight:bold; } #service_detail .lefttext h3 { font-size:16px; padding-top:10px; padding-bottom:0px; } #service_detail .lefttext p { margin-top:3px; padding-top:0px; } #service_detail .lefttext .introparagraph { font-size:15px; margin-top:15px; font-weight:bold; } #service_detail .lefttext .introparagraph p { line-height:18px; } #service_detail .righttext { float:left; width:520px; margin-left:40px; } #service_detail .righttext h2 { margin-top:20px; padding-bottom:10px; } #service_detail .righttext .bigcontainer { z-index:2; position:relative; margin:6px 0px 0px -34px; padding:34px; width:520px; height:351px; background:url(/resources/images/services/shadow.png) no-repeat; } #service_detail .righttext .bigimage { cursor:pointer; padding:0px; margin:0px; position:absolute; width:520px; height:351px; } #service_detail .righttext #dots { width:520px; text-align:center; padding-top:0px; margin:-4px 0px 0px 0px; } #service_detail .righttext #dots img { margin:0px 3px; cursor:pointer; } #service_detail .righttext .singlefaq { background:url(/resources/images/services/15trans.png) repeat; width:482px; padding:7px 15px 0px 15px; } #service_detail .righttext .singlefaqbottom { width:512px; height:27px; background:url(/resources/images/services/faqbubble.png) no-repeat; margin-bottom:15px; } #service_detail .righttext .singlefaq { font-size:11px; overflow:hidden; } #service_detail .righttext .singlefaq .question p { cursor:pointer; font-size:13px; font-style:italic; font-weight:bold; margin-bottom:3px; max-width: 460px; } #service_detail .righttext .singlefaq .question img { float:left; margin-top:5px; } #service_detail .righttext .singlefaq .question span { float:left; padding-left:10px; } #service_detail .righttext .singlefaq .answer { clear:both; padding-top:8px; padding-bottom:5px; margin-bottom:5px; margin-left:18px; } #service_detail .breadcrumb_link { color:#999999; } #service_detail .breadcrumb_link:hover { color:#ffffff; } #service_detail .tabs { position:relative; margin-top:20px; z-index:1; } #service_detail .tabs .tab h2 { float:left; background:url(/resources/images/landing/tab_off_left.png) no-repeat top left; height:36px; line-height:36px; z-index:2; } #service_detail .tabs .tab h2 a { color:#ffffff; font-size:15px; font-weight:bold; height:36px; display:inline-block; margin-left:12px; z-index:2; padding:0px 20px 0px 6px; line-height:36px; background:url(/resources/images/landing/tab_off.png) no-repeat top right; } #service_detail .tabs .tab .content { position:absolute; top:34px; left:0px; border-top:solid 2px #241732; width:100%; z-index:3; padding:15px; } #service_detail .tabs .tab h2.selected { background:url(/resources/images/landing/tab_on_left.png) no-repeat top left; } #service_detail .tabs .tab h2.selected a { background:url(/resources/images/landing/tab_on.png) no-repeat top right; } #service_detail .tabs .tab .content h2 { background:none; clear:both; font-size:26px; height:auto; float:none; line-height:28px; } #cmsLanding .breadcrumb { font-size:22px; font-weight:bold; color:#999999; float:left; clear:none; } #cmsLanding h1 { font-size:22px; float:left; clear:none; } #cmsLanding h2.bigh2 { font-size:30px; margin:20px 0px 10px 0px; } #cmsLanding h3 { font-size:18px; font-weight:bold; } #cmsLanding .lefttext { width:430px; } #cmsLanding p { font-size:12px; } #cmsLanding .righttext { margin-left:40px; width:360px; } .sayhello { width:370px; padding:15px 15px 50px 15px; background:url(/resources/images/landing/talk.png) no-repeat bottom left; } .sayhello h4 { color:#36244C; font-weight:bold; font-size:21px; } .sayhello .whynot { font-weight:bold; font-size:12px; padding:10px 0px 0px 0px; display:block; } .sayhello .call { font-weight:bold; font-size:19px; color:#36244C; display:block; } #cmsLanding ul a { font-size:13px; color:White; } #cmsLanding ul.big li a { font-size:16px; color:White; } #cmsLanding ul.big li ul { margin-left:20px; } #cmsLanding ul.big li ul li a { font-size:13px; color:White; } #tt { position:absolute; display:block; z-index:999; font-weight:bold; } #tttop { display:block; overflow:hidden; } #ttcont { display:block; padding:3px 0px 0px 4px; background:url(/resources/images/tooltip.png) no-repeat; width:102px; height:33px; color:#000000; font-size:9px; } #ttbot { display:block; height:0px; overflow:hidden; } #tt h3 { margin:0px; color:#0C598A; padding:5px; } #tt p { color:Black; margin:0px 5px 0px 5px; } #pdfreplacement { width:1024px; margin:20px auto; } #pdfreplacement .dots { width:1024px; text-align:center; margin-top:20px; } #pdfreplacement .dots input { margin-right:5px; display:inline-block; } #pdfreplacement .thumbnails { width:1050px; } #pdfreplacement .thumbnails img { float:left; width:250px; margin-right:8px; margin-top:10px; } .newhouse { width:676px; float:left; margin-top:-50px; margin-left:50px; z-index:1; position:relative; } .newhouse #cloud1 { position:absolute; z-index:2; top:65px; left:35px; } .newhouse #cloud2 { position:absolute; z-index:2; top:-10px; left:145px; } .newhouse #cloud3 { position:absolute; z-index:2; top:17px; left:405px; } .newhouse #btnbasement { position:absolute; z-index:4; bottom:1px; left:285px; cursor:pointer; } .newhouse .thehouse { width:676px; height:540px; background:url(/resources/images/house/house.png) no-repeat; z-index:3; position:relative; } .newhouse #basement { margin:-56px 0px 0px 138px; width:385px; height:169px; background:url(/resources/images/house/basement.png) no-repeat; z-index:2; position:relative; } .newhouse #hoverTruth { position:absolute; top:135px; left:290px; z-index:10; cursor:pointer; } .newhouse #zoomTruth { position:absolute; top:80px; left:210px; width:178px; height:115px; background:url(/resources/images/house/truth.png) no-repeat; padding:10px 10px 5px 155px; } .newhouse #hoverResults { position:absolute; top:255px; left:248px; z-index:10; cursor:pointer; } .newhouse #zoomResults { position:absolute; top:225px; left:-40px; width:178px; height:115px; background:url(/resources/images/house/results.png) no-repeat; padding:10px 155px 5px 10px; } .newhouse #hoverMagic { position:absolute; top:242px; left:364px; z-index:10; cursor:pointer; } .newhouse #zoomMagic { position:absolute; top:215px; left:305px; width:178px; height:115px; background:url(/resources/images/house/magic.png) no-repeat; padding:10px 10px 5px 155px; } .newhouse #hoverTrackRecord { position:absolute; top:395px; left:455px; z-index:10; cursor:pointer; } .newhouse #zoomTrackRecord { position:absolute; top:355px; left:190px; width:178px; height:115px; background:url(/resources/images/house/trackrecord.png) no-repeat; padding:10px 155px 5px 10px; } .newhouse #hoverConvenience { position:absolute; top:500px; left:155px; z-index:10; cursor:pointer; } .newhouse #zoomConvenience { position:absolute; top:490px; left:100px; width:178px; height:115px; background:url(/resources/images/house/convenience.png) no-repeat; padding:10px 10px 5px 155px; } .newhouse h3 { font-weight:bold; font-size: 20px; margin:0px; } .newhouse p { margin:0px; padding:0px; } h1.portfolioBreadcrumb { font-size:23px; margin-bottom:20px; z-index:2; position:relative; } h1.portfolioBreadcrumb a { color:#999999; text-decoration:none; } h1.portfolioBreadcrumb a:hover { color:#ffffff; } h1.portfolioBreadcrumb span { color:#999999; }